style.css

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

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

#main {
  height: 100%;
  width: 100%;
  background-color: rgb(255, 255, 255);
}

#nav {
  height: 100px;
  width: 100%;
  background-color: white;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 30px;
  padding: 0 30px;
}

#nav h4 {
  font-size: 20px;
  font-weight: 600;
}

#nav i {
  background-color: black;
  color: white;
  font-size: 20px;
  font-weight: 500;
  padding: 10px;
  border-radius: 50%;
}

#center {
  width: 100%;
  background-color: white;
  padding: 20px 80px;
}

#center h1 {
  
  /* font-size: 78px; */
  font-size: 4.1vw;
  font-weight: 500;
  line-height: 4.4vw;

}

#center-in {
  /* background-color: red; */
  width: 100%;
  margin-top: 42px;
  display: flex;
  justify-content: space-between;
}

#center-in p {
  font-size: 1.17vw;
  font-weight: 600;
  line-height: 1.8vw;
}
#right {
  width: 20%;
}

.elem {
  /* background-color: yellow; */
  /* margin: 5px; */
  padding: 20px 0;
  border-top: 2px solid #000;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.elem i{
    font-size: 25px;
    font-weight: 500;
    opacity: 0;
}

.elem a {
  text-decoration: none;
   color: black; 
  font-size: 20px;
  font-weight: 600;
}

.elem:hover i{
      opacity:1 ;
}

/* .elem:hover a{ 
   text-decoration: underline;
}*/

#bottom {
    height: 100vh; /* Full viewport height */
    width: 100vw;  /* Full viewport width */
    background-image: url(https://media.gettyimages.com/id/1484093150/photo/portrait-of-beautiful-young-woman-casual-clothes-and-backpack-walking-on-the-dry-grass.jpg?s=2048x2048&w=gi&k=20&c=euqTzG5Xfzkfu2yQuwCX9pUUw5a5OqzF45KlQpQAp_E=);
    background-size: cover; /* Ensure the image covers the entire area */
    background-position: center; /* Center the image */
    background-repeat: no-repeat; /* Prevent image repetition */
}

@media (max-width:600px) {
    #nav {
        height: 60px;
        gap: 20px;
        padding: 0 20px;
      }
      #nav h4 {
        font-size: 12px;
        font-weight: 600;
        /* display: none; */
      }
      
      #nav i {
        background-color: black;
        color: white;
        font-size: 11px;
        font-weight: 500;
        padding: 7px;
        border-radius: 50%;
      }
      #center {
        width: 100%;
        background-color: white;
        padding: 15px 20px ;
      }
      
      #center h1 {
        
        /* font-size: 78px; */
        font-size: 10vw;
        font-weight: 500;
        line-height: 12vw;
      
      }
      
      #center-in {
        /* background-color: red; */
        width: 100%;
        margin-top: 24px;
        display: flex;
        gap: 40px;
        flex-direction: column;
        justify-content: space-between;
      }
      
      #center-in p {
        font-size: 3vw;
        font-weight: 600;
        line-height: 4vw;
      }
      #right {
        width: 100%;
      }
      
      .elem {
        /* background-color: yellow; */
        /* margin: 5px; */
        padding: 10px 0;
        border-top: 1.5px solid #000;
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
      .elem i{
          font-size: 14px;
          font-weight: 500;
          opacity: 1;
          color: #303030; 
      }
      
      .elem a {
        text-decoration: none;
         color: #303030; 
        font-size: 12px;
        font-weight: 600;
      }
      
      bottom {
        height: 33.5vh; /* Full viewport height */
        width: 100vw;  /* Full viewport width */
        background-image: url(https://media.gettyimages.com/id/1484093150/photo/portrait-of-beautiful-young-woman-casual-clothes-and-backpack-walking-on-the-dry-grass.jpg?s=2048x2048&w=gi&k=20&c=euqTzG5Xfzkfu2yQuwCX9pUUw5a5OqzF45KlQpQAp_E=);
        background-size: cover; /* Ensure the image covers the entire area */
        background-position: center; /* Center the image */
        background-repeat: no-repeat; /* Prevent image repetition */
    }
}