@charset "utf-8";
/* CSS Document */
/*
font-family: 'Francois One', sans-serif; //Títulos y botones
font-family: 'Roboto Condensed', sans-serif; //Textos
*/

html{
    width:100%;
    height:100%;
}

body{
	margin: 0%;
    background-color: #61335d;
	
	-webkit-user-select: none;
	-moz-user-select: none;
	-khtml-user-select: none;
	-ms-user-select:none;
}

.contenedor{
    position:absolute;
}

#registro{
    position: absolute;
    cursor: pointer;
    width: 29.5%;
    height: 8%;
    left: 61%;
    top: 42%;
}

#email{
	position: absolute;
    cursor: text;
    width: 29%;
    height: 6.8%;
    left: 61%;
    top: 42.25%;
    background-color: transparent;
    outline: none;
    border: none;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 2vw;
    text-align: center;
}

#clave{
    position: absolute;
    cursor: pointer;
    width: 29%;
    height: 6.8%;
    left: 61%;
    top: 52%;
    background-color: transparent;
    outline: none;
    border: none;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 2vw;
    text-align: center;
}

#entrar{
    position: absolute;
    cursor: pointer;
    width: 18.5%;
    height: 9.75%;
    left: 66.5%;
    top: 62.25%;
}

#olvido-clave{
    position: absolute;
    cursor: pointer;
    width: 14%;
    height: 3.25%;
    left: 68.75%;
    top: 75%;
}

#mensaje-error{
    position: absolute;
    cursor: pointer;
    width: 46%;
    left: 48%;
    top: 90%;
    color: #f5ffa5;
    text-align: center;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 1.5vw;
    background-color: #000a;
}

#terminos-y-condiciones{
    position: absolute;
    cursor: pointer;
    width: 34%;
    height: 2.7778%;
    left: 39%;
    top: 93.5%;
}

input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active  {
  transition: background-color 5000s;
  -webkit-text-fill-color: #333 !important;
  font-size:2vw;
}

@media screen and (max-aspect-ratio: 1/1) { /* portrait styles here */
    #registro{
        width: 31.5%;
		height: 4.5%;
		left: 34.5%;
		top: 64.75%;
    }

	#email{
		width: 52%;
        height: 4%;
        left: 32%;
        top: 66%;
        font-size: 2.5vh;
    }

	#clave{
		width: 50%;
        height: 4%;
        left: 33%;
        top: 71.5%;
        font-size: 2.5vh;
    }

	#entrar{
		width: 32.75%;
        height: 5.5%;
        left: 42%;
        top: 77.5%;
    }

	#olvido-clave{
		width: 25%;
        height: 2%;
        left: 46%;
        top: 84.5%;
    }

	#terminos-y-condiciones{    
		width: 60%;
		height: 1.5%;
		left: 33%;
		top: 96%;
    }

	#mensaje-error{
		width: 84%;
		left: 8%;
		top: 91%;
		font-size: 2vh;
		padding: 1%;
    }

    input:-webkit-autofill,
    input:-webkit-autofill:hover, 
    input:-webkit-autofill:focus, 
    input:-webkit-autofill:active  {
      transition: background-color 5000s;
      -webkit-text-fill-color: #333 !important;
      font-size:2.5vh;
    }
}