@import url("botones.css");

ol#depthpath { margin: 0 10px 20px 0; font-size: 80%;}
ol#depthpath li { display: inline;}
ol#depthpath li a { color:#06C;}
#base a { text-decoration:underline; color:#06C;}
a {color: #06C;}
*::selection { background: #000; color: #FFF;}
*::-moz-selection { background: #000; color: #FFF;}

/* css menu responsive */
#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  line-height: 1;
  display: block;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
#cssmenu:after,
#cssmenu > ul:after, .bloquepublicacion:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  line-height: 0;
  height: 0;
}
#cssmenu #menu-button {
  display: none;
}
#cssmenu {
  width: auto;
  line-height: 1;
  background: #ffffff;
 border-bottom:1px solid #999;
 }
#menu-line {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transition: all 0.25s ease-out;
  -moz-transition: all 0.25s ease-out;
  -ms-transition: all 0.25s ease-out;
  -o-transition: all 0.25s ease-out;
  transition: all 0.25s ease-out;
}
#cssmenu > ul > li {
  float: left;
}
#cssmenu.align-center > ul {
  font-size: 0;
  text-align: center;
}
#cssmenu.align-center > ul > li {
  display: inline-block;
  float: none;
}
#cssmenu.align-center ul ul {
  text-align: left;
}
#cssmenu.align-right > ul > li {
  float: right;
}
#cssmenu.align-right ul ul {
  text-align: right;
}
#cssmenu > ul > li > a {
  padding: 10px 6px 6px;
  font-size: 11px;
  text-decoration: none;
  color: #000000;
  -webkit-transition: color .2s ease;
  -moz-transition: color .2s ease;
  -ms-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease;
  border-right: 1px solid #C00;
  z-index: 9;
}
#cssmenu > ul > li > a > img { margin:-4px 0 0; padding:0; height:20px;}

#cssmenu > ul > li:first-child > a { color:#F00; font-weight:bold; border: none; }

#cssmenu > ul > li:last-child > a { border-right: none; }
#cssmenu > ul > li.last > a { border: none; padding: 4px 5px; }
#cssmenu > ul > li.conraya > a {  border-right: 1px solid #C00;}

#cssmenu > ul > li:hover > a,
#cssmenu > ul > li.active > a {
  color: #009ae1;
}
#cssmenu > ul > li.has-sub > a {
  padding-right: 10px;
}
#cssmenu > ul > li.has-sub > a::after {
  position: absolute;
  top: 12px;
  right: 0px;
  width: 4px;
  height: 4px;
  border-bottom: 1px solid #000000;
  border-right: 1px solid #000000;
  content: "";
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
  -webkit-transition: border-color 0.2s ease;
  -moz-transition: border-color 0.2s ease;
  -ms-transition: border-color 0.2s ease;
  -o-transition: border-color 0.2s ease;
  transition: border-color 0.2s ease;
}
#cssmenu > ul > li.has-sub:hover > a::after {
  border-color: #009ae1;
}
#cssmenu ul ul {
  position: absolute;
  left: -9999px;
}
#cssmenu li:hover > ul {
  left: auto;
}
#cssmenu.align-right li:hover > ul {
  right: 0;
}
#cssmenu ul ul ul {
  margin-left: 100%;
  top: 0;
}
#cssmenu.align-right ul ul ul {
  margin-left: 0;
  margin-right: 100%;
}
#cssmenu ul ul li {
  height: 0;
  -webkit-transition: height .2s ease;
  -moz-transition: height .2s ease;
  -ms-transition: height .2s ease;
  -o-transition: height .2s ease;
  transition: height .2s ease;
  box-shadow:1px 4px 2px #CCC;
}
#cssmenu ul li:hover > ul > li {
  height: 32px; border:none;
}
#cssmenu ul ul li a {
  padding: 12px 20px;
  width: 300px;
  font-size: 11px;
  background: #FFF;
  text-decoration: none;
  color: #333333;
  -webkit-transition: color .2s ease;
  -moz-transition: color .2s ease;
  -ms-transition: color .2s ease;
  -o-transition: color .2s ease;
  transition: color .2s ease; border:none;
}
#cssmenu ul ul li:hover > a,
#cssmenu ul ul li a:hover {
  color: #009ae1;
}
#cssmenu ul ul li.has-sub > a::after {
  position: absolute;
  top: 13px;
  right: 10px;
  width: 4px;
  height: 4px;
  border-bottom: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
  content: "";
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  -o-transform: rotate(-45deg);
  transform: rotate(-45deg);
  -webkit-transition: border-color 0.2s ease;
  -moz-transition: border-color 0.2s ease;
  -ms-transition: border-color 0.2s ease;
  -o-transition: border-color 0.2s ease;
  transition: border-color 0.2s ease;
}
#cssmenu.align-right ul ul li.has-sub > a::after {
  right: auto;
  left: 10px;
  border-bottom: 0;
  border-right: 0;
  border-top: 1px solid #dddddd;
  border-left: 1px solid #dddddd;
}
#cssmenu ul ul li.has-sub:hover > a::after {
  border-color: #ffffff;
}

