@font-face {
  font-family: 'Myriad Web Pro';
  src: url('../../fonts/frontend/MyriadPro-Regular.otf');
  src: url('../../fonts/frontend/MyriadWebPro.ttf');
}
.header .texto-banner {
  position: absolute;
  top: 45%;
  left: 20%;
  color: #ffffff;
  font-size: 30px;
  font-weight: bold;
}
.header .contacto-banner {
  padding: 5px;
  background-color: #3FA6F2;
  color: #fff;
  position: absolute;
  font-size: 25px;
  right: 3%;
  top: 68%;
  width: 50px;
  height: 35px;
  text-align: center;
  vertical-align: middle;
  border-radius: 8px 8px 8px 8px;
}
.header .contacto-banner i:hover {
  color: #FF901E;
}
.header .contacto-banner a {
  color: #fff;
}
.header .idioma-banner {
  margin-right: 10px;
  padding: 5px;
  background-color: #3FA6F2;
  color: #fff;
  position: absolute;
  font-size: 12px;
  right: 8%;
  top: 68%;
  width: 100px;
  height: 35px;
  text-align: center;
  border-radius: 8px 8px 8px 8px;
}
.header .idioma-banner a:hover {
  color: #FF901E;
}
.header .idioma-banner a {
  vertical-align: middle;
  color: #fff;
}
.header img {
  width: 100%;
  height: 200px;
}
/*
.menu-superior{

	ul.topnav {
	    list-style-type: none;
	    margin-top: -15px;
	    padding-left: 0px;
	    padding-right: 0px;
	    width: 100%;

	    background-color: #3FA6F2;
	    height: 43px;
	}

	ul.topnav li {
	    float: left;
		padding-top: 19px;
		padding-left: 16px;
		padding-right: 16px;
		padding-bottom: 19px;
		margin-top: -6px;
		border-radius: 12px 12px 0px 0px;
		background-color: #3FA6F2;
	    box-shadow: -3px -3px 5px #555753;
	    text-align: center;
	}

	ul.topnav li a {
	    color: #fff;
	    text-decoration: none;
	    font-weight: bold;
	}

	ul.topnav li:hover a{
	    color: #FF901E;
	    text-decoration: none;
	}


	ul.topnav .mli{
		padding-top: 14px; 
		padding-bottom: 15px;		
	}

}*/
body {
  font-family: "Myriad Web Pro";
  background-color: #808080;
}
body .cuerpo {
  background-color: #ffffff;
  padding-left: 0px;
  padding-right: 0px;
}
.capa-img-principal {
  padding-top: 5%;
  padding-left: 6%;
  padding-right: 0px;
  padding-bottom: 5%;
}
.titulo-cuerpo {
  padding: 5% 5% 5% 15%;
  background-color: #3FA6F2;
  text-align: left;
}
.titulo-cuerpo .fecha {
  padding: 3px;
  font-size: 12px;
  position: absolute;
  top: 0px;
  right: 5%;
  background-color: #FF901E;
  color: #ffffff;
  border-radius: 0px 0px 12px 12px;
}
.titulo-cuerpo h1 {
  font-size: 22px;
  color: #ffffff;
}
.titulo-cuerpo2 {
  margin-top: 10px;
  padding-left: 0px;
  background-color: #3FA6F2;
  text-align: left;
}
.titulo-cuerpo2 .fecha {
  padding: 3px;
  font-size: 12px;
  position: absolute;
  top: 0px;
  right: 5%;
  background-color: #FF901E;
  color: #ffffff;
  border-radius: 0px 0px 12px 12px;
}
.titulo-cuerpo2 h1 {
  padding-left: 20%;
  font-size: 22px;
  color: #ffffff;
  padding-top: 5%;
}
.titulo-cuerpo2 .capa-img-principal2 {
  padding-left: 0px !important;
}
.capa-cuerpo {
  padding-top: 5%;
  padding-left: 15%;
  padding-right: 0px;
  padding-bottom: 5%;
}
.capa-cuerpo .descargar {
  text-align: right;
  width: 80%;
  padding: 5px;
  font-size: 20px;
  position: absolute;
  top: 0px;
  right: 5%;
  background-color: #FF901E;
  color: #ffffff;
  border-radius: 0px 0px 12px 12px;
}
.capa-cuerpo .descargar a {
  margin-left: 10px;
  text-decoration: none;
  color: #ffffff;
}
.capa-cuerpo .descargar a span {
  font-size: 10px;
}
.capa-cuerpo .descargar a:hover {
  text-decoration: none;
  color: #ffffff;
}
.capa-cuerpo .descargar ul {
  list-style-type: none;
  padding: 0;
  width: 300px;
  background-color: #484A42;
  color: white;
  display: none;
  position: absolute;
  z-index: 1000;
  border-top: 10px solid #F3F3F3;
  right: 0px;
  border-radius: 0px 0px 12px 12px;
  top: 28px;
}
.capa-cuerpo .descargar li a {
  margin-left: 0px !important;
  display: block;
  color: #fff;
  padding: 10px 10px 10px 10px;
  text-decoration: none;
  text-align: left;
  border-bottom: 1px solid #ffffff;
}
.capa-cuerpo .descargar li a:hover {
  background-color: #95BD0F;
  color: white;
}
.capa-cuerpo .texto {
  padding-top: 20px;
}
.capa-logos {
  padding-left: 15%;
}
.capa-logos h2 {
  color: #3FA6F2;
  font-size: 21px;
}
.capa-logos .logos {
  margin-top: 5px;
  margin-left: -11%;
}
.capa-logos img {
  margin-top: 8px;
  margin-right: 8px;
  float: left;
  height: 100%;
}
.barra-lateral {
  padding-top: 10%;
  padding-right: 6%;
  padding-left: 0px;
}
.barra-lateral .logo-youtube {
  margin-bottom: 5px;
}
.contenedor-pie {
  margin-top: 30px;
  margin-left: 0px;
  margin-right: 0px;
  background-color: #3FA6F2;
}
.contenedor-pie .pie {
  color: #fff;
  text-align: center;
  font-size: 10px;
}
.contenedor-pie .pie p {
  margin-top: 10px;
  margin-bottom: 10px;
}
ul.topnav li.icon {
  display: none;
}
@media only screen and (max-width: 768px) {
  .capa-img-principal,
  .capa-img-principal2 {
    padding: 0px 0px 0px 0px;
  }
  .titulo-cuerpo,
  .titulo-cuerpo2 {
    padding: 2% 2% 2% 2%;
  }
  .capa-cuerpo .descargar {
    width: 100%;
    right: 0px;
    text-align: center;
  }
  .capa-cuerpo {
    padding: 6% 3% 3% 3% !important;
  }
  .barra-lateral,
  .header {
    display: none;
  }
}
/* Remove margins and padding from the list, and add a black background color */
ul.topnav {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}
/* Float the list items side by side */
ul.topnav li {
  float: left;
  box-shadow: -3px -3px 5px #555753;
  border-radius: 12px 12px 0px 0px;
}
/* Style the links inside the list items */
ul.topnav li a {
  display: inline-block;
  color: #f2f2f2;
  text-align: center;
  padding: 14px 16px 16px 16px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 17px;
}
ul.topnav li.mli-icono a {
  display: inline-block;
  color: #f2f2f2;
  text-align: center;
  padding: 10px 20px 12px 20px;
  text-decoration: none;
  transition: 0.3s;
  font-size: 17px;
}
/* Hide the list item that contains the link that should open and close the topnav on small screens */
ul.topnav li.icon {
  display: none;
}
/*
@media screen and (max-width: 768px) {

	.menu-superior ul{
		margin-top: 0px !important;
		height: 50px !important;
	}

	.mli, .icon{
		margin-top: 0px !important;
		border-radius: 0px 0px 0px 0px !important;
		box-shadow: 0px 0px 0px !important;
	}

	.icon{
		padding-bottom: 0px !important;		
	}

  	ul.topnav li:not(:first-child) {display: none !important;}

  	ul.topnav li.icon {
    	float: right !important;
    	display: inline-block !important;
  	}
}

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


  	ul.topnav.responsive {
  		position: relative !important;
  		list-style-type: none;
	    margin-top: 0px;
	    padding-left: 0px;
	    padding-right: 0px;
	    width: 100%;
	    background-color: #3FA6F2;
	    height: 100px;
  	}

  	ul.topnav.responsive li.icon {
    	position: absolute !important;
    	right: 0 !important;
    	top: 0 !important;
  	}

  	ul.topnav.responsive li {
    	float: none !important;
    	display: inline !important;
		padding: 14px 16px !important;
		margin-top: 0px !important;
		border-radius: 0px 0px 0px 0px !important;
		background-color: #3FA6F2 !important;
	    box-shadow: 0px 0px 0px #555753 !important;
	    text-align: center !important;
  	}

  	ul.topnav.responsive li a {
    	display: block !important;
    	text-align: left !important;
	    color: #f2f2f2 !important;
	    padding: 14px 16px !important;
	    text-decoration: none !important;
	    transition: 0.3s !important;
	    font-size: 17px !important;
  	}
}*/
/* When the screen is less than 680 pixels wide, hide all list items, except for the first one ("Home"). Show the list item that contains the link to open and close the topnav (li.icon) */
@media screen and (max-width: 768px) {
  .titulo-cuerpo2 {
    padding: 26px 2% 2% 2% !important;
  }
  ul.topnav li:not(:first-child) {
    display: none;
  }
  ul.topnav li.icon {
    float: right;
    display: inline-block;
  }
  ul.topnav li {
    box-shadow: 0px 0px 0px #555753;
    border-radius: 0px 0px 0px 0px;
  }
}
/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens */
@media screen and (max-width: 768px) {
  ul.topnav.responsive {
    position: relative;
  }
  ul.topnav.responsive li.icon {
    position: absolute;
    right: 0;
    top: 0;
  }
  ul.topnav.responsive li {
    float: none;
    display: inline;
  }
  ul.topnav.responsive li a {
    display: block;
    text-align: left;
  }
}