/*!
Theme Name: Appilo
Theme URI: https://themeforest.net/item/appilo-app-landing-wordpress-theme/22358661
Author: ThemeXriver
Author URI: http://themexriver.com
Description: Appilo One Page App Landing WordPress Theme
Version: 6.1.3
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: appilo
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Normalize
# Typography
# Elements
# Forms
# Navigation
	## Links
	## Menus
# Accessibility
# Alignments
# Clearings
# Widgets
# Content
	## Posts and pages
	## Comments
# Infinite scroll
# Media
	## Captions
	## Galleries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Normalize
--------------------------------------------------------------*/
/* normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */

/* Document
	 ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */



 
.modal-width {
    /* Width: 1348px !important; */
    max-width: 900px !important;
}
.pop_section {
    /* Width: 1348px; */
    margin: 0 auto;
    max-width: 100%;
    overflow: hidden;
    /* background: linear-gradient(90deg, #2EA2FF 4%, #5F4FFF 95%); */
    display: flex;
    justify-content: space-between;
    border-radius: 24px;
    font-family: 'Poppins', sans-serif;
    /* align-items: center; */
}

.pop_left {
    width: 42%;
    max-width: 100%;
    padding-top: 24px;
    text-align: center;
    position: relative;
    background-color: #fff;
}

.top_content {
    text-align: center;
    max-width: 100%;
    margin: auto;
}

.pop_left h1 {
    font-size: 70px;
    /* color: #4974FF;
    text-transform: uppercase; */
    line-height: 77px;
    margin: 0px;
    font-weight: 700;
}

.pop_left p {
    font-size: 20px;
    color: #00008B;
    margin: 8px 0px;
    line-height: 27px;
    font-weight: 700;
    text-align: left;
    margin-left: 35px;
    font-family: 'Poppins';
}

h3.intent-h3 {
    font-style: normal;
    font-weight: 800 !important;
    font-size: 64px !important;
    line-height: 48px;
    letter-spacing: 0.02em;
    color: #4974FF;
    text-transform: uppercase;
}

.pop_left span {
    font-size: 18px;
    color: #00008B;
    margin: 0px;
    line-height: 22px;
    font-weight: 500;
}

.mobile_img {
    /* width: 487px; */
    max-width: 100%;
    margin: 10px auto 0px;
}

.pop_right_s {
    padding: 15px 20px 45px;
    position: relative;
    width: 58%;
    box-sizing: border-box;
    max-width: 100%;
    background: linear-gradient(90deg, #2EA2FF 4%, #5F4FFF 95%);
}

.closebtn {
    position: absolute;
    top: 12px;
    right: 12px;
}

.pop_right_s h2 {
    font-size: 36px;
    font-weight: 700;
    color: #fff;
    line-height: 48px;
    text-transform: capitalize;
}

.pop_right_s h2 span {
    color: #fff;
    display: block;
    margin-top: 25px;
    font-size: 32px;
}

.pop_right_s ul {
    padding-left: 20px;
    padding-top: 12px;
}

.pop_right_s ul li {
    font-size: 18px;
    line-height: 30px;
    /* margin-bottom: 20px; */
    font-weight: 400;
    color: #fff;
    list-style: disc;
}

.start_btn {
    align-items: center;
    margin-top: 32px;
    justify-content: center;
    display: flex;
}
.mobile_img img {
    /* max-width: 300px; */
}

.start_btn a {
    font-size: 16px;
    line-height: 16px;
    font-weight: 500;
    display: block;
    text-decoration: none;
    color: #fff;
    background: #0CC308;
    border-radius: 13px;
    padding: 20px 30px 20px 30px;
}

.modal-dialog.modal-lg.modal-dialog-centered.modal-width {
    max-width: 1000px !important;
}
/* media  */


@media screen and (max-width:1024px) {



    /* .pop_right_s h2 {
        font-size: 40px;
        line-height: 55px;
    } */

    .start_btn a {
        font-size: 20px;
        padding: 25px 35px 25px 35px;
    }

    .pop_left p {
        font-size: 16px;
        line-height: 24px;
    }

    .pop_left h1 {
        font-size: 50px;
        line-height: 50px;
    }
}

@media screen and (max-width:980px) {


    .pop_right_s h2 {
        font-size: 30px;
        line-height: 40px;
    }

    .top_part h1 {
        font-size: 50px;
        line-height: 55px;
    }
    .top_part {
        max-height: 100%;
        min-height: 140px;
    }
    .pop_section {
        flex-direction: column;
    }
    /* .pop_left {
        order: 2;
        width: 100%;
    } */
    
}

@media screen and (max-width:767px) {
    .pop_left{
        width: 100%;
    }
    .pop_right_s {
        width: 100%;
    }
    .top_part h1 {
        font-size: 30px;
        line-height: 35px;
    }
    .top_part p {
        font-size: 20px;
        line-height: 30px;
    }
    .top_part {
        min-height: 80px;
    }
    .pop_right_s {
        padding: 38px 30px 30px;
    }
    .pop_right_s ul li {
        margin-bottom: 10px;
    }
    .closebtn {
        top: 2px;
        right: 2px;
    }
    .start_btn a {
        font-size: 16px;
        padding: 20px;
    }
    .bottom_login_cre {
        gap: 20px;
    }
}

/****************** Results page tiles ******************/
.results-page-offers {
    font-family: Arial, sans-serif;
}
.results-page-offers .container {
    width: 100%;
    margin: 20px auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    border: 1px solid #ddd;
    padding: 20px;
    border-radius: 5px;
    background-color: #fff;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    position: relative;
}
.results-page-offers .top-offer {
    border: 2px solid #007bff;
}
.results-page-offers .top-offer-ribbon {
    position: absolute;
    top: -10px;
    left: -10px;
    background-color: #007bff;
    color: white;
    padding: 5px 10px;
    font-size: 0.9em;
    font-weight: bold;
    border-top-left-radius: 5px;
    border-bottom-right-radius: 5px;
}
.results-page-offers .left-section {
    /* flex: 1 1 15%; */
    text-align: center;
}
.results-page-offers .left-section img {
    width: 180px;
    height: auto;
    border-radius: 5px;
}
.results-page-offers .center-section {
    flex: 1 1 55%;
    padding: 0 20px;
    text-align: left;
}
.results-page-offers .center-section h2 {
    margin: 0;
    font-size: 22px;
    font-weight: bold;
    color: #333;
}
.results-page-offers .center-section h3 {
    font-size: 18px;
    margin: 10px 0;
    color: #007bff;
    font-weight: 600;
}

.results-page-offers .center-section h3 {
    font-size: 22px;
    margin: 10px 0;
    color: #000000;
    font-weight: 600;
}
.results-page-offers .center-section p {
    margin: 10px 0;
    font-size: 18px;
    color: #007bff;
}
.results-page-offers .highlight {
    background-color: yellow;
}
.results-page-offers .right-section {
    flex: 1 1 5%;
    text-align: center;
    display: grid;
}
.results-page-offers .cta-button {
    background-color: #0CC308;
    color: white;
    padding: 10px 20px;
    text-decoration: none;
    border-radius: 25px;
    text-align: center;
    font-size: 16px;
    font-weight: bold;
    display: inline-block;
    margin-bottom: 10px;
}
.results-page-offers .cta-button:hover {
    background-color: #002B56;
}
.results-page-offers .center-section ul {
    list-style: none;
    padding: 0;
}
.results-page-offers .center-section li {
    margin-bottom: 5px;
    position: relative;
    padding-left: 25px;
}
.results-page-offers .center-section li::before {
    content: '';
    background-image: url('https://helloratestravelfinancing.com/wp-content/uploads/2024/07/right-check.svg');
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    display: inline-block;
    height: 20px;
    width: 20px;
    position: absolute;
    left: 0;
    top: 0;
}
.results-page-offers .more-info {
    font-size: 14px;
    color: #007bff;
    text-decoration: none;
}
.results-page-offers .more-info:hover {
    text-decoration: underline;
}

section#step-11 {
    background-image: url('https://helloratestravelfinancing.com/wp-content/uploads/2024/08/pure-white-background-85a2a7fd.jpg');
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    width: 100%;
    /* margin-top: -50px; */
}

