*{
	margin: 0;
	padding: 0;
}
header{
	width: 100%;
	background-color: #2C3E50;
	height: 15vw;
	align-content: center;
	position: fixed;
	z-index: 2;
}
.header{
	width: 85%;
	margin-left: 7.5%;
	display: flex;
	align-content: center;
}
.header-header{
	width: 50%;
	display: flex;
	align-content: center;
}
.header-logo{
	width: 30%;
	text-align: center;
}
.header-logo img{
	width: 95%;
}
.header-name{
	width: 70%;
	color: #ffffff;
	font-family: sans-serif;
	font-size: 1.2vw;
	display: flex;
}
.header-name h1{
	align-content: center;
	float: right;
	font-weight: 900;
}
.nav{
	width: 45%;
	margin-left: 5%;
	display: flex;
	align-content: center;
	text-align: center;
}
.nav-home{
	display: flex;
	margin: auto;
	align-content: center;
	text-align: center;
}
.nav-home a{
	width: 100%;
	display: flex;
	text-decoration: none;
	color: #EBEDEE;
	align-content: center;
	text-align: left;
}
.nav-home a:hover{
	width: 110%;
	height: 110%;
	padding: 0.2vw;
	background-color: #425262;
	margin-top: -0.3vw;
}
.nav-home a img{
	width: 2vw;
	margin-right: 0.2vw;
}
.nav-home a h2{
	font-size: 1.2vw;
	font-family: sans-serif;
	align-content: center;
}
.nav-home1{
	width: 40%;
	margin: auto;
	display: flex;
	text-align: left;
	position: relative;
}

.nav-home1 a{
	height: 3.5vw;
	width: 100%;
	display: flex;
	text-decoration: none;
	color: #EBEDEE;
	align-content: center;
	text-align: center;
	background-color: #E74C3C;
	border-radius: 10vw;
}
.nav-home1 a:hover{
	background-color: #C0392B;
	margin-top: -0.3vw;
	box-shadow: 0 0.5vw 0.5vw #E74C3C;
}
.nav-home1 a img{
	width: 2vw;
	margin-left: 3vw;
}
.nav-home1 a h2{
	font-size: 1.2vw;
	font-family: sans-serif;
	align-content: center;
}

/*inicio*/
main {
	width: 100%;	
}
.main{
	height: 60vw;
	background-image: url("imagenes/fondo.png");
	background-size: cover;
	background-attachment: fixed;
	background-position: center;
	padding-top: 15vw;
	position: relative;
	z-index: 1;
	width: 100%;
}

.inicio-title{	
	width: 40%;
	margin-left: 30%;
	text-align: center;
}
.inicio-title h2{
	margin-top: 8vw;
	font-size: 3vw;
	color: #ffffff;
	font-family: sans-serif;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}
.inicio-title p{
	margin-top: 3vw;
	margin-bottom: 3vw;
	font-size: 2vw;
	color: #ffffff;
	font-family: sans-serif;
	text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}
