* {
	margin:0;
	padding:0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	font-size:11px;	
  font-family: 'Lato', sans-serif;
}
html, body {  
  cursor:default;
  margin:0px;
  background:#FFF; 
  color:#FF0000;
  height: 100%;
  width: 100%;
}
body.cursorProgress {
  cursor:wait; 
  opacity:0.4;
  background:#A4A4A4;
}
label {
  display: inline-block;
  color:#0000FF; /*rgb(3, 178, 79); */
  margin-top: 0px;
  padding-left: 0px;
  margin-bottom: 0px;
  font-size:1.0em;
}
table {
  color:#0000FF;
  font-size: 12px;
}
th {
  background: #A4A4A4;
  color:#FFF;
  font-size: 14px;
  padding: 5px 0px;
}
input {
  padding:5px;
  border: #3c6cd3 solid 1px;
  border-radius: 5px;
  text-transform: uppercase;
  font-size:1.0em;
}
input[type=email] {
  text-transform: none;
}

input:required {
  border-bottom:  #2bd310  solid 2px;
}
select {
  padding:5px;
  border: #3c6cd3 solid 1px;
  border-radius: 5px;
}
select:required {
  border-bottom:  #2bd310  solid 2px;
}
::placeholder {
  color:#A4A4A4;
  font-size: 0.8em;
  text-transform: none;
}
/*************************************************************************/
.cabeza{
  background:#4b8ad3; /*rgb(4, 211, 101); /* */
  margin:0px; 
  padding:5px;
  min-height:12%; 
  max-height:12%; 
  overflow-x: auto;
  display:flex;
  font-family: 'Lato', sans-serif;
  overflow-x: auto;
}
.menu {
  width:100%; 
  overflow-x: auto;
  padding:0px;
  background:#FFF;
  margin:0px;
  color:#4b8ad3;
  max-height: 78%;
  min-height: 78%;
  
}
.trabajo {
  width: 100%;
  overflow-x: auto;
  padding:0px;
  background: #FFF; 
  margin:0px;
  color:#F00;
  font-size:16px;
  font-weight: normal;	
  /*min-height: 500px;
  max-height: 81%;*/
}
.trabajosinmenu {
  width: 100%;
  padding:0px;
  background: #FFF; 
  color:#F00;
  font-size:16px;
  font-weight: normal;	
  height: auto;
}
.pie {
  margin:0px; 
  display:flex;
  min-height: 6%;
  max-height: 6%;
  padding:3px;
  overflow-x: auto;
  font-size: 0.8em;
  background:#4b8ad3;
}  
/**************************************************************************/
.cabezalogo {
  padding:5px;
  margin:0px;
  text-align: center;  
 }
.cabezatitulo {
  width:50%;
  font-family: 'Montserrat', sans-serif;
  font-size: 3.0em;
  font-weight: bold;
  font-style: italic;
  text-shadow: #a4a4a4 3px 3px 3px;
  padding:5px 5px;
  color:#FFF; 
}
.cabezainforma {
  width:10%;
  font-family: 'Lato', sans-serif;
  color:#a4a4a4; 
  font-size: 14px;
  padding: 5px;
  text-align: center;
}
.cabezainforma > a {
  width: 100%;
  color:#2bd310;
  text-decoration: none;
}
.cabezaecologo {
  text-align: center;
  padding:0px;
  padding-top:7px;
  margin:0px;
}
.cabezanombre {
  width:20%;
  font-family: 'Lato', sans-serif;
  padding-top: 3px;
  padding-right: 10px;
}
.cabezanombre > label {
  font-family: 'Lato', sans-serif;
  display: inline-block;
  font-size: 0.8em;
  text-align: right;
  width: 100%;
  color: #fff176;
  padding:3px;
  margin:0px;
}
/******************************************************************************/
.clave {
  display:flex;
  justify-content:space-between; 
  overflow-x:auto; 
  padding:0px; 
  margin:0px auto; 
  background: conic-gradient(from 45deg, rgba(40,80,205,0.2), blue 50%, white  85%, rgba(20,50,255,0.5));
  /*background: conic-gradient(from 45deg, rgba(40,80,205,0.2), rgb(9, 222, 123) 50%, white  85%, rgba(5, 108, 60, 0.5));*/
}
.clave1 {
  width:80%;
  margin:0px auto;
  padding:10px 5px; 
  max-height:90%;
}
.clave2 {
  width:20%;
  border:#A4A4A4 solid 2px; 
  margin:10px 5px; 
  padding:50px; 
  text-align:center;
  background:#FFF;
}


