/*
   Responsive Design
*/
.desktop-view{display: block;}
.tablet-view{display: none;}
.mobile-view{display: none;}
.tab-mob-view{display: none;}

@media (max-width: 1280px){
    img.sk-wording {
        margin-right: 12%;
    }
    
/*    .hero-section{padding-top: 9%;}*/
    p.exclusive-text {font-size: 9px;}
}

@media (max-width: 1024px) {
    .hero-section{
/*        height: 650px;*/
        height: auto;
    }
    .hero-content h1 {
        font-size: 32px;
        line-height: 42px;
    }
    .section-heading h2{
        font-size: 32px;
        line-height: 42px;
    }
}

/* ---- Start of max-width 992px CSS ---- */
@media (max-width: 992px) {
    .tab-mob-view{display: block;}
    .sm-padding{ padding: 15px; }
    .menu-btn,
    .menu-wrap ul.nav{
        display: none;
    }
    .slicknav_menu {
/*        display:block;*/
        display: none;
    }
    .slicknav_nav li:last-child{ display: none; }
    .hero-section{padding-top: 0;}
    .hero-content h1 {
        font-size: 32px;
        line-height: 42px;
    }
    p.exclusive-text {
        font-size: 8px;
        margin-top: -6%;
        margin-left: 7%;
    }
    
    .feature-section{
        padding-top: 0;
    }
    
    div.content {
        width: 100%!important;
        padding: 5%;
    }

    section#outlets img {
        width: 100%!important;
        padding: 5%;
        margin-bottom: 0%;
    }
    
    .about-list {
        padding: 5% 5%;
    }
    .desktop-view{display: none;}
    .tablet-view{display: block;}
    .mobile-view{display: none;}
}
/* ---- End of max-width 992px CSS ---- */


/* ---- Start of min-width 480px and max-width 768px CSS ---- */
@media all and (min-width: 480px) and (max-width: 768px) {
	
}
/* ---- End of min-width 480px and max-width 768px CSS ---- */


/* ---- Start of max-width 767px CSS ---- */
@media all and (max-width: 767px) {
    body, p{
        font-size: 12px;
        line-height: 22px;
    }
    h1{
        font-size: 30px!important;
    }
    h2{
        font-size: 20px;
    }
    h3{
        font-size: 16px;
    }
    p br{
        display: none;
    }
    .padding{
        padding: 60px 0;
    }
    .xs-padding{
    	padding: 15px;
    }
    .hero-section{
        height: auto;
        padding: 0;
        background-position: top center;
    }
    .hero-section{padding-top: 0;}
    .hero-content{
        text-align: center;
    }
    .feature-section{
        padding-top: 0;
    }
    .section-heading h2 {
        font-size: 24px;
        line-height: 36px;
    }
    
    h1.white-text.t1 {
        margin-bottom: 0;
        line-height: 1.0;
        font-family: times new roman;
        font-size: 48px!important;
    }
    
    .outlet-card{background: transparent!important;padding: 0!important;border-radius: 0!important;}
    
    .mobile-outlet-card{
        padding: 1%!important;
        background: pink!important;
        border-radius: 4px!important;
    }
}
/* ---- End of max-width 767px CSS ---- */


/* ---- Start of max-width 520px CSS ---- */
@media all and (max-width: 520px) {
    .subscribe-form{ width: 100%; }
    .card-header a{
        font-size: 14px;
        line-height: 18px;
    }
    #accordion{
        padding-right: 0;
    }
    .subscribe-form input{
        width: 100%;
    }
    .submit-btn{
        width: 100%;
    }
    .default-btn.order{
        font-size: 8px;
    }
    .section-heading h2{
        font-size: 32px;
        line-height: 26px;
        letter-spacing: -0.5px;
    }
    .section-heading h2 br{
        display: none;
    }
    .icons-wrap span.icon-2{
        left: 5%;
        top: 40px;
    }
    .icons-wrap span {
        left: 110px;
        top: 40px;
    }
    .icons-wrap span.icon-3{
        top: 55px;
    } 
    section#video-generic{padding: 32px 10px!important;}
    
    p.exclusive-text {
        font-size: 6px;
        margin-top: -6%;
        margin-right: 7%;
    }
    
    .desktop-view{display: none;}
    .tablet-view{display: none;}
    .mobile-view{display: block;}
}
/* ---- End of max-width 520px CSS ---- */


/* ---- Start of max-width 420px CSS ---- */
@media all and (max-width: 420px) {
    .about-list {
        padding: 5% 0;
    }
    h1.white-text.t1 {
        font-size: 45px!important;
    }
    
    p.exclusive-text {
        font-size: 8px;
        margin-top: -6%;
        margin-left: 5%;
    }
}
/* ---- End of max-width 420px CSS ---- */


/* ---- Start of max-width 380px CSS ---- */
@media all and (max-width: 380px) {
	.about-list li {
        font-size: 17px;
    }
    h1.white-text.t1 {
        font-size: 43px!important;
    }
    p.white-text.t2 {
        font-size: 11px;
    }
    
}
/* ---- End of max-width 380px CSS ---- */