/*--SF: Misc--*/

.sf_row {
    display: flex;
}

.sf_row_center {
    align-items: center;
}

.sf_column {
    flex: 1 0 50%;
    max-width: 50%;
    padding-right: 10px;
    box-sizing: border-box;
}

.sf_column_1_3 {
    flex: 1 0 33.3%;
    max-width: 33.3%;
}

.sf_column_1_5 {
    flex: 1 0 20%;
    max-width: 20%;
}

.sf_column_4_5 {
    flex: 1 0 80%;
    max-width: 80%;
}

.sf_column_2_3 {
    flex: 1 0 66.6%;
    max-width: 66.6%;
}

.sf_column_full {
    flex: 1 0 100%;
    max-width: 100%;
    padding-right: 10px;
    box-sizing: border-box;
}

.sf_column_padding_left {
    padding-left: 50px;
}

.sf_column_no_padding_right {
    padding-right: 0px;
}

.sf_margin_bottom_8 {
    margin-bottom: 8px;
}

.sf_margin_bottom_16 {
    margin-bottom: 25px;
}

.sf_margin_bottom_24 {
    margin-bottom: 24px;
}

.sf_margin_top_24 {
    margin-top: 24px;
}

.sf_margin_top_64 {
    margin-top: 64px;
}

.sf_hide_initial {
    display: none;
}

.sf_hr {
    border: 1px solid #00a0cd;
}

.sf_hr_gray {
    border: 1px solid #ccc;
    margin: 50px 0px;
}

.sf_error_wrapper {
    display: none;
    color: red;
    font-style: italic;
}


/*--SF: Headings--*/

.sf_heading_1 {
    color: #11284b;
    font: normal 900 36px / 42px "Muli", Helvetica, Arial, Verdana, sans-serif;
    display: block;
    margin-bottom: 15px;
}

.sf_heading_1.sf_heading_stripe {
    position: relative;
    padding-left: 70px;
}

.sf_heading_stripe:before {
    position: absolute;
    content: '';
    width: 50px;
    background: #ef7d00;
    height: 10px;
    left: 0px;
    top: 15px;
}

.sf_heading_2 {
    color: #11284b;
    font: normal 900 26px / 34px "Muli", Helvetica, Arial, Verdana, sans-serif;
    display: block;
}

.sf_heading_3 {
    color: #11284b;
    font: normal 400 26px / 34px "Muli", Helvetica, Arial, Verdana, sans-serif;
    display: block;
}

.sf_heading_3_bold {
    color: #11284b;
    font: normal 900 26px / 34px "Muli", Helvetica, Arial, Verdana, sans-serif;
    display: block;
}

.sf_heading_4 {
    color: #11284b;
    font: normal 900 22px / 30px "Muli", Helvetica, Arial, Verdana, sans-serif;
    display: block;
}


/*--SF: Typograpgy--*/

.sf_white {
    color: #fff;
}

.sf_light_blue {
    color: #00a0cd;
}


/*--SF: Buttons--*/

.sf_button_1 {
    background: #ef7d00;
    color: #fff;
    font-weight: bold;
    font-size: 20px;
    padding: 10px 20px;
    border-radius: 20px;
    border: 1px solid #ef7d00;
    display: inline-block;
}

.sf_button_1:hover {
    background: #11284b;
    color: #fff;
    border-color: #11284b;
}

.sf_button_1:hover {
    color: #fff;
    text-decoration: underline !important;
}


/*--SF: Contact form-*/

.sf_contact_form input[type='text'],
.sf_contact_form input[type='tel'],
.sf_contact_form input[type='email'],
.sf_white_input {
    width: 100% !important;
    background: #fff !important;
}

.sf_contact_form button[type='submit'] {
    background: #ef7d00;
    color: #fff;
    font-weight: bold;
    font-size: 20px;
    padding: 10px 20px;
    border-radius: 20px;
    border: 1px solid #ef7d00;
}

