@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap');

*{ padding:0; margin:0}

body{font-family: 'Roboto', sans-serif;}

#main{ width:100%; 
       height:100vh; 
       background:url(../img/bg.png) no-repeat center center;
	   background-size:cover;
	   position:absolute;
}


.msgError{ color:#ff0000; text-align:center; font-size:15px}
.msgError p{ padding:2px}

.msgInfo{ color:#16871e; text-align:center; font-size:15px}
.msgInfo p{ padding:2px}


#login { width:500px; height:500px; margin:auto; position:absolute; left:50%; top:50%; margin-left:-250px; margin-top:-310px}
h1{ text-align:center; font-size:22px; padding-top:30px}
h2{ text-align:center; font-size:20px; margin-top: 10px; text-decoration: underline; }
#login p{ text-align:center; padding:10px 10px 10px 10px}
#login input{ width:80%; height: 45px; margin-left:5%;  padding:0 5%; margin-top:10px; font-size:16px; }
#login select{ width:80%; height: 45px; margin-left:5%; background-color: white !important;  padding:0 5%; margin-top:10px; font-size:16px; }


#login a:link{ text-decoration:none; color:#000}
#login a:visited{ text-decoration:none; color:#000}
#login a:hover{ color:#555}



.logo { width:240px; height:120px;margin:auto;}
.logo img{ width:100%; height:100%; }

.bton{ background-color:#fc6b01; border:none; color:#fff; cursor:pointer}
.bton:hover{background-color:#e66303}

.bton2{ width: 100% !important; background-color:#fc6b01; border:none; color:#fff; cursor:pointer}
.bton2:hover{background-color:#e66303}


	
#registro{ width:100%; 
	       height:100%;
 
       background:url(../img/bg.png) no-repeat center center fixed;
	   background-size:cover;

}

#registrarCondomino { width:500px; height:auto; max-height: 1000px; margin:auto; margin-bottom: 80px}

#registrarCondomino p{ text-align:center; padding:10px 10px 10px 10px}
#registrarCondomino input{ width:80%; height: 45px; margin-left:5%;  padding:0 5%; margin-top:10px; font-size:16px; }
#registrarCondomino select{ width:80%; height: 45px; margin-left:5%; background-color: white !important;  padding:0 5%; margin-top:10px; font-size:16px; }
.checkbox{ width: 20px !important; height: 20px !important; padding-top: 200px !important }



#registrarCondomino a:link{ text-decoration:none; color:#000}
#registrarCondomino a:visited{ text-decoration:none; color:#000}
#registrarCondomino a:hover{ color:#555}

#recuperar{ width:500px; height:700px; margin:auto;}

#recuperar p{ text-align:center; padding:10px 10px 10px 10px}
#recuperar input{ width:80%; height: 45px; margin-left:5%;  padding:0 5%; margin-top:10px; font-size:16px; }
#recuperarselect{ width:80%; height: 45px; margin-left:5%; background-color: white !important;  padding:0 5%; margin-top:10px; font-size:16px; }


#footer{ width: 100%; height: 70px;  bottom: 0; position: absolute; font-size: 14px }
#footer p{ text-align: center; margin-top: 10px}


#footer2{ width: 100%; height: 70px;  font-size: 14px }
#footer2 p{ text-align: center;  margin-top: 10px}

#footer a:link{ text-decoration:none; color:#000}
#footer a:visited{ text-decoration:none; color:#000}
#footer a:hover{ color:#555}

#footer2 a:link{ text-decoration:none; color:#000}
#footer2 a:visited{ text-decoration:none; color:#000}
#footer2 a:hover{ color:#555}


@media screen and (max-width:768px){

#login { width:90%; height:auto; margin-left:-45%; margin-top:-290px}
h1{font-size:16px; padding-top:20px}
h2{font-size:14px}
#login p{ text-align:center; padding:10px 10px 10px 10px; font-size: 14px}


.logo { width:200px; height:100px; margin-top:20px}



#registrarCondomino { width:90%; height:auto; margin:auto; padding-bottom: 100px}

#recuperar{ width:90%; height:auto; margin:auto;}




}