.inicio-cont{	
	width: 36%;
	margin-left: 32%;
	text-align: center;
}
.inicio-cont button{
	width: 50%;
	height: 5vw;
	margin-bottom: 3vw;
	font-size: 2vw;
	border-radius: 0.7vw;
	color: #ffffff;
	border: none;
}
#button1{
	background-color: #0D6EFD;
}
#button2{
	background-color: #198754;
}
#button3{
	background-color: #DC3545;
}
#button1:hover{
	background-color: #0B5ED7;
}
#button2:hover{
	background-color: #157347;
}
#button3:hover{
	background-color: #BB2D3B;
}
footer{
	width: 100%;
	background-color: #2C3E50;
}
.footer{
	width: 100%;
	padding-top: 5vw;
}
.contador{
	width: 18%;
	height: 10vw;
	margin-left: 41%;
	text-align: center;
	background-color: #3A4754;
	border: solid 3px #47545F;
	border-radius: 2vw;
	align-content: center;
}
.contador h1{
	font-size: 5vw;
	background: linear-gradient(#BD5E62,#6A82AC);
	-webkit-background-clip: text;
	color: transparent; 
	font-family: sans-serif; 
}
.contador p{
	font-size: 2vw;
	color: #748388;
}
.footer-text{
	width: 100%;
	text-align: center;
	margin-top: 2vw;
	padding-bottom: 3vw;
}
.footer-text p{
	font-size: 1.5vw;
	font-family: sans-serif;
	width: 50%;
	margin-left: 25%;
	color: #ffffff;
	margin-top: 2vw;
}

/*registro*/
.main_registro{
	padding-top: 15vw;
	position: relative;
	z-index: 1;
	width: 100%;
	background-color: #F8F9FA;
}
.main_registro_title{
	width: 85%;
	margin-left: 7.5%;
	display: flex;
	align-content: center;
	margin-top: 3vw;
}
.main_registro_title a{
	text-decoration: none;
	text-align: center;
	align-content: center;
	width: 10vw;
	background-color: #6C757D;
	font-size: 1.2vw;
	border-radius: 0.5vw;
	height: 2.8vw;
	color: #ffffff;
	border: none;
}

.main_registro_title a:hover{
	cursor: pointer;
	background-color: #5C636A;
}
.main_registro_title h2{
	width: 70%;
	padding-left: 25vw;
	font-family: sans-serif;
	font-size: 2vw;
}
.main_registro_form{
	width: 85%;
	margin-left: 7.5%;
	margin-top: 3vw;
	font-family: sans-serif;
}
.main_registro_form label{
	font-size: 1.3vw;
	font-weight: 300;
	margin-bottom: 1.5vw;
	color: #4b4343;
}
.main_registro_form input, .main_registro_form select{
	width: 100%;
	height: 3vw;
	background-color: #ffffff;
	margin-bottom: 2vw;
	border-radius: 0.5vw;
	border: none;
}
#registrar{
	width: 10vw;
	height: 3vw;
	font-size: 1.5vw;
	font-family: sans-serif;
	background-color: #0D6EFD;
	color: #ffffff;
}

/*inicio*/
.main_inicio{
	width: 100%;
	height: 100%;
	/*padding: 2vw 0 2vw 0;*/
	display: flex;
	z-index: 1;
	width: 100%;
	background: linear-gradient(#4EADFE,#01F1FE);
}
.main_inicio form{
	width: 20vw;
	height: auto;
	padding: 3vw 1vw 0 1vw;
	margin: auto;
	background-color: #ffffff;
	border-radius: 1vw;
}
#error_inicio{
	text-align: center;
	color: red;
	margin-top: -2vw;
	margin-bottom: 2vw;
	font-size: 1.2vw;
}
.main_inicio_logo{
	width: 100%;
	text-align: center;	
}
.main_inicio_logo img{
	width: 10vw;
}
.main_inicio_logo h2{
	font-size: 2vw;
	font-family: sans-serif;
	margin-top: 1vw;
	margin-bottom: 1vw;
	color: #4b4343;
}
.main_inicio_logo p{
	font-size: 1.2vw;
	font-family: sans-serif;
}
.main_inicio form label{
	width: 90%;
	margin-left: 5%;
	font-size: 1.5vw;
}
.main_inicio form input{
	width: 90%;
	margin-left: 5%;
	height: 2.5vw;
	border-radius: 0.5vw;
	border: 0.2px solid #4b4343;
}
.main_inicio form button{
	width: 80%;
	margin-left: 10%;
	height: 3vw;
	font-size: 1.5vw;
	font-family: sans-serif;
	background-color: #0D6EFD;
	color: #ffffff;
	margin-bottom: 2vw;
	border: none;
	border-radius: 0.5vw;
}

/*usuario*/
.main_usuario{
	padding-top: 15vw;
	position: relative;
	width: 100%;
	margin-bottom: 5vw;
	background-color: #F8F9FA;
}
.main_usuario h2{
	width: 50%;
	margin-left: 25%;
	margin-top: 2vw;
	font-size: 2.5vw;
	font-family: sans-serif;
	text-align: center;
	color: #2c3e50;
	letter-spacing: 1px;
	font-weight: 600;
}
.main_usuario p{
	width: 50%;
	margin-left: 25%;
	margin-top: 1vw;
	font-size: 1.5vw;
	font-family: sans-serif;
	text-align: center;
	color: #2c3e50;
}
.cont_usuario{
	width: 80%;
	margin-left: 10%;
	margin-top: 3vw;
	text-align: center;
}
#documentos{
	width: 100%;
	height: 4vw;
	background-color: #0D6EFD;
	align-content: center;
}
#documentos:hover{
	background-color: #0B5ED7;
}
#documentos a, #imprimir_pasaporte a, #cerrar_sesion a{
	text-decoration: none;
	font-size: 1.5vw;
	font-family: sans-serif;
	color: #ffffff;
}

