/********************** Typo ************************* *
 *  1. Small (tablet portrait) > 640px
 *  2. Medium (tablet landscape) > 960px
 *  3. Large (laptop) > 1200px
 *  4. XLarge (desktop) > 1600px
 *  5. XXLarge (mac) > 2000px
*****************************************************/

/******** 1. Small (tablet portrait) > 640px ********/

@media only screen and (min-width: 640px) {
    .page-homepage .footer {
        /* padding: 55px 0 35px; */
        padding: 55px;
    }
    h1 {
        font-size: 100px;
    }
    h1.smaller-h1 {
        font-size: 72px;
    }
    h2,
    .uk-light h2 {
        font-size: 24px;
    }
    .testimonial-single {
        font-size: 18px;
    }
    .testimonial-single small {
        font-size: 16px;
    }
    .testimonial-single .uk-panel {
        padding: 80px 60px 90px 90px;
    }
    .service-box-link {
        font-size: 20px;
        width: 144px;
        height: 144px;
        padding: 18px;
    }
    .padding-bottom {
        padding-bottom: 150px;
    }
    #main h1 {
        font-size: 72px;
    }
    .uk-button,
    .gform_button.button {
        padding: 15px 35px;
    }
}

/******* 2. Medium (tablet landscape) > 960px *******/

@media only screen and (min-width: 960px) {
    h1 {
        font-size: 150px;
    }
    h1.smaller-h1 {
        font-size: 112px;
    }
    #main h1 {
        font-size: 104px;
    }
    .page-our-story #main .hero h1 {
        font-size: 150px;
    }
    .testimonial-single {
        font-size: 22px;
    }
    #field_3_10 .gfield_radio {
        column-gap: 30px;
        column-count: 2;
    }
}

/*********** 3. Large (laptop) > 1200px *************/

@media only screen and (min-width: 1200px) {
    .corner-top,
    .corner-bottom {
        height: 10px;
        width: 10px;
        position: absolute;
        right: -10px;
        top: 0;
        display: block;
    }
    .corner-top::after,
    .corner-bottom::after {
        position: absolute;
        content: "";
        background: url(../../img/corner-top-left.svg);
        height: 10px;
        width: 10px;
    }
    .corner-bottom {
        left: 17px;
        top: -90px;
        right: auto;
    }
    .corner-bottom::after {
        transform: rotate(-90deg);
    }
    .page-homepage .uk-slidenav-previous {
        right: 100%;
    }
    .page-homepage .uk-slidenav-next {
        left: 100%;
    }
}

/*********** 4. XLarge (desktop) > 1600px ***********/

@media only screen and (min-width: 1600px) {
    .uk-container {
        padding-left: 70px;
        padding-right: 70px;
    }
    .corner-bottom {
        left: -10px;
    }
}

/*********** 5. XXLarge (mac) > 2000px ***********/

@media only screen and (min-width: 2000px) {    
    html {
        font-size: 1vw;
    }
    h1 {
        font-size: 7.813vw;
    }
    h1.smaller-h1 {
        font-size: 5.833vw;
    }
    h2,
    .uk-light h2,
    h4 {
        font-size: 1.250vw;
    }
}


@media only screen and (max-width: 640px) {
    .btn-scroll-up {
        top: auto;
        bottom: 0;
    }
}