.botonmenutitulo {
  width:10%;
  padding: 10px;
  margin: 0px;
  background:#4b8ad3;
  color:#f4d03f;
  border:none;
  text-align: center;
  cursor: none;
}  
.botonmenu {
  width:8%;
  padding: 10px 5px;
  margin: 5px 0px;
  background:#FFF; 
  color:  #424949; 
  border:none;
  border-bottom:#e6e6e6  solid 1px;
  text-align: center;
  font-weight: bold;
  cursor:pointer;
}
.botonmenu:disabled {
  color: #e6e6e6; 
  border:none;
  text-align: center;
  font-weight: bold;
}
.botonmenu:hover{
  border-bottom: #4b8ad3 solid 1px;
  color:#00f;
  text-shadow: #e6e6e6 1px 1px;
}  
.botonmenu:disabled:hover{
  color:#e6e6e6;
}
.botonmenu2 {
  width:10%;
  padding: 5px 2px;
  margin: 5px 5px;
  background:#FFF; 
  color:  #424949; 
  border:none;
  font-size: 14px;;
  border-bottom:#e6e6e6  solid 1px;
  text-align: center;
  font-weight: bold;
  cursor:pointer;
}
.botonmenu2:disabled {
  color: #e6e6e6; 
  border:none;
  text-align: center;
  font-weight: bold;
}
.botonmenu2:hover{
  border-bottom: #4b8ad3 solid 1px;  /*#f00 solid 1px;*/
  color: #00F; /*:#ec7063;*/
  text-shadow:#e6e6e6 1px 1px; /* #000 1px 1px;*/
  /*background: #E6E6E6;*/
}  
.botonmenu2:disabled:hover{
  color:#e6e6e6;
}
.botonmenu3 {
  width:8%;
  padding: 0px;
  margin: 0px;
  background:#e6e6e6; 
  height: 18px;
  color:  #424949; 
  border:none;
  border-bottom:#e6e6e6  solid 1px;
  text-align: center;
  font-weight: bold;
  cursor:pointer;
}
.botonmenu3:disabled {
  color: #FFF; 
  border:none;
  text-align: center;
  font-weight: bold;
}
.botonmenu3:disabled:hover{
  color:#E6E6E6;
  border-bottom: #FFF;
}
.botonmenu3:hover{
  border-bottom: #4b8ad3 solid 1px;
  color:#00f;
  text-shadow: #e6e6e6 1px 1px;
}
/* ------------------------------------------------- */
.submenu {
  margin:10px; 
  display:none; 
  width:12%; 
  border:#a4a4a4 solid 2px; 
  padding:5px 10px;
  box-shadow:#e6e6e6 5px 5px;
  text-align: left;
}
.botonsubmenu {
  width:100%;
  padding: 5px 3px;
  margin: 3px 0px;
  background:#FFF; 
  color:  #424949;
  border:none;
  text-align: left;
  font-size:0.9em;
  font-weight: bold;
  cursor:pointer;
}
.botonsubmenu:disabled{
  
  color:#E6E6E6;
  transition: all 0.3s;
}

.botonsubmenu:hover{
  background:#4b8ad3;
  color:#FFF;
  transition: all 0.3s;
}
/*******************************************************************************************/
.titulopantalla {
  color: #48c9b0; 
  display:inline-block; 
  width:100%;
  font-size:1.8em; 
  text-align:center; 
 /* font-family: 'Roboto', cursive; /*'Roboto';Lalezar */
  margin:0px auto;
  padding:0px; 
  text-shadow:#a4a4a4 1px 1px;
  font-weight: bold;
}
.partedos {
  width:98%; 
  margin:0px auto; 
  height:80%;
  display:flex;
  flex-flow:row wrap;
  justify-content:space-between;
}
.partemeadisin {
  width:48%; 
  height:95%; 
  padding:10px;  
  border:#A4A4A4 solid 1px;
}
.partemediacon {
  width:48%; 
  overflow-x: auto; 
  height:95%; 
  padding:10px; 
  border:#A4A4A4 solid 1px;
}
.subtitulo {
  color: #48c9b0; 
  display:inline-block; 
  width:100%;
  font-size:1.4em; 
  text-align:center; 
  margin:0px auto;
  padding:0px; 
  text-shadow:#a4a4a4 1px 1px;
}
/**************************************************************************************/
.divboton{
  height:10%;  
  display:flex;
  justify-content:space-between;
  width:80%;
  margin:0 auto;
}
.boton {
  padding:8px 20px; 
  border:#0000FF solid 1px; 
  box-shadow:#a4a4a4 2px 2px; 
  border-radius:10px; 
  background:#3c6cd3; 
  color:#FFF;
  font-size: 12px;
}
.boton:hover {
  background:#03a9f4; 
  color: #fff176 ; 
}
.boton:disabled {
  background:#A4A4A4; 
  color: #fff ; 
  border:none;
}
/*******************************************************************************************/
.estadopie {
  width:25%;
  color:#f1f908;
  text-align:left;
  font-size: 1.0em;
} 
.ayudapie {
  width:50%;
  color:#FFF;
  text-align: center;
  font-size: 0.9em;
}
.lblayudapie {
  color:#e6e6e6;  
  width: 100%;
  text-align: center;
  font-size: 1.2em;
}  
.legalespie{
  width:25%;
  color:#f4d03f;
  text-align: right;
  font-size: 1.0em;
}
.legalespie > a {
  text-decoration: none;
  color:#f4d03f;
  font-size: 1.0em;
}

