@import url('https://fonts.googleapis.com/css2?family=REM:wght@400;600&display=swap');

/** {
    
}
*/
/*.popup {
    border-image: linear-gradient(#ee4a0f, #ef5922) 1;
    border-width: 2px;
    border-style: solid;
    padding: 1em;
    box-shadow: none !important;
    width: 375px !important;
    border-radius: 15px;
}
*/
.popup {
    position: relative; /* Necessary for the pseudo-element */
    padding: 1em;
    box-shadow: none !important;
    width: 375px !important;
    border-radius: 15px;
    background: white; /* Adjust the background color as needed */
    z-index: 1; /* Ensure the popup content is above the pseudo-element */
}

    .popup:before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border-radius: 15px; /* Match the border radius of the container */
        padding: 2px; /* Match the border width */
        background: linear-gradient(#ee4a0f, #ef5922);
        -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
        -webkit-mask-composite: destination-out;
        mask-composite: exclude; /* For other browsers */
        z-index: -1; /* Ensure the pseudo-element is below the popup content */
    }

.form {
    width: 375px  !important;
}

.form > h3 {
    margin-left: 10px;
}
.submit {
    width: 94% !important;
    margin: auto;
}

.courier-container {
    margin-top: 4em;
}

.hero-container {
    background: #f7f8fa;
    padding-top: 1em;
    padding-bottom: 1em;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding-top: 2em;
    height: 100% !important;
    padding-left: 5%;
}

.mover-container {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 2em;
    padding-top: 1em;
    padding-bottom: 1em;
    background: #f7f8fa;
    padding-left: 50px;
    padding-right: 50px;
}

.mover-img-container {
    width: 50%;
    display:block;
}

    .mover-img-container > img {
        width: 600px;
        margin: auto;
        padding-right:10px;
    }

.mover-text-container {
    width: 80%;
    padding-left: 50px;
    padding-right: 50px;
    /*margin: 10px 0;*/
}

    .mover-text-container > h2 {
        color: #000;
    }
.mover-text-bulk-container {
    display: flex;
    /* float: left; */
    width: 100%;
    /* height: 300px; */
    padding-left: 10px;
    flex-wrap: nowrap;
    align-items: baseline;
    justify-content: space-around;
    align-content: stretch;
    flex-direction: column;
}
.three-steps-container {
    margin-top: 0em;
    margin-bottom: 2em;
}

    .three-steps-container > h2 {
        text-align: center;
        padding: 1em;
    }

.steps-container {
    display: flex;
    justify-content: center;
    align-items: baseline;
    gap: 1em;
    margin-top: 1em;
}

.steps-card:hover {
    color: #3051ab;
    cursor: pointer;
}

.arrow {
    height: 80px;
    width: 160px;
    margin-top: auto;
    margin-bottom: auto;
}

.steps-card {
    width: 20%;
    text-align: center;
}

    .steps-card > img {
        width: 100px;
        height: 100px;
        margin-bottom: 1em;
    }

    .steps-card > h6 > a {
        color: #189e59;
        font-weight: bold;
    }

.arrow-down {
    display: none;
}

.mover-advantages-container {
    margin-top: 2em;
    padding-top: 2em;
    padding-bottom: 2em;
}

    .mover-advantages-container > h2, .mover-advantages-container > p {
        text-align: center;
    }

.advantages-container {
    display: flex;
    justify-content: center;
    align-items: baseline;
    flex-wrap: wrap;
    gap: 2em;
    margin-top: 2em;
}