#cssmenu ul li input {
    width: 70px;
    margin: 4px 0 0 4px;
	box-sizing:border-box;
}
#cssmenu ul li input[type='submit'] {
    width: 24px !important;
    height: 24px;
    margin: 3px 0;
    padding: 1px 4px;
    background-color: #fff;
    text-indent: -200px;
    background-image: url(../imgs/ic_search_black.png);
    background-size: auto 100%;
    background-repeat: no-repeat;
    border: none;
}
#cssmenu ul li input.btnBuscador { margin: 0;
    width: 24px;
    padding: 3px;
    border: none;
	text-indent: 50px;
    color: #FFF;}
	
#cssmenu ul li.sinborde a { border:none;}


a#btnsitiosdc { position: absolute; right: 28px; top: 166px; color: #fff; font-size: 12px; text-shadow: 1px 1px 2px #333; }
a#btntop1 { position: absolute; right: 10px; top: 20px; }

.modalDialog {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background: rgba(0,0,0,0.8);
	z-index: 99999;
	opacity:0;
	-webkit-transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	transition: opacity 400ms ease-in;
	pointer-events: none;
}

.modalDialog:target {
	opacity:1;
	pointer-events: auto;
}
.modalDialog > div:after { clear:both; display:block; content:"";}

.modalDialog > div {
	width: 440px;
	position: relative;
	top:10%;
	margin: 30px auto;
	padding: 0;
	background-color: #000;
	color:#FFF;
}
.modalDialog > div div {padding:1%;}

