*{
      margin: 0;
      padding: 0;
      box-sizing: border-box;
       font-family:  sans-serif; 
}

*::selection{
      color: #fff;
      background-color: #000;
}

.nunito {
  font-family: "Nunito", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

html, body {
      height: 100%;
      height: 100%;
}

#main{
      width: 100%;
      background-color: white;   
}

#home{
      width: 100%;
      min-height: 100vh;
      background-color: white;
}

#nav{
      width: 100%;
      padding: 30px 50px;
      display: flex;
      align-items: center;
      justify-content: space-between;
}

#nav img{
      width: 80px;
}

#nav #right{
      display: flex;
      align-items: center;
      gap: 30px;
}

#nav a{
      text-decoration: none;
      font-weight: 400;
      color: black;
      letter-spacing: -1px;
}

#home #homemain{
      width: 100%;
      padding: 17vw 14vw;
}

#homemain h1{
      font-weight: 500;
      font-size: 1.5vw;
      letter-spacing: -0.1px;
}

#headings{
      display: flex;
      align-items: center;
      gap: 35px;
}

#headings h1{
      font-weight: Bold;
      font-size: 5.5vw;
      color: black;
      padding-top: 8px;
      color: transparent;
      -webkit-text-stroke: 0.5px #000;
}

#homemain #headings h1:hover{
      color: #000;
}

#homelast{
      display: flex;
      align-content: center;
      justify-content: center;
      padding :5vw 14vw;
}
#homelast p{
      font-weight: 400;
      font-size: 1.3vw;
      line-height: 1.6;
      text-align: center;
      color: #000; 
      max-width: 800px;
      margin: 40px auto;
}

#homelast p::selection{
      color: #fff;
      background-color: #000;
}

#featured{
      padding: 10vw 14vw;

}

.fheading>h1{
      line-height:1;
      font-size: 3vw;
      font-weight: 500;
}

.fheading>h1:nth-child(2){
      color: transparent;
      -webkit-text-stroke: 0.2px black      ;
}

#fimg{
      display: flex;
      justify-content: space-between;
      width: 100%;
      height: 100vh;
      margin-top: 5vw;
}

#fleft{
      overflow: hidden;
      width: 45%;
      height: inherit;

}

.fleftelm{
      width: 100%;
      height: inherit;
      display: flex;
      flex-direction: column;
      justify-content: center;

}

.fleftelm h3{
      font-weight: 600;
      font-size: 12px;
}

.fleftelm h1{
      font-size: 25px;
      text-transform: capitalize;
      line-height: 1;
      margin: 1.5vw 0vw;
}

.fleftelm h5{
      font-weight: 100;
      font-size: 12px;
      color: grey;
      opacity: 0.5;
}

#fright{
      display: flex;
      align-items: center;
      justify-content: center;
      width: 45%;
      height: inherit;

}

#fright .images{
      overflow: hidden;
      width: 90%;
      height: 90vh;
}

#fright .images img{
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.btn{
      display: flex;
      align-items: center;
      justify-content: center;
      padding-top: 12vw;
}

.btn button{    
      padding: 1vw 1.5vw;
      border-radius: 100px;
      border: 1px solid rgb(215, 215, 215);
      background-color: white;
      font-size:1vw ;
      font-weight: 400;
      letter-spacing: -0.2px;
}

#dev{
      width: 100%;
      padding: 5vw 14vw;
}

#dev h1{
      font-weight: 400;
      font-size: 3.8vw;
      width: 55%;
      line-height: 1;
}

#dev p{
      font-size: 1.5vw;
      margin-top: 3vw;
      letter-spacing: -0.3px;
      width: 55%;
}

#slides{
     display: flex;
     justify-content: space-between; 
     padding: 3vw 10vw;
}

.slide{
      width: 30%;
      height: 100px;
}

.slide .img{
      width: 100%;
      height: 150px;
      background-color: yellowgreen;
      overflow: hidden;
      border-radius: 10 px;
}

.slide .tag{
      font-size: 0.8vw;
      width: fit-content;
      border-radius: 100px;
      padding: 10px ;
      background-color: rgb(237, 237, 237);
      margin: 10px 0;
}

.slide h3{
      font-size: 1.5vw;
      width: 100%;
      font-weight: 600;
      letter-spacing: -0.2px;
}

.slide .img img{
      width: 100%;
      height: 100%;
      object-fit: cover;
}

.btn2{
      display: flex;
      align-items: center;
      justify-content: center;
      padding-top: 16vw;
}

.btn2 button{    
      padding: 1vw 1.5vw;
      border-radius: 100px;
      border: 1px solid rgb(215, 215, 215);
      background-color: white;
      font-size:1vw ;
      font-weight: 400;
      letter-spacing: -0.2px;
}
   