﻿/*
**************************************************************
ESAT SYSTEM
Especialistas en Sistemas y Aplicaciones Tecnológicas

http://www.esatsystem.net
Facebook and Twitter >> @esatsystem
YouTube >> esat system

By: Rashta Vidal Miguel Angel
**************************************************************
*/

/*@import url('https://fonts.googleapis.com/css?family=Open+Sans:400i&display=swap');*/

body{
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	margin-right: 0px;
	background-attachment: fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	background-color: #dddddd;
	font-family:Arial, Helvetica, sans-serif;
	background-image: url("../../Images/homepag.jpg");
  	background-size: 100% 100%;
}

@font-face {
	font-family: 'mfont-1';
	src: url("../fonts/Roboto-Regular.ttf");
}

a:link {text-decoration: none;}
a:visited {text-decoration: none;}
a:hover {text-decoration: none; color: #74C059;}
a:active {text-decoration: none;}
a{color: #862E6E;}

#mask {
	display: none;
	background: #000000; 
	position: fixed; left: 0; top: 0; 
	width: 100%; height: 100%;
	opacity: 0.8;
	z-index: 1;
}

#carga{
	display: none;
	background-color: #fff;
	border-radius: 20px;
	border: 1px solid #000;
	text-align:center;
	position: fixed; left: 50%; top: 50%;
	margin-left:-75px; margin-top:-40px;
	width: 150px; height: 80px;
	padding:10px;
	z-index: 3;
}

.avisook{font-size: 1em; font-weight: bold; color: #2B8557; background-color: #C6FFE9; text-align: center; margin-bottom: 10px; padding: 10px; box-shadow: 0px 0px 5px #49B67E;}
.avisonot{font-size: 1em; font-weight: bold; color: #A33838; background-color: #EBD247; text-align: center; margin-bottom: 10px; padding: 10px;}

#msjregval{
	display: none;
	position: fixed;
	background-color: #fff;
	width: 300px;
	left: 50%; top: 50%;
	margin-left: -150px;
	border-radius: 20px;
	border: 3px solid #d45d79;
	color: #d45d79;
	text-align: center;
	font-size: 14px;
	font-weight: bold;
	overflow: hidden;
	padding: 10px;
	z-index: 2;
	box-shadow: 0px 0px 4px #d45d79;
}

#alert{font-size: 11pt; color: #A33838; display: none; text-align: center;}
#ventana{position: fixed; left: 50%; top: 50%; width: 400px; min-height: 200px; margin-left: -200px; margin-top: -120px; padding: 15px; background-color: #fff; border-radius: 10px; border: 1px solid #B7B7B7; z-index: 2;}

#WinFloat{
	display: none;
	background-color: #fff;
	border-radius: 20px;
	width: 250px; overflow: 100%;
	position: absolute; left: 50%; top: 50%;
	margin-left:-125px;
	padding:5px;
	z-index: 2;
	box-shadow: 0px 0px 4px #fff;
}
	#WinFloat .msg{position: absolute; width: 40px; line-height: 40px; left: 50%; margin-left: -20px; top: 50%; margin-top: -20px; color: #629F52; font-weight: bold; font-size: 50px; display: none; z-index: 3;}
	#WinFloat .title{width: 100%; background-color: #960283; color: #fff; font-size: 2em; font-weight: bold; padding: 5px; border-radius: 20px; text-align: center;}
	#WinFloat .subtitle{font-size: 14px; color: #6e5773; text-align: center; padding: 5px; margin-bottom: 10px; line-height: 20px; background-color: #39375b; color: #fff;}
	#WinFloat .asterisk{font-size: 12px; color: red;}
	#WinFloat #headform{font-size: 12px; color: #1b262c;}
	#WinFloat #formvirtual{font-size: 12px; font-weight: bold; text-align: justify; color: #6e5773; padding: 0 5px;}
	#WinFloat input[type="text"]{height: 30px; border: 1px solid #A9BBED; border-bottom: 2px solid #4990B9; font-size: 12px; text-align: center;}
	#WinFloat select{height: 30px; border: 1px solid #A9BBED; border-bottom: 2px solid #4990B9; font-size: 12px; text-align: center;}
	#WinFloat textarea{border: 1px solid #A9BBED; border-bottom: 2px solid #4990B9; font-size: 12px;}
	#WinFloat #closed{position: absolute; border-radius: 50%; background-color: #000; color: #fff; right: -8px; top: -8px; line-height: 22px; width: 26px; font-size: 15px; text-align: center; border: 2px solid #fff; cursor: pointer;}