.card.mb-3.co-branded-main {
    margin-top: 20px;
}

#step-11 .container {
    max-width: 1440px;
}

section#step-1 {
    padding-top: 10px;
}

/*******************************************/

/** Step form CSS **/
/* .payment-steps.process-wrap {
    width: 50%;
    margin: 100px auto;
} */
/* .payment-steps.process-main {
    width: 100%;
    min-width: 320px;
    display: flex;
    justify-content: center;
    margin-bottom: 25px;
}
.payment-steps.col-3 {
    width: 40%;
    position: relative;
    max-width: 100% !important;
}
.payment-steps.col-3:first-child .process-step:before {
    content: '1';
}
.payment-steps.col-3:nth-child(2) .process-step:before{
    content: '2';
}
.payment-steps.col-3:nth-child(3) .process-step:before {
    content: '3';
}

.payment-steps.process-main .col-3:not(:first-child):before{
    content: "";
    display: block;
    position: absolute;
    width: 100%;
    height: 4px;
    top: 29.5px;
    left: calc(-50% + 20px);
    right: 0;
    background: #fff;
    border: 2px #ebebeb solid;
    -o-transition: .4s;
    -ms-transition: .4s;
    -moz-transition: .4s;
    -webkit-transition: .4s;
    transition: .4s;
}
.payment-steps.process-step-cont {
    font-family: sans-serif;
    font-size: 16px;
    text-decoration: none;
    white-space: nowrap;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    align-content: space-between;
}
.payment-steps.process-step {
    border: 5px #ebebeb solid;
    border-radius: 100%;
    line-height: 0;
    background: #959595;
    text-align: center;
    align-items: center;
    justify-content: center;
    align-self: center;
    display: flex;
    color: #fff;
    width: 50px;
    height: 50px;
    font-weight: 700;
    margin-bottom: 7px;
    z-index: 4;
    cursor: pointer;
}
.payment-steps.process-label {
    color: #959595;
    font-weight: 600;
    width: 100%;
    text-align: center;
}

.payment-steps.active-step.col-3:nth-child(-n+2) .process-step {
    background-color: #000080;
}
.payment-steps.active-step.col-3:nth-child(-n+2) .process-label{
    color: #000080;
}
.payment-steps.active-step.col-3:nth-child(-n+2):before{
    background: #000080 !important;
}

.payment-steps.process-main .col-3:last-child:before {
    left: calc(-50% + 20px);
} */