@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');



header{
  background-color: rgb(11,62,105);
  width: 85vw;
  height: 4vw;
  border-radius: 3vw;
  margin-top: 1vw;
  margin-left: 8vw;
  margin-right: 45vw;
  position: fixed;
}

ul{
  list-style: none;
}


#titulo{
  float: left;
  font-weight: bold;
  font-size: 1.5vw;
  padding-top: 1.1vw;
  padding-left: 2vw;
  font-family: "Poppins", serif;
  color: white;
}

#menu-text{
  text-decoration: none;
  color: black;
  font-family:"Poppins", serif;;
  color: white;
  font-size: 1vw;
}

#nav-bar{
  margin-left: 20vw;
}

#nav-bar ul{
  display: flex;
  margin-right: 20vw;

}

#nav-bar li{ 
  margin-top: 0.5vw;
  margin-left: 2vw;
}

#icon{
  margin-left: 60vw;
}

#icon ul{
  display: flex;
  margin-top: -2.3vw;
  margin-left: -6vw;
 
}

#icon li{
  padding-left: 3vw;
}

.icon-img{
  height: 1.1vw;
  width: auto;
}

@media(max-width: 450px){
  header{
    width: 90%;
    height: 4%;
    margin-left: 4%;
  }
  #titulo{
    font-size: 1.5vw;
    padding-top: 2vw;
    padding-left: 3%;
  }
  #menu-text{
    font-size: 1.5vw;
  }
  #nav-bar ul{
    margin-top: -0.5vw;
    padding-left: 1%
  }
  #icon{
    margin-left: 65%;
    margin-top: -9vw;
  }
  .icon-img{
    width: 1.5vw;
    height: auto;
  }
  
  .admin{
      display: none;
  }
  #icon ul{
      margin-left: -2vw;
  }
}