.divmodal{
  background-color: rgba(147,155,171,0.5);
  color:#FFF;
  position:fixed;
  top:0;
  left:0;
  width:100%;
  height:100%;
  transition: all 1s;
  box-shadow:#333 8px 8px 8px;
  padding:0px;
  margin:0px;
  z-index: 1;
}
.modal-contenido{
  background-color:#F2F2F2;
  border:#00F solid 2px;
  width:60%;
  color:#00F;
  padding:10px;
  margin:0px auto;
  position: relative;
  margin-top:100px;
  height: 70%;
  text-align: center;
}
.modal-contenido50{
  background-color:#F2F2F2;
  border:#00F solid 2px;
  width:60%;
  color:#00F;
  padding:10px;
  margin:0px auto;
  position: relative;
  margin-top:200px;
  height: 40%;
  text-align: center;
}
/****************************************************/
.dropdownmenu  {
	width:100%; 
  background:#FFF;
  color:#4b8ad3;
  margin-bottom: 10px;
  /*height: 7vh;*/
}
.dropdownmenu ul, .dropdownmenu li {
	margin: 0;
	padding: 0;
}
.dropdownmenu ul {
	background: #FFF;
	list-style: none;
	width: 100%;
  border:#A4A4A4 solid 1px;
}
.dropdownmenu li {
	float: left;
	position: relative;
	width:9%;
}
.dropdownmenu a {
	background: #FFF;
  color: #424949; 
	display: block;
  border:none;
  text-decoration: none;
  text-align: center;
	font-weight: bold;
  font-size: 1.0em;
  margin: 5px;
	padding: 5px;
	text-align: center;
	-webkit-transition: all .25s ease;
	-moz-transition: all .25s ease;
	-ms-transition: all .25s ease;
	-o-transition: all .25s ease;
	transition: all .25s ease;
  cursor:pointer;
  border-bottom:#e6e6e6  solid 1px;
}
.dropdownmenu li:hover a {
	border-bottom: #4b8ad3 solid 1px;
  color:#00f;
  text-shadow: #e6e6e6 1px 1px;
  background-color: #E6E6E6;
}
#submenu2 {
	left: 0;
	opacity: 0;
	position: absolute;
	top: 35px;
	visibility: hidden;
  width: 100%;
	z-index: 1;
  border:none;
}
li:hover ul#submenu2 {
	opacity: 1;
	top: 30px;	
	visibility: visible;
}
#submenu2 li {
	float: none;
	width: 120%;
  border:none;
}
#submenu2 a:hover {
  color:#00f;
  text-shadow: #e6e6e6 1px 1px;
  background-color: #fff;
  border:#4b8ad3 solid 1px;
}
#submenu2 a {
	text-align: left;
  background: #E6E6E6;
  color: #424949; 
  font-size:0.9em;
  padding:10px;
  margin:0px;
  border:none;
}

/****************************************************/
.afilia{
  font-size:12px;	
  font-family:'Times New Roman', Times, serif;
  background:#FFF; 
  color:#000; 
  width:100%; 
  margin:10px auto; 
  text-align:center;
  display:flex;
  flex-direction:row;
  justify-content:space-around;
  flex-wrap:wrap;
  align-items:flex-start;
}
.afilia1 {
  width:30%;
  margin:5px;
  padding:10PX;
  background: #FFF;
  border:#A4A4A4 solid 2px;
}
.afilia2 {
  width:28%;
  margin:5px;
  padding:10px;
  background: #E6E6E6;
  border:#A4A4A4 solid 2px;
  text-align: center;
  height: 300px;
}
.afilia2B {
  width:20%;
  margin:0px;
  padding:10PX;
  background: #E6E6E6;
  border:#A4A4A4 solid 2px;
  text-align: center;
/*  height: 300px;*/
}

