@charset "UTF-8";
/* CSS Document *
ADMINISTRADOR DE CONTENIDOS - PLANTILLA OFICIAL
DIRECCIÓN DE TECNOLOGÍAS - MUNICIPIO DE LEÓN, GUANAJUATO
-----------------------------------------------------------*/
html {
	box-sizing: border-box;
}
*, *:before, *:after {
  box-sizing: inherit;
}

@font-face {
    font-family: 'Azo Sans Bk';
    src: url('font/AzoSans-Black.eot');
    src: url('font/AzoSans-Black.eot?#iefix') format('embedded-opentype'),
        url('font/AzoSans-Black.woff') format('woff'),
        url('font/AzoSans-Black.ttf') format('truetype'),
        url('font/AzoSans-Black.svg#AzoSans-Black') format('svg');
    font-weight: 900;
    font-style: normal;
    font-display: swap;}

@font-face {
    font-family: 'Azo Sans Lt';
    src: url('font/AzoSans-Light.eot');
    src: url('font/AzoSans-Light.eot?#iefix') format('embedded-opentype'),
        url('font/AzoSans-Light.woff') format('woff'),
        url('font/AzoSans-Light.ttf') format('truetype'),
        url('font/AzoSans-Light.svg#AzoSans-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-display: swap;}

@font-face {
    font-family: 'Azo Sans';
    src: url('font/AzoSans-Regular.eot');
    src: url('font/AzoSans-Regular.eot?#iefix') format('embedded-opentype'),
        url('font/AzoSans-Regular.woff') format('woff'),
        url('font/AzoSans-Regular.ttf') format('truetype'),
        url('font/AzoSans-Regular.svg#AzoSans-Regular') format('svg');
    font-weight: normal;
    font-style: normal;
    font-display: swap;}

@font-face {
	font-weight: normal;
	font-style: normal;
	font-family: 'stroke7pixeden';
	src:url('font/stroke7pixeden.eot?u58ytb');
	src:url('font/stroke7pixeden.eot?#iefixu58ytb') format('embedded-opentype'),
		url('font/stroke7pixeden.woff?u58ytb') format('woff'),
		url('font/stroke7pixeden.ttf?u58ytb') format('truetype'),
		url('font/stroke7pixeden.svg?u58ytb#stroke7pixeden') format('svg');}

body {
  	margin: 0;
  	padding: 0;
	width: 100%;
	min-height: 100vh	;
	font-family: 'Azo Sans';
	background: #f5f3f1;
  	color:#606060;
	line-height:25px;
	font-size:16px;}

main#content {
	margin:0 auto;
	max-width: 1366px; }



/*--------------------------------------------
			GENERAL
----------------------------------------------*/

.sombra{
	clear: both;
	width: 100%;
	background: #fff;
	height: 4px;
	box-shadow: 0px 2px 2px 0px rgba(3, 3, 3, 0.1);}

.nota{font-family: 'Azo Sans Bk'}

#contenido{
	background: #fff;
	padding: 25px 0px 0px 0px; }


#contenedor-temas{
	display: flex;
	display: -webkit-flex;
	-webkit-flex-flow: row wrap;}	

.modulo-destacados{
	display: -webkit-flex;
	-webkit-flex-direction: column; }

.info-destacados{
	flex: 1;
	-webkit-flex: 1;
	-webkit-order: 1;
	margin-right:0px;}	

.datos-mod{
	margin: 0 auto;
	width: 95%;
	padding: 5px;}



/*--------------------------------------------
			OPCIONES CINTILLA
----------------------------------------------*/
#cintilla{
	clear: both;
	font-family: 'Azo Sans Bk';
	color:#fff;
	width: 100%;
	height: 40px;
	padding: 10px 20px 10px 20px;
	background: url("img/orla.svg");
	background-repeat: no-repeat;
	background-position: right;
	background-color:#202c4d; }

a.link-portal{
	float: left;
	color:#fff; 
	margin-right: 25px;
	text-decoration:none;}

a.link-portal:hover {
	color:#f6a800; 
	text-decoration:none}

.aire{
	float: left;
	width: 100px;
	height: 25px;
	margin-right: 5px;}

#icon-clima{
	float:left;
	font-size:20px;
	margin-right:15px;
	font-family: 'weathericons';}	

.temperatura{ font-size: 18px;}

/*--------------------------------------------
			ENCABEZADO PRINCIPAL
----------------------------------------------*/
#encabezado{
	clear: both;
	height:117px;
	background:#fff;}

.logotipo{
	width: 140px;
	margin-left: 25px;}

a.boton-contacto{
    display: block;
    height:40px;
	line-height: 45px;
	font-size: 14px;
	font-family: 'Azo Sans Bk';
	color:#163a63;
	line-height: 40px;
    text-decoration: none;
    background:url("img/contacto.svg") 0 0  no-repeat;
	background-position:left;
	background-size:25px 25px;
	padding-left: 30px;
	margin-left: 15px;
	margin-right: 25px;}

a:hover.boton-contacto{
    background-position: -30px 0;
	text-decoration:none;
	color:#f6a800;
    background:url("img/contacto-roll.svg") 0 0 no-repeat;
	background-position:left;	
	background-size:25px 25px;
	padding-left: 30px;	}


