/*
**************************************************************
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: #ECECEC;
	font-family:Arial, Helvetica, sans-serif;
}

@font-face {
	font-family: 'mfont-1';
	src: url("../fonts/OpenSans-RegularItalic.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: #85D45E;}

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

#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: 7;
}

#msjreg{
	display: none;
	position: fixed;
	background-color: #fff;
	width: 400px;
	left: 50%; top: 50%;
	margin-left: -200px;
	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;
}
#msjreg .titlemsj{color: #3B1F61;}

#alert{font-size: 11pt; color: #A33838; display: none; padding-bottom: 10px;}
	#alert .Coms{color: #A33838;}
	#alert .Resp{color: #A33838;}
	#alert .Valid{color: #38A368;}

.spaceh-lg{width: 100%; height: 130px; 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;}

.container-fluid{position: relative;}
	.container-fluid #loguers{position: absolute; bottom: 10px; right: 15px; color: #D4D5D5; font-weight: bold; font-size: 14px;}

#headpage{background-color: #1b262c; overflow: hidden; padding: 10px 0px; border-bottom: 3px solid #64b2cd; display: flex; justify-content: center; align-items: center;}
	#headpage img{width: 170px; height: 90px;}
	#headpage #titlehead{font-size: 18pt; font-weight: bold; text-align: center; color: #bbe1fa;}
	#headpage #subtitlehead{font-size: 22pt; color: #fff; font-weight: bold; text-shadow: 2px 2px 1px #05C2BF;}

#bodypage{min-height: 700px;}
	#bodypage #namesist{text-align: center; font-size: 18pt; color: #3282b8; font-weight: bold; text-shadow: 1px 1px 1px #05C2BF;}
	#bodypage .mensjtitle{font-size: 15px; font-weight: bold; color: #A02323;}
	#bodypage .mensj{font-size: 10pt; text-align: justify; color: #2D515C;}
	#bodypage #mensjalert{font-size: 10pt; text-align: justify; color: #2E7B35; font-weight: bold;}
	#bodypage ul.val-mensj{font-size: 12px; text-align: justify; color: #2D515C; text-decoration: none; list-style: none; padding: 0;}
		#bodypage .val-mensj li{position: relative; line-height: 30px; border-bottom: 1px solid #B8B8B8; color: #000;}
		#bodypage .val-mensj .icon-times-circle{position: absolute; top: 6px; right: 10px; color: #9A3232; font-size: 18px;}
		#bodypage .val-mensj .icon-check-circle{position: absolute; top: 6px; right: 10px; color: #419A32; font-size: 18px;}
	#bodypage .menubody{background-color: #3282b8; overflow: hidden; padding: 17px; border-radius: 20px; font-size: 14px;}
		#bodypage .menubody .item{position: relative; width: 100%; min-height: 46px; font-size: 13px; border-bottom: 1px solid #bbe1fa; padding: 5px; color: #F2F2F2; display: flex; align-items: center;}
			#bodypage .menubody .item i{font-size: 20px;}
		#bodypage .menubody a .item:hover{background-color: #bbe1fa; color: #000; cursor: pointer; border-bottom: 1px solid #0f4c75;}
		#bodypage .menubody a .item:hover .ps{background-color: #316D95; color: #fff;}
			#bodypage .menubody .item .ps{background-color: red; color: #fff; font-weight: bold; border-radius: 100%; width: 30px; height: 30px; line-height: 30px; text-align: center;}
		#bodypage .menubody a .item:hover .notif{background-color: #3A9531; color: #fff;}
			#bodypage .menubody .item .notif{position: absolute; right: 5px; background-color: #99FA90; color: #000; font-weight: bold; border-radius: 100%; width: 30px; height: 30px; line-height: 30px; text-align: center;}
		#bodypage .menubody .inhabil{color: #B3B3B3;}
			#bodypage .menubody .ps.inhabil{background-color: #B3B3B3;}
	#bodypage .infoindex{min-height: 600px; overflow: hidden; padding: 0 30px; text-align: center;}
		#bodypage .infoindex img{width: 100%; height: 500px;}
	#bodypage .docindex{min-height: 600px; overflow: hidden; text-align: center;}
		#bodypage .docindex .listgroup{overflow: hidden; border: 2px solid #727272; border-radius: 20px; padding: 10px; margin-bottom: 20px; font-size: 0.9em;}
			#bodypage .docindex a .listgroup{color: #000; background-color: #fff;}
			#bodypage .docindex a:hover .listgroup{background-color: #d8f8b7; color: #000;}
				#bodypage .docindex .listgroup .notif{color: #23522A; font-weight: bold; width: 100%; line-height: 20px; text-align: left; border-radius: 20px;}
				#bodypage .docindex .listgroup .fec{font-size: 12px; color: #AB434F;}
				#bodypage .docindex .listgroup i.icon-file-pdf{font-size: 50px; color: #AB434F;}
	#bodypage .infoentr{min-height: 600px; overflow: hidden; padding: 0 30px; text-align: center;}
		#bodypage .infoentr .group-salida{background-color: #1DAF8E; color: #fff; border-radius: 20px; border: 2px solid #274921; padding: 15px; font-size: 14px; min-height: 100px;}
			#bodypage .infoentr .group-salida i{font-size: 30px; font-weight: bold;}
			#bodypage .infoentr a .group-salida:hover{background-color: #DDD44B; color: #000;}
		#bodypage .infoentr .group-recep{border-bottom: 1px solid #274921; padding: 10px; font-size: 12px; font-weight: bold;}
			#bodypage .infoentr .group-recep i{font-size: 30px;}
		#bodypage .infoentr .group-lista{background-color: #1DAF8E; color: #fff; border-radius: 20px; border: 2px solid #274921; padding: 15px; font-size: 14px; min-height: 100px;}
			#bodypage .infoentr .group-lista i{font-size: 30px; font-weight: bold;}
			#bodypage .infoentr a .group-lista:hover{background-color: #DDD44B; color: #000;}
	#bodypage .infobody{min-height: 600px; overflow: hidden; padding: 0 30px; font-size: 13px;}
		#bodypage .infobody .title{color: #325567; font-size: 16px; font-weight: bold; text-align: center; background-color: #3282b8; color: #fff; padding: 10px; border-radius: 0 30px;}
		#bodypage .infobody .titlepro{color: #325567; font-size: 20px; font-weight: bold; text-align: center; padding-bottom: 20px;}
		#bodypage .infobody .titlereg{font-size: 16px; color: #3B3B3B; font-weight: bold;}
		#bodypage .infobody .subtitle{font-weight: bold;}
		#bodypage .infobody .adv{color: #305F83; font-size: 7pt;}
		#bodypage .infobody .asterisk{color: #BF3535;}
		#bodypage .infobody #msjcorrect{font-size: 16px; color: #159F35; font-weight: bold; margin-top: 10px;}
		#bodypage .infobody #textpro{background-color: #D3E6ED; color: #3D3D3D; border: 1px solid #36606F; font-size: 10px; font-weight: bold; display: flex; justify-content: center; align-items: center;}
		#bodypage .infobody #btn-agr{font-size: 12px;}
		#bodypage .infobody #lista{width: 100%; height: 400px; border: 1px solid #ADC4D6; overflow-y: scroll; font-size: 0.8em; font-weight: bold; background-color: #E1EFF9;}
			#bodypage .infobody #lista .item{widows: 100%; padding: 10px; border-bottom: 1px solid #17a2b8;}
			#bodypage .infobody #lista .item:hover{background-color: #fff; color: #000; cursor: pointer;}
		#bodypage .infobody select{border: none; border-bottom: 1px solid #4990B9; padding: 5px; font-size: 9pt; font-weight: bold;}
		#bodypage .infobody input[type="file"]{border: none; border-bottom: 1px solid #4990B9; padding: 5px; font-size: 9pt; font-weight: bold;}
		#bodypage .infobody table td{font-size: 12px;}
			#bodypage .infobody table td i{cursor: pointer; font-size: 15px;}
			#bodypage .infobody table td a i{color: #000;}
		#bodypage .infobody #bodyimg{text-align: center;}
			#bodypage .infobody #bodyimg img{width: 320px; height: 500px;}
		#bodypage .infobody #bodydescrip{text-align: center; font-size: 14pt; color: #263f44; padding: 20px;}
			#bodypage .infobody #bodydescrip i{font-size: 80px;}
			#bodypage .infobody #bodydescrip a{font-size: 14px; color: #144B8E;}
			#bodypage .infobody #bodydescrip a:hover{color: #8E1442;}
		#bodypage .infobody #validations{}
			#bodypage .infobody #validations a .btn-valid{padding: 10px; color: #000;}
			#bodypage .infobody #validations a .btn-valid:hover{background-color: #fff; color: #000; cursor: pointer;}
			#bodypage .infobody #validations .icon-check-circle{font-size: 30px; color: #5AAD31;}
			#bodypage .infobody #validations .icon-times-circle{font-size: 30px; color: #AD3131;}
	
	#bodypage .inforegister{text-align: center; font-size: 14pt; color: #263f44; padding: 20px;}
		#bodypage .inforegister a .group-regist{background-color: #0f4c75; color: #bbe1fa; border-radius: 15px; min-height: 100px; font-size: 16px; font-weight: bold; padding: 10px; border: 2px solid #ffc93c; display: flex; justify-content: center; align-items: center;}
			#bodypage .inforegister a .group-regist:hover{background-color: #07689f; color: #fff;}

	#bodypage .infobody .msj-seg{color: #305F83; font-size: 20pt; text-align: center;}
		#bodypage .infobody .msj-seg i.icon-cloud-download{font-size: 120px; margin-bottom: 10px;}
		#bodypage .infobody .msj-seg #alert{font-size: 11pt; color: #A33838; display: none;}

	#bodypage .present-mat{min-height: 600px; overflow: hidden; padding: 0 30px;}
		#bodypage .present-mat .title{font-size: 20pt; font-weight: bold; color: #2C69A2;}
		#bodypage .present-mat .subtitle{font-size: 18pt; color: #242424;}
		#bodypage .present-mat img{width: 400px; height: 200px;}

#bodypage .infobody #listinst{position: absolute; width: 93%; padding: 1%; margin: 1% 0; display: none; background-color: #fff; border-radius: 10px; border: 1px solid #B7B7B7; max-height: 330px; overflow-y: auto; z-index: 1;}
	#bodypage .infobody #listinst .fonts{font-size: 7pt; color: #7C7C7C;}
	#bodypage .infobody #listinst table td{line-height: 25px; border-bottom: 1px solid #DADADA; padding: 0 1%; font-size: 8pt;}
	#bodypage .infobody #listinst table tr.cabcel{background-color: #5D909D; color: #fff; font-weight: bold;}
	#bodypage .infobody #listinst table tr.scel:hover{background-color: #CADADE; cursor: pointer;}

#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 .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 .entidad{width: 100%;}
			#documento .descrip .entidad #table-respon{font-size: 8pt;}
				#documento .descrip #table-respon .headtitle{background-color: #BEBEBE; color: #000; height: 30px; font-size: 10pt; font-weight: bold; border-top: 1px solid #000;}
					#documento .descrip .entidad #table-respon .headtitle td{text-align: center; border-top: 1px solid #000; font-weight: bold;}
				#documento .descrip #table-respon tr{height: 25px;}
					 #documento .descrip #table-respon tr td{border-bottom: 1px solid #000;}
			#documento .descrip .entidad .title{font-size: 10pt; font-weight: bold; text-align: center;}
		#documento .descrip .aviso{font-size: 8pt;}
		#documento .descrip .rubrica{text-align: center; font-size: 8pt;}

footer{background-color: #F8F8F8; color: #fff; text-align: center; padding: 15px 0; box-shadow: 0px -1px 6px #454545;}
	footer .footlat1{text-align: center; border-right: 1px solid #7E7E7E; line-height: 100px;}
		footer .footlat1 img{width: 320px; height: 100px;}
	footer .footlat2{color: #343434; text-align: center; display: flex; justify-content: center; align-items: center; font-size: 9pt;}
		footer .footlat2 a{color: #377A23;}
		footer .footlat2 img{width: 150px; height: 30px;}

@media(max-width: 576px){
	.ocult{display: block;}
	.visible{display: none;}
	#bodypage .infoindex img{height: 250px;}

	#headpage img{width: 230px; height: 125px;}
	#headpage #titlehead{font-size: 15px;}
	#headpage #subtitlehead{font-size: 18px;}

	#bodypage .present-mat .title{font-size: 15pt;}
	#bodypage .present-mat .subtitle{font-size: 14pt;}
	#bodypage .present-mat img{width: 60%; height: 100px;}

	footer{padding: 40px 0;}
}