.advantages-card {
    width: 22%;
    display: flex;
    gap: 1em;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.advantages-icon {
    width: 120px;
    height: 100px;
    display: grid;
    place-items: center;
    border-image: linear-gradient(#f05e29, #ef5720) 1;
    border-width: 2px;
    border-style: solid;
}

    .advantages-icon > img {
        width: 80%;
        height: 80%;
        margin: auto;
    }

.advantages-text {
    width: 100%;
}

.callnow-container {
    text-align: center;
    padding: 4em;
    background:#f7f8fa;
}

    .callnow-container > h2 {
        margin-bottom: 1em;
    }

    .callnow-container > a {
        background:linear-gradient(#ee4a0f, #ef5922) ;
        border-radius: 0.5em;
        padding: 0.8em;
        color: #ffffff !important;
        text-decoration: none;
    }

        .callnow-container > a:hover {
            opacity: .90;
        }
.mover-partner-container {
    background: #f7f8fa;
    text-align:center;
    padding-top:2em;
}
.partners-container {
    display: flex;
    background: #f7f8fa;
    justify-content: space-evenly;
    align-items: center;
    padding-top: 3em;
    padding-bottom: 3em;
}
.partner-card{
    width:30%;
    display:grid;
    place-items:center;
}
.partner-card > img {
    transition: transform .5s ease;
    height:50px;
    width:50%;
}
.captcha-container {
    padding-left: 10px;
}
.get-cont {
    margin-top: 6em;
}
.track-hero-container {
    height: 100%;
    padding-top: 100px;
    margin-bottom: 0px;
    background: #f7f8f9;
    display:flex;
    justify-content:space-evenly;
    align-items:center;
}

.track-img-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    color: #08123b;
    height: 500px;
    width: 43%;
}
    .track-img-container > h1 {
        font-weight: bold;
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }

    .track-img-container > h4 {
        font-weight: bold;
    }

    .track-img-container > a > img {
        width: 200px;
        margin-top: 10px;
    }

.track-form-container {
    order: 2;
    background: #fff;
} 
    
@media screen and (max-device-width:768px) {
    .hero-container {
        flex-direction: column;
        padding-right: 4%;
    }

    .form-container {
        order: 2;
    }

    .form > h3 {
        margin: auto;
    }

    .popup{
        width:360px !important;
    }
    .form{
        width:360px !important;
    }
    .captcha-container {
        padding-left: 8px;
    }
    .mover-container {
        display: flex;
        flex-direction: column;
        padding: 1em;
        gap: 1em;
        align-items: center;
        width: 100%;
    }

    .mover-img-container {
        width: 100%;
        display: grid;
        place-items: center;
        order: -1;
    }

        .mover-img-container > img {
            /*height: 200px;*/
            width: 100%;           
        }

    .mover-text-container {
        width: 100%;
        padding:0;
    }
    
    .steps-container {
        flex-direction: column;
        padding-left: 1em;
        padding-right: 1em;
        margin-top: 0em;
    }

    .steps-card {
        width: 100%;
    }

    .arrow {
        display: none;
    }

    .arrow-down {
        display: flex;
        width: 50px;
        height: 50px;
        margin-left: auto;
        margin-right: auto;
    }

    .advantages-container {
        flex-direction: column;
    }

    .advantages-card {
        width: 90%;
        margin: auto;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }

    .advantages-icon {
        width: 100px;
        height: 100px;
    }

        .advantages-icon > img {
            height: 70%;
            width: 70%;
        }

    .mover-advantages-container > h2, .mover-advantages-container > p {
        margin-left: 0.4em;
        margin-right: 0.4em;
    }
    .partners-container{
        padding-top:1em;
    }
    .partner-card > img {
        width:90%;
        height:40px;
    }
    .get-cont{
        margin-top:0em;
    }
    .track-hero-container{
        flex-direction:column;
    }
    .track-img-container{
        width:90%;
        height:fit-content;
        margin:auto;
        padding-top:0px;
        display:block;
        padding-top:1em;
        padding-bottom:2em;
        text-align:center;
    }
    .track-form-container{
        margin-bottom:2em;
    }
}

@media (max-width: 768px) {
    .partners-container {
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    }

    .partner-card img {
        max-width: 80%;
        max-height: 60%;
    }
    .form-img-container {
        margin-top: 12%;
        margin-bottom: 12%;
    }
}

@media  (max-width: 768px) {
    .booking-padding {
        padding-top: 15%; /* Set padding-top to 5% for mobile view */
    }
}