#enlace{
	background: #31b0b4; }


/*--------------------------------------------
			ENCABEZADO LOGIN
----------------------------------------------*/
#encabezado-login{
	clear: both;
	height:140px;
	background:#fff;}

#usuario{
	float: right;
	width: 30%;
	height: 40px;
	padding: 2px;
	background: #f7f4f4;
	border-radius: 5px;
	margin: -10px 10px 10px 0px;}

#bandera-op-2{
	z-index: 1000;
	position: absolute;
	top:150px;
	width:500px;
	height: 90px;
	padding: 10px;
	background: #005d9a;
	color:#fff;}

.accordion-menu {
/*    width: 90%;
	max-width: 235px;
    margin: 0px auto 0px;
	*/
	width:98%;
	padding: 5px;
	font-family: 'Azo Sans Bk';
	color:#888888;
    margin: 0 auto;
	list-style: none;
	position: absolute;
	z-index: 90;}

.accordion-menu li.open .dropdownlink {color: #005c99;}

.accordion-menu li.open .dropdownlink .fa-chevron-down { transform: rotate(180deg);}

.accordion-menu li:last-child .dropdownlink {  border-bottom: 0;}

.dropdownlink {
    cursor: pointer;
    display: block;
    font-size: 13px;
	padding-bottom: 6px;
    border-bottom: 1px solid #ccc;
    color: #8888881;
    position: relative;
    transition: all 0.4s ease-out;}

.dropdownlink i {
    position: absolute;
    top: 17px;
    left: 16px;}

.dropdownlink .fa-chevron-down {
    right: 12px;
    left: auto;}

.submenuItems {
	padding: 10px;
	list-style: none;
    display: none;
	font-size: 14px;
	font-family: 'Azo Sans Lt';	
    background: #f7f4f4;}

.submenuItems li {
    border-bottom: 1px solid #c0d7e6;}

.submenuItems a {
	text-decoration: none;
    display: block;
    color: #727272;
    padding: 5px 5px 5px 5px;
    transition: all 0.4s ease-out;}

.submenuItems a:hover {
    background: #c0d7e6;
    color: #005C9A;}

.avatar{
	float: left;
	width: 30px;
	height: 30px;
	margin-right: 10px;}

.iconos-usuario{
	float: left;
	width: 25px;
	height: 25px;
	margin-right: 10px;}




/*--------------------------------------------
			SLIDER - BANNERS CAMPAÑAS
----------------------------------------------*/

.slider-container {
	width:100%;
	height:auto;
	margin: 0 auto;
	padding:0px 0px 0px 0px;
	background-color: #fff;}

.myCarousel {
  position: relative;
  background-color: #fafafa;}

.myCarousel .slides-wrapper .slides {
  position: absolute;}

.myCarousel .slides-wrapper .slides.content {
  height: 60%;
  width: 45%;
  top: 10%;
  left: 0;}

.myCarousel .slides-wrapper .slides.content .bodytext {
  padding: 50px 15px 0px 15px;
  position: relative;
  top: 45%;
  transform: translateY(-50%);}

.myCarousel .slides-wrapper .slides.content .title {
	color:#005d9a;
	font-family: 'Azo Sans Bk';
	text-transform: uppercase;
  font-size:35px;
 	 margin:10px 0px 10px 0px;
	line-height: normal;
}
.myCarousel .slides-wrapper .slides.content .subtitle {
	font-family: 'Azo Sans Lt';
  font-size: 18px;
  line-height: 25px;
}
.myCarousel .slides-wrapper .slides.photo {
  height: 100%;
  width: 55%;
  top: 0;
  right: 0;
}
.myCarousel .slides-wrapper .slides.photo .image {
  width: 100%;
  height: 100%;
  background-size: cover;
  background-position: center;
}
.myCarousel .slides-wrapper .slides.title {
  height: 20%;
  width: 55%;
  bottom: 0;
  left: 0;
}
.myCarousel .slides-wrapper .slides.title .bodytext {
  padding: 0 50px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.myCarousel .slides-wrapper .slides.title .title {
  margin: 0;
  color: #fff;
  margin-bottom: 5px;
  font-family: serif;
  font-size: 2.25em;
  letter-spacing: 1px;
}
.myCarousel .slides-wrapper .slides.title .link {
  position: relative;
  color: #fff;
  text-transform: uppercase;
  font-size: 0.65em;
  letter-spacing: 2px;
  margin-left: 3px;
}
.myCarousel .slides-wrapper .slides.title .link:after {
  content: "";
  position: absolute;
  top: 2px;
  right: -15px;
  width: 7px;
  height: 7px;
  transform: rotate(45deg);
  border: 1px solid;
  border-left: 0;
  border-bottom: 0;
  transition: right 0.3s;
}
.myCarousel .slides-wrapper .slides.title .link:hover span {
  opacity: 0.5;
}
.myCarousel .slides-wrapper .slides.title .link:hover:after {
  right: -18px;
}
.myCarousel .slides-wrapper .slides.title .red {
  background-color: lightyellow;
}
.myCarousel .slides-wrapper .slides.title .red .title,
.myCarousel .slides-wrapper .slides.title .red .link {
  color: #333;
}
.myCarousel .slides-wrapper .slides.title .blue {
  background-color: lightblue;
}
.myCarousel .slides-wrapper .slides.title .green {
  background-color: lightpink;
}
.myCarousel .slides-wrapper .slides.price {
  height: 20%;
  width: 25%;
  bottom: 0;
  left: 55%;
  background-color: #333;
}
.myCarousel .slides-wrapper .slides.price > * {
  transition-delay: 0.2s;
}
.myCarousel .slides-wrapper .slides.price .bodytext {
  padding: 0 50px;
  position: relative;
  top: 50%;
  transform: translateY(-50%);
}
.myCarousel .slides-wrapper .slides.price .bodytext span {
  display: block;
  color: #fff;
}
.myCarousel .slides-wrapper .slides.price .bodytext .title {
  text-transform: uppercase;
  margin-bottom: 10px;
}
.myCarousel .slides-wrapper .slides.price .bodytext .title.red {
  color: lightyellow;
}
.myCarousel .slides-wrapper .slides.price .bodytext .title.blue {
  color: lightblue;
}
.myCarousel .slides-wrapper .slides.price .bodytext .title.green {
  color: lightpink;
}
.myCarousel .slides-wrapper .slides.price .bodytext .label {
  font-size: 2em;
}
.myCarousel .slides-wrapper .slides.counter {
  position: absolute;
  top: 40%;
  right: 0;
  width: 50px;
  height: 50px;
  background-color: #005d9a;
  color: #fff;
  line-height: 50px;
  text-align: center;
  font-size: 12px;
}
.myCarousel .slides-wrapper .counter-content {
  position: absolute;
  top: 40%;
  margin-top: 50px;
  right: 0;
  width: 50px;
  background-color: #f6a800;
}
.myCarousel .slides-wrapper .counter-content hr {
  position: relative;
  display: block;
  transform: rotate(-45deg);
  width: 20px;
}
.myCarousel .slides-wrapper .counter-content span {
  display: block;
  text-align: center;
  line-height: 50px;
  color: white;
  font-size: 12px;
}
.myCarousel #arrows {
  position: absolute;
  top: 0;
  left: 0;
  padding: 125px 0px 30px 50px;
}
.myCarousel #arrows span {
  margin: 0 10px;
  text-transform: uppercase;
  font-size: 12px;
  line-height: 1;
  font-weight: bold;
}
.myCarousel #arrows .prev,
.myCarousel #arrows .next {
  width: auto;
  height: auto;
  border: none !important;
  text-transform: uppercase;
  font-size: 14px;
  line-height: 1;
  font-weight: bold;
  color: #000;
}
.myCarousel #arrows .prev.disable,
.myCarousel #arrows .next.disable {
  display: none;
}
.myCarousel #arrows .prev:hover,
.myCarousel #arrows .next:hover {
  opacity: 0.5;
}

.ico-flecha{
	width: 30px;
	height: 30px;
}

a.boton-link{
	margin: 0 auto;
    display: block;
	width: 145px;
	height: 40px;
	line-height: 40px;
	font-family: 'Azo Sans Lt';
	font-size: 14px;
	text-transform: uppercase;
	color:#fff;
    text-decoration: none;
	border-radius: 5px;
    background:#005d9a url("img/mas.svg") 0 0  no-repeat;
	background-position: center right;
	background-size:15px 15px;
	padding-left: 35px;}

a:hover.boton-link{
	height: 40px;
    background-position: -30px 0;
	text-decoration:none;
	color:#fff;
    background:#f6a800 url("img/mas-roll.svg") 0 0 no-repeat;
	background-position: center right;
	background-size:15px 15px;
	padding-left: 35px;}


/*--------------------------------------------
			EJE - BANDERA
----------------------------------------------*/

#bandera{
	z-index: 1000;
	position: absolute;
	top:117px;
	width:500px;
	height: 90px;
	padding: 10px;
	background: #005d9a;
	color:#fff;}

.txt-bandera{
	font-family: 'Azo Sans';
	font-weight: normal;
    font-style: normal;
	padding: 15px 10px 15px 10px;}

h1{
	margin:0px 0px 5px 0px;
	line-height: 30px;
	font-size: 25px;
	text-transform: uppercase;
	text-align: left;}


/*--------------------------------------------
			MENÚ DE TEMAS
----------------------------------------------*/
#menu-temas{
	clear: both;
	width: 100%;
	height: 320px;
	padding:0px 0px 10px 0px;
	background-color:#fff;}

#botones-calidad{
	height: 235px;
	background: #202c4d;
	margin: 0px 0px 0px 0px;
	-webkit-box-shadow: inset 0 10px 0 rgba(0,0,0,.1), 0 10px 8px rgba(0,0,0,.2); 
	-moz-box-shadow: inset 0 10px 0 rgba(0,0,0,.1), 0 10px 8px rgba(0,0,0,.2);
	box-shadow: inset 0 10px 0 rgba(0,0,0,.1), 0 10px 8px rgba(0,0,0,.2); }

a.boton-calidad{
	float: left;
    display: block;
    width:33.3%;
    height:235px;
	padding:50px 20px 0px 20px;
	font-family: 'Azo Sans Lt';
	font-size:16px;
	color:#fff;
    text-decoration: none;
	background-color:#202c4d;
	background-position:center;
	line-height:20px;
	margin-bottom:15px; }

a:hover.boton-calidad{
	height:285px;
	padding:50px 20px 0px 20px;
	text-decoration:none;
	background-color:#005d9a;} 


.ico-boton{
	float: left;
	width: 40px;
	height: 40px;
	margin-right: 10px;}


/*--------------------------------------------
			CONTACTO - FOOTER
----------------------------------------------*/
#contacto{
	font-family: 'Azo Sans Lt';
	line-height: 20px;
	background: #f6a800;
	padding: 20px 25px 20px 25px;
	color:#fff;}

h3{
	 font-family: 'Azo Sans Bk';
	font-size: 18px;
	color:#fff;
	margin: 0px 0px 5px 0px;
	font-weight: bold; }

.comentarios{
	padding: 10px;
	text-align: left;
	font-family: 'Azo Sans Lt';}

.iconos{
	width: 25px;
	height: 25px;
	margin-right: 5px;}

a.link-contact-footer{
	margin: 0 auto;
    display: block;
    width:98%;
	color:#fff;
	text-align: left;
    text-decoration: none;
    background:url("img/comentarios.svg") 0 0  no-repeat;
	background-position:left;
	background-size:25px 25px;
	padding-left: 35px;}

a:hover.link-contact-footer{
    background-position: -90% 0;
	text-decoration:none;
	color:#52225f;
    background:url("img/comentarios-roll.svg") 0 0 no-repeat;
	background-position:left;	
	background-size:25px 25px;} 

#contacto a {
	color:#fff; 
	text-decoration:none;	}

#contacto a:hover {
	color:#52225f; 
	text-decoration:none}


