/* 
 *  CSS TABLE OF CONTENTS:
 *   
 *  1.0 - Desktop Devices Up To 1440px
 *  2.0 - Desktop Devices & Tablets Up To 1200px
 *  3.0 - Standard Tablets Up To 992px
 *  4.0 - Large Mobile Devices Up To 767px
 *  5.0 - Standard Mobile Devices Up To 600px
 *  
 */

/**********************************************************/
/*           1.0 - Desktop Devices Up To 1440px           */
/**********************************************************/

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

    .container {
        padding-left: 10%;
        padding-right: 10%;
    }

}

/**********************************************************/
/*           End - Desktop Devices Up To 1440px           */
/**********************************************************/

/**********************************************************/
/*      2.0 - Desktop Devices & Tablets Up To 1200px      */
/**********************************************************/

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

    h1 { font-size: 48px; }
    h2 { font-size: 32px; }

    #heroHeader {
        width: 100%;
        height: 600px;
    }

    .wrapper-header-video video {
        width: 100%;
        height: 600px;
    }

    /* Logo */
    .wrapper-logo {
        top: 50px;
        left: calc(10% - 12px);
    }

        .wrapper-logo img {
            height: 500px;
            width: auto;
        }
    
    .container-section1 { 
        padding-top: 120px;
    }

    .txt-section1 h2 {
        display: none;
    }
    
    .heading-section1 h2 {
        display: block;
    }

}

/**********************************************************/
/*      End - Desktop Devices & Tablets Up To 1200px      */
/**********************************************************/

/**********************************************************/
/*           3.0 - Standard Tablets Up To 992px           */
/**********************************************************/

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

    .container {
        padding: 100px 8%;
    }

    h1 { font-size: 42px; }
    h2 { font-size: 28px; }
    h5 { font-size: 18px; }
    p  { font-size: 18px; }

    .container-section1 { 
        padding-top: 80px;
    }

    .container-section2 {
        padding-top: 70px;
        padding-bottom: 60px;
    }

    /* Info Columns */
    .info-columns .col-4 img {
        width: 140px;
        height: auto;
    }

    .info-col-first {
        width: calc(50% - 30px);
        margin: 0 30px 0 0;
    }
    
    .info-col-second {
        width: calc(50% - 30px);
        margin: 0 0 0 30px;
    }
    
    .info-col-third {
        width: calc(50% - 30px);
        margin: 60px 30px 0 0;
    }
    
    .info-col-fourth {
        width: calc(50% - 30px);
        margin: 60px 0 0 30px;
    }

    .container-gallery {
        padding: 100px 0;
    }

    .content-gallery {
        max-width: 100%;
        margin: 0 5%;
    }

    .wrapper-slider {
        margin-bottom: 70px;
    }

    .heading-section4 {
        width: calc(50% - 50px);
        margin-right: 50px;
    }

    .left-content--section5 {
        width: 200px;
    }
    
        .left-content--section5 img {
            width: 200px;
            height: 200px;
        }
    
    .right-content--section5 {
        width: calc(100% - 260px);
    }

}

/**********************************************************/
/*           End - Standard Tablets Up To 992px           */
/**********************************************************/

/**********************************************************/
/*         4.0 - Large Mobile Devices Up To 767px         */
/**********************************************************/

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

    .container {
        padding-left: 5%;
        padding-right: 5%;
    }

    .col-4, .col-5, .col-6,
    .col-7, .col-8, .col-12 
    { 
        width: 100%; 
    }

    #heroHeader {
        width: 100%;
        height: 500px;
    }

    .wrapper-header-video video {
        width: 100%;
        height: 500px;
    }

    /* Logo */
    .wrapper-logo {
        top: 30px;
        left: 5%;
    }

        .wrapper-logo img {
            height: 440px;
            width: auto;
        }
    
    .img-section1 { 
        padding-top: 20px;
    }

    /* Info Columns */
    .info-col-first, .info-col-second,
    .info-col-third, .info-col-fourth
    {
        margin: 20px 100px;
    }

    .info-col-first {
        margin-top: 0;
    }

    .info-col-fourth {
        margin-bottom: 0;
    }

    .info-col-fourth h4 {
        margin-top: -15px;
    }

    .container-section3 {
        padding-bottom: 80px;
    }

    .wrapper-slider {
        margin-top: 40px;
    }

        .wrapper-slider .items img {
            height: 450px;
            width: auto;
        }

    .slick-center {
        -webkit-transform: scale(1);
        -moz-transform: scale(1);
        transform: scale(1);
    }
    
    .slick-list { 
        padding: 0 !important;
    }

    .left-content--section5 {
        margin-right: 50px;
    }
    
    .right-content--section5 {
        width: calc(100% - 250px);
    }

}

/**********************************************************/
/*         End - Large Mobile Devices Up To 767px         */
/**********************************************************/

/**********************************************************/
/*       5.0 - Standard Mobile Devices Up To 600px        */
/**********************************************************/

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

    h1 { font-size: 36px; }
    h2 { font-size: 24px; }
    h4 { font-size: 20px; }
    p { font-size: 16px; }

    #heroHeader {
        width: 100%;
        height: 450px;
    }

    .wrapper-header-video video {
        width: 100%;
        height: 450px;
    }

    /* Logo */
    .wrapper-logo {
        top: 40px;
        left: 5%;
    }

        .wrapper-logo img {
            height: 370px;
            width: auto;
        }

    /* Info Columns */
    .info-col-first, .info-col-second,
    .info-col-third, .info-col-fourth
    {
        margin-left: 20px;
        margin-right: 20px;
    }

    .heading-section3, 
    .heading-section4 
    {
        margin-right: 0;
    }

    .wrapper-slider .items img {
        height: 400px;
        width: auto;
    }

    .left-content--section5 {
        width: 100%;
        margin-right: 0;
    }

    .right-content--section5 {
        width: 100%;
        margin-top: 30px;
    }

}

/**********************************************************/
/*       End - Standard Mobile Devices Up To 600px        */
/**********************************************************/
