body {
    background-color: #081e35;
    display: flex;
    flex-direction: column;
    align-items: center;
}

a, h1, h2, h3, h4, p, li, td, th, button, input, textarea, span {
    font-family: "Montserrat";
    text-decoration: none;
    color: white;
}

.bold {
    font-weight: 700;
}

.desktop {
    display: none !important;
}

@media screen and (min-width: 640px) {
    .desktop {
        display: flex !important;
    }

    .mobile {
        display: none !important;
    }
}

.hide {
    display: none !important;
}

.fixed-cta {
    font-size: 5.581vw;
    font-weight: 700;
    color: #fff;
    background: #11CC72;
    padding: 30.1px 0;
    border-radius: 0;
    display: block;
    margin: 0;
    height: 9vh;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: fixed;
    bottom: 0vw;
    z-index: 999;
    margin: 0;
    width: 100%;
}

body {
    background-color: #030406;
    background-image: url('../images/bg-mobile-ca.webp');
    background-size: 100%;
    background-repeat: no-repeat;
}

.cta {
    width: 78.577vw;
    height: 15.947vw;
    border-radius: 2.937vw;
    font-size: 5.74vw;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #11CC72;
    letter-spacing: 0.198vw;
}

.cta-text:hover {
    background-color: #139456;
}

h2 {
    font-size: 5.814vw;
    font-weight: 900;
    text-align: center;
    line-height: 1.2;
    width: 80%;
}

p {
    font-size: 3.953vw;
    text-align: center;
    width: 86%;
    line-height: 1.235;
}

header {
    padding-top: 4.419vw;
    height: 38.605vw;
}

.header-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.ontario {
    width: 16.047vw;
}

.logo {
    margin-top: 4.66vw;
    width: 67.502vw;
}

.hero {
}

.hero-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hero-image {
    width: 96.279vw;
}

.hero h2 {
    margin-top: 9.535vw;
}

.hero p {
    margin-top: 6.279vw;
}

.explore {
    margin-top: 19.535vw;
}

.explore-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.explore h2 {
    
}

.explore p {
    margin-top: 7.907vw;
}

.explore .places {
    margin-top: 10.233vw;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8.372vw;
}

.explore .place {
    width: 82.186vw;
}

.explore .cta {
    margin-top: 10.698vw;
}

.promos {
    margin-top: 21.495vw;
    text-align: center;
}

.promos-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0;
    margin-top: 9.302vw;
}

.promos h2 {
    font-size: 6.977vw;
    width: 55%;
    margin: 0 auto;
    line-height: 1.24;
}

.promo {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 89.767vw;
    height: 81.163vw;
}

.promos .cta {
    margin: 0 auto;
}

.promo-with-icon {
    display: flex;
    align-items: flex-end;
}

.promo-icon {
    position: absolute;
}

.promo-icon-1 {
    width: 26.512vw;
    bottom: 9.07vw;
    left: 2.326vw;
}

.promo-icon-2 {
    width: 29.302vw;
    bottom: 12.093vw;
    left: 0.465vw;
}

.promo-icon-3 {
    width: 26.512vw;
    bottom: 17.674vw;
    left: 2.326vw;
}

.promo p {
    margin-top: 3.488vw;
    font-size: 3.721vw;
    width: 59.302vw;
    text-align: center;
}

.promo-with-icon p {
    text-align: left;
    padding-right: 2.326vw;
    margin-top: 2.791vw;
    width: 57.674vw;
}

.specials {
    margin-top: 34.186vw;
    padding-bottom: 23.256vw;
}