/*--------------------------------------------
			FOOTER
----------------------------------------------*/
footer{
	background: #202c4d;
	padding: 25px 20px 25px 20px;
	color:#fff;}

.info-datos {
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;

  -webkit-justify-content: space-around;
  justify-content: space-around;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-align-items: stretch;
  align-items: stretch;}

.info-datos > div {
	padding: 0px;
	margin: 0px; }

.box {	
	flex-basis:150px;
	flex-grow: 1; }

.box1 {
	flex-basis:600px;
	flex-grow: 3; }

.logo-footer{
	width: 60%; 
	text-align: center !important; }

.linea{
	background: #144a7b;
	height:1px;
	margin-top: 10px;
	margin-bottom: 10px;}

.imagen{
	width:100%;
	margin-bottom: 10px;}

.redes{
	height: 35px;
	width:125px;}

a.facebook-footer{
	float: left;
    display: block;
	width: 30px;
    height:30px;
    text-decoration: none;
    background:url("img/facebook-footer.svg") 0 0  no-repeat;
	background-size:30px 30px;
	margin-right:10px;}

a:hover.facebook-footer{
    background-position: -30px 0;
	text-decoration:none;
    background:url("img/facebook-footer-roll.svg") 0 0 no-repeat;
	background-size:30px 30px;	}

a.twitter-footer{
	float: left;
    display: block;
	width: 30px;
    height:30px;
    text-decoration: none;
    background:url("img/twitter-footer.svg") 0 0  no-repeat;
	background-size:30px 30px;
	margin-right:10px;}

a:hover.twitter-footer{
    background-position: -30px 0;
	text-decoration:none;
    background:url("img/twitter-footer-roll.svg") 0 0 no-repeat;
	background-size:30px 30px;	}

a.youtube-footer{
	float: left;
    display: block;
	width: 30px;
    height:30px;
    text-decoration: none;
    background:url("img/youtube-footer.svg") 0 0  no-repeat;
	background-size:30px 30px;
	margin-right:10px;}

a:hover.youtube-footer{
    background-position: -30px 0;
	text-decoration:none;
    background:url("img/youtube-footer-roll.svg") 0 0 no-repeat;
	background-size:30px 30px;	}

#sub-menu{
	margin: 0 auto;
	width:100%;
	padding: 5px;
	font-family: 'Azo Sans Lt'; }