.afilia2a {
  width:22%;
  margin:5px;
  padding:10px;
  background: #FFF;
  border:#A4A4A4 solid 2px;
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  flex-wrap:wrap;
  align-items:flex-start;
}
.afilia3 {
  width:33%;
  margin:2px;
  padding:5px;
  background: #FFF;
  border:#A4A4A4 solid 2px;
}
.afilia4 {
  width:45%;
  margin:2px;
  padding:5px;
  background: #FFF;
  border:#A4A4A4 solid 2px;
}
.afilia5 {
  width:28%;
  margin:2px;
  padding:5px;
  background: #FFF;
  border:#A4A4A4 solid 2px;
}
.afilia6 {
  width:50%;
  margin:2px;
  padding:10px;
  background: #FFF;
  border:#A4A4A4 solid 2px;
  display:flex;
  flex-direction:row;
  justify-content:space-between;
  flex-wrap:wrap;
  align-items:flex-start;
}

.label1 {
  width:45%;
  text-align: left;
  font-size: 1.0em;
}
.label2 {
  width:100%;
  text-align: center;
  font-size: 1.0em;
}
.labelcaja {
  width:36%;
  text-align: left;
  font-size: 0.9em;
}
.inputcaja {
  width:50%;
  font-size: 1.2em;
}

.input1 {
  width:50%;
  font-size: 1.0em;
}
.entrada1 {
  font-size:1.8em; 
  text-shadow:#a4a4a4 1px 1px; 
  text-align:left; 
  font-weight: bold; 
  width:25%; 
  color: #48c9b0;
}
.entra1 {
  font-size:1.2em; 
  text-align:left; 
  width:9%'
}
.dato1 {
  padding:5px 10px;
  font-size:1.2em;
  width: 15%;
}
.cajamenu {
  background: #fff; 
  border:#e6e6e6 solid 2px; 
  width:24%; 
  color:#00f; 
  height:390px; 
  border-radius:15px;
  box-shadow:#a4a4a4 2px 2px;
}
.linea {
  margin: 10px 0px;
  width:98%;
  height: 3px;
  color:#A4A4A4;
  background: #A4A4A4;
  border: #A4A4A4;
}
.linea2 {
  margin: 4px 0px;
  margin-top: 9px;
  width:98%;
  height: 2px;
  color:#A4A4A4;
  background: #A4A4A4;
  border: #A4A4A4;
}

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

  .cabeza{
    margin:0px; 
    height:auto; 
  }
  .cabezalogo {
    width:20%;
    margin: 10px;
  }
  .cabezaecologo {
    display: none;
  } 
  .menu {
    height: auto;
  }
  /*
  .botonmenu {
    width:18%;
    padding: 20px 10px;
  }
  */
  .botonmenu2 {
    width:100%;
    text-align: left;
    margin-left: 10px;
  }
  .trabajo {
    width: 100%;
    height: auto;
  }
  .publicidad {
    display: none;
  }
  .clave{
    /*display: block;*/
    display: none;
  }
  .clave1 {
    width: 100%;
    display:none;
  }
  .clave2 {
    /*width: 100%;*/
    display:none;
  }
  .cajamenu{
    width: 100%;
    display:none;
  }
  .entrada1 {
    width: 100%;
    text-align: center;
  }
  .entra1 {
    width: 40%;
    padding-left:5%;
  }
  .dato1 {
    width: 50%;
  }
  .boton {
    padding:8px 20px; 
    border:#0000FF solid 1px; 
    box-shadow:#a4a4a4 2px 2px; 
    border-radius:10px; 
    background:#3c6cd3; 
    color:#FFF;
    font-size: 12px;
    width: 30%;
    margin: 5px;
  }
  .afilia {
    width:100%;
  }
  .afilia1 {
    width:100%;
  }
  .afilia2 {
    width:100%;
  }
  .afilia3 {
    width:100%;
  }
  .afilia4 {
    width:100%;
  }

  .dropdownmenu  {
    height: auto;
  }
  .dropdownmenu li {
    width:25%;
  }
  
  
}