@charset "utf-8";
/* CSS Document */

.mainMenu{ display: flex; list-style:none; padding: 0; }
.mainMenu li{ position:relative; flex: 1; text-align: center; }
.mainMenu a{ -webkit-transition:all ease-out 250ms; -moz-transition:all ease-out 250ms; -ms-transition:all ease-out 250ms; -o-transition:all ease-out 250ms; }
.mainMenu a{ padding: 15px; text-align: center; color: white; text-transform: capitalize; border: 1px solid transparent; font-size: 16px; }
.mainMenu a:hover{ color: white; background: #00911a; border-radius: 2px; }

.bt{ background: white; font: inherit; align-items: center; padding: 0 10px; border-radius: 3px; margin: 5px; }
.bt i{ margin-right: 10px; }
.responsivo { display: none; margin-left: 5px; }
#responsivo_fundo { display: none; position: fixed; z-index: 99999; width: 100%; height: 100%; top: 0; left: 0; background: rgba(0,0,0,.6);}

@media screen and (max-width:650px) {
    nav{ display: flex; justify-content: flex-end; margin-right: 10px; }
    .responsivo { display: flex; }
    .mainMenu { display: flex; justify-content: space-around; flex-direction: column; position: fixed; top: 0; right: -100%; width: 50%; max-width: 250px; min-width: 250px; height: 100%; background: white; border-left: 4px solid #00911a; overflow-y: auto; z-index: 999999; }
    .mainMenu li{ flex: none; }
    .mainMenu li a { color: #313f68; padding: 15px; margin: 0 10px; flex: 1; display: flex; justify-content: center; }
    .mainMenu li a:hover { color: white; background: #00911a; }
    #responsivo_fecha { float: right; }
}