#sub-menu a{
	float: left;
    display: block;
    height:30px;
	color:#fff;
	text-align: left;
    text-decoration: none;
    background:url("img/vineta-c.svg") 0 0  no-repeat;
	background-size:15px 15px;
	padding-left:20px;
	margin-left: 10px;}

#sub-menu a:hover{
    background-position: -30px 0;
	text-decoration:none;
    background:url("img/vineta-b.svg") 0 0 no-repeat;
	background-size:15px 15px;	}

.copy{
	clear: both;
	padding: 5px;
	font-family: 'Azo Sans Lt';
	text-align: center;}

a.link-aviso{
	color:#fff; 
	text-decoration:none;}

a.link-aviso:hover {
	color:#28b2b5; 
	text-decoration:none}

/*--------------------------------------------
			RUTA DE NAVEGACIÓN
----------------------------------------------*/

#ruta{
	float: right;
	width:47%;
	background: #fff;
	text-transform: uppercase;
	text-align: right;
	padding: 15px 25px 15px 25px;
	font-size: 14px;
	font-family: 'Azo Sans Bk';
	color:#888888;
	border-bottom: 1px solid #cccccc;}

a.link-ruta{ 
	color:#888; 
	text-decoration:none;}

a.link-ruta:hover {
	color:#005c99; 
	text-decoration:none}

