body {
margin: 0;
padding: 0;
background-image: url("TECMA FONDO.jpg");
background-repeat: no-repeat;
background-size: cover;
background-attachment: fixed;
font-family: sans-serif;
height: 100vh;
}

.login-box{
width: 320px;
height: 420px;
background:#000;
border-radius: 5%;
color: #fff;
top: 50%;
left: 50%;
position: absolute;
transform: translate(-50%, -50%);
box-sizing: border-box;
padding:70px 30px;

}

.login-box .avatar {
height: 100px;
border-radius: 5%;
position: absolute;
top:-50px;
left: calc(35% - 50px);
width: 205px;

}

.login-box h1
{
margin:0;
padding:0 0 20px;
text-align:center;
font-size: 22px;
}

.login-box label
{
margin:0;
padding: 0;
font-weight: bold;
display:block;
}

.login-box input
{
width: 100%;
margin-bottom:20px;
}

.login-box button
{
width: 100%;
margin-bottom:20px;
}

.login-box input[type="text"],
.login-box input[type="password"]
{
border:none;
border-bottom:1px solid #fff;
background: transparent;
outline: none;
height: 50px;
color: #fff;
font-size: 16px;
}

.login-box a {
text-decoration: none;
font-size: 12px;
line-height: 20px;
color: darkgrey;

}

.login-box a:hover{
color:#fff;
}
.login-box button[type="submit"]:hover{
background-color:#0d6efd;
color: #fff;
}