.sf_contact_form button[type='submit']:hover {
    background: #11284b;
    color: #fff;
    border-color: #11284b;
}


/*--SF: Steps Misc--*/

.sf_step_wrapper_1,
.sf_step_wrapper_2,
.sf_step_wrapper_3 {
    border: 10px solid #00a0cd;
    padding: 20px;
    background-color: white;
}

.sf_button_choose {
    background-color: #9d9d9c;
    display: inline-block;
    padding: 5px;
    min-width: 50px;
    color: #fff;
    border-radius: 10px 0px 0px 10px;
    text-align: center;
    font-weight: bold;
    margin-bottom: 10px;
}

.sf_button_choose_right {
    border-radius: 0px 10px 10px 0px;
}

.sf_button_choose_active,
.sf_button_choose:hover {
    background-color: #00a0cd;
    color: #fff !important;
}

.sf_calculator_wrapper input[type='text'],
.sf_calculator_wrapper select,
.sf_calculator_wrapper input[type='email'] {
    background: #f0f0f0;
    font-size: 20px !important;
    width: 100%;
    padding: 10px 20px 20px 20px;
    height: auto !important;
    /* font-weight: bold; */
}

.sf_calculator_wrapper .small_input {
    width: 100px !important;
}

body .sf_calculator_wrapper .sf_input_white {
    border: 1px solid #ccc !important;
    background: #fff !important;
    font-size: 16px !important;
    font-weight: normal;
}

.sf_small_input_desc {
    margin-left: 10px;
    font-size: 22px;
}

.sf_wrapper_light_blue {
    background: #deecf6;
    padding: 20px;
}

.sf_wrapper_blue {
    background: #11284b;
    padding: 20px;
}

.sf_wrapper_light_blue input[type='text'],
.sf_wrapper_blue input[type='text'] {
    background: #fff;
}

.sf_lowest_interest_wrapper {
    border: 1px solid #ccc;
}

#sf_lowest_interest {
    background: #00a0cd;
    color: #fff;
    text-align: center;
    padding: 5px;
}

#sf_lowest_interest_logo {
    text-align: center;
}

.sf_input_label_radio {
    background-color: #fff;
    border: 1px solid #bfbfbe;
    border-radius: 50%;
    cursor: pointer;
    height: 28px;
    left: 0;
    position: absolute;
    top: 0;
    width: 28px;
}

.sf_checkbox_wrapper {
    position: relative;
    margin-bottom: 25px;
}

.sf_checkbox_wrapper input {
    margin-right: 20px;
}

.sf_checkbox_wrapper label:after {
    border: 5px solid #00a0cd;
    border-top: none;
    border-right: none;
    content: "";
    height: 6px;
    left: 6px;
    opacity: 0;
    position: absolute;
    top: 8px;
    transform: rotate(-45deg);
    width: 12px;
}

.sf_checkbox_wrapper input[type="checkbox"],
.sf_checkbox_wrapper input[type="radio"] {
    visibility: hidden;
}

.sf_checkbox_wrapper input[type="checkbox"]:checked+label,
.sf_checkbox_wrapper input[type="radio"]:checked+label {
    background-color: #fff;
}

.sf_checkbox_wrapper input[type="checkbox"]:checked+label:after,
.sf_checkbox_wrapper input[type="radio"]:checked+label:after {
    opacity: 1;
}

#sf_lowest_interest_period {
    text-align: center;
    display: block;
    margin-top: 20px;
}

.sf_money_input {
    position: relative;
}

.sf_money_input input {
    padding-left: 30px !important;
}

.sf_money_input:before {
    content: '€';
    display: block;
    position: absolute;
    top: 9px;
    left: 10px;
    font-size: 22px !important;
    font-weight: bold;
}


/*--SF: Max Mortgage--*/

.sf_max_mortgage_return,
.sf_monthly_costs_return {
    background: #deecf6;
    padding: 20px;
}