#imprimir_pasaporte{
	width: 100%;
	height: 4vw;
	margin-top: 2vw;
	background-color: #198754;
	align-content: center;
}
#imprimir_pasaporte:hover{
	background-color: #157347;
}
#cerrar_sesion{
	width: 100%;
	height: 4vw;
	margin-top: 2vw;
	background-color: #DC3545;
	align-content: center;
}
#cerrar_sesion:hover{
	background-color: #BB2D3B;
}
/*documentos*/
.main_document{
	padding-top: 15vw;
	position: relative;
	width: 100%;
	margin-bottom: 5vw;
	background-color: #F8F9FA;
}
.main_document_title{
	width: 80%;
	margin-left: 10%;
	display: flex;
	margin-top: 3vw;
	font-family: sans-serif;
}
.main_document_title_text{
	width: 50%;	
	font-size: 2vw;	
	display: flex;
}
.main_document_title_text h2{
	float: right;
	font-weight: 200;
}
.main_document_title_button{
	width: 50%;
	display: flex;
	position: relative;
}
.main_document_title_button a{
	text-decoration: none;
	width: 11vw;
	border-radius: 1vw;
	background-color: #6C757D;
	color: #ffffff;
	align-content: center;
	text-align: center;
	font-weight: 400;
	margin-left: 70%;
}
.table{
	width: 80%;
	margin-left: 10%;
	margin-top: 4vw;
}
table{
	width: 100%;
	font-size: 1.2vw;
	font-family: sans-serif;
}
.table_title{
	background-color: #ffffff;
	height: 3vw;
}
tr{
	height: auto;
	align-content: center;
}
.tr_white{
	background-color: #ffffff;
}
.tr_grey{
	background-color: #F2F2F2;
}
.ver_des{
	width: 100%;
	height: auto;
	align-content: center;
	padding: 1vw 0 1vw 0;
}
.ver_des a{
	text-decoration: none;
	color: #ffffff;
	margin: 1vw 0 1vw 0;
}
.doc_ver{
	background-color: #0DCAF0;
	padding: 0.2vw;
}
.doc_des{
	background-color: #198754;
	padding: 0.2vw;
}
/*quienes*/
.main_quienes{
	width: 100%;
	padding-top: 15vw;
	font-family: sans-serif;
	text-align: justify;
	/*background-color: #F8F9FA;*/
	color: #333333;
	position: relative;
}
.main_quienes::before {
	content: '';
	position: absolute;
	top: 12.5%;
	left:12.5%;
	width: 75%;
	height: 75%;
	background-color:#F8F9FA;
	background-image: url('imagenes/logo.png');
	background-size: cover;
	background-position: center;
	opacity: 0.1;	
	/*z-index: -1;*/
}

