/*
*  CUSTOM RESPONSIVE WEBSITE STYLES
*  Use this stylesheet to overwrite or define new rules for your website's visual appearance.
*  If you need to reference the location of image files, please start your URLs with "/images/".
*/

/* -- Viewport Styles ( Media Query $7 / Default 1161px ) -- */
@media (min-width: $7){
    
    [data-page=home] .website .page_banner {
        padding: 0 0 52%;
        /* height: 650px; */
    }
}


/* -- Viewport Styles ( Media Query $6 / Default 1160px ) -- */
@media (max-width: $6){

    [data-page=home] .website .page_banner {
        padding: 0 0 52%;
        /* height: 620px; */
    }

}


/* -- Viewport Styles ( Media Query $5 / Default 1024px ) -- */
@media (max-width: $5){
    
    .header .header_logo {
        width: 60px;
        height: 60px;
        background-size: 100%;
    }
    
    .website .nav .list_pages {
        
    }

}


/* -- Viewport Styles ( Media Query $4 / Default 900px ) -- */
@media (max-width: $4){

    [data-page=home] .website .page_banner {
        /* height: 485px; */
    }

}


/* -- Viewport Styles ( Media Query $3 / Default 800px ) -- */
@media (max-width: $3){

    .deatsfeats,
    .ophours {
        width: 100%;
    }
    
    .website .nav .list_pages {
        
    }

}


/* -- Viewport Styles ( Media Query $2 / Default 640px ) -- */
@media (max-width: $2){
    
    .header .header_logo.outer {
        position: relative;
        left: 50%;
        transform: translate(-50%, 0);
        margin: 10px auto 15px;
        width: 90%;
        height: auto;
        max-width: 300px;
    }
    .header .header_info {
        margin-right: auto;
    }
    .nav .list_pages {
        background-color: #050505;
    }
    [data-page=home] .website .page_banner,
    .page:first-child > .page_banner .video_banner {
        display: none;
    }
    .nav_expanded .nav .list_pages {
        float: none;
        max-width: none;
        padding: 0;
    }
    
    .footer .footer_info .detail.name {
        max-width: none;
    }

}


/* -- Viewport Styles ( Media Query $1 / Default 420px ) -- */
@media (max-width: $1){


}


/* -- Viewport Styles ( Media Query $0 / Default 320px ) -- */
@media (max-width: $0){


}