a {text-decoration:none}
@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,100);
body{font-size:16px;font-family: 'Roboto Condensed', sans-serif;line-height: 130%;margin: 0 auto;max-width: 960px;}
body {background: #373737 url("/imagen/back-main.png") top center no-repeat;background-attachment: fixed;}
h1, h2, h3, big, .gT {color: #D63105;line-height: 120%;font-family: 'Roboto', sans-serif;letter-spacing: 0em;font-weight: 400;}
h1, h2, h3, big {line-height: 120%}
article, section, .sp {clear: left;width: 100%}
figure, figcaption {margin: 0}
a {color: #A52828}
a:hover {color: #B76100}
.hidden {opacity: 0}
.termina {float: none;clear: both}
fieldset {border: none;}
textarea {resize:none;}
textarea, input[type="text"], input[type="email"], input[type="search"], input[type="password"] {-webkit-appearance: none; -moz-appearance: caret;border: 1px solid #BFBFBF;padding: .5em .7em;font-size: 1em;font-weight: 300;color: #000 }


#hoy {display: none;}
#cmi-web {text-align: center;border-bottom: 5px solid #f00}
#cmi-web .cmi-web {background: url(../../imagenes/site/cmi.jpg) top center no-repeat;background-size: cover;padding-bottom: 15%;max-width: 700px;margin: auto;width: 100%}
#contenidos {overflow: hidden;background: rgba(0, 0, 0, 0.3);}
.centro { max-width:1400px;margin:auto;position:relative }
.fondo {position: absolute;top: 0;bottom: 0;left: 0;right: 0}
.home a {text-decoration: none;}
.empty-message {display: none;}
.btn {background: #255AAB;color: #fff;font-size: 1em;display: inline;padding: .5em;font-weight: 100}

#buscaTx {cursor: pointer;color: #fff}
#buscarEnv {padding: 1em;text-align: center;display: none;}
#buscarEnv input, #buscarEnv button {padding: .5em;border-radius: 3px;border: 1px solid #cecece}
#buscarEnv input {width: 70%}
#buscarEnv button {padding: .5em;margin-left: -.5em;background: #9D9D9D;color: #cecece}

h2 {font: 300 1.8em 'Teko', "Helvetica Neue", Helvetica, Arial, sans-serif; margin: 0 0 22px 0;line-height: 110% }
h3, big {font: 2.5em 'Teko', "Helvetica Neue", Helvetica, Arial, sans-serif; color: #FFF; letter-spacing: -1px; text-transform: uppercase; margin: 0 0 5px 0; }
h4 {font: 300 1.5em 'Teko', "Helvetica Neue", Helvetica, Arial, sans-serif; margin: 0 0 22px 0; }

header {overflow: hidden;border-top: 1px solid #333;position: relative;}
header .centro {text-align: center}
header {background-image: url("/imagen/back-header.png") right center no-repeat;background-attachment: fixed;}

nav {border-bottom: 10px solid #255AAB;position: relative;background: #7F7F7F;height: 9em}
nav.nav-home .logo, nav.nav-home #tx-logo {display: none;}
nav .logo {position: absolute;top: 50%;margin-top: -2.5em;left: 2em;border-radius: 50%;background: #717070;width: 5em;height: 5em;text-align: center;font-size: 1.2em}
nav .logo span {line-height: 3em;color: #7F7F7F;font-weight: 100;font-size: 1em}
nav #tx-logo {position: absolute;top: 50%;margin-top: -.5em;left: 1.8em;border-bottom: 3px solid #908B80;font-size: 2.5em}
h3 strong {font-weight: 300;font-size: .7em}
nav ul {list-style: none !important;zoom: 1;position: absolute;right: 2em;top: 50%;margin-top: -.5em}
.nav-home {height: auto;padding: 2em 0;text-align: center;}
.nav-home ul {position: static;margin: auto}
nav li {display: inline-block;line-height: 2em;padding: 0 .8em;font-weight: 100;text-transform: uppercase;font-size: 1em}
nav a {color: #B0B0B0;}
nav a:hover {color: #D8D8D8;}
#ini {display: none}

section {position: relative;overflow: hidden;}
section.portada {clear: left;overflow: hidden}
section .fondoHover {display: none;}
section .textos {overflow: hidden;padding: 4em 0}
section .ln {height: 1px;position: absolute;bottom: 0;left: 0;right: 0}
section .imagenSeccion {margin: 4em 0}
section.sinMargenImg .imagenSeccion {margin: 0;margin-bottom:-4px}
section.sinMargenTx .textos {margin: 0}

.modelo1 .logo {left: 0;right: 0;text-align: center;top: 1.7em;height: 5em}
.modelo1 .msj {font: 100 1.7em "Roboto", sans-serif;width: 80%;bottom: 1.2em;top: auto;text-align: center;margin-left:10%;}
.modelo1 .imgSup {text-align: center;top: 5.5em}
.modelo1 .videoHome {height: 20em;width: 20em;border-radius: 50%;position: absolute;top: 7.7em;overflow: hidden;border: 1.5em solid rgba(255,255,255,.5);left: 50%;margin-left: -10em}
section.modelo1 {text-align: center;}
section.modelo1 .imagenSeccion {margin-top: 1em}
section h2, section h3 {margin-top: 0}

.modelo2 h3 {margin-bottom: .5em;line-height: 130%}
.modelo2 .logo {left: 0;text-align: left}
.modelo2 .imgSup {float:left}
.modelo2 .textos {padding-left: 5%}
.modelo2 .imagenSeccion {width: 50%;float: left;}
.modelo2 .imagenSeccion img {width: 100%;height: auto;}
.modelo2.sinMargenImg .centro {padding-left: 0;width: 100%}
.modelo2.sinMargenTx .textos {margin-left: 50%}
.modelo2.sinMargenImg .imagenSeccion {position: absolute;top: 0;bottom: 0;right: 50%;left: 0;float: none;}
.modelo2.sinMargenImg .textos {margin-left: 50%;float: none;}
.modelo2.altoMax .imagenSeccion img {width: auto;height: 100%;}
.modelo2 .videoHome {height: 25em;width: 25em;position: absolute;top: 3.5em;overflow: hidden;border: 1.5em solid rgba(255,255,255,.5);right: 4.5em}
.modelo2 .textos, .modelo2 .subtitulo {line-height: 130%}

.modelo3  {text-align: center;}
.modelo3  .msj2 {text-align: center;}


#logo	{padding-top: 2em}
#slider	{width: 100%;position: relative;}
#slider .slider {padding-bottom: 38%;overflow: hidden;position: relative;}
#slider .slider.portada {padding-bottom: 45%}
.it-slider {position: absolute;top: 0;bottom: 0;right: 0;left: 0;display: none;}
#slider1 {display: block;}
#slider .centro {height: 100%;width: 100%;position: relative;padding: 0}
#slider .imgSup {float: none;position: absolute;top: 0;bottom: 0}
#slider .modelo2 .imgSup {left: 0;right: 40%}
#slider .modelo3 .imgSup {right: 0;left: 40%}
#slider .modelo3.sinMargenImg .imgSup {text-align: right}
#slider .msj1 {display: table;position: absolute;top: 0;bottom: 0;height: 100%;text-align: left;}
#slider .msj2 {font: 300 2.5em 'Teko', "Helvetica Neue", Helvetica, Arial, sans-serif, sans-serif;line-height: 120%;color: #ffff;text-shadow: 1px 1px 2px black;}
#slider .msj2a {font: 300 2.5em 'Teko', "Helvetica Neue", Helvetica, Arial, sans-serif, sans-serif;line-height: 120%;color: #ffff;text-shadow: 1px 1px 2px black;}
#slider .modelo2 .msj1 {left: 40%;width: 58%}
#slider .modelo3 .msj1 {position: static !important;text-align: center;}
#slider .modelo1 .msj1 {left: 5%;right: 5%}
#slider .modelo1 .imgSup {right: 5%;left: 5%}
#itemSlider {position: absolute;bottom: 1em;right: 5%;text-align: right;display: none;}
.itemSlider {border: 1px solid #cecece;border-radius: 50%;display: inline-block;margin-left: .5em;height: 12px;width: 12px;background: #3F3F3F;cursor: pointer;}
.itemSlider.activo {background: #cecece}
#slider .btn {font-size: .5em}

#videos {text-align: center;padding-bottom: 2em}
#videos h3 {margin: 2em 0 1.5em}
#videos article {text-align: left;width: 43%;display: inline-block;margin: 2em 1%;overflow: hidden;position: relative;vertical-align: top;}
#videos figure {width: 50%;padding-bottom: 50%;overflow: hidden;position: relative;border-radius: 50%;float: left;cursor: pointer;}
#videos figcaption {position: absolute;top: 50%;left: 50%;font-size: 3em;color: #fff;margin-left: -.5em;margin-top: -.5em;display: none;}
#videos figure:hover > figcaption {display: block;}
#videos img  {height: 100%;width: auto;position: absolute;}
#videos .info1 {width: 50%;position: absolute;top: 0;bottom: 0;left: 50%;right: 0;overflow: hidden;}
#videos .info2 {padding: 20% 7% 0 7%;position: relative;height: 60%}
#videos .avanzar {position: absolute;top: 50%;margin-top: -1em;font-size: 1.5em;line-height: 1.5em}
#videos .izq { left: -5%}
#videos .der { right: -5%}
#videos .nombre {color: #111;font-size: 1.2em;font-weight: 300}
#videos .cargo {color: #7F7F7F;font-size: 1em;font-weight: 100}
#videos .fecha {color: #255AAB;font-size: .8em;font-weight: 100}
#videos .btn {font-size: 1.1em;border-radius: 5px;padding: .5em 1.5em .3em;position: absolute;bottom: -0;cursor: pointer;}

#hoy {padding: 4em 0;text-align: center;background: #255AAB;margin-top: 1em}
#hoy .centro {position: relative;width: 80%}
#hoy .imagen {width: 50%;float: left;margin-right: 2em;}
#hoy figure {overflow: hidden;width: 100%;max-height: 220px}
#hoy img  {width: 100%;height: auto;}
#hoy h3 {color: #fff;margin-bottom: 1em}
#hoy .titulo {text-align: left;padding-top: 1em}
#hoy .nombre {color: #000;font-size: 1.5em;font-weight: 300;margin-bottom: .3em}
#hoy .cargo {color: #111;font-size: 1.2em;margin-bottom: 1.5em}
#hoy .btn {clear: left;background: #173C77;color: #fff;font-size: 1.1em;}

#entrevistas {padding: 4em 0;text-align: center}
#entrevistas a {color: #000}
#entrevistas a:hover {color: #A52828}
#entrevistas h3 {margin-bottom: 1.5em}
#entrevistas article {text-align: left;width: 40%;border-bottom: 3px solid #255AAB;display: inline-block;margin: 2em 3%;overflow: hidden;position: relative;vertical-align: top}
#entrevistas figure {overflow: hidden;padding-bottom: 42%;position: relative;}
#entrevistas img  {width: 100%;height: auto;position: absolute;}
#entrevistas .info {padding: .5em;font-weight: 100}
#entrevistas .avanzar {position: absolute;top: 50%;margin-top: -1em;font-size: 1.5em;line-height: 1.5em}
#entrevistas .izq { left: -5%}
#entrevistas .der {right: -5%}
#entrevistas .nombre {color: #111;font-size: 1.2em;font-weight: 300}
#entrevistas .cargo {color: #818181;font-size: 1em;font-weight: 100}
#entrevistas .fecha {color: #255AAB;font-size: .8em;font-weight: 100}
#entrevistas .fecha span {color: #777;margin-left: 1em;font-size: .8em}

#fondo-cmi {background: url(../imagenes/site/cmi.jpg) center left;background-size: cover;max-height: 175px;padding: 3em 3em 7em;position: relative;}
#fondo-cmi #enlace {position: absolute;top: 0;bottom: 0;right: 0;left: 0}

footer {background: #5D5D5D;position: relative;}
.footer {text-align: center;padding: 3em 0;font-size: .9em;color: #999;display: block;;font-weight: 100}
footer h3 {position: absolute;top:2em;left: 2em}
.contact-form {padding: 2em 5% 2em 35%;border: none;}
.contact-form textarea {border: 1px solid #3F3F3F;width: 92%;height: 5em;padding: .7em 4%}
.contact-form input[type="text"],  .contact-form input[type="email"] {border: 1px solid #3F3F3F;width: 92%;padding: .7em 4%}
.contact-form input[type="submit"] {border: 1px solid #333;background: #333;width: 100%;padding: .7em 4%;margin: 1.5em 0;color: #fff;font-size: 1.2em;font-weight: 100;letter-spacing: 1px;cursor: pointer;}
.contact-form .name {position: relative;padding-top: 1em;padding-left:5%;width: 45%;float: left;}
.contact-form .message {position: relative;padding-top: 1.5em;padding-left:5%;clear: left}
.contact-form h5 {font: 100 1em "Roboto",sans-serif;margin: 0 0 .5em;color: #2C2C2C}
.contact-form .empty-message {transition: height 0.3s ease-in 0s; position: absolute; right: 0; top: 2.5em; color: #F00; height: 0px; font-size: .8em; z-index: 99; }
.contact-form .name .empty-message {top: 1.8em}

.portada section {text-align: center;margin: 4em 0;}
#estudios article {display: inline-block;text-align: center;vertical-align: top;max-width: 350px;min-width: 300px;margin: 2em 1em;}
#estudios img {width: 100%;max-width: 300px;}

#servicios article {display: inline-block;text-align: center;vertical-align: top;max-width: 400px;min-width: 300px;margin: 2em 1em;}
#servicios img {width: 100%;max-width: 390px;}

#unidad_movil {background: rgba(81, 81, 81, 0.3);padding:2em 0}
#unidad_movil img {width: 100%;max-width: 800px;}

#mas .fa {color: #881a1e;margin: .2em .5em;text-shadow: 1px 1px 2px black;font-size: 1.5em;}

#contenidos p {padding: 2em 4em;color: #cecece;line-height: 1.5em;font: 300 1.2em 'Teko', "Helvetica Neue", Helvetica, Arial, sans-serif, sans-serif;line-height: 125%;text-shadow: 1px 1px 2px black;}

.internal {width: 95%;}
.internal #logo {margin-top: 3em;}
.internal #mas {top: 2em;}
.internal #mas .fa {color: rgba(255, 255, 255, .5);}

nav {background: #000 ;text-align: center; height: auto;padding: 0 0 1em;border: none;position: relative;}
nav .internal {position: absolute;top: .5em;right: 1em;width: auto;}

@media screen and (min-width: 900px) {
	#videos article {width: 40%;margin: 2em 3%}
}

@media screen and (max-width: 1000px) {
	#videos .info2 {padding-top: 10%}
	#videos .btn {bottom: -1.5em;}
}

@media screen and (max-width: 900px) {
	body {font-size: 14px}
}

@media screen and (max-width: 850px) {
	body {font-size: 14px}
	#videos article {width: 60%;display: block;margin: 0 15% 3em;border-bottom: 1px dotted #cecece;padding-bottom: 3em}
	#videos .btn {bottom: 1.5em}
	#videos .nombre {font-size: 1.3em}
	#videos figure {width: 40%;padding-bottom: 40%;}
	#videos .info1 {width: 60%;left: 40%;}
	#videos .info2 {padding-top: 15%;}
}

@media screen and (max-width: 800px) {
	#videos article {width: 70%;margin: 0 15% 3em}
	#entrevistas article {width: 70%;display: block;margin: 5em 15%}
}

@media screen and (max-width: 700px) {
	h3 {font-size: 2em}
	#videos article {width: 80%;margin: 0 10% 3em}
	#entrevistas article {width: 80%;display: block;margin: 5em 10%}
	.contact-form {width: 80%;margin: 0 10%;padding: 1em 0 2em}
	footer h3 {text-align: center;position: static;padding-top: 2em}
}

@media screen and (max-width: 600px) {
	h3 {font-size: 1.9em}
	#videos article {width: 90%;margin: 0 5% 3em}
	#videos .info2 {padding-top: 10%;}
	#videos .btn {bottom: 1em;}
	#entrevistas article {width: 90%;display: block;margin: 5em 5%}
	.contact-form {width: 90%;margin: 0 5%}
}

@media screen and (max-width: 500px) {
	body {font-size: 14px}
	h2 {font-size: 1.4em}
	h3 {font-size: 1.8em}
	#videos .info2 {padding-top: 5%;}
	#videos .btn {bottom: 0em;}
	#ini {display: block;top: -2em;right: .5em;font-size: 2em;position: absolute;cursor: pointer;}
	#slider {font-size: .8em;}
	#menu-nav {display: none;}
	.contact-form {padding: 0;width: 85% }
}

#fondo-cmi {display: none;}