.nota-rut{
	color:#f5a700; 
	font-family: 'Azo Sans Lt';}

/*--------------------------------------------
			DOCUMENTOS
----------------------------------------------*/
.cabecera-documentos{
	clear: both;
	padding: 100px 25px 40px 25px;
	background:url("img/manuales-de-procesos.png") top center;
	background-repeat:no-repeat;
	background-color:#fff;
	background-size:cover;
	background-position:right;
    background-position-y: initial; }

.tit-documentos{
	color:#005d9a;
	line-height: 28px;
	font-size: 24px;
	margin: 0px 0px 0px 0px;
	text-transform: uppercase;
	font-family: 'Azo Sans Bk';	}

.descrip-documentos{
	width: 50%;
	color:#63676a;
	font-family: 'Azo Sans Lt';
	text-align: left;
	padding: 20px 0px 70px 0px}

/*****************************/
/* TABS */
/*****************************/

.tabs-style-fillup nav ul li a {
	font-family: 'Azo Sans Bk';
	padding: 1.2em 0;
	border-right: 1px solid #ccc;
	line-height: 1;
	-webkit-transition: color 0.3s;
	transition: color 0.3s;
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
	color: #005d9a;
	text-decoration: none;
	outline: none;}

.tabs-style-fillup nav ul li:last-child a {
	border: none;}

.tabs-style-fillup nav ul li.tab-current {
	z-index: 100;}

.tabs-style-fillup nav ul li.tab-current a {
	color: #005d9a;}

.tabs-style-fillup nav ul li a::after {
	position: absolute;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100%;
	height: calc(100% + 1px);
	border: 1px solid #eee;
	background: #efefef;
	content: '';
	-webkit-transition: -webkit-transform 0.3s;
	transition: transform 0.3s;
	-webkit-transform: translate3d(0,100%,0);
	transform: translate3d(0,100%,0);}

.tabs-style-fillup nav ul li.tab-current a::after {
	-webkit-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);}

.tabs-style-fillup nav ul li a span,
.tabs-style-fillup .icon::before {
	-webkit-transition: -webkit-transform 0.5s;
	transition: transform 0.5s;
	-webkit-transform: translate3d(0,5px,0);
	transform: translate3d(0,5px,0);}

.tabs-style-fillup nav ul li a span {
	display: block;
	font-weight: 700;
	font-size: 0.7em;
	line-height: 1.5;}

.tabs-style-fillup .icon::before {
	display: block;
	margin: 0;}

.tabs-style-fillup nav ul li.tab-current a span,
.tabs-style-fillup li.tab-current .icon::before {
	-webkit-transform: translate3d(0,-10px,0);
	transform: translate3d(0,-10px,0);}

.tabs {
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	width: 100%;
	font-weight: 300;
	font-size: 1.25em;}

/* Nav */
.tabs nav {
	text-align: center;}

.tabs nav ul {
	position: relative;
	display: -ms-flexbox;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	margin: 0 auto;
	padding: 0;
	max-width: 1200px;
	list-style: none;
	-ms-box-orient: horizontal;
	-ms-box-pack: center;
	-webkit-flex-flow: row wrap;
	-moz-flex-flow: row wrap;
	-ms-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;}

.tabs nav ul li {
	position: relative;
	z-index: 1;
	display: block;
	margin: 0;
	text-align: center;
	-webkit-flex: 1;
	-moz-flex: 1;
	-ms-flex: 1;
	flex: 1;
}

.tabs nav a {
	position: relative;
	display: block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	line-height: 2.5;}

.tabs nav a span {
	vertical-align: middle;
	font-size: 0.75em;}

