*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    text-decoration: none;
    list-style: none;
}
.header{
    
    display: flex;
    justify-content: space-evenly;
    flex-wrap: wrap;
    position: fixed;
    width: 100%;  
    padding: 35px 12%;
    background: rgb(43, 43, 105);
    align-items: center;
     z-index:1;
}
@media screen and  (max-width:700px){
   .header{
      display: flex;
      justify-content: space-evenly;
      flex-wrap: nowrap;
      font-size: 10px;
}
}
.logo{
    font-size: 25px;
    color: aqua;
    
}
a{
   font-size: 18px;
    color: white;
    margin: 0 20px;
}

 .navitems:hover{
    color: aqua;
    border-bottom: 2px solid aqua;
}  
 .contact1{
    padding: 10px 25px;
    background-color: rgb(182, 234, 247);
    color:rgb(10, 10, 10);
    border:2px solid transparent;
    border-radius: 8px;
    font-size: 15px;
 }
 .contact1:hover{
    background-color: rgb(108, 237, 247);
    color: white;
 }
 .page{
    width: 100%;
    min-height: 100vh;
    background: white;
    display: flex;
    align-items: center;
     gap: 7em;
    padding: 30px 12% 0;
 }
 .content{
    max-width: 700px;
 }
 .content h2{
    font-size: 40px;
 }
 .content h1{
    font-size: 60px;
 }
 .content p{
    font-size: 18px;
    margin: 25px 0 30px;
 }
 img{
   border-radius: 50%;
   width: 410px;
 }
 .btn{
    width:340px;
    display: flex;
 }
 .btn1{
   width: 200px;
    padding: 12px 25px;
    background-color: black;
    color: white;
    font-size: 15px;
    border-radius: 8px;
    cursor: pointer;
 }
 .btn1:hover{
    background-color: white;
    color: black;
    box-shadow:10px 10px 12px 2px rgb(100, 99, 99);
 }
 .btn2{
    width: 200px;
    padding: 20px 25px;
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);
    font-size: 15px;
    border-radius: 8px;
    cursor: pointer;
 }
 .btn2:hover{
    background-color: rgb(91, 217, 248);
    color: rgb(255, 255, 255);
    box-shadow:10px 10px 12px 2px rgb(100, 99, 99);
 }
 ::-webkit-scrollbar{
    width: 15px;
  }

  ::-webkit-scrollbar-thumb{
    background-color: rgba(187, 190, 190, 0.829);
  }

  ::-webkit-scrollbar-track{
    background-color: rgba(0, 0, 0, 0.637);
    width: 50px;
  }
  .about{
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 10% 5%;
    gap:10em;
    background:black;
  }
  .about h2{
    text-align: left;
    color: white;
    font-size: 40px;
  }
  .about h3{
    font-size: 60px;
    color: white;
  }
  .about p{
    font-size: 20px;
    color: white;
  }
  .contact h2{
    text-align: center;
    margin-top: 80px;
    font-size: 36px;
  }
  .container {
   width: 100%; 
   min-height: 70vh; 
   display: flex; 
   justify-content: center; 
   align-items: center;
 }
 .input {
   text-align: center; 
   border: 1px solid #ccc; 
   padding: 20px; 
   border-radius: 5px; 
 }

 input {
   display: block; 
   width: 100%; 
   margin-bottom: 10px; 
   padding: 10px; 
   border-radius: 3px; 
 }
  .btn3{
   padding: 12px 25px;
   background-color: black;
   color: white;
   font-size: 15px;
   border-radius: 8px;
   cursor: pointer;
   border: none;
}
.btn3:hover{
   background-color: white;
   color: black;
}
.Project{
   padding: 10px 5px;
   min-height: 100vh;
   background: white;
}
.projecthead{
   margin-top: 140px;
   font-size: 50px;
   text-align: center;
}
.containers{
   display: flex;
   justify-content: space-evenly;
   margin-top: 60px;
}
.container1 {
   width: 350px; 
   height: 315px; 
   background-color: rgb(43, 43, 105);
   border-radius: 20px;
} 
.todo{
   color:aqua;
   padding-left: 30px;
   padding-right: 30px;
}
.container2 {
   width: 350px; 
   height: 315px; 
   background-color: rgb(43, 43, 105);
   border-radius: 20px;
} 
.container3 {
   width: 350px; 
   height: 315px; 
   background-color: rgb(43, 43, 105);
   border-radius: 20px;
} 
.text{
   text-align: center;
   color: white;
   padding: 10%;
   font-family: "Abril Fatface", serif;
   font-weight: 400;
   font-style: normal;
   font-size: 40px;
}
.one{
   margin-top: 25px;
}
.viewbtn{
   background-color: rgb(182, 234, 247);
   width: 90px;
   padding: 15px;
   border-radius: 25px;
   margin-left: 105px;
   margin-top:20px ;
   cursor: pointer;
   border: 3px solid black;
}
.viewbtn:hover{background-color: rgb(108, 237, 247);color: white;}
.edu{
   min-height: 100vh;
   background-color: rgb(0, 0, 0);
   display: flex;
   justify-content: center;
}
.education{
   color: aqua;
   font-size: 50px;
   margin: 60px;
   margin-top: 290px;
   margin-left: 20px;

}
.year1{
   color: white;
   margin-top: 170px;
   margin-left: 70px;
}
.line{
   border-left: 5px solid aqua;
   margin-left:20px;
   margin-top: 120px;
   height: 510px;
}
.clg{
   color: white;
   margin-top: 125px;
   margin-left: 20px;
}

 .threelines{
   display: flex;
 }