.spaceh-lg{width: 100%; height: 120px; clear: left;}
.spaceh-mld{width: 100%; height: 100px; clear: left;}
.spaceh-msd{width: 100%; height: 80px; clear: left;}
.spaceh-md{width: 100%; height: 60px; clear: left;}
.spaceh-ms{width: 100%; height: 30px; clear: left;}
.spaceh-nh{width: 100%; height: 20px; clear: left;}
.spaceh-ns{width: 100%; height: 10px; clear: left;}
.spaceh-mx{width: 100%; height: 5px; clear: left;}
.ocult{display: none;}
.visible{display: block;}
.asterisk{color: #C32B2B;}
.circle{border-radius: 100%; width: 100%; line-height: 70px; text-align: center; font-weight: bold;}
	.circle:hover{background-color: #51D67A; cursor: pointer;}
.cuadre{border-radius: 20px; line-height: 60px; text-align: center; font-weight: bold;}
	.cuadre:hover{background-color: #51D67A; cursor: pointer;}
.circle.ok{background-color: #51D67A; cursor: pointer;}
.cuadre.ok{background-color: #51D67A; cursor: pointer;}


.lineblue{width: 100%; height: 5px; margin: 20px 0; background-color: #1775ba;}
.linered{width: 100%; height: 5px; margin: 20px 0; background-color: #e16752;}

.navlat2{padding: 5px 30px;}
	.navlat2 #headtitle{font-size: 2em; color: #fff;}

.container{overflow: hidden;}
	.container section#login{position: absolute; width: 500px; height: 600px; margin: 0 auto; top: 50%; left: 50%; margin-left: -250px; margin-top: -300px;}
		.container section#login #bodys-log{background-color: rgba(255,255,255,0.75); border-radius: 20px; padding: 20px; box-shadow: 3px 3px 10px #1B0525;}
			.container section#login #bodys-log img#loguer{width: 100%; height: 300px;}
			.container section#login #bodys-log img#logohz{width: 180px; height: 100px;}
			.container section#login #bodys-log .menu{text-align: center;}
				.container section#login #bodys-log .menu .title{font-size: 1em; font-weight: bold; color: #930016;}

	.container #lat-platform{min-height: 500px;}
		.container #lat-platform #lateral{position: relative; min-height: 550px;}
			.container #lat-platform #lateral .menu{position: relative; top: 70px; text-align: center; background-color: rgba(255,255,255,0.75); padding: 70px 15px 15px 15px; border-radius: 20px;}
				.container #lat-platform #lateral .menu img#loguerconfig{position: absolute; top: -70px; width: 150px; height:150px; margin-left: -75px; border-radius: 50%; border-bottom: 5px solid #1B0525;}
				.container #lat-platform #lateral .menu .title{font-size: 1.2em; font-weight: bold;}
				.container #lat-platform #lateral .menu .titlename{font-size: 16px; font-weight: bold; color: #2E2E2E;}
				.container #lat-platform #lateral .menu .subtitle{font-size: 16px; color: #37313A;}
				.container #lat-platform #lateral .menu ul{text-decoration: none; padding: 0px;}
					.container #lat-platform #lateral .menu ul li{list-style-type: none; text-align: left; line-height: 30px; border-bottom: 1px solid #1B0525; padding: 10px; color: #37313A;}
					/*.container #lat-platform #lateral .menu ul li:hover{background-color: #1B0525; cursor: pointer; color: #fff;}*/
					.container #lat-platform #lateral .menu ul a li{list-style-type: none; text-align: left; line-height: 30px; border-bottom: 1px solid #1B0525; padding: 10px; color: #37313A;}
					.container #lat-platform #lateral .menu ul a li:hover{background-color: #1B0525; cursor: pointer; color: #fff; transition: 0.5s;}
				.container #lat-platform #lateral .menu .m-disable{color: #7F7F7F;}
			.container #lat-platform .menufoot{text-align: center; background-color: rgba(255,255,255,0.8); padding: 15px; border-radius: 20px;}
				.container #lat-platform .menufoot .title{background-color: #007bff; color: #fff; padding: 5px; border-radius: 15px;}

		.container #lat-platform .bodyg{}
			.container #lat-platform .bodyg #bodyhead{background-color: rgba(255,255,255,0.75); border-radius: 20px; min-height: 400px; padding: 25px;}
				.container #lat-platform .bodyg #bodyhead .cuadre-config{background-color: #fff; padding: 20px; border-radius: 20px;}
					.container #lat-platform .bodyg #bodyhead .cuadre-config .iconconfig{width: 130px;}
					.container #lat-platform .bodyg #bodyhead .cuadre-config .title{font-size: 1em; font-weight: bold; color: #666666;}
					.container #lat-platform .bodyg #bodyhead .cuadre-config .subtitle{font-size: 0.8em; color: #969696;}
				.container #lat-platform .bodyg #bodyhead .groupmoni{background-color: #B3ECEE; font-size: 0.9em; font-weight: bold; border: 1px solid #717171; border-bottom: 4px solid #717171; border-radius: 20px; padding: 10px;}
					.container #lat-platform .bodyg #bodyhead .groupmoni img{margin-bottom: 10px;}
				.container #lat-platform .bodyg #bodyhead a .groupmoni{color: #000; background-color: #B3ECEE;}
				.container #lat-platform .bodyg #bodyhead .groupmoni:hover{background-color: #fdca40; cursor: pointer;}
					.container #lat-platform .bodyg #bodyhead .groupmoni .p-2{margin: 0 10px 0 10px;}
			.container #lat-platform .bodyg #evalhead{background-color: rgba(255,255,255,0.75); border-radius: 20px; min-height: 600px; padding: 25px;}
				.container #lat-platform .bodyg #evalhead .title-form{font-size: 1.3em; font-weight: bold;}
				.container #lat-platform .bodyg #evalhead .group{background-color: #fff; box-shadow: 0px 2px 2px #000; padding: 5px;}
					.container #lat-platform .bodyg #evalhead .group .title-eval{background-color: #5B286A; color: #fff; font-size: 0.8em;}
					.container #lat-platform .bodyg #evalhead .group .body-eval{background-color: #fff;}

				.container #lat-platform .bodyg #evalhead .cabec-eval{width: 100%; background-color: #000; color: #fff; text-align: center; font-weight: bold; padding: 10px; border-radius: 20px;}
				.container #lat-platform .bodyg #evalhead .body-eval{}
					.container #lat-platform .bodyg #evalhead .body-eval ul{text-decoration: none; padding: 0px;}
					.container #lat-platform .bodyg #evalhead .body-eval ul a li{list-style-type: none; text-align: left; border-bottom: 1px solid #7B4697; padding: 10px; color: #37313A; margin-bottom: 3px;}
					.container #lat-platform .bodyg #evalhead .body-eval ul a li.active{background-color: #fff;}
					.container #lat-platform .bodyg #evalhead .body-eval ul a li:hover{background-color: #fff;}

			.container #lat-platform .bodyg #bodyconfig{background-color: rgba(255,255,255,0.75); border-radius: 20px; min-height: 600px; padding: 25px;}
				.container #lat-platform .bodyg #bodyconfig .group{background-color: #1b0525; color: #fff; padding: 20px; text-align: center; border-radius: 30px; font-size: 1.2em;}
					.container #lat-platform .bodyg #bodyconfig .group i{font-size: 60px;}
				.container #lat-platform .bodyg #bodyconfig a .group:hover{background-color: #641892; transition: 0.5s;}

			.container #lat-platform .bodyg #bodyregister{background-color: rgba(255,255,255,0.75); border-radius: 20px; min-height: 600px; padding: 25px;}
				.container #lat-platform .bodyg #bodyregister .menuregister{}
					.container #lat-platform .bodyg #bodyregister .menuregister .title{font-size: 1.2em; font-weight: bold;}
					.container #lat-platform .bodyg #bodyregister .menuregister i{font-size: 70px;}

footer{background-color: #27374D;}
	footer .footlat2{color: #fff; text-align: center; font-size: 9pt; padding: 10px;}
		footer .footlat2 a{color: #34D034;}
.footlatlogin{margin-top: 30px; color: #000; text-align: center; font-size: 9pt; padding-bottom: 10px;}

#documento{margin:0 auto; width:700px;}
	#documento .spaceh{width: 100%; height: 10px;}
	#documento .portada{position:relative; width:100%; text-align: center;}
	#documento .descrip{position:relative; width:100%;}
		#documento .descrip .titulo{position:relative; text-align:center; padding-top:10px;}
			#documento .descrip .titulo .font_titu{font-size: 11pt; font-weight: bold;}
			#documento .descrip .titulo .font_subtitu{font-size:10pt;}
		#documento .descrip .datep{width: 100%; text-align: right; font-size: 9pt; padding: 5px 0;}
		#documento .descrip .datec{width: 90%; font-size: 10pt; background-color: #DFDFDF; padding: 5%; border-radius: 10px; margin-bottom: 20px;}
			#documento .descrip .datec .title{font-size:14pt; font-weight: bold; text-align: center;}
			#documento .descrip .datec .titu_con{font-size:12pt; font-weight: bold;}
			#documento .descrip .datec #table-inst{font-size: 9pt;}
				#documento .descrip .datec #table-inst .titletd{font-weight: bold;}
			#documento .descrip .datec #table-mod{font-size: 8pt;}
				#documento .descrip .datec #table-mod .headtitle{background-color: #BEBEBE; color: #000; height: 30px; font-size: 10pt; font-weight: bold; border-top: 1px solid #000;}
					#documento .descrip .datec #table-mod .headtitle td{text-align: center; border-top: 1px solid #000; font-weight: bold;}
				#documento .descrip .datec #table-mod tr{height: 25px;}
					 #documento .descrip .datec #table-mod tr td{border-bottom: 1px solid #000;}
		#documento .descrip .titleif{font-size: 12px; background-color: #E5DEFF;}
		#documento .descrip .titleif-valid{font-size: 12px; background-color: #51E05F;}
		#documento .descrip .titledat{font-size: 12px;}
		#documento .descrip #entidad{font-size: 12px;}
			#documento .descrip #entidad #title{width: 100%; font-size: 11pt; font-weight: bold; text-align: center;}
			#documento .descrip #entidad .subtitle{font-size: 14px; color: #6e5773; text-align: left; margin-bottom: 10px; background-color: #39375b; color: #fff; padding: 5px 20px;}
			#documento .descrip #entidad .subtitlevac{font-size: 14px; color: #6e5773; text-align: left; margin-bottom: 10px; color: #000; padding: 5px 20px;}
			#documento .descrip #entidad .titu_con{font-size:12pt; font-weight: bold;}
			#documento .descrip #entidad #grade{font-size: 14px; font-weight: bold; text-align: right; margin-bottom: 7px;}
			#documento .descrip #entidad .preg{font-size: 11px; font-weight: bold;}
			#documento .descrip #entidad .resp{font-size: 11px; font-weight: normal;}
			#documento .descrip .aviso{font-size: 8pt; text-align: left;}
			#documento .descrip .rubrica{text-align: center; font-size: 8pt;}
			#documento .descrip .rubrica1{text-align: left; font-size: 8pt; margin-top: 5px;}

/********************************************************************************************************************************************************************************************/
@media(max-width: 576px){
	.ocult{display: block;}
	.visible{display: none;}
	.circle{line-height: 70px;}
	.container #lat-platform .bodyg #evalhead .title-form{font-size: 1em;}
	.navlat2 #headtitle{font-size: 2.5em;}
		.navlat2 b{font-size: 13px;color: #F5E87E;}
}

@media(min-width: 1500px){
	
}