.specials-wrapper {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.specials-icons {
    margin-top: 8.372vw;
    display: flex;
    flex-direction: column;
    gap: 14.186vw;
}

.specials-icon {
    width: 73.488vw;
    position: relative;
}

.specials-icon h3 {
    color: #3578BA;
    font-weight: 900;
    line-height: 1.155;
    font-size: 6.977vw;
    position: absolute;
    bottom: 3.953vw;
    text-align: center;
    left: 50%;
    transform: translate(-50%, 0);
    width: 68.372vw;
}

.specials h2 {
    font-size: 6.744vw;
    width: 40%;
    line-height: 1.243;
    letter-spacing: 0.163vw;
}

.specials-description {
    margin-top: 18.605vw;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.specials-description p {
    width: 80%;
    margin-bottom: 4.651vw;
}

.specials .cta {
    margin-top: 15.349vw;
}

.terms {
    background-color: #081e35;
    padding: 20px 0 80px;
}

.terms-wrapper {
    width: 80%;
    max-width: 1200px;
    display: flex;
    justify-self: center;
}

.terms-wrapper p {
    font-size: 12px;
    line-height: 1.4;
    width: 100%;
}



@media screen and (min-width: 640px) {
 
    body {
        padding-top: 0.625vw;
        background-image: url(../images/bg-desktop-ca.webp);
        background-position: center -3.333vw;
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .cta {
        width: 41.198vw;
        height: 8.75vw;
        border-radius: 0.938vw;
        font-size: 3.333vw;
        font-weight: 700;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #11CC72;
        letter-spacing: 0.052vw;
    }
    
    .cta-text:hover {
        background-color: #139456;
    }
    
    h2 {
        font-size: 5vw;
        font-weight: 900;
        text-align: center;
        line-height: 1.2;
        width: 80%;
    }
    
    p {
        font-size: 2.083vw;
        text-align: center;
        width: 86%;
        line-height: 1.235;
    }
    
    header {
        width: 100%;
        background-color: black;
        padding-top: 1.615vw;
        height: 5.521vw;
        position: relative;
        left: 0;
    }
    
    .header-wrapper {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        width: 60.26vw;
        position: relative;
        margin: 0 auto;
        left: -4.167vw;
    }
    
    .ontario {
        width: 7.135vw;
        position: relative;
        top: 0.573vw;
    }
    
    .logo {
        margin-top: 1.044vw;
        width: 13.125vw;
    }
    
    .hero {
        margin-top: 5.26vw;
    }
    
    .hero-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .hero-image {
        width: 78.333vw;
    }
    
    .hero h2 {
        margin-top: 6.302vw;
        line-height: 1.22;
        width: 79.844vw;
    }
    
    .hero p {
        margin-top: 4.323vw;
        width: 61.302vw;
        font-size: 2.344vw;
    }
    
    .explore {
        margin-top: 12.917vw;
    }
    
    .explore-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .explore h2 {
        width: 64.74vw;        
    }
    
    .explore p {
        margin-top: 2.396vw;
        width: 55.208vw;
    }
    
    .explore .places {
        margin-top: 3.802vw;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 3.802vw;
    }
    
    .explore .place {
        width: 41.354vw;
    }
    
    .explore .cta {
        margin-top: 6.563vw;
        letter-spacing: 0.104vw;
    }
    
    .promos {
        margin-top: 17.552vw;
        text-align: center;
    }
    
    .promos-wrapper {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 9.427vw 4.688vw;
        margin-top: 7.604vw;
        width: 86.25vw;
        position: relative;
        left: 0.729vw;
    }
    
    .promos h2 {
        font-size: 4.948vw;
        width: 100%;
        margin: 0 auto;
        line-height: 1.24;
        letter-spacing: 0.039vw;
    }
    
    .promo {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 40.781vw;
        height: 32.813vw;
    }
    
    .promo-1 {
        order: 1;
    }
    
    .promo-2 {
        order: 3;
    }
    
    .promo-3 {
        order: 5;
    }
    
    .promo-4 {
        order: 2;
    }
    
    .promo-5 {
        order: 4;
    }
    
    .promo-6 {
        order: 6;
    }
    
    .promo-with-icon {
        display: flex;
        align-items: flex-end;
    }
    
    .promo-icon {
        position: absolute;
    }
    
    .promo-icon-1 {
        width: 12.813vw;
        bottom: 3.438vw;
        left: -0.781vw;
    }
    
    .promo-icon-2 {
        width: 18.438vw;
        bottom: 0.938vw;
        left: -2.708vw;
    }
    
    .promo-icon-3 {
        width: 14.323vw;
        bottom: -1.719vw;
        left: 0.208vw;
    }
    
    .promo p {
        margin-top: 1.563vw;
        font-size: 2.344vw;
        width: 39.583vw;
        text-align: center;
    }
    
    .promo-with-icon p {
        text-align: center;
        padding-right: 1.458vw;
        margin-top: 1.927vw;
        width: 27.552vw;
        line-height: 1.225;
    }
    
    .promos .cta {
        margin: 0 auto;
        margin-top: 12.292vw;
    }

    .specials {
        margin-top: 16.146vw;
        padding-bottom: 7.813vw;
    }
    
    .specials-wrapper {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        margin: 0;
        width: 82.448vw;
        justify-content:flex-start;
        gap: 5.156vw;
        position: relative;
        left: 1.719vw;
    }
    
    .specials-icons {
        margin-top: 0;
        display: flex;
        flex-direction: row;
        gap: unset;
        justify-content: space-between;
        width: 39.271vw;
        flex-wrap: wrap;
        flex-shrink: 0;
        row-gap: 1.615vw;
        position: relative;
        top: 1.771vw;
    }
    
    .specials-icon {
        width: 17.917vw;
        position: relative;
    }
    
    .specials-icon h3 {
        color: #3578BA;
        font-weight: 900;
        line-height: 1.155;
        font-size: 1.563vw;
        position: absolute;
        bottom: 0.885vw;
        text-align: center;
        left: 50%;
        transform: translate(-50%, 0);
        width: 15.313vw;
    }
    
    .specials-info {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 34.948vw;
    }

    .specials h2 {
        font-size: 5vw;
        line-height: 1.22;
        letter-spacing: 0;
        text-align: center;
        width: auto;
    }
    
    .specials-description {
        order: 2;
        margin-top: 3.49vw;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
    }
    
    .specials-description p {
        width: 100%;
        margin-bottom: 3.177vw;
        font-size: 2.604vw;
        line-height: 1.22;
    }
    
    .specials .cta {
        order: 3;
        margin-top: 0.781vw;
        width: 34.948vw;
        height: 7.813vw;
        font-size: 2.5vw;
        border-radius: 0.677vw;
    }

}






@media screen and (min-width: 1920px) {
 
    body {
        padding-top: 12px;
        background-image: url(../images/bg-desktop-ca.webp);
        background-position: center -25px;
        background-repeat: no-repeat;
        background-size: auto;
    }

    .cta {
        width: 791px;
        height: 168px;
        border-radius: 18px;
        font-size: 64px;
        font-weight: 700;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: #11CC72;
        letter-spacing: 1.0px;
    }
    
    .cta-text:hover {
        background-color: #139456;
    }
    
    h2 {
        font-size: 96px;
        font-weight: 900;
        text-align: center;
        line-height: 1.2;
        width: 80%;
    }
    
    p {
        font-size: 40px;
        text-align: center;
        width: 86%;
        line-height: 1.235;
    }
    
    header {
        width: 100%;
        background-color: black;
        padding-top: 31px;
        height: 106px;
        position: relative;
        left: 0;
    }
    
    .header-wrapper {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: space-between;
        width: 1157px;
        position: relative;
        margin: 0 auto;
        left: -80px;
    }
    
    .ontario {
        width: 137px;
        position: relative;
        top: 11px;
    }
    
    .logo {
        margin-top: 20.04px;
        width: 252px;
    }
    
    .hero {
        margin-top: 101px;
    }
    
    .hero-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .hero-image {
        width: 1504px;
    }
    
    .hero h2 {
        margin-top: 121px;
        line-height: 1.22;
        width: 1533px;
    }
    
    .hero p {
        margin-top: 83px;
        width: 1177px;
        font-size: 45px;
    }
    
    .explore {
        margin-top: 248px;
    }
    
    .explore-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    
    .explore h2 {
        width: 1243px;        
    }
    
    .explore p {
        margin-top: 46px;
        width: 1060px;
    }
    
    .explore .places {
        margin-top: 73px;
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 73px;
    }
    
    .explore .place {
        width: 794px;
    }
    
    .explore .cta {
        margin-top: 126px;
        letter-spacing: 2px;
    }
    
    .promos {
        margin-top: 337px;
        text-align: center;
    }
    
    .promos-wrapper {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        gap: 181px 90px;
        margin-top: 146px;
        width: 1656px;
        position: relative;
        left: 14px;
    }
    
    .promos h2 {
        font-size: 95px;
        width: 100%;
        margin: 0 auto;
        line-height: 1.24;
        letter-spacing: .75px;
    }
    
    .promo {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 783px;
        height: 630px;
    }
    
    .promo-1 {
        order: 1;
    }
    
    .promo-2 {
        order: 3;
    }
    
    .promo-3 {
        order: 5;
    }
    
    .promo-4 {
        order: 2;
    }
    
    .promo-5 {
        order: 4;
    }
    
    .promo-6 {
        order: 6;
    }
    
    .promo-with-icon {
        display: flex;
        align-items: flex-end;
    }
    
    .promo-icon {
        position: absolute;
    }
    
    .promo-icon-1 {
        width: 246px;
        bottom: 66px;
        left: -15px;
    }
    
    .promo-icon-2 {
        width: 354px;
        bottom: 18px;
        left: -52px;
    }
    
    .promo-icon-3 {
        width: 275px;
        bottom: -33px;
        left: 4px;
    }
    
    .promo p {
        margin-top: 30px;
        font-size: 45px;
        width: 760px;
        text-align: center;
    }
    
    .promo-with-icon p {
        text-align: center;
        padding-right: 28px;
        margin-top: 37px;
        width: 529px;
        line-height: 1.225;
    }

    .promo-2 p {
        text-align: center;
        padding-right: 28px;
        margin-top: 37px;
        width: 464px;
        line-height: 1.225;
    }

    .promos .cta {
        margin: 0 auto;
        margin-top: 236px;
    }

    .specials {
        margin-top: 310px;
        padding-bottom: 150px;
    }
    
    .specials-wrapper {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        margin: 0;
        width: 1583px;
        justify-content:flex-start;
        gap: 99px;
        position: relative;
        left: 33px;
    }
    
    .specials-icons {
        margin-top: 0;
        display: flex;
        flex-direction: row;
        gap: unset;
        justify-content: space-between;
        width: 754px;
        flex-wrap: wrap;
        flex-shrink: 0;
        row-gap: 31px;
        position: relative;
        top: 34px;
    }
    
    .specials-icon {
        width: 344px;
        position: relative;
    }
    
    .specials-icon h3 {
        color: #3578BA;
        font-weight: 900;
        line-height: 1.155;
        font-size: 30px;
        position: absolute;
        bottom: 21px;
        text-align: center;
        left: 50%;
        transform: translate(-50%, 0);
        width: 294px;
    }
    
    .specials-info {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 671px;
    }

    .specials h2 {
        font-size: 96px;
        line-height: 1.22;
        letter-spacing: 0;
        text-align: center;
        width: auto;
    }
    
    .specials-description {
        order: 2;
        margin-top: 67px;
        display: flex;
        flex-direction: column;
        align-items: center;
        position: relative;
    }
    
    .specials-description p {
        width: 100%;
        margin-bottom: 61px;
        font-size: 50px;
        line-height: 1.22;
    }
    
    .specials .cta {
        order: 3;
        margin-top: 15px;
        width: 671px;
        height: 150px;
        font-size: 48px;
        border-radius: 13px;
    }

}