body {font-family: Tahoma, Verdana, sans-serif;;}
#login_popup {
  padding: 15px;
  position: absolute;
  top: calc(61px - 130px); 
  right: 0px;
  width: 330px;
  height: 130px;
  background-color: rgba(99,99,99,1);
  color: white;
  font-family: 'Tahoma', Verdana, sans-serif;
  animation: drop2 0.3s ease forwards;
}

@keyframes drop2 {
  0% {}
  100% {transform: translateY(120px)}
}

.inputLogin {   
  position: absolute;
	background-color:rgb(230,230,230);
  top: 25px; 
  right: 25px;
  width: 280px;
  padding: 12px 14px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  box-sizing: border-box;
  font-family: Tahoma;
  font-size:14px;
  outline: none; 
 }

.inputLogin:focus {
	background-color: white;
}



#psw {   
  position: absolute;
	background-color:rgb(230,230,230);
  top: 80px; 
  right: 140px;
  width: 165px;
  padding: 12px 14px;
  margin: 8px 0;
  display: inline-block;
  border: none;
  box-sizing: border-box;
  font-family: Tahoma;
  font-size:14px;
z-index:20;
	  outline: none; 
 }


#psw:focus {
	background-color: white;
}


.buttonLogin {
  position: absolute;
  top: 80px; 
  right: 25px;
  width: 60px;
  background: rgb(51,51,51);
  color: hsla(var(--banH), var(--banS), calc(100% - var(--banL)), 1);
        font-family: 'Tahoma', Verdana, sans-serif;
	  font-weight: bold;
	padding: 9px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  box-sizing: border-box;
  transition: 0.2s;
  font-size:15px;
}

.buttonLogin:hover {
  background: rgb(var(--accent1),1);
  color: white;
}

.user_icon{
position: absolute;
top: 40px;
right: 320px;
z-index: 9999;
}
	
.lock_icon{
position: absolute;
top: 95px;
right: 320px;
z-index: 9999;
}


#togglePassword{
color: rgba(100,100,100,1);
cursor: pointer;
margin-left:205px;
margin-top:73px;
z-index:20;
background-color:white;
padding-top: 11px;
padding-bottom :10px;
padding-right :10px;
padding-left :10px;


}

#togglePassword:hover {
color: black;


}