.modalDialog > div h2 { font-weight:normal; font-size:20px; padding:0 10px; color:#FFF; border-bottom:1px solid #FFF; }
.modalDialog > div p  {font-size:14px;text-align:justify; color:#FFF; width: auto;}
.modalDialog > div p em { font-size:12px; }
.modalDialog > div p input, .modalDialog > div p textarea { width: 98%; box-sizing: border-box;}

.modalDialog > div form p input[type="submit"] { width:60px; margin-right: 1%; float:right;}

.modalDialog div div .close { color: #FFFFFF;
    line-height: 16px;
    position: absolute;
    right: -10px;
    text-align: center;
    top: -10px;
    width: 20px;
    text-decoration: none;
    font-size: 20px;
}
.close:hover { background: #00d9ff; }


.modalDialog > div.deseos { width: 90%;
    max-width: 560px;
	position: relative;
	top:10%;
	margin: 20px auto;
	border-radius:20px;
	border: 1px solid #666;
	box-sizing:border-box;
	padding:20px 40px;
	background: transparent;
    background-color: #FFF !important;
    color: #000;
	box-sizing:border-box;
}

.modalDialog > div.deseos h2, .modalDialog > div.deseos p { color:#069; padding:0;text-align:left !important;}
.modalDialog > div.deseos p { text-align:center; }
.modalDialog > div.deseos p label { display:block; text-align:left !important; font-weight:bold;}
.modalDialog > div.deseos p input, .modalDialog > div.deseos p textarea { width: 98%; box-sizing: border-box; padding:1px;border-radius:4px;}
.modalDialog > div.deseos form p input[type="submit"] {
    width: auto; border:none;
    margin-right: 1%; padding:6px; border-radius:4px;
    float: right; background-color:#06C; color:#fff;
}
.modalDialog div.deseos div .close {
    line-height: 20px; border-radius: 30px;
}

	
ul.navsuperior {
  list-style: none;
  margin: 20px 0;
  padding: 0;
  font-size: 13px;
}

ul.navsuperior li {
  float: left;
  width:20%;
  text-align:center;
}
ul.navsuperior li:first-child a {
  border: none;
}
ul.navsuperior li a {
  display: block;
  font-size:14px;
  text-decoration: none;
 color: #505050;
    border-left: 1px solid #505050;
  padding: 6px;
}
ul.navsuperior li:nth-child(4) a { padding: 12px 6px 0; }
ul.navsuperior li a:hover { background-color:#505050; color:#FFF;}
form.porpalabra {   padding: 10px;   text-align: center; }
form.porpalabra input, form.porpalabra select { padding:6px; border: 1px solid #505050; }
form.porpalabra input[type="submit"] { padding:6px; background-color:#505050; color: #FFF;  border: 1px solid #505050; }

form.porpalabra ::-webkit-input-placeholder {
   color: #505050;
   text-transform:inherit;
}
form.porpalabra :-moz-placeholder { /* Firefox 18- */
   color: #505050;  
     text-transform:inherit;
}
form.porpalabra ::-moz-placeholder {  /* Firefox 19+ */
   color: #505050;  
     text-transform:inherit;
}
form.porpalabra :-ms-input-placeholder {  
   color: #505050;  
     text-transform:inherit;
}

.container.main-content.clearfix section {
    width: auto !important;
    max-width: none;
}

/* CSS Red de Emprendedores*/

.cuadrored {
    width: 98% !important;
    float: left;
    margin: 1% 2% 1% 0;
    padding: 10px;
    box-sizing: border-box;
}
.cuadrored img {
    float: left;
    max-width: 100px;
    margin: 0 10px 10px 0;
}
.cuadrored h2, .cuadrored p { margin:0; }

.vistanio a { display:inline-block; padding:6px; text-decoration:none; font-weight: bold;}


/* Publicaciones */
article.tapapublicacion { float:left; width:25%; padding:10px 30px; box-sizing:border-box;}
article.tapapublicacion:nth-child(6) { clear: both;}
article.tapapublicacion h3 { margin:6px 0; border: none; padding:0;}
article.tapapublicacion img { width:100%;}

#detallepublicacion { float:right; width:440px; border:1px solid #666; margin:0 0 20px 20px; padding:20px 20px 0; box-sizing:border-box; }
#detallepublicacion h2 { margin:0 0 10px 0; line-height: 1;}
#detallepublicacion h2 em { font-size:16px; font-weight:normal;font-style: normal;}
#detallepublicacion img { float:left; margin:0 10px 10px 0; max-width: 130px; border: 1px solid #666;}
#detallepublicacion h3 { line-height: 1.5;}
#detallepublicacion p { line-height: normal; margin: 10px 0; }

.bloquepublicacion { box-shadow:1px 1px 3px #666666; box-sizing:border-box; padding:10px;  }
.bloquepublicacion .imagenLibro { float:left;margin: 0 20px 20px 0;border: 1px solid #333;}
.bloquepublicacion h2 { font-size: 18px; }
.bloquepublicacion h4 { font-size: 16px; font-weight: bold; }
.bloquepublicacion p { line-height: normal; margin: 6px 0;}

.bloquecajas:nth-child(odd) { /* clear: both; */}
.bloquecajas {
    float: left;
/*  width: 49%;
    min-height: 145px;*/
    width: 23%;
    background: -moz-linear-gradient(50% 100% 90deg, #E9E9E9, #FFFFFF 50%);
    margin: 1% 1% 0 1%;
    padding: 10px;
    -moz-box-shadow: 1px 1px 2px #CCCCCC;
    -webkit-box-shadow: 1px 1px 2px #CCCCCC;
    box-shadow: 1px 1px 2px #CCCCCC;
    font-size: 10px;
    font-weight: normal;
    color: #666666;
    box-sizing: border-box;
    min-height: 448px;
}
.bloquecajas img {
/*    float: left;
    height:120px; 
    margin: 5px;*/
    width: auto;
    border: #000000 1px solid;
    box-sizing:border-box;
    padding: 5px;
}
.bloquecajas h2 {
    font-size: 12px;
    font-weight: bold;
    color: #CC0000;
    margin: 5px 0px;
}
.bloquecajas h3 {
    font-size: 14px;
    line-height: normal;
    color: #333333;
    /* height: auto; */
    border: none;
    padding: 0 !important;
}
.bloquecajas p {
    font-size: 11px;
    line-height: normal;
    padding: 0 !important;
    margin: 0;
    display: none;
}
.bloquecajas a {
    font-size: 11px;
    font-weight: normal;
    color: #CC0000;
    text-decoration: none;
    min-height: 15px;
}
.bloquecajas p a { display: block; text-align: center; padding: 5px;
    border-top: #CC0000 solid 1px;
    border-bottom: #CC0000 solid 1px;
    margin: 5px 0;}


/* PROYECTOS PEDAGOGICOS */

.botonesproyectos {
	text-align: center;
	clear: both;
}
.botonesproyectos img { margin:10px; width: 165px;}
 
h1 span { font-size:70%;}

.botonescuatrimestre { list-style:none;}
.botonescuatrimestre li { padding:10px 0; border-bottom:1px solid #CCC; background-color:#FFF; margin:4px 0; clear:both; }
.botonescuatrimestre li:after, ul.tresbotones:after, ul.cuatrobotones:after { clear:both; display:block; content:'';}
.botonescuatrimestre li a { display:block; width:19%; float:left; text-align:center; margin:0 1% 0 0;}
.botonescuatrimestre li a:first-child img { max-width: 120px !important; margin: 0; }
.botonescuatrimestre li img { max-width:100px; margin: 10px 0; }
.botonescuatrimestre li a:hover img { opacity: .6; }




h1 { line-height: 1.3; margin:20px 0; font-size: 28px; color: #5a5c5d; font-weight: normal; padding: 10px 0;}
h2 { font-size: 22px; line-height: 1.3;  margin-bottom: 20px; color: #5a5c5d; font-weight: normal;}
	
.page-title { padding: 0;}
/* / / / */

header.style-3 .navigation ul li a {
    padding: 28px 20px 22px; font-weight:bold; font-size: 92%; font-family: 'RobotoMedium', Arial, sans-serif;
}

/* //  AFTER  //  */
.congresos:after, article.cajasdirectorios:after { clear:both; display:block; content:"";}

.congresos { list-style-type: none; margin:0; padding: 5px; }
.congresos li { float:left; }
#modulo01 ul.congresos, ul.congresos { box-shadow:none;}
#modulo01 ul.congresos li a, .congresos li a { display:block; padding:6px; font-weight:bold; border: none; color: #5a5c5d;font-size: 14px; text-transform: uppercase;}
#modulo01 ul.congresos li a:hover, .congresos li a:hover { background-color:#06C; color:#FFF;}

.congresos1 { list-style-type: none; margin:20px 0 0; padding: 5px 0; }
.congresos1 li { float:left; width:20%; margin:0; padding:0; border-left:1px solid #999; box-sizing: border-box; }
.congresos1 li:first-child { float:none; width:100%; text-align:left; border:none; margin-bottom: 10px;}
.congresos1 li:first-child a { text-align:left; font-weight:bold;}
.congresos1 li:nth-child(2) { border:none;}

.congresos1 li a { font-size: 14px; text-transform:inherit; color: #5a5c5d; border: none; padding:6px; display:block;     text-align: center;}
.congresos1 li a:hover { background-color:#06C; color:#FFF;}

.navegador { text-align:left;}
.navegador a { padding: 2px 6px;
    font-weight: bold;
    background-color: #06C;
    color: #FFF;
    border-radius: 4px;
    margin-left: 5px;
    font-size: 14px;text-decoration: none;}

section { margin:10px auto; box-sizing: border-box; max-width:900px; width:80%;}

section h3 { border-bottom:1px solid #06C; color:#06C; font-size:16px; padding: 10px 100px 0 0; line-height: 1.6; }
section h3 a { float: right; display: inline-block; padding:2px 6px; background-color: #06C; color: #FFF; border-radius: 4px; font-size: 80%; margin: 0 -100px 0 4px;text-decoration: none; text-transform: none;}
section h3 a:hover, section p a.btnvideo:hover { background-color: #FFF; color: #06C; border-radius: 4px;}


section p a.btnvideo { float: right; display: inline-block; padding:0px 4px; background-color: #06C; color: #FFF; border-radius: 4px; margin: 0 4px;text-decoration: none; text-transform: none;}

a.vermas {
    float: right;
    display: block;
    padding: 6px;
    background-color: #06C;
    color: #FFF;
    border-radius: 4px;
    text-decoration: none;
    margin: -8px -100px 0 0;
}
.autoresgris p a { color: #5a5c5d;text-decoration: none;font-size: 14px;}
.autoresgris p a:hover { text-decoration: underline;}

section p, p { line-height:24px; margin:10px 0 20px;}
section form p { margin:20px 0; width:80%; clear: both;}
section form p label { float:left; width:22%; font-weight:bold; line-height: 1.3; margin-right:2%;}
section form p input, section form p select, section form p textarea { padding:6px; width:76%; box-sizing:border-box;}
section form p textarea { border:1px solid #999; width:76%; box-sizing:border-box;}
section form p input[type="submit"] { background-color:#06C; padding:6px 8px; color:#FFF; width:auto; border:none; font-weight:bold;}
section form p input[type="checkbox"], section form p input[type="radio"] { width:auto;}

article.cajasdirectorios { width:31.3%; padding:0; margin:1%; text-align:center; float:left;}
article.cajasdirectorios img { width:100%;}

.btnexpositor { display:inline-block; padding:4px 6px; margin:4px 0 0; border-radius:4px; border:1px solid #06C; color:#06C; }

.recuadro { padding:10px 10px 0 10px; box-shadow:0px 0px 2px #333;}

.doscajas { width: 45%; float: left; margin: 0 10% 2% 0;}
.doscajas:nth-child(odd) { margin: 0 0 2% 0;}
.doscajas h2 { border-bottom:1px solid; #CCC;}
.doscajas p { line-height: 1.2; margin: 10px 0;}

.botonesproduccion:after { clear:both; display:block; content:'';}
.botonesproduccion { list-style-type:none; clear:both;}
.botonesproduccion li { box-sizing: border-box; float: left; width: 22%; margin: 0 3% 3% 0; min-height: 50px; background-color: #8A6495; position:relative;}
.botonesproduccion li a { display:block; padding:6px; color:#FFF; position: absolute; bottom: 0; left: 36px; width:auto;}
.botonesproduccion li a em { font-style:normal; position: absolute; bottom:4px;left: -32px;     font-weight: bold; font-size: 180%;}

.carrerascursada { line-height: 24px; margin: 10px 4% 20px 0; list-style-type:none; width:45%; float:left;}
.carrerascursada li { font-weight:bold; font-size:110%;}
.carrerascursada li strong, .carrerascursada li a{
    background-color: #9A7D6B;
    color: #FFF;
    padding: 10px;
    display: block;
}

.carrerascursada ul {margin: 0 0 40px 10px;}
.carrerascursada ul li { font-weight:normal; font-size: 100%;}
.carrerascursada li ul li strong {
    background-color:transparent;
    color: #5a5c5d;
    padding: 0;
    display:inherit;
}
.carrerascursada li ul li a {
    background-color: transparent;
    color: #06C;
}
.etapaproduccion { border: 1px solid #8A6495; padding: 8px; color: #8A6495; }

.btnregistro { display: inline-block; padding: 4px 10px; margin: 4px 0 0; border: 1px solid #DCDCDC; color: #000; background-color:#DCDCDC; }
	
.btnregistro:hover {background-color:#FFF; }

a.sinborde {
    border: none !important;
}
.autoresgris {
	float: left;
    width: 45%;
    height: 260px;
    padding: 1%;
    text-align: left;
    border: 1px solid #E8E8E8;
    margin: 1%;
    background-color: #FFF;
    -webkit-box-shadow: 2px 2px 4px rgba(0,0,0,0.13), 1px 0 0 rgba(0,0,0,0.1);
    -moz-box-shadow: 2px 2px 4px rgba(0,0,0,0.13), 1px 0 0 rgba(0,0,0,0.1);
    box-shadow: 2px 2px 4px rgba(0,0,0,0.13), 1px 0 0 rgba(0,0,0,0.1);
    position: relative;
}
.autoresgris p {
    line-height: 1.2;
    margin: 10px 0;
}
.autoresgris a.button-primary {
    position: absolute;
    bottom: 3%;
    right: 2%;
}

.button4 {
    background-color: #ff3143;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    display: inline-block;
    cursor: pointer;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: bold;
    padding: 8px;
    text-decoration: none;
    margin-left: 4px;
}

/* 
CSS para Colecciones
*/
ul.colecciones { list-style:none;}
ul.colecciones li { width:25%; padding:20px; box-sizing: border-box; float:left;}
ul.colecciones li img { width:100%; margin:0 0 10px 0;}
ul.colecciones li:nth-child(5) { clear: both;}

article.coleccionescaja {
    width: 33.3%;
    box-sizing: border-box;
    padding: 10px 20px;
    float: left;
	position:relative;
}
article.coleccionescaja:nth-child(3n)  { clear:both;}

article.coleccionescaja img{
    width: 100%;
}
article.coleccionescaja .fecha{ position:absolute; top: 10px; right: 20px; padding: 2px; background-color: #fff; }
article.coleccionescaja h2 { font-size: 20px; line-height: 1.2; margin: 10px 0; }
article.coleccionescaja h3 { font-size: 14px; line-height: 1.2; border-bottom: none; text-transform: inherit;}
article.coleccionescaja a.btnvermas { font-size: 12px; display: block; float: right; padding: 4px;}



/* ESTILOS Portal DC */
.carreras { padding:2%;}
.carreras h4 { color:#35A0DE; font-size:18px; text-transform:uppercase;}
.carreras ul { margin:0; padding:0; list-style-type:none;}
.carreras ul li { float:left;}
.carreras ul li a { display:block; padding:10px; color:#35A0DE; text-decoration:none; border:1px solid #FFF;  -webkit-transition: border 0.5s;}
.carreras ul li a:hover {color:#35A0DE; border:1px solid #35A0DE;/* HOVER ON */}


/* Estilos para formularios Encuestas Encuentro */

.form-style-10{
    width:50%;
    padding:30px;
    margin:40px auto;
    background: #FFF;
    border-radius: 10px;
    -webkit-border-radius:10px;
    -moz-border-radius: 10px;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.13);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.13);
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.13);
}
.form-style-10 .inner-wrap{
    padding: 30px;
    background: #F8F8F8;
    border-radius: 6px;
    margin-bottom: 15px;
}
.form-style-10 h1{
    background: #2A88AD;
    padding: 20px 30px 15px 30px;
    margin: -30px -30px 30px -30px;
    border-radius: 10px 10px 0 0;
    -webkit-border-radius: 10px 10px 0 0;
    -moz-border-radius: 10px 10px 0 0;
    color: #fff;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
    font: normal 30px 'Bitter', serif;
    -moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    border: 1px solid #257C9E;
}
.form-style-10 h1 > span{
    display: block;
    margin-top: 2px;
}
.form-style-10 span{
    display: block; padding:10px 0;
}

.form-style-10 label{
    display: block;
    font: 13px Arial, Helvetica, sans-serif;
    color: #333;
    margin-bottom: 15px;
}
.form-style-10 input[type="text"],
.form-style-10 input[type="date"],
.form-style-10 input[type="datetime"],
.form-style-10 input[type="email"],
.form-style-10 input[type="number"],
.form-style-10 input[type="search"],
.form-style-10 input[type="range"],
.form-style-10 input[type="url"],
.form-style-10 input[type="password"],
.form-style-10 textarea,
.form-style-10 select {
    display: block;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    width: 100%;
    padding: 8px;
    border-radius: 6px;
    -webkit-border-radius:6px;
    -moz-border-radius:6px;
    border: 2px solid #fff;
    box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
    -moz-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
    -webkit-box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.33);
}

.form-style-10 .section{
    font: normal 20px 'Bitter', serif;
    color: #2A88AD;
    margin-bottom: 5px;
	position:relative;
}
.form-style-10 p{ width:auto;}

.form-style-10 .section span {
    background: #2A88AD;
    padding: 5px 10px 5px 10px;
    position: absolute;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border: 4px solid #fff;
    font-size: 14px;
    margin-left: -45px;
    color: #fff;
    margin-top: -3px;
}
.form-style-10 input[type="button"], 
.form-style-10 input[type="submit"]{
    background: #2A88AD;
    padding: 8px 20px 8px 20px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    color: #fff;
    text-shadow: 1px 1px 3px rgba(0, 0, 0, 0.12);
    font: normal 30px 'Bitter', serif;
    -moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.17);
    border: 1px solid #257C9E;
    font-size: 15px;
}
.form-style-10 input[type="button"]:hover, 
.form-style-10 input[type="submit"]:hover{
    background: #2A6881;
    -moz-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
    -webkit-box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
    box-shadow: inset 0px 2px 2px 0px rgba(255, 255, 255, 0.28);
}
.form-style-10 .privacy-policy{
    font-size: 12px;
    color: #4D4D4D;
    padding: 0 20px;
	display:block;
}
.form-style-10 input[type="range"] {
    -webkit-appearance: none;  /* Override default CSS styles */
    appearance: none;
    width: 100%; /* Full-width */
    height: 25px; /* Specified height */
    outline: none; /* Remove outline */
    opacity: 0.4; /* Set transparency (for mouse-over effects on hover) */
    -webkit-transition: .2s; /* 0.2 seconds transition on hover */
    transition: opacity .2s;
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a90329+0,00af14+100 */
background: #a90329; /* Old browsers */
background: -moz-linear-gradient(left, #a90329 0%, #00af14 90%); /* FF3.6-15 */
background: -webkit-linear-gradient(left, #a90329 0%,#00af14 90%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right, #a90329 0%,#00af14 90%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#00af14',GradientType=.9 ); /* IE6-9 */
}
/* Mouse-over effects */
.form-style-10 input[type="range"]:hover {
    opacity: .5; /* Fully shown on mouse-over */
}

/* The slider handle (use -webkit- (Chrome, Opera, Safari, Edge) and -moz- (Firefox) to override default look) */ 
.form-style-10 input[type="range"]::-webkit-slider-thumb {
    opacity: 1; /* Fully shown on mouse-over */
    -webkit-appearance: none; /* Override default look */
    appearance: none;
    width: 25px; /* Set a specific slider handle width */
    height: 25px; /* Slider handle height */
    background: #FFF; /* Green background */
    cursor: pointer; /* Cursor on hover */
	border:1px #000 solid;
	border-radius: 50%;
}

.form-style-10 input[type="range"]::-moz-range-thumb {
    opacity: 1; /* Fully shown on mouse-over */
    width: 25px; /* Set a specific slider handle width */
    height: 25px; /* Slider handle height */
    background: #FFF; /* Green background */
    cursor: pointer; /* Cursor on hover */
	border:1px #000 solid;
	border-radius: 50%;
}
.form-style-10 label td { padding: 6px 0; border-bottom: 1px solid #ccc;}

ul.tresbotones, ul.cuatrobotones { list-style:none; }
ul.tresbotones li { float:left; width:33.33%;}
ul.tresbotones li a, ul.cuatrobotones li a { display:block; padding:10px; text-align:center;}

ul.cuatrobotones li {float:left; width:25%;} 

.divbannertxt {height:238px; overflow:hidden; padding: 80px 60px 0; background-size:100% auto; box-sizing:border-box;}
.cuadrado-2 {
    float: left;
    margin: 18px 15px 0 0;
    width: 12px;
    height: 12px;
}
.banner_tit_principal { color: #FFF;
    font-size: 30px;
    margin: 0px;
    text-transform: uppercase;
	line-height: 1.7;
}
.banner_tit_secundario {
    color: #FFF;
    font-size: 19px;
    padding-left: 34px;
    margin: 0px;
}


@media all and (max-width: 768px), only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 1024px), only screen and (min-device-pixel-ratio: 2) and (max-width: 1024px), only screen and (min-resolution: 192dpi) and (max-width: 1024px), only screen and (min-resolution: 2dppx) and (max-width: 1024px) {
  #cssmenu {
    width: 100%;
  }
  #cssmenu ul {
    width: 100%;
    display: none;
  }
  #cssmenu.align-center > ul,
  #cssmenu.align-right ul ul {
    text-align: left;
  }
  #cssmenu ul li,
  #cssmenu ul ul li,
  #cssmenu ul li:hover > ul > li {
    width: 100%;
    height: auto;
    border-top: 1px solid rgba(120, 120, 120, 0.15);
  }
  #cssmenu ul li a,
  #cssmenu ul ul li a {
    width: 100%;
  }
  #cssmenu > ul > li,
  #cssmenu.align-center > ul > li,
  #cssmenu.align-right > ul > li {
    float: none;
    display: block;
  }
  #cssmenu ul ul li a {
    padding: 20px 20px 20px 30px;
    font-size: 12px;
    color: #000000;
    background: none;
  }
  #cssmenu ul ul li:hover > a,
  #cssmenu ul ul li a:hover {
    color: #000000;
  }
  #cssmenu ul ul ul li a {
    padding-left: 40px;
  }
  #cssmenu ul ul,
  #cssmenu ul ul ul {
    position: relative;
    left: 0;
    right: auto;
    width: 100%;
    margin: 0;
  }
  #cssmenu > ul > li.has-sub > a::after,
  #cssmenu ul ul li.has-sub > a::after {
    display: none;
  }
  #menu-line {
    display: none;
  }
  #cssmenu #menu-button {
    display: block;
    padding: 20px;
    color: #000000;
    cursor: pointer;
    font-size: 12px;
    text-transform: uppercase;
  }
  #cssmenu #menu-button::after {
    content: '';
    position: absolute;
    top: 20px;
    right: 20px;
    display: block;
    width: 15px;
    height: 2px;
    background: #000000;
  }
  #cssmenu #menu-button::before {
    content: '';
    position: absolute;
    top: 25px;
    right: 20px;
    display: block;
    width: 15px;
    height: 3px;
    border-top: 2px solid #000000;
    border-bottom: 2px solid #000000;
  }
  #cssmenu .submenu-button {
    position: absolute;
    z-index: 10;
    right: 0;
    top: 0;
    display: block;
    border-left: 1px solid rgba(120, 120, 120, 0.15);
    height: 52px;
    width: 52px;
    cursor: pointer;
  }
  #cssmenu .submenu-button::after {
    content: '';
    position: absolute;
    top: 21px;
    left: 26px;
    display: block;
    width: 1px;
    height: 11px;
    background: #000000;
    z-index: 99;
  }
  #cssmenu .submenu-button::before {
    content: '';
    position: absolute;
    left: 21px;
    top: 26px;
    display: block;
    width: 11px;
    height: 1px;
    background: #000000;
    z-index: 99;
  }
  #cssmenu .submenu-button.submenu-opened:after {
    display: none;
  }
}

@media (max-width:768px) {
	.doscajas { width: 96%; float: none; margin: 1% auto 2%;}
	.doscajas:nth-child(2) { margin: 1% auto;}
	#container #btnsitiosdc, #content #btnsitiosdc, #container #btntop1, #content #btntop1, a#btnsitiosdc, a#btntop1 { display:none!important;}
	article.cajasdirectorios { width:46%;}
	article.cajasdirectorios:nth-child(odd) { clear: both; }
	
	article.coleccionescaja { width: 50%;}
	section { box-sizing:border-box; padding:10px !important; width:auto !important;}
	.bloquecajas { float: none; width: auto;  clear: both; }
	article.tapapublicacion { float:left; width:33.3%; padding:10px 30px; box-sizing:border-box;}
	article.tapapublicacion:nth-child(6) { clear:none;}
	article.tapapublicacion:nth-child(5), article.tapapublicacion:nth-child(8) { clear: both;}
	.modalDialog > div.misdeseos { margin: 10px auto 0; width: 90%; padding: 20px 20px 0;}
	
	.form-style-10 { width: auto; padding: 10px; margin: 20px auto;}
	.form-style-10 .section { margin: 5px 0 10px 15px;}
	.form-style-10 .section span { margin-left: -40px;}
	.form-style-10 .inner-wrap { padding: 30px 10px;}

}

@media only screen and (max-width: 767px) and (min-width: 480px) {
	.container { width: 98% !important;}
	#container #btnsitiosdc, #content #btnsitiosdc, #container #btntop1, #content #btntop1, a#btnsitiosdc, a#btntop1 { display:none!important;}
	.bloquecajas { float: left; width: 31.3%; }
	article.tapapublicacion { float:left; width:33.3%; padding:10px 30px; box-sizing:border-box;}
	article.tapapublicacion:nth-child(6) { clear:none;}
	article.tapapublicacion:nth-child(5), article.tapapublicacion:nth-child(8) { clear: both;}
}

@media (max-width:480px) {
	article.cajasdirectorios { width:96%;text-align: left;}
	#container #btnsitiosdc, #content #btnsitiosdc, #container #btntop1, #content #btntop1, a#btnsitiosdc, a#btntop1 { display:none!important;}
	#detallepublicacion {width:96%; margin:10px auto; padding:10px; float:none;}
	section, .container.main-content.clearfix section { width:96%!important; float:none; clear:both; margin:auto;}
	.bloquecajas { float: none;    width: 90%;    clear: both;  margin: auto; min-height: inherit; }
	article.tapapublicacion { float:left; width:50%; padding:10px 30px; box-sizing:border-box;}
	article.tapapublicacion:nth-child(6) { clear:none;}
	article.tapapublicacion:nth-child(4), article.tapapublicacion:nth-child(6), article.tapapublicacion:nth-child(8) { clear: both;}
  .autoresgris { float: none; width: 100% !important; height: auto !important; box-sizing: border-box; padding: 8px 8px 40px; }

}
