*{
    margin: 0px;
    padding: 0px;
    box-sizing: border-box;
    text-decoration: none; 
}

body{
    min-height: 100vh;
    background: rgb(255,255,255);;
}

 header{ 
     position: fixed; 
     top: 0; 
     left: 0; 
     width: 100%; 
     height: 80px; 
     background: #fff; 
     box-shadow: 0 4px 25px -22px black; 
     z-index: 10; 
 } 

 .header-content{ 
     max-width: 1200px; 
     margin: auto; 
     display: flex; 
     justify-content: space-between; 
     position: relative; 
 } 

 .logo{ 
     height: 80px; 
     display: flex; 
     justify-content: center; 
     align-items: center; 
 } 

 .logo h1{
    color: #4b4c4d;
 }

 .logo h1 b{ 
     color: #c1c1c1; 
 } 

 .menu { 
     height: 80px; 
     margin-right: 60px; 
 } 

 .menu nav{ 
     height: 100%; 
 } 

 .menu nav ul{ 
     height: 100%; 
     display: flex; 
     list-style: none; 
 } 

 .menu nav ul li{ 
     height: 100%; 
     margin: 0px 20px; 
     display: flex; 
     justify-content: center; 
     align-items: center; 
     position: relative; 
 } 

 .menu-selected:before{ 
     content: ''; 
     width: 100%; 
     height: 4px; 
     background: #4b4c4d; 
     position: absolute; 
     top: 0; 
     left: 0; 
 } 

 .menu { 
    height: 80px; 
    margin-right: 60px; 
} 

.menu nav{ 
    height: 100%; 
} 

.menu nav ul{ 
    height: 100%; 
    display: flex; 
    list-style: none; 
} 

 .menu nav ul li a{ 
     color: #000000; 
     font-size: 18px; 
     transition: color 300ms; 
 } 

 .menu nav ul li a:hover{ 
     color: #cfcfcf; 
 } 

 .menu nav ul li a i{ 
     display: none; 
 } 

 #icon-menu{ 
     width: 50px; 
     height: 50px; 
     position: absolute; 
     right: 20px; 
     top: 16px; 
     padding: 10px; 
     font-size: 20px; 
     background: #eeeeeefa; 
     border-radius: 100%; 
     color: #787878; 
     display: none; 
     justify-content: center; 
     align-items: center; 
     cursor: pointer; 
 } 

 #icon-menu:hover{ 
     opacity: 0.8; 
 } 


 /* Responsive Design - adaptable a dispositivos moviles*/ 
 @media screen and (max-width: 1220px){ 
     .header-content, 
     .container-footer footer{ 
         max-width: 1000px; 
         padding: 0 20px; 
     } 
 } 

 @media screen and (max-width: 800px){ 
     body{ 
         overflow-x: hidden; 
     } 

     .container-all{ 
         transition: all 300ms cubic-bezier(1,0,0,1); 
     } 

     .move-container-all{ 
         transform: translateX(300px); 
     } 

     .menu{ 
         width: 0px; 
         height: 100vh; 
         position: fixed; 
         top: 80px; 
         left: 0; 
         background: #fff; 
         overflow: hidden; 
         transform: translateX(-350px); 
         box-shadow: 10px 0 20px -25px black; 
         transition: all 300ms cubic-bezier(1,0,0,1); 
     } 

     .show-lateral { 
         width: 300px; 
         transform: translateX(0px); 
     } 

     .menu nav ul { 
         flex-direction: column; 
     } 

     .menu nav ul li{ 
         max-width: 200px; 
         height: 50px; 
         justify-content: flex-start; 
     } 

     .menu-selected:before{ 
         width: 0; 
     } 

     .menu nav ul li a{ 
         margin-top: 40px; 
         color: #858585; 
     }  

     .menu nav ul li a i{ 
         width: 20px; 
         display: inline-block; 
         margin-right: 10px; 
         color: #4f4f4f; 
     } 

     #icon-menu{ 
         display: flex; 
         right: 6px; 
     } 

     .container-aside{ 
         flex-wrap: wrap; 
     } 
 }