.tabs nav li.tab-current a {
	color: #005d9a;}

.tabs nav a:focus {
	outline: none;}

/* Icons */
.icon::before {
	z-index: 10;
	display: inline-block;
	margin: 0 0.4em 0 0;
	vertical-align: middle;
	text-transform: none;
	font-weight: normal;
	font-variant: normal;
	font-size: 1.3em;
	font-family: 'stroke7pixeden';
	line-height: 1;
	speak: none;
	-webkit-backface-visibility: hidden;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;}

.icon-upload::before {
	content: "\e68a";}

.icon-tools::before {
	content: "\e60a";}

.icon-plane::before {
	content: "\e625";
}
.icon-joy::before {
	content: "\e6a4";
}
.icon-plug::before {
	content: "\e69a";
}
.icon-home::before {
	content: "\e648";
}
.icon-gift::before {
	content: "\e652";
}
.icon-display::before {
	content: "\e65e";
}
.icon-date::before {
	content: "\e660";
}
.icon-config::before {
	content: "\e666";
}
.icon-coffee::before {
	content: "\e669";
}
.icon-camera::before {
	content: "\e66f";
}
.icon-box::before {
	content: "\e674";}

/* Content */
.content-wrap {
	position: relative;}

.content-wrap section {
	display: none;
	margin: 0 auto;
	padding: 20px 20px 90px 20px;
	max-width: 1366px;
	text-align: center;}

.content-wrap section.content-current {
	display: block;}

.content-wrap section .lista {
	margin: 0px;
	background: #eee;
	padding: 10px;
	line-height: 26px;
	text-align: left;
	font-family: 'Azo Sans Lt';	
	font-size: 15px;}

/* Fallback */
.no-js .content-wrap section {
	display: block;
	padding-bottom: 2em;
	border-bottom: 1px solid rgba(255,255,255,0.6);
}

.no-flexbox nav ul {
	display: block;
}

.no-flexbox nav ul li {
	min-width: 15%;
	display: inline-block;
}

@media screen and (max-width: 58em) {
	.tabs nav a.icon span {
		/*display: none;*/
	}
	.tabs nav a:before {
		margin-right: 0;
	}
}

.archivo{
	float: left;
	width: 18px;
	height: 18px;
	margin-right: 10px;}

.drive{
	vertical-align: middle;
	width: 18px;
	height: 18px;
	margin-right: 10px;}


a.link-archivo{
	color:#888; 
	border-radius: 3px;
	text-decoration:none; }

a.link-archivo:hover {
	color:#005C9A; 
	text-decoration:none}

a.link-drive{
	display: block;
	color:#888; 
	padding:5px;
	border-bottom: 1px solid #ccc;
	border-radius: 3px;
	text-decoration:none;
	margin:10px 0px;}

a.link-drive:hover {
	background: #D0DEF1;
	color:#005C9A; 
	text-decoration:none}


/*****************************/
/* ACORDION-LISTAS */
/*****************************/
.accordion {
	list-style: none;
	margin: 0;
	padding: 0;
}

.accordion > li {
	margin: 0;
}

/**
 * Add zero-width space. needed to ensure Safari + VO respect list semantics.
 * Set the before content to position absolute to negate any visible space
 * the before content could add to the document.
 */
.accordion > li:before {
	content: "\200B";
	position: absolute;
}

/**
 * Accordion Heading
 */
.accordion__heading {
	border-bottom: 1px solid #eee;
	font-size: inherit;
	margin: -1px 0 0;
}

.accordion__trigger {
	-webkit-appearance: none;
	background: #fafafa;
	background: url("img/organismo.png") no-repeat;
	background-position: left;
	background-size: 25px 25px;
	border: none;
	color: #7d7d7d;
	cursor: pointer;
	display: block;
	font-size: 14px;
	margin: 0;
	padding: 15px 10px  15px 35px;
	position: relative;
	text-align: left;
	width: 100%;
	z-index: 2;
	font-family: 'Azo Sans Lt';	
	text-transform: uppercase;}

.accordion__trigger:after {
  border-left: .4em solid transparent;
  border-right: .4em solid transparent;
  border-top: .5em solid #7d7d7d;
  bottom: 0;
  content: '';
  height: 0;
  margin: auto;
  position: absolute;
  right: 1em;
  top: 0;
  transition: transform .2s ease-in-out;
  transform-origin: center center;
  transform: rotate(0deg);
  width: 0;}

.accordion__trigger:hover:after,
.accordion__trigger:focus:after,
.accordion__trigger[aria-expanded="true"]:after {
	border-top-color: #FDD044;}

.accordion__trigger[aria-expanded="true"]:after {
	transform: rotate(180deg);	
}


.accordion__trigger:hover,
.accordion__trigger:focus {
	background-color: #e4ebf0;
	color: #005d9a;
	outline: none;}

.accordion__trigger:focus {
	box-shadow: inset 0 0 0 1px #ccc;
}

.accordion__trigger[aria-disabled="true"]:hover {
	background-color: #202C4D;
	color: #fff;
	cursor: not-allowed;
}

.accordion__trigger[aria-disabled="true"]:focus {
	background-color: #0a2a42;
}

.accordion__panel {
	background-color: inherit;
	max-height: 0vh;
	overflow: hidden;
	padding: 0.001em 1.25em;
	position: relative;
	visibility: hidden;
	z-index: 1;
}

.accordion__panel--transition {
	transition:
		max-height .2s ease-in-out,
		padding-top .2s ease-in-out,
		padding-bottom .2s ease-in-out;
}

.accordion__panel > :last-child {
	margin-bottom: 0;
}

.accordion__panel[aria-hidden="false"] {
	max-height: 100vh;
	overflow: auto;
	padding: 10px;
	visibility: visible;}

#sub-nivel {
	background: #e7e7e7;}

#sub-nivel .accordion__trigger{
	-webkit-appearance: none;
	background: #fafafa;
	background: url("img/unidades.png") no-repeat;
	background-position: left;
	background-size: 25px 25px;
	border: none;
	color: #7d7d7d;
	cursor: pointer;
	display: block;
	font-size: 15px;
	margin: 0px 0px 0px 5px;
	padding: 15px 5px 15px 35px;
	position: relative;
	text-align: left;
	width: 100%;
	z-index: 2;
	font-family: 'Azo Sans Lt';	
	text-transform: uppercase;	}

#lista-drive{
	background: #fff;}

#lista-drive .accordion__trigger  {
	-webkit-appearance: none;
	background: #fafafa;
	background: url("img/lista.png") no-repeat;
	background-position: left;
	background-size: 25px 25px;
	border-top:1px solid #e2e2e2;
	color: #7d7d7d;
	cursor: pointer;
	display: block;
	font-size: 15px;
	margin: 0px 0px 0px 5px;
	padding: 15px 5px 15px 35px;
	position: relative;
	text-align: left;
	width: 100%;
	z-index: 2;
	font-family: 'Azo Sans Lt';	
	text-transform: uppercase;	}




