*{
   margin: 0;
	padding-top: 3px;
	font-family: arial,sans-serif;
	box-sizing: border-box;
   
   
  
}
body{
   font-family: 'Lato', sans-serif;
font-family: 'Roboto', sans-serif;
}
.menu{
   font-size: small;
   font-weight: 400;
   line-height: 1.5;
   color: #000;
}



.menu ul{
 display: flex;
 list-style: none;
 padding-left: 15em;
 
}

.menu li{
	padding: 10px;
	transition: transform 0.2s ease-in;
   

}
.menu li:hover{
	transform: translateY(-10px);
}
.menu a{
	color: black;
	text-decoration: none;
	text-transform: uppercase;
	
}
.navi a:hover{
   color: #ccc;
	font-weight: bolder;
}
.menu a:hover{
   border-bottom: solid yellowgreen;

}
.menu .highlight{
   color: yellowgreen;
   padding-left:3em;
}
.menu .current a{
   color: yellowgreen;
}
.mainbody{
background-color: #ccc;
padding: 80px;
height: 50%;
margin: 60px;
}
.list{
   padding-bottom: 10px;
}
.list ul{
   list-style: none;
}
.checkmark{
   display: flex;
   gap: 1em;
}

.card{
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   background: rgba(225, 225, 225, .2);
   box-shadow:0 5px 15px rgba(0,0,0,0.5) ;
   gap: 0.6em;
   margin: 10px;
   padding: 30px;
   border-radius: 15px;
}
.card1 img{
   height:5em;
}
.folder{
   text-align: center;
}
.folder img{
   height: 15em;
   transition: 0.5s all ease-in-out;
   
}
.folder img:hover{
   transform: scale(1.5); 
}
.foot{
   background-color: #ccc;
   height:15em;
}
.footer .social a {
   margin: 0 10px;
   

 }
 .social{
   display: flex;
   justify-content: center;
   gap: 1em;
 }
 
 .fa-github:hover {
   color: #000000;
 }
 
 .fa-linkedin:hover {
   color: #1773EA;
 }
 
 .fa-instagram:hover {
   color: #B32E87;
 }
 
 .fa-twitter:hover {
   color: #1C9CEA;
 }

/*tablets*/
 

 /*mobile*/
 @media(max-width:500px){
   *{
      font-size: small;
      padding: 0%;
   }
      .menu ul {
         float:right;
      }

      .card{
         display:none;
      }

      .mainbody{
         height: 50%;
         width: fit-content;
         font-size: medium;
         padding: 10%;
         margin: 10%;
      }
   
      
 }