HTML
<!DOCTYPE html>
<html>
<head>
<title>Title</title>
</head>
<body>
<div id="window">
<form>
<label for="enter">Вход</label>
<br/><br/>
<input type="email" placeholder="Введите ваш email" required></input>
<br/><br/>
<input type="password" placeholder="Введите пароль" ></input>
<br/><br/>
<button name="enter">Вход</button>
</form>
</div>
</body>
</html>
CSS
*{
color:#FFF;
text-align:center;
font-size:2vw;
background:transparent;
}
body {
background-image:url("https://img.fonwall.ru/o/36/poselok_novogodniy_vecher_domiki_svet.jpg");
background-size:100vw 100vh;
}
button {
box-shadow:inset 0px 0px 3px rgb(0, 0, 0), inset 2px 2px 3px rgb(0, 0, 0), -2px 0px 3px rgb(0, 0, 0), inset 0px -2px 3px rgb(0, 0, 0);
position:relative;
left:7.5vw;
Border:0.05vw solid #fff;
width:10vw;
}
button:hover{
background: rgba(255, 255, 255, 0.5);
cursor:pointer;
}
#window{
border:0.05vw solid #fff;
padding:3vw;
width:30vw;
position:relative;
top:10vw;
left:35vw;
background:rgba(0, 0, 0, 0.5);
}
input {
width:25vw;
text-align:left;
}
input:hover{
background: rgba(255, 255, 255, 0.5);
}