/*--------------------------------------------
			LOGIN
----------------------------------------------*/
#marco-login{
	padding: 125px 20px 35px 20px;}

#login {
	margin: 0 auto;
	width: 85%;
	padding: 30px 25px 90px 25px;
	background:url("img/orlas.png")  no-repeat;
	background-repeat:no-repeat;
	background-color:#202c4d;
	background-size:38%;
	background-position:right;
    background-position-y: initial; }

h2{
	text-align: center;
	font-size: 25px;
	font-family: 'Azo Sans Bk';
	color:#fff;
	margin: 25px 0px 20px 0px;
	margin-bottom: 15px;}

#formulario{
	margin: 0 auto;
	width: 90%;
	padding: 30px 10px 10px 10px;
	text-align: center;}

.campo-forma-1{
	font-size: 15px;
	font-family: 'Azo Sans Lt';	
	width:50%;
	height: 30px;
	padding: 5px;
	background: transparent;
	border-radius: 25px;
	color:#fff;
	border: 1px solid #005C9A;
	padding: 25px 0px  25px 50px;
	background:url("img/usuario.svg")  no-repeat;
	background-repeat:no-repeat;
	background-size:45px 45px;;
	background-position:left;
	margin-bottom: 20px;}

.campo-forma-1::placeholder {
	color:#fff !important;
	font-size: 14px;}

.campo-forma-2{
	font-size: 15px;
	font-family: 'Azo Sans Lt';	
	width:50%;
	height: 30px;
	padding: 5px;
	background: transparent;
	border-radius: 25px;
	color:#fff;
	border: 1px solid #005C9A;
	padding: 25px 0px  25px 50px;
	background:url("img/password.svg")  no-repeat;
	background-repeat:no-repeat;
	background-size:45px 45px;;
	background-position:left;
	margin-bottom: 20px;}

.campo-forma-2::placeholder {
	color:#fff !important;
	font-size: 14px;}

#no-soy{
	margin: 0 auto;
	text-transform: uppercase;
	width: 220px;
	padding: 10px 0px 10px 5px;
	text-align: center}

.centrar-boton{
	margin: 0 auto;	
	width: 160px;
	padding-top: 20px;
	padding-bottom: 20px;}

.enviar{
	width:180px;
	height:45px;
	border: 0px;
	font-size: 15px;
	border-radius: 25px;
	padding: 10px;
	font-family: 'Azo Sans Bk';
	text-transform: uppercase;
	color:#fff;
    background:#005c9a;
	margin-bottom: 20px;}

a.boton-formulario{
	margin: 0 auto;
    display: block;
	width: 210px;
    height:50px;
	line-height: 50px;
	font-size: 15px;
	font-family: 'Azo Sans Bk';
	color:#fff;
	line-height: 40px;
    text-decoration: underline; }

a:hover.boton-formulario{
    background-position: -30px 0;
	text-decoration:none;
	color:#f6a800;}

/*--------------------------------------------
			CONTACTO - DEPENDENCIA
----------------------------------------------*/
#contacto-dependencia{
	clear: both;
	background: #fff;
	padding: 45px 25px 35px 25px;}

.info-contacto-dependencia {
  -ms-box-orient: horizontal;
  display: -webkit-box;
  display: -moz-box;
  display: -ms-flexbox;
  display: -moz-flex;
  display: -webkit-flex;
  display: flex;

  -webkit-justify-content: space-around;
  justify-content: space-around;
  -webkit-flex-flow: row wrap;
  flex-flow: row wrap;
  -webkit-align-items: stretch;
  align-items: stretch;}

.info-contacto-dependencia > div {
	/*padding: 0px;
	margin: 0px;*/ }

.box-dat-contacto{
	flex-basis: 380px;
	flex-grow: 3; }

.box-geolocaliza {
	flex-basis: 350px;
	flex-grow: 1; }

.titulo-contacto{
	font-size: 35px;
	font-family: 'Azo Sans Bk';
	color:#7d7d7d;
	margin: 30px 0px 0px 0px;}

#fondo-contacto{
	background: #edeff1;
	padding: 15px;
	height: 500px;
	text-align: left;}

#fondo-contacto a{
	text-decoration: none;
	color:#7d7d7d;}

#fondo-contacto a:hover{
	color:#f5a700;}

.imagen-contacto{
	float: left;
	width: 38%;
	margin: 10px 0px 10px 0px;}

.dependencia{
	color:#005c9a;
	margin: 20px 0px 25px 0px;
	font-size:22px;
	font-family: 'Azo Sans Bk';}

.ico-dependencia{
	margin-right: 10px;
	width: 30px;
	height: 30px;}

.ico-directorio{
	float: left;
	width: 25px;
	height: 25px;
	margin-right: 5px;
	margin-bottom: 5px;}