.sf_max_mortgage_cta {
    background: #11284b;
    padding: 50px 100px;
    text-align: center;
}


/*--SF: Get Quote--*/

.sf_quote_wrapper {
    background: #deecf6;
    padding: 20px;
}

.sf_quote_wrapper input[type='text'] {
    background: #fff;
}


/*--SF: Interest top 5--*/

.sf_row_new {
    display: flex;
    margin-left: -15px;
    margin-right: -15px;
}

.sf_row_new .sf_column_1_3 {
    padding: 0px 15px;
    flex: 0 1 33.33333%;
    max-width: 33.33333%;
}

.sf_interest_top_5_wrappper .sf_column_new {
    text-align: center;
    padding: 0px 15px;
    flex: 0 1 20%;
    max-width: 20%;
    background: #fff;
}

.sf_interest_top_5_wrappper .sf_column_new .sf_column_inner {
    border: 1px solid #ebebeb;
}

.sf_interest_top_5_wrappper .sf_interest_top_5_interest {
    background: #11284b;
    color: #fff;
    text-align: center;
    padding: 10px 0px;
    display: block;
    font-weight: bold;
    font-size: 22px;
}

.sf_interest_top_5_wrappper .sf_interest_top_5_interest_0 {
    background: #00a0cd;
}

.sf_interest_bank_logo {
    min-height: 50px;
    margin-top: 10px;
}

.sf_interest_top_5_period {
    display: block;
    font-size: 16px;
    padding: 10px 0px
}

.sf_interest_top_5_wrappper_alt .sf_column_new {
    flex: 0 1 50%;
    max-width: 50%;
    margin-bottom: 15px;
}

.sf_column_top5_text .sf_column_inner {
    max-width: 160px;
    width: 160px;
    height: 214px;
    text-align: left;
    background: #dfecf6;
    padding: 10px;
}

.sf_interest_top_5_period_big {
    font: normal 900 36px / 42px "Muli", Helvetica, Arial, Verdana, sans-serif;
    color: #11284b;
    line-height: 44px;
}


/*--SF: Interest compare--*/

.sf_interest_compare_wrapper {
    border: 10px solid #00a0cd;
    padding: 20px;
    background-color: white;
}

.sf_interest_compare_row {
    display: block;
    padding: 10px;
    background: rgb(17, 40, 75);
    background: linear-gradient(90deg, rgba(17, 40, 75, 1) 0%, rgba(0, 160, 205, 1) 100%);
    color: #fff;
    text-align: right;
    font-size: 20px;
    font-weight: bold;
    vertical-align: middle;
    margin-top: 4%;
}

.sf_interest_compare_row_0 {
    width: 40%;
}

.sf_interest_compare_row_1 {
    width: 50%;
}

.sf_interest_compare_row_2 {
    width: 60%;
}

.sf_interest_compare_row_3 {
    width: 70%;
}

.sf_interest_compare_row_4 {
    width: 80%;
}

.sf_interest_compare_cta {
    background: #deecf6;
    padding: 20px;
}

.sf_button_1:hover {
    color: white !important;
    text-decoration: none !important;
    background-color: #00a0cd;
}

.sf_step_back {
    margin-right: 30px;
}

.sf_calculator_wrapper input.sf_white_input,
.sf_calculator_wrapper select.sf_white_input,
.sf_calculator_wrapper textarea.sf_white_input {
    border: 1px solid #f0f0f0 !important;
    border-color: #f0f0f0 !important;
    font-size: 16px !important;
}

.sf_calculator_wrapper select.sf_white_input {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" fill="rgba(87,87,86,0.5)" x="0px" y="0px" width="8px" height="8px" viewBox="0 0 386.257 386.257" style="enable-background:new 0 0 386.257 386.257;" xml:space="preserve"><polygon points="0,96.879 193.129,289.379 386.257,96.879 "/></svg>') !important;
    background-position: calc(100% - 10px) center !important;
    background-repeat: no-repeat !important;
}


