@import url('https://fonts.googleapis.com/css?family=Lobster|Philosopher:400i&display=swap');
@import url('https://fonts.googleapis.com/css2? família=David+Libre&família=Montaga&família=Poppins:wght@300&família=Fonte+Sans+Pro&display=swap');

.menu {
   margin-top: 70px;
   width:180px;
   height:93%;
   transition:all .5s;
   top: 100px;
   background-color: #2f3132;
   overflow-y:auto;
   overflow-x:auto;
   box-shadow: 0px 5px 10px 2px #4F4F4F;
}

.menu img{
   width: 50px;
}
.menu ul{
   width:90%;
   list-style: none;
   margin-left: -20%;

}

 .menu li{
    padding: 10px;
    font-size: 12px;
}

 .menu label{
   padding: 3px;
   color:black;
   font-size: 22px;

}

.menu li:hover{
   background-color: #b1b5f5;
   color: #b62929;
   border: 1px solid #989999;
   border-radius: 5px;
}

.menu_label:hover{
   color: #b62929;
}

 .menu a{
   padding: 0px;
   color: #f8f9fa;
   text-decoration: none;
   font-size: 15px;
}
 .menu_label{
   left:215px;
   top: -1px;
   position: fixed;
   display: block;
   margin:0px -200px;
   right: 8px;
 }

 .menu_label img{
   margin-left: -11px;
   margin-top: 22px;
   width: 30px;
   position: fixed;
   right: 8px;
   display: none; /* Botão do menu responsivo */
 }

 #bt_menu_mobil{
   right: 10px;
   position: absolute;
   margin-top: -10px;
   width: 30px;
   display: none; /* Botão do menu responsivo */
}
/* Responsividade do menu */


@media (max-width: 768px) {
.menu_input[type="checkbox"]{
   display: block}
.menu_input[type ="checkbox"]:checked ~ nav{
   transform: translateX(300px);
} 

   .menu{
      top:0;
      position: fixed;
      overflow-y:auto;
      margin-left: -300px;
      height: 91%;
   }
   .menu_label{
      display: block;
   }
   .menu_label img{
      display: block; /* Botão do menu responsivo */
   }
   #bt_menu_mobil{
      display: block;
   }
}

.caicha_texto4{
  font-size: 16px;
  border: 1px solid #adafaf;
  border-radius: 5px;
  resize: none;
}