/*
**************************************************************
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: #583d72;
	font-family:Arial, Helvetica, sans-serif;
	background-image: url("../../Images/juegosdeportivos.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: #85D45E;}

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

#msjreg{
	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: 3;
	box-shadow: 0px 0px 4px #d45d79;
}
#msjreg .regok{color: #3A973E;}

#alert{font-size: 11pt; color: #A33838; display: none; text-align: center;}

#WinFloat{
	display: none;
	background-color: #fff;
	border-radius: 20px;
	width: 400px; overflow: 100%;
	position: absolute; left: 50%; top: 50%;
	margin-left:-200px;
	padding: 10px;
	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: 1.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 #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;}
	#WinFloat #listies{position: absolute; text-align: left; width: 96%; left: 50%; margin-left: -48%; padding: 1%; margin-top: 5px; display: none; background-color: #fff; border: 1px solid #B7B7B7; max-height: 330px; overflow-y: auto; z-index: 1;}
		#WinFloat #listies .fonts{font-size: 7pt; color: #7C7C7C;}
		#WinFloat #listies table td{line-height: 25px; border-bottom: 1px solid #DADADA; padding: 0 1%; font-size: 8pt;}
		#WinFloat #listies table tr.cabcel{background-color: #5D909D; color: #fff; font-weight: bold;}
		#WinFloat #listies table tr.scel:hover{background-color: #CADADE; 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;}

.container{border-radius: 0 0 20px 20px;}
	.container section#login{width: 660px; height: 100%; margin: 0 auto;}
		.container section#login #head-log{position: relative; padding: 10px; background-color: #921a76; font-size: 20px; color: #fff; border-radius: 20px 20px 0 0; border-bottom: 3px solid #730069;}
			.container section#login #head-log #logoh{position: absolute; width: 130px; height: 120px; left: 50%; margin-left: -60px; top: 50%; margin-top: -140px; z-index: 1;}
			.container section#login #head-log .log1{font-size: 25px; text-shadow: 0px 3px 2px #000; text-align: center; padding-top: 60px;}
			.container section#login #head-log .log2{position: absolute; display: flex; justify-content: right; align-items: center; text-shadow: 0px 2px 2px #000; right: 10px; top: 5px;}
				.container section#login #head-log .log2 a i.icon-times-circle{color: #fff; font-size: 25px;}
		.container section#login #bodys-log{background-color: rgba(255,255,255,0.8); border-radius: 0 0 20px 20px; padding: 20px;}
			.container section#login #bodys-log .menu{text-align: center;}
				.container section#login #bodys-log .menu img.logohz{width: 90px; height: 90px; margin-bottom: 20px;}
				.container section#login #bodys-log .menu .title{font-size: 19px; font-weight: bold; color: #440a67;}
	.container #head{position: relative; background-color: #921a76; padding-top: 60px; padding-bottom: 10px; font-size: 1.5em; color: #fff; border-radius: 20px 20px 0 0; border-bottom: 3px solid #730069;}
		.container #head #logoh{position: absolute; width: 720px; left: 50%; margin-left: -360px; top: 50%; margin-top: -120px; z-index: 1;}
			.container #head #logoh img{width: 100px; height: 100px;}
		.container #head .a1{display: flex; font-size: 1.2em; justify-content: left; align-items: flex-end; text-shadow: 0px 3px 2px #000;}
		.container #head .a2{display: flex; font-size: 1.5em; justify-content: center; align-items: flex-end; text-shadow: 0px 2px 2px #000;}
			.container #head .a2 a i.icon-times-circle{color: #fff; font-size: 35px;}
	.container #bodys{background-color: rgba(255,255,255,0.8); border-radius: 0 0 20px 20px;}
		.container #bodys .menu{text-align: center;}
			.container #bodys .menu img#logohz{width: 170px; height: 90px; margin-bottom: 10px;}
			.container #bodys .menu .title{font-size: 1.3em; font-weight: bold; color: #440a67;}
			.container #bodys .menu .felic{background-color: #93329e; font-size: 25px; color: #fff; font-weight: bold; border-radius: 20px;}
			.container #bodys .menu img.line{width: 100%; margin: 10px 0;}
			.container #bodys .menu img.imgdescrip{width: 100%; height: 250px; border-radius: 20px; border-bottom: 6px solid #794c74; margin-bottom: 20px;}
			.container #bodys .menu .cabec{background-color: #730069; padding: 10px; color: #fff; font-weight: bold; font-size: 1.2em;}
			.container #bodys .menu .sub-menu{border-bottom: 1px solid #93329e;}
				.container #bodys .menu a .sub-menu{color: #000; padding: 10px;}
				.container #bodys .menu a .sub-menu:hover{background-color: #fff;}
			.container #bodys .menu .sub-menu img{width: 50px; height: 50px;}
		.container #bodys #Descrip{padding: 20px;}
			.container #bodys #Descrip img{width: 100%;}
			.container #bodys #Descrip .title{font-size: 1.3em; font-weight: bold; color: #440a67;}
			.container #bodys #Descrip .subtitle{font-size: 1em; font-weight: bold; color: #000;}
			.container #bodys #Descrip img#img-result{width: 100px; height: 100px;}
			.container #bodys #Descrip table th{border: 1px solid #000;}
			.container #bodys #Descrip table td{border: 1px solid #000;}
		.container #bodys #ResultD{padding: 20px;}
			.container #bodys #ResultD i.icon-search{font-size: 70px; color: #85417F;}
			.container #bodys #ResultD i.icon-user-circle{font-size: 70px; color: #85417F;}
			.container #bodys #ResultD #tabla-cert{font-size: 13px;}
			.container #bodys #ResultD #tabla-cert td{border-bottom: 1px solid #730069;}
			.container #bodys #ResultD #tabla-cert td .img-cert{width: 40px; height: 40px; cursor: pointer;}
	.container .footlat2{width: 100%; color: #fff; text-align: center; display: flex; justify-content: center; align-items: center; font-size: 9pt; margin-bottom: 10px;}
	.container .footlat2 img{width: 150px; height: 30px;}

	.container #lat-platform{background-color: rgba(255,255,255,0.8); border-radius: 0 0 20px 20px; padding: 30px 0px;}
		.container #lat-platform .menu{text-align: center;}
			.container #lat-platform .menu img#logohz{width: 170px; height: 90px; margin-bottom: 10px;}
			.container #lat-platform .menu .title{font-size: 1.1em; font-weight: bold; color: #440a67;}
			.container #lat-platform .menu .titlename{font-size: 16px; font-weight: bold; color: #2E2E2E;}
			.container #lat-platform .menu .subtitle{font-size: 16px; color: #37313A;}
			.container #lat-platform .menu ul{text-decoration: none; padding: 0px;}
				.container #lat-platform .menu ul li{list-style-type: none; text-align: left; line-height: 30px; border-bottom: 1px solid #440a67; padding: 10px; color: #37313A;}
				.container #lat-platform .menu ul li:hover{background-color: #915252; cursor: pointer; color: #fff;}
				.container #lat-platform .menu ul a li{list-style-type: none; text-align: left; line-height: 30px; border-bottom: 1px solid #440a67; padding: 10px; color: #37313A;}
				.container #lat-platform .menu ul a li:hover{background-color: #fff; cursor: pointer; color: #000;}
		.container #lat-platform .bodyg{text-align: center; padding: 0 50px;}
			.container #lat-platform .bodyg #logoreg{width: 100px; height: 100px;}
			.container #lat-platform .bodyg .titlename{font-size: 1.3em; font-weight: bold; color: #000;}
			.container #lat-platform .bodyg .group{border-radius: 20px; overflow: hidden; border: 1px solid #440a67; cursor: pointer;}
				.container #lat-platform .bodyg .group .cabec-home{background-color: #440a67; color: #fff; font-size: 16px; font-weight: bold; padding: 12px;}
				.container #lat-platform .bodyg .group .cabec{color: #fff; font-size: 16px; font-weight: bold; padding: 12px;}
				.container #lat-platform .bodyg .group .cabec-new{background-color: #960283; color: #fff; font-size: 16px; font-weight: bold; padding: 12px;}
				.container #lat-platform .bodyg .group .name{background-color: #fff; color: #440a67; font-size: 40px; font-weight: bold; padding: 10px;}
					.container #lat-platform .bodyg .group .name i.icon-plus3{font-size: 40px; color: #960283;}
			.container #lat-platform .bodyg .icon-edit{cursor: pointer;}
			.container #lat-platform .bodyg a .group:hover .name{background-color: #CCB1D3;}
			.container #lat-platform .bodyg .group:hover .name{background-color: #E3C0E1;}

			.container #lat-platform .bodyg .configevent{overflow: hidden;}
				.container #lat-platform .bodyg .configevent #title{font-size: 1.5em; color: #742071; font-weight: bold;}
				.container #lat-platform .bodyg .configevent .acert{font-size: 1.4em; color: #C45757; font-weight: bold; cursor: pointer;}

/********************************************************************************************************************************************************************************************/
@media(max-width: 576px){
	.ocult{display: block;}
	.visible{display: none;}
}

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