/* Responsive Styles */
/* Xtra lg */
@media (min-width: 2560px) {

}

@media (min-width: 1921px) {

}

@media (min-width: 1600px) and (max-width: 1919px) {
   
}

@media (min-width: 1367px) and (max-width: 1599px) {
    
}

/* lg */
@media (min-width: 1200px) and (max-width: 1366px) {
    #particle-1, #particle-2, #particle-3 { display: none; }
    .navbar-custom .nav li a {
        padding-top: 30px;
        padding-bottom: 30px;
        font-size: 16px;
    }

    .navbar-brand > img {
        height: 45px;
        margin-top: 3px;
        margin-right: 25px;
    }

    .active-menu-item::before { top: -24px; }
    .active-menu-item::after { top: 23px; }

    #header-image { height: 110vh; }

    .scroll-btn { bottom: 65px; }

    #offer-landing {
        background: url(../../img/default/backgrounds/offer-landing-section-md-bg.jpg) top center no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        -o-background-size: cover;
    }
}


/* md */
@media (min-width: 992px) and (max-width: 1199px) {
    #particle-1, #particle-2, #particle-3 { display: none; }
    .navbar-custom .nav li a {
        padding-top: 30px;
        padding-bottom: 30px;
        font-size: 16px;
    }

    .navbar-brand > img {
        height: 45px;
        margin-top: 3px;
        margin-right: 25px;
    }

    .active-menu-item::before { top: -24px; }
    .active-menu-item::after { top: 23px; }

    #offer-landing {
        background: url(../../img/default/backgrounds/offer-landing-section-md-bg.jpg) top center no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        -o-background-size: cover;
    }
}


/* sm */
@media (min-width: 768px) and (max-width: 991px) {
    #particle-1, #particle-2, #particle-3 { display: none; }
    .navbar-custom .nav li a {
        padding-top: 30px;
        padding-bottom: 30px;
        font-size: 16px;
    }

    .navbar-brand > img {
        height: 45px;
        margin-top: 3px;
        margin-right: 25px;
    }

    .active-menu-item::before { top: -24px; }
    .active-menu-item::after { top: 23px; }

    #offer-landing {
        background: url(../../img/default/backgrounds/offer-landing-section-md-bg.jpg) top center no-repeat;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        background-size: cover;
        -o-background-size: cover;
    }
}

/* xs */
@media (max-width: 767px) {
    #header-image { display: none; }

    #mobile-header-image {
        display: flex;
        align-items: center;
        height: 100vh;
        margin-bottom: 60px;
    }

    .navbar-custom {
        background: #fff;
        -webkit-box-shadow: 0px 15px 20px -20px rgba(0,0,0,0.3);
        -moz-box-shadow: 0px 15px 20px -20px rgba(0,0,0,0.3);
        box-shadow: 0px 15px 20px -20px rgba(0,0,0,0.3);
    }

    .navbar-brand > img {
        height: 30px;
        margin-top: 0;
        margin-right: 0;
    }

    .navbar-custom li:first-child { margin-left: 25px; }

    .navbar-custom .nav li a {
        padding-top: 5px;
        padding-bottom: 5px;
        font-size: 16px;
    }

    .active-menu-item::before, .active-menu-item::after { background: none; }
    
    #intro-text { max-width: 360px; font-size: 22px;  margin-left: -200px; }

    .direct-image-first-row, .direct-image-second-row { height: 500px; margin-top: 20px; margin-bottom: 20px; }

    .scroll-btn { display: none; }
    #right-side-buttons { top: 100px; }

    #particle-1, #particle-2, #particle-3 { display: none; }

    #custom-content, #about-section, #contact-section { padding-top: 10px; }

    #custom-content img { margin-bottom: 25px; }
    
    .offer-item-wrapper:first-of-type { margin-top: 120px; }
    .offer-item-wrapper { margin-top: 0; margin-bottom: 30px; }

    #social-media-links li {
        display: block;
        margin-right: 0;
        margin-bottom: 15px;
    }

    .footer-menu { padding-left: 15px; padding-right: 15px; }
    #copyright { padding-left: 15px; padding-right: 15px; text-align: left; }
}

/* XS Portrait */
@media (max-width: 480px) {
    #mobile-header-image {
        display: flex;
        align-items: center;
        height: 60vh;
        margin-bottom: 60px;
    }

    #intro-text { max-width: 300px; font-size: 18px; margin-left: -30px; }
    #right-side-buttons { top: 260px; }

    .s-header { font-size: 24px; }

    .direct-image-first-row, .direct-image-second-row { height: 300px; }
}