#mapa-contacto{
	clear: both;
	margin: 0px;
	background: #fafafa;
	padding: 10px;}


/*--------------------------------------------
			SECCIÓN 
----------------------------------------------*/
#lista-temas{
	clear: both;
	background: #fff;
	padding: 65px 25px 45px 25px;}

.titulo-tema-secc{
	font-size: 25px;
	font-family: 'Azo Sans Bk';
	color:#7d7d7d;
	margin: 30px 0px 30px 0px;}

.txt-lista-tema{
	width: 75%;
	font-family: 'Azo Sans Lt';
	padding: 0px 5px 5px 5px;
	color:#7d7d7d;
	text-align:left;}

.items-tema{
	margin: 0 auto;
	width: 85%;
	padding: 30px 10px 20px 10px;
	color:#7d7d7d;
	font-family: 'Azo Sans Lt';}

a.boton-item{
    display: block;
	font-size: 14px;
	color:#7d7d7d;
	padding: 10px 0px 10px 0px;
    text-decoration: none;
	border-bottom: 1px dotted #ccc;}

a:hover.boton-item{
    background-position: -30px 0;
	text-decoration:none;
	color:#005c9d;}

.num-item{
	font-family: 'Azo Sans Bk';	
	padding-right: 10px;}


/*--------------------------------------------
			LOGIN GENERAL
----------------------------------------------*/
#login-sesion {
	margin: 0 auto;
	width: 80%;
	padding: 130px 25px 100px 25px;
	background:url("img/login-sgc.png")  no-repeat;
	background-repeat:no-repeat;
	background-size:cover;
	background-position:center;
    background-position-y: initial; }


/*--------------------------------------------
			MEDIA QUERY
----------------------------------------------*/

@media (max-width: 992px) {
  .mobileMenu {
    -webkit-transform: translateX(-100%);
            transform: translateX(-100%);
    position: fixed;
    top: 50px;
    bottom: 0;
    margin: auto;
    left: 0;
    -webkit-transition: all ease 0.25s;
    transition: all ease 0.25s;
  }
  .mobileMenu.open {
    -webkit-transform: translateX(0%);
            transform: translateX(0%);
  }
  .mobileMenu .navbar-nav {
    overflow-y: auto;
  }
  .overlay {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    background-color: rgba(0, 0, 0, 0.5);
    display: none;  }
	
  .overlay.open {
    display: block;
    z-index: 1029;}
	
	#bandera{width: 55%; height: 80px;}	
	
	#bandera-op-2{width: 55%; height: 80px;}	
	
	
	h1{ line-height: 18px; font-size: 18px;}	 
		
	.myCarousel .slides-wrapper .slides.content .title { font-size:25px;}

	.myCarousel .slides-wrapper .slides.content .subtitle { font-size: 16px;}
	
	.cabecera-documentos{padding: 20px 25px 10px 25px; background-position:78%}

	#login {width: 98%;}	

	#formulario{width: 98%;}	
	
	.campo-forma-1{width:70%;}
	
	.campo-forma-2{width:70%;}	
	
	.dependencia{font-size:16px;}
	
	.titulo-contacto{font-size: 20px;}	
	
	#usuario{width: 50%;}
	

	
}


@media (max-width: 789px) {
	.logo-footer{ width: 22%; margin: 0 auto;}	
	
	.redes{margin: 0 auto;}
	
	.titulo-tema-secc{font-size: 18px;}
	
	#usuario{width: 55%;}
	

}


@media (max-width: 668px) {
	#contenedor-temas {-webkit-flex-direction: column; width: 100%; }
	
	#bandera{width: 100%; height: 60px;}	
	
	#bandera-op-2{width: 100%; height: 60px;}		
	
	a.boton-calidad{ width:100%; height: 160px; padding: 25px; margin: 0px}
	
	a:hover.boton-calidad{ height:160px; padding: 25px;  margin:0px;} 

	#menu-temas{height: 630px;}	
	
	.myCarousel .slides-wrapper .slides.content .title { font-size:18px;}
		
	footer{	padding: 25px 10px 25px 10px; }
	
	#ruta{ float:none; width:100%; margin: 30px 0px 10px 0px; font-size: 13px;}
	
	.tit-documentos{ line-height: 20px; font-size: 18px;}

	#marco-login{ padding: 30px 10px 35px 10px;}

	h2{font-size: 18px;}
	
	.campo-forma-1{width:80%;}
	
	.campo-forma-2{width:80%;}	
	
	#no-soy{width: 95%;}	
	
	#usuario{width: 95%;}
	
	
}


@media (max-width: 595px) {
	
	.myCarousel #arrows {  padding: 85px 0px 30px 50px;	}
	
	
	h1{ line-height: 16px; font-size: 15px;}

	#contacto{ padding: 25px 15px 25px 15px; }	

	#sub-menu{width:100%;}	

	.txt-bandera{ padding: 3px 5px 0px 5px;}	
		
	.logo-footer{ width: 30%; }
	
	.cabecera-documentos{; background-position:70%}
}

	
@media (max-width: 414px) {
	
	.cabecera-documentos{; background-position:66%}	
	
	.campo-forma-1{width:100%;}
	
	.campo-forma-2{width:100%;}	
	
}

