#button_menu{ display: none; font-size: 50px; z-index: 1000 }

/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/*Para todos abaixo de 767px                                        */
/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
@media only screen and (max-width: 767px){
    #button_menu{ display: inline-block }
    .nav_mobile{ z-index: 900 }
    .nav_mobile ul{ -webkit-transition: all 500ms linear; -moz-transition: all 500ms linear; -ms-transition: all 500ms linear; -o-transition: all 500ms linear; transition: all 500ms linear }
    /*
        style1
    */
    /* button */
    .nav_style1{ -ms-transform: translateX(-767px); -webkit-transform: translateX(-767px); transform: translateX(-767px) }
    .button_style1{ width: 30px; height: 30px; position: fixed; top: 20px; left: 10px; display: inline-block; font-size: 46px!important }
    .button_style1:after{ font-family: 'Arial', sans-serif; content: '\2261'; width: 100%; color: #ffffff; position: absolute; top: 0; left: 0; line-height: 20px }
    .menu_active .button_style1:after{ content: '\00ab' }
    /* /button */
    /* nav */
    .nav_style1{ width: 180px; height: 100%; font-size: 16px; padding: 40px 20px 20px 20px; position: fixed; top: 0; left: 0; z-index: 900; background-color: rgba(0, 0, 0, 0.9); border-right: 1px solid #333333 }
    .menu_active .nav_style1{ -ms-transform: translateX(0); -webkit-transform: translateX(0); transform: translateX(0) }
    .nav_style1 li, .nav_style1 a{ display: block; text-align: left }
    .nav_style1 li{ margin: 15px 0 }
    .nav_style1 li:first-child{ margin-top: 0 }
    .nav_style1 li:last-child{ margin-bottom: 0 }
    .nav_style1 a{ padding: 10px 0 }
    /* /nav */
    /*
        /style1
    */
}

/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/*Smartphones no modo Paisagem e Tablets Menores                    */
/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
@media only screen and (min-width: 480px) and (max-width: 767px) {

}

/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
/*Smartphones no modo Paisagem e Tablets Menores                    */
/*- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
@media only screen and (min-width: 320px) and (max-width: 479px) {

}