body
{
    background-color: azure;
    background-attachment: fixed;
    background-image:url(../imagenes/fondo_sesion.jpg);
}

@media (min-width: 1980px) 
{ 
    body
    {
	 background-size: 100% 100%;
    }
}

#inicio_sesion
{
    top:20px; 
    max-width:350px; 
    margin:auto;
    opacity:0;
    color:white;
	
    animation-name:inicio_sesion_animacion;
    animation-direction:normal;
    animation-duration:1.5s;
    animation-iteration-count:1;
    animation-timing-function:linear;
    animation-fill-mode:forwards;
}
@keyframes inicio_sesion_animacion
{
    100%
    {
        opacity:0.90;
    }
}

.card
{
    opacity:0.9;
    box-shadow:0 0 1px #666;
    border:none;
}

button
{
    cursor:pointer;
    margin:2px;
    outline:none;
    border-style: outset;
    text-decoration:none;
    border:none;
}

button:focus
{ 
    outline-color: transparent; 
    outline-style: none;
}

.teclas_numericas
{
    width:25px; 
    height:25px;
    border-radius:5px;
    color:white;
    font-size:12px;
    cursor:pointer;
    margin:2px;
    background-color:#17a2b8;
}

.teclas_alfabeticas
{
    width:30px; 
    height:30px;
    border-radius:5px;
    font-size:14px;
    cursor:pointer;
    margin:2px;
    background-color:#dbdbdc;
}

#alerta
{
    z-index:1080;
    top:-100px;
    right:10px;
    left:10px;
    position:fixed;
}