/* Responsive fixes */

@media only screen and (max-width:768px) {
    .sf_row,
    .sf_row_new {
        display: block;
    }
    .sf_row_new {
        margin-left: 0px;
        margin-right: 0px;
    }
    .sf_row_mobile_flex {
        display: flex;
    }
    .sf_column,
    .sf_column_1_3,
    .sf_column_2_3,
    .sf_interest_top_5_wrappper_alt .sf_column_new {
        max-width: 100%;
        padding-right: 0px;
    }
    .sf_row_new .sf_column_1_3,
    .sf_column_1_5,
    .sf_column_4_5 {
        max-width: 100%;
    }
    .sf_margin_bottom_24 {
        margin-bottom: 12px;
    }
    .sf_heading_1 {
        font-size: 22px;
        line-height: 24px;
    }
    .sf_heading_2 {
        font-size: 16px;
    }
    .sf_max_mortgage_return,
    .sf_monthly_costs_return {
        margin-top: 20px;
    }
    .sf_max_mortgage_cta {
        padding: 20px;
    }
    .sf_heading_stripe:before {
        display: none;
    }
    .sf_heading_1.sf_heading_stripe,
    .sf_column_padding_left {
        padding-left: 0px;
    }
    .sf_submit_step {
        margin-top: 10px;
    }
    .sf_button_choose,
    .sf_money_input {
        margin-top: 8px;
    }
    .sf_checkbox_wrapper {
        margin-bottom: 10px !important;
    }
    .sf_button_1,
    .sf_contact_form button[type='submit'],
    .sf_contact_form_short input[type='text'],
    .sf_contact_form_short input[type='email'],
    .sf_contact_form_long input[type='text'],
    .sf_contact_form_long input[type='email'] {
        font-size: 15px !important;
    }
    .sf_button_1 {
        line-height: 15px;
    }
    .sf_contact_form_long textarea {
        width: 100%;
        height: 135px;
    }
    .sf_margin_bottom_16 {
        margin-bottom: 8px;
        margin-top: 8px;
    }
    .sf_mobile_margin_top_24 {
        margin-top: 24px;
    }
    .sf_hr_gray {
        margin: 20px 0px;
    }
    .sf_column_top5_text .sf_column_inner {
        width: auto;
        max-width: 100%;
    }
}

.sf_loading_wrapper {
    display: none;
}

.sf_lowest_interest_wrapper {
    position: relative;
}

.sf_lowest_interest_loader {
    display: none;
    background: rgb(255 255 255 / 50%);
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    text-align: center;
    padding-top: 20px;
}

.sf_black {
    color: black;
}

.sf_column_full_nested.sf_max_mortgage_cta_nested {
    padding: 25px 0px;
}


/*--SF: Update 11-10--*/
.sf_popup{
    position: fixed;
    width: 40%;
    left: 30%;
    background: #00a0cd;
    padding: 16px;
    top: 20%;
    color: #fff;
    z-index: 9998;
    -webkit-box-shadow: 0px 0px 49px -14px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 49px -14px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 49px -14px rgba(0,0,0,0.75);
}
.sf_popup_close:hover{
    cursor: pointer;
}
.sf_popup_close{
    float: right;
}
.sf_popup_open{
    background: #00a0cd;
    display: inline-block;
    width: 30px;
    height: 30px;
    font-size: 22px;
    line-height: 30px;
    text-align: center;
    color: #fff;
    border-radius: 100%;
}
.sf_popup_open:hover{
    cursor: pointer;
}
@media only screen and (max-width:768px) {
    .sf_popup_open{
        width: 20px;
        height: 20px;
        font-size: 18px;
        line-height: 20px;
    }
    .sf_popup{
        width: 80%;
        left: 10%;
    }
}