@import url("https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap");

@media (max-width: 2560px) {
    * {
        font-family: "Open Sans";
    }
    
    html, body {
        overflow-x: hidden; 
    }

    /* Chrome and Safari */
    input:-webkit-autofill,
    textarea:-webkit-autofill,
    select:-webkit-autofill {
        box-shadow: 0 0 0 1000px white inset; /* Set the background color */
        -webkit-text-fill-color: #000; /* Set the text color */
    }

    /* Firefox */
    input:-moz-placeholder,
    textarea:-moz-placeholder,
    select:-moz-placeholder {
        box-shadow: 0 0 0 1000px white inset; /* Set the background color */
        -moz-text-fill-color: #000; /* Set the text color */
    }

    /* overflow-x: applied as a quick fix  */
    .container {
        max-width: calc(100vw);
        width: 100%;
        padding-left:130px;
        padding-right:130px;
    }

    nav {
        padding-top: 25px;
        padding-bottom: 25px;
    }

    .nav-bar-logo {
        height: 55px !important;
        width: auto !important;
    }

    .nav-bar-button {
        padding: 19.5px 69px;
        color: #fff;
        font-size: 22px;
        font-weight: 600;
        background: #f7b32b !important;
        line-height: 1;
    }

    /* NAV END */

    header {
        padding-top: 40px;
        padding-bottom: 60px;
        position: relative;
        overflow: hidden;
    }

        header::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient( 90deg, #0f4c44 24.74%, rgba(15, 76, 68, 0.83) 43.99%, rgba(15, 76, 68, 0) 78.91% ), url("../images/header-image.png") no-repeat;
            background-position: right center;
            background-size: cover;
            transform: scaleX(-1);
            z-index: -1;
        }

    .header-txt {
        color: #fff;
        font-size: 50px;
        font-weight: 700;
        line-height: 135%;
        margin-bottom: 50px;
    }

    #mainForm {
        background: #fff;
        padding: 35px 2rem 50px;
        border-radius: 5px;
        box-shadow: 0px 4px 25px 0px rgba(15, 76, 68, 0.09);
    }

    .form-txt-1 {
        color: #212427;
        text-align: center;
        font-size: 28px;
        font-weight: 600;
        line-height: 1.5;
        margin-bottom: 18px;
    }

    .form-txt-2 {
        color: #212427;
        text-align: center;
        font-size: 18px;
        font-weight: 400;
        line-height: 1;
        margin-bottom: 25px;
    }

    .form-txt-2 span {
        font-weight: 600;
    }

    .form-steps {
        margin-left: calc(40%/2);
        margin-bottom: 25px;
        width: 60%;
    }

    .form-steps .rect {
        height: 4px;
        position: relative;
        background: #D9D9D9;
        margin: 20px 0px;
    }

    .form-steps .first-dot {
        width:  20px;
        height: 20px;
        border-radius: 50px;
        background: #000;
        position: absolute;
        top: 2px;
        left: 0px;
        transform: translate(-50%, -50%);
    }

    .form-steps .second-dot {
        width:  20px;
        height: 20px;
        border-radius: 50px;
        background: #000;
        position: absolute;
        top: 2px;
        right: 0px;
        transform: translate(50%, -50%);
    }

    header .text-1 {
        transform: translateX(-50%);
    }

    header .text-2 {
        transform: translateX(50%);
    }

    .hr {
        width: calc(100% + 2rem);
        height: 2px;
        transform: translateX(-1rem);
        background: #0e6c5e;
        border-radius: 10px;
        margin-bottom: 25px;
    }

    .inputs {
        display: grid;
        grid-template-areas:
            "first second"
            "third forth";
        gap: 15px;
        margin-bottom: 15px;
    }

    .inputs-three-fields {
        display: grid;
        grid-template-areas:
            "first second"
            "third";
        gap: 15px;
        margin-bottom: 15px;
    }
 
    .inputs-long-form-second-step {
        display: grid;
        grid-template-areas:
            "first"
            "second";
        gap: 15px;
        margin-bottom: 15px;
    }

    .inputs-short-form {
        display: grid;
        grid-template-areas: "first";
        gap: 15px;
        margin-bottom: 15px;
    }
    .inputs-short-form-2 {
        display: grid;
        grid-template-areas: "first second";
        gap: 15px;
        margin-bottom: 15px;
    }
    .inputs div:nth-of-type(1) {
        grid-area: first;
    }

    .inputs div:nth-of-type(2) {
        grid-area: second;
    }

    .inputs div:nth-of-type(3) {
        grid-area: third;
    }

    .inputs div:nth-of-type(4) {
        grid-area: forth;
    }

    ::placeholder {
        color: rgba(0, 0, 0, 0.55);
    }

    select {
        font-size: 16px !important;
        font-style: normal !important;
        font-weight: 400 !important;
        line-height: normal !important;
        padding: 20px 16px !important;
    }

    input:not([type="checkbox"]):not([type="button"]):not([type="submit"]) {
        font-size: 16px;
        font-style: normal;
        font-weight: 400;
        line-height: normal;
        padding: 20px 16px;
    }

    .checkbox-input {
        display: grid;
        grid-template-columns: 15px 5px auto;
        margin-bottom: 10px;
        color: #544f4f;
        font-size: 14px;
        border: 1px solid #544f4f33;
        padding: 10px;
        border-radius: 12px;
    }

    .checkbox-input-second {
        margin-bottom: 0px;
        color: #544f4f;
        font-size: 14px;
        text-align: center;
    }
    
    .checkbox-input label {
        grid-column: 3/4;
    }

    .form-disclaimer {
        margin-bottom: 15px;
    }

    .form-disclaimer-v2 {
        margin-bottom: 0px;
        font-size: 10px;
    }

    .form-btn {
        color: #FFF;
        font-size: 22px;
        font-style: normal;
        font-weight: 600;
        line-height: 34px; /* 154.545% */
        padding-top: 24px;
        padding-bottom: 24px;
        background: #F7B32B !important;
    }
    .btn-red {
        background-color: #FF0000 !important;
        color: #fff !important;
    }
    /* HEADER END */

    .business-partners {
        margin: 100px 0px;
    }
    
    .business-partners .heading-text {
        color: #212427;
        font-size: 30px;
        font-style: normal;
        font-weight: 600;
        line-height: 135%; /* 40.5px */
        margin-bottom: 40px;
    }

    /* PARTNERS END */

    .card-1 {
        margin: 100px 0px;
    }

    .card-1 .desk-heading {
        color: #212427;
        font-size: 46px;
        font-style: normal;
        font-weight: 600;
        line-height: 135%; /* 62.1px */
        margin-bottom: 35px;
    }
    
    .card-1 .mob-heading {
        color: #212427;
        text-align: center;
        font-size: 26px;
        font-style: normal;
        font-weight: 600;
        line-height: 135%; /* 35.1px */
    }

    .card-1 .text-1,
    .card-1 .text-2 {
        color: #565656;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%; /* 27px */
        margin-bottom: 30px;
    }

    .card-1 .text-2 {
        margin-bottom: 40px;
    }

    .card-1 button.btn, 
    .card-2 button.btn {
        color: #FFF;
        font-size: 22px;
        font-style: normal;
        font-weight: 600;
        line-height: 34px; /* 154.545% */
        padding: 19.5px 69px;
        border-radius: 5px;
        background: #F7B32B;
    }
    
    .card-1 img {
        object-fit: cover;
        border-radius: 5px;
    }

    /* CARD 1 END */

    .bg-dark-green {
        background: #0E6C5E;
    }

    .card-2 img {
        object-fit: cover;
    }

    .card-2 .main-heading {
        color: #FFF;
        font-size: 46px;
        font-style: normal;
        font-weight: 600;
        line-height: 135%; /* 62.1px */
    }

    .card-2 .text-1 {
        color: #FFF;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%; /* 27px */
    }

    .card-2 .content-row {
        display: flex;
        flex-direction: column;
        gap: 35px;
    }


    .card-2 button.btn {
        flex-grow: 0;
    }


    /* CARD 2 END */

    .carousel {
        padding: 100px 200px;
    }

    .carousel .main-heading {
        color: #FFF;
        text-align: center;
        font-size: 46px;
        font-style: normal;
        font-weight: 600;
        line-height: 130%; /* 59.8px */
        margin-bottom: 48px;
    }

    .carousel .card-body {
        padding: 25px 40px 35px;
    }

    .carousel .card-content > img:nth-child(1) {
        margin-bottom: 22px;
    }

    .carousel .card-text {
        color: #565656;
        font-size: 18px;
        font-style: italic;
        font-weight: 400;
        line-height: 150%; /* 27px */
        margin-bottom: 35px;
    }

    .carousel .client-name {
        color: #565656;
        font-size: 20px;
        font-style: normal;
        font-weight: 700;
        margin-left: 15px;
    }

    .carousel .navigation-buttons {
        margin-top: 35px;
    }

    /* CAROUSEL END */

    .collapsibles {
        margin: 100px auto;
    }

    .collapsibles .main-heading {
        color: #212427;
        font-size: 24px;
        font-style: normal;
        font-weight: 600;
        line-height: 145%; /* 34.8px */
    }

    .collapsibles .collapsible-content {
        color: #565656;
        font-size: 18px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%; /* 27px */
    }

    .collapsibles .collapsible-item hr {
        margin-top: 35px;
        margin-bottom: 35px;
    }

    /* COLLAPSIBLE END */

    footer {
        margin-top: 50px;
        margin-bottom: 50px;
    }

    footer p {
        color: #838383;
        text-align: center;
        font-size: 14px;
        font-style: normal;
        font-weight: 400;
        line-height: 150%; /* 21px */
    }

    footer .super-footer p {
        font-size: 18px;
    }

    /* END */

    .pointer {
        cursor: pointer;
    }
}