.main_quienes_title{
	width: 100%;
	margin-top: 3vw;
	text-align: center;
	font-size: 2vw;
}
.main_quienes_cont{
	width: 100%;
	margin-top: 3vw;
}
.main_quienes_cont p{
	width: 60%;
	margin-left: 20%;
	font-size: 1.3vw;
	margin-top: 1vw;
}
.main_quienes_cont ul{
	width: 60%;
	margin-left: 20%;
	font-size: 1.3vw;
	margin-top: 3vw;
}
.main_quienes_cont ul li{
	list-style: none;
	align-content: center;
	margin-bottom: 2vw;
}
.main_quienes_cont ul li img{
	width: 1.1vw;
	margin-right: 1vw;
}
.main_quienes_opl{
	width: 60%;
	margin-left: 20%;
	font-size: 1.2vw;
	background-color: #CFF4FC;
	padding: 2vw 0 2vw 0;
}
.main_quienes_opl h1{
	width: 90%;
	margin-left: 5%;
	text-align: center;
}
.main_quienes_opl p{
	width: 90%;
	margin-left: 5%;
	text-align: justify;
	margin-top: 2vw;
}
.main_quienes_unete{
	width: 60%;
	margin-left: 20%;
	margin-top: 2vw;
	text-align: center;
}
.main_quienes_unete h2{
	font-size: 2vw;
	margin-bottom: 2vw;
}
.main_quienes_unete a input{
	width: 15vw;
	height: 3vw;
	color: #ffffff;
	background-color: #0B5ED7;
	font-size: 1.5vw;
	border-radius: 0.5vw;
	border: none;
	margin-bottom: 3vw;
}
@media (max-width: 600px){
	header{
	height: 50vw;
	}
	.header{
		display: block;
	}
	.header-header{
		width: 100%;
		display: block;
		align-content: center;
		text-align: center;
	}
	.header-logo{
		width: 100%;
		text-align: center;
	}
	.header-logo img{
		width: 30%;
	}
	.header-name{
		width: 80%;
		margin-left: 10%;
		font-size: 3vw;
		display: block;
	}
	.header-name h1{
		float: center;
	}
	.nav{
		width: 110%;
		margin-left: -5%;
		margin-top: 3vw;
	}
	.nav-home a:hover{
		width: 110%;
		height: 110%;
		padding: 0.2vw;
		background-color: #425262;
		margin-top: -0.3vw;
	}
	.nav-home a img{
		width: 4vw;
		margin-right: 0.2vw;
	}
	.nav-home a h2{
		font-size: 4vw;
		font-family: sans-serif;
		align-content: center;
	}
	.nav-home1{
		width: 35%;
		text-align: right;
		position: relative;
	}

	.nav-home1 a{
		height: 7vw;
		width: 100%;
		display: flex;
		text-decoration: none;
		color: #EBEDEE;
		align-content: center;
		text-align: center;
		background-color: #E74C3C;
		border-radius: 10vw;
	}
	.nav-home1 a:hover{
		background-color: #C0392B;
		margin-top: -0.3vw;
		box-shadow: 0 0.5vw 0.5vw #E74C3C;
	}
	.nav-home1 a img{
		width: 4vw;
		margin-left: 3vw;
	}
	.nav-home1 a h2{
		font-size: 3.5vw;
		font-family: sans-serif;
		align-content: center;
	}
	/*inicio*/
	main {
		width: 100%;	
	}
	.main{
		height: 130vw;
		padding-top: 60vw;
	}

	.inicio-title{	
		width: 80%;
		margin-left: 10%;
	}
	.inicio-title h2{
		margin-top: 8vw;
		font-size: 8vw;
	}
	.inicio-title p{
		margin-top: 3vw;
		margin-bottom: 3vw;
		font-size: 6vw;
		color: #ffffff;
		font-family: sans-serif;
		text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
	}
	.inicio-cont{	
		width: 80%;
		margin-left: 10%;
		margin-top: 10vw;
	}
	.inicio-cont button{
		width: 100%;
		height: 13vw;
		margin-bottom: 9vw;
		font-size: 7vw;
		border-radius: 1vw;
	}

	.contador{
		width: 40%;
		height: 20vw;
		margin-left: 30%;
	
	}
	.contador h1{
		font-size: 10vw;
	}
	.contador p{
		font-size: 5vw;
	}
	.footer-text{
		width: 100%;
		margin-top: 4vw;
		padding-bottom: 6vw;
	}
	.footer-text p{
		font-size: 4vw;
		width: 70%;
		margin-left: 15%;
		margin-top: 2vw;
	}
	.main_registro{
		padding-top: 60vw;
	}
	
	.main_registro_title a{
		width: 30vw;
		font-size: 3vw;
		border-radius: 0.5vw;
		height: 8vw;
	}

	.main_registro_title a:hover{
		cursor: pointer;
		background-color: #5C636A;
	}
	.main_registro_title h2{
		width: 90%;
		margin-left: 5%;
		padding-left: 0;
		font-size: 5vw;
	}
	
	.main_registro_form label{
		font-size: 4vw;
		margin-bottom: 2vw;
	}
	.main_registro_form input, .main_registro_form select{
		height: 6vw;
		margin-bottom: 4vw;
	}
	#registrar{
		width: 25vw;
		height: 8vw;
		font-size:5vw;
	}

	/*iniciar*/

	.main_inicio form{
		width: 80vw;
		padding: 3vw 1vw 0 1vw;
	}
	#error_inicio{
		font-size: 3vw;
	}

	.main_inicio_logo img{
		width: 40vw;
		margin-bottom: 5vw;
	}
	.main_inicio_logo h2{
		font-size: 8vw;
		margin-top: 3vw;
	}
	.main_inicio_logo p{
		font-size: 5vw;
	}
	.main_inicio form label{
		font-size: 4vw;
	}
	.main_inicio form input{
		height: 6vw;
		border-radius: 1vw;
	}
	.main_inicio form button{
		width: 80%;
		margin-left: 10%;
		height: 6vw;
		font-size: 4vw;
		margin-bottom: 4vw;
		border-radius: 1vw;
	}
	/*usuario*/
	.main_usuario{
		padding-top: 60vw;
	}
	.main_usuario h2{
		width: 90%;
		margin-left: 5%;
		margin-top: 10vw;
		font-size: 5vw;
	}
	.main_usuario p{
		width: 90%;
		margin-left: 5%;
		margin-top: 2vw;
		font-size: 4vw;
	}
	.cont_usuario{
		width: 80%;
		margin-left: 10%;
		margin-top: 15vw;
		text-align: center;
		margin-bottom: 20vw;
	}
	#documentos{
		height: 10vw;
	}

	#documentos a, #imprimir_pasaporte a, #cerrar_sesion a{
		font-size: 5vw;
	}

	#imprimir_pasaporte{
		height: 10vw;
		margin-top: 15vw;
	}

	#cerrar_sesion{
		width: 100%;
		height: 10vw;
		margin-top: 15vw;
	}
	/*documentos*/
	.main_document{
		padding-top: 60vw;
		width: 100%;
		margin-bottom: 5vw;
	}
	.main_document_title_text{
		width: 70%;	
		font-size: 4vw;	

	}
	.main_document_title_text h2{
		font-weight: 200;
	}
	.main_document_title_button{
		width: 30%;
		display: flex;
		margin-left: -20%;
		position: relative;
	}
	.main_document_title_button a{
		width: 40vw;
		height: 10vw;
		font-size: 5vw;
		border-radius: 1vw;
		background-color: #6C757D;
		color: #ffffff;
		align-content: center;
		text-align: center;
		font-weight: 400;
	}
	.main_document_title_button a h2{
		font-size: 4vw;
		width: 30vw;
	}
	
	table{
		width: 100%;
		font-size: 3.5vw;
		margin-top: 15vw;
		margin-bottom: 20vw;
	}
	.table_title{
		background-color: #ffffff;
		height: 10vw;
	}
	.main_quienes{
		padding-top: 60vw;
	}
	.main_quienes_title{
		width: 100%;
		margin-top: 0;
		text-align: center;
		font-size: 5vw;
	}
	.main_quienes_cont{
		margin-top: 3vw;
	}
	.main_quienes_cont p{
		width: 90%;
		margin-left: 5%;
		font-size: 3vw;
		margin-top: 2vw;
	}
	.main_quienes_cont ul{
		width: 90%;
		margin-left: 5%;
		font-size: 3vw;
		margin-top: 5vw;
	}
	.main_quienes_cont ul li{
		margin-bottom: 3vw;
	}
	.main_quienes_cont ul li img{
		width: 3vw;
	}
	.main_quienes_opl{
		width: 90%;
		margin-left: 5%;
		font-size: 3vw;
		padding: 5vw 0 5vw 0;
	}
	.main_quienes_opl h1{
		width: 90%;
		margin-left: 5%;
		text-align: center;
	}
	.main_quienes_opl p{
		width: 90%;
		margin-left: 5%;
		text-align: justify;
		margin-top: 2vw;
	}
	.main_quienes_unete{
		width: 90%;
		margin-left: 5%;
		margin-top: 3vw;
	}
	.main_quienes_unete h2{
		font-size: 3vw;
		margin-bottom: 2vw;
	}
	.main_quienes_unete a input{
		width: 20vw;
		height: 5vw;
		font-size: 2.5vw;
		margin-bottom: 5vw;
		margin-top: 5vw;
	}

}