body {
     font-family: "Montserrat", sans-serif;
     margin: 0;
     padding: 0;
     overflow-x: hidden;
}


     /* Navbar css */

nav {
     width: 100%;
    height: 13%;
     display: flex;
     flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    padding:  0px 140.657px;
    position: fixed;
    background-color: white;
      box-shadow: 0px 2px 3px rgb(239, 239, 239);
     z-index: 999;
 
  
}

nav img {
    width: 80x;
    height: 80px;
} 


nav div a {
font-size: 12px;
font-weight: 700;
  font-family: "Montserrat", sans-serif;
padding: 0px 12px;
text-decoration: none;
color: #3d3d3db0;
letter-spacing: 0.1px;
transition: all,0.3s ease-in-out ;
}

naV div a:hover {
    color: rgb(83, 83, 83);
}
  
nav div a i {
     font-size: 16px;
      font-family: "Open Sans", sans-serif;
      color: #616161;
      opacity: 0.5;
      transition: all,0.3s ease-in-out ;
}

nav div a i:hover {
     opacity: 1;
}

@media (max-width: 720px) {
  nav {
    padding: 0;
    justify-content: space-evenly;
  }
}

        /* Cards css */

.cards {
   padding-top: 170px;  
   width: 100%;
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
 
   
   
}        

.card {
    margin: 20px 15px 80px 15px;
    width: 379.59px !important;
    border: none !important;
    padding-bottom: 20px !important;
    box-shadow: 0px 2px 3px rgb(239, 239, 239) !important;

}

.card img {
     border-radius: 7px;
     cursor: pointer;
}


.card .categry {
     margin-top: 25px;
     font-size: 11px;
     color: #d79c6a;
     text-decoration: none;
      font-family: "Montserrat", sans-serif;
    font-weight: 700;
    letter-spacing: 2px;
    text-transform: uppercase;
   
}

.card div h2 {
     font-family: "Montserrat", sans-serif;
     font-size: 26px;
     font-weight: 700;
     color: #2b2b2b;
     margin-top: 10px;
      transition: all,0.3s ease-in-out ;

}

.card div h2:hover{
     opacity: 0.8;
}

.card div p {
   font-family: "Open Sans", sans-serif;
   font-size: 14px;  
   color: #7f7e7e;
   line-height: 23px;
   padding-bottom: 19px;
}

.card-link {
     text-decoration: none;
     color: #8d8d8d;
     font-family: "Montserrat", sans-serif;
     font-size: 11px;
     transition: all,0.3s ease-in-out ;

}

.card-link:hover{
     color: rgb(79, 79, 79);
}


         /* Page icons css */



.page-icons span {
    width: 50px;
    height: 50px;
    background-color: white;
    color: #4b4b4b;
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    bottom: 20px;
    font-size: 20px;
    
}

#up-arrow {
    width: 45px;
    height: 45px;
    border-radius: 5px;
    right: 20px;
     transition: all,0.5s ease-in-out ;
    
}


.page-icons span:hover{
    background-color: #f12424;
}

             /* Footer css */

 .footer {
   padding: 25px 10px;
   background-color: #1e1e1e;
   display: flex;
   
   
}              

.footer p{
     font-size: 12px;
      font-family: "Open Sans", sans-serif;
      color: #b4b4b4;
      background-color: #1e1e1e;
      margin-left: 120px;
      margin-top: 20px;
   
}