/* CSS Document */

@import url(https://fonts.googleapis.com/css?family=Oswald:400,300,700);
@import url(https://fonts.googleapis.com/css?family=Slabo+27px);
@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@300;400;500;600&display=swap');
body {margin:0; padding:0;}

img {width:100%; height:auto;
}

.logo {width:100%; height:40px; 
color:#FF9900; 
background:#000; 
text-align:center}

.slider {width:100%; height:400px}
.slider img {height:400px}
.slider img {width:100%; height:100%;}

.intro {width:100%; text-align:center;
padding:20px; font-size:2em;
font-family:"Slabo 27px"}

.menuSup {width:100%; height:80px;
background: url(../img/transpa-negro.png);
font-family:Oswald;
font-weight:300}

.logo {font-family:Oswald;
font-weight:400;
font-size:2em
}

.iso {position:absolute; 
width:180px; height:180px; 
/*left:50%; 
margin-left:-90px*/}

footer {height:auto;
background:#f5f5f5;
}

/* MENU */

#mizq a:hover, #mder a:hover {text-decoration:none}
#mizq {float:left; list-style:none; margin-top:20px}
#mizq li {display:inline-block; text-transform:uppercase}
#mizq li a {padding:20px 30px; color:#f5f5f5}
#mder {float:right; list-style:none; margin-top:20px}
#mder li {display:inline-block; text-transform:uppercase}
#mder li a {padding:20px 30px; color:#f5f5f5}
#mizq li {position:relative}
#mizq li ul {position:absolute; list-style:none; padding:0; 
margin:20px 0 0 0; background:#f90; width:200px}
#mizq li ul li {padding:0; border-bottom:1px solid; width:100%}
#mizq li ul {visibility:hidden; opacity:0; transition:.177s all; margin-top:70px}
#mizq li:hover ul {visibility:visible; opacity:1; margin-top:22px}
#mizq ul li a {padding:10px 20px; text-decoration:none}
#mizq ul li {transition:.3s all}
#mizq ul li:hover {background:#000}
#mizq li ul li {padding:8px 20px; width:230px}
#mizq li ul li {display:block}
#mizq li ul {width:230px}
#mizq li a {padding:40px 30px}

/* FIN MENU */

.box {width:12.2%; height:200px; 
background:#ccc; 
float:left; 
margin-right:3px}
.box img {width:103px; height:auto}
.box {text-align:center; padding:20px 10px; transition:.2s all; transform:scale(1)}
.box:hover {background:orange; transform:scale(1.02); z-index:9999;
cursor:pointer}
.box i {font-size:4em}
.box h2 {text-align:center; font-size:1.3em;
font-family:Oswald; font-weight:300}

#llogin {}

#llogin li {float:right}

#linkspie ul {list-style:none; padding:0 0 0 30; margin:0 0 0 0; border-left:1px solid #ccc}

#linkspie ul li a {color:#000; font-family:Oswald; font-weight:300}

footer img {margin:0 auto; display:block; margin-top:100px}

#linkspie {padding-top:30px; margin-bottom:40px}

h2 {font-family:Oswald; font-weight:300; font-size:1.2em}
h1 {font-family:Oswald; font-weight:400; font-size:2em}
.cuerpo {width:80%; margin-left:15%; margin-top:20px}

.cuerpo > p {font-family:"Slabo 27px"; font-size:1.3em; text-indent:30px;}
.cuerpo > p:first-line {font-weight:normal;}
.misarchivos li, figcaption {font-family:"Slabo 27px"; font-size:1.2em}

figcaption {font-size:1.2em; padding:0; border-bottom:1px solid #ccc; margin:0;}

.misarchivos {list-style:none; margin:0; padding:0; font-size:.9em}
.misarchivos li {padding:5px 0}

.renglon h2 {margin:0; padding:0}
.renglon h1 {margin:15px; padding:0}
.renglon h1 a {font-size:.7em; color:#666}

.tit {font-weight:300}
.renglon {width:30%; float:left; margin-right:10px; transition:.2s all;transform:scale(1.0); padding:5px;
width:100%; margin:0 0 5px;}
.renglon:hover {transform:scale(1.00); background:#fff; margin-left:10px; color:#000}
.renglon h2 {display:none}
.renglon:hover h1 a {color:#000}

.subtitulo {font-family:Oswald;
font-size:1.2em;}

.parent-container .thumbnail {display:none}
.parent-container .thumbnail:first-child {display:block}
figcaption {padding:20px; border:0}



/* DIRECTIVOS */

.dnombre {margin:0; color:#df7132; 
text-transform:uppercase;
font-size:1.3em; line-height:1.3em;
font-family:Oswald;
font-weight:300;
margin-bottom:10px;
}
.dprofesion {margin:0; font-weight:300}
.dcargo {margin:0; font-family:Oswald; font-weight:300}
.cargos {height:100px; border-bottom:1px solid #ccc; 
margin-bottom:30px; font-family:Oswald;
font-weight:400;
}

.fotito {width:100px; height:100px;
background:#fff;
}

.slider {height:525px}
#llogin {padding:0 0 20px 0}
#toptop {position:absolute; z-index:9999; width:100%; margin:0 auto;}

.notibox {position:absolute; 
top:320px; left:7%; 
z-index:9; 
width:700px; height:230px; 
background: url(../img/transpa-blanco.png); 
padding:10px 20px; 
border-radius:6px}

.notibox h3 {font-family:'Oswald'; font-weight:300}
.notibox h3 a {transition:.5s all; color:#000}
.notibox h3 a:hover {color:#FF9900;text-decoration:none}

#imgfooter {width:437px; display:block; margin:0 auto}
#imgfooter img {}

.linkdelfooter {height:auto; margin-bottom:00px; display:inline-block; width:100%}
#linkspie {height:auto; margin-bottom:0}
#credito {background:#373737; text-align:center; padding:0px 0}
footer {margin-top:30px}
.lkdestacado {font-weight:400; font-size:1.4em; padding:20px 0}
.linkdelfooter ul li {padding:5px 0 0px}

.intro {margin-top:0}
.slider {height:570px; margin:0}

.notibox {overflow:hidden}

#llogin {left:80%; top:500px; list-style:none; position:absolute; margin:0; padding:20px; background:#ff9900; border-radius:5px; border:1px solid #fff; box-shadow:0 0 6px }
#llogin li {display:block; clear:both; text-align:center; width:100%}
#llogin li a {padding:20px; color:#fff; text-transform:uppercase}

.slider {margin-bottom:20px}

.boxsocios {width:18%; float:left; height:340px; margin:6px}
.boxsocios {transition:.2s all; transform:scale(1); text-align:center}
.boxsocios:hover {transform:scale(1.1)}
.boxsocios p {font-family:Oswald; font-weight:300}

.iso {left:10%; top:8%}
#mizq {float:right}
#mizq li a {padding:20px 50px;}
#mizq > li {margin-top:18px}

#direccion {width:100%; text-align:center;margin-top:30px}

#mizq li ul li {padding-left:0; width:250px}
#mizq li ul {padding-left:0; width:250px}

.renglon {padding:5px}
.renglon h1 {margin:20px 0}
.renglon p:first-child {font-weight:bold}

.carnets {margin-bottom:30px; margin-right:10px}
.carnetsBox {float:left;width:45%}
.carnetsBox {height:140px}
.carnetsBox img {border:5px solid #ccc}
.carnetsBox img {height:100px}
.vinieta {width:18px; height:18px}

/* LLOGIN */
/* LLOGIN */
/* LLOGIN */

#llogin {height:auto; left:70%; border-radius:2px; border:0}
#llogin li {height:20px; width:280px}
#llogin li div label {color:#fff; font-weight:normal}
#llogin li div {background: url(../img/transpa-negro.png); margin-top:20px; padding:20px; border-radius:5px; box-shadow:0px 0px 5px #fd8107; display:none}
#llogin {z-index:99999}
#llogin {padding:5px 0; top:20px; left:75%}
#aalerta {color: #FFCC66; display:block; padding:10px;}
.menuSup {z-index:9999999999r}

.mellizos {width:50%; float:left}
.formcont input {margin:0px 0}
.formcont button {margin:10px 0; width:300px}
.formcont textarea {height:200px}

.notibox .media .media-left img {width:100%; height:210px}
.media-left {width:55%}
.media-left {width:10%} /**/
.media-right {width:45%}



/**************************************************/
@media (max-width:480px) {

#mizq {display:none !important; position:absolute; left:0;width:100%; top:75%; margin:0; padding:0}
#mizq li {display:block}
#mizq li a {display:block; margin:0}

.box {width:100%; height:140px; margin-bottom:2px}
.notibox {width:90%; margin:0}
.notibox .media img {display:none}
.notibox .media .media-left {width:200px; height:120px; display:none}
.notibox .media .media-left img {width:40%; height:210px}
.notibox .media-right {width:300px}
.notibox {height:200px}
#llogin {top:260; left:30px}
#imgfooter { width:80%}
.nuevaportada {height:220px;}
.notiPrincipal {height:50% !important; margin:20px; font-size:.7em}

.envoltorioSecundarias {margin:20px; padding:0}
.notiSecundarias {margin:0; padding:0}
.notiSecundarias ul {margin:0; padding:0; width:100% !important}
.notiSecundarias ul li {width:100% !important}
.titus2 {width:100%} 

#notiBloque {margin-top:0 !important; height:auto !important}
#slider2020 {height:810 !important}

.celdaNoti {height:auto !important; padding:20px !important; margin:0 !important}
.colNoti1 {height:auto !important;}
#itemContainer {height:auto !important}
.fotingui {height:220 !important; display:block !important}

.antetituloNP h4 {padding:0 !important; height:10px; width:100% !important}
.antetituloNP {padding:0 10px !important; margin:0}

}
/*************************************************/


@media (max-width:768px) {

#mizq {display:block}
.iso {margin: 80 25%; border:0 !important;}
.box {width:100%; height:140px; margin-bottom:2px}
.notibox {width:90%; margin:0}
.notibox .media .media-left {width:200px; height:120px; display:none}
.notibox .media .media-left img {width:40%; height:180px}
.notibox .media-right {width:300px}
.notibox {height:200px}
#llogin {top:260; left:30px}
#imgfooter { width:80%}

}


/* TWITTER Y VIDEO */

.twitterBox {background:#fff; 
width:300px; height:100px; height:520px; 
position:absolute; 
top:20%; left:69%; 
border-radius:5px;
padding:20px; 
box-shadow:3px 3px 3px #666}
#mizq li a {
  padding:20px 34px;
}
.img-thumbnail {padding:2em}
.descOferta {font-family:Arial; font-size:8px important!}


.slider {background:url(../img/slider2.jpg) !important; background-size:cover !important; background-position:100% 800px !important}



/**********************/

.celdaNoti {height:380px; margin:10px; border-right:1px solid #ccc}
.colNoti1 .col-md-4 {margin:0; padding:0}
.celdaNoti img {padding:10px}
.notiPrincipal {background:#ccc; height:100%}
.notiSecundarias {margin:0 !important; padding:0;}
.secus {background:#666; list-style:none; margin:0; padding:0em !important;width:95% !important}
.secus li {height:133px; margin:0; padding:0 !important; border-bottom:1px solid #ffff}
.notiPrincipal {position:relative}
.titus {bottom:0 !important; position:absolute; padding:2em}
.titus2 {padding:1em}

.titus {background: rgb(2,0,36);
background: linear-gradient(0deg, rgba(2,0,36,1) 0%, rgba(0,0,0,0.5) 0%, rgba(0,0,13,0.3533788515406162) 76%, rgba(0,0,13,0) 100%);
}
.titus a {color:#fff}
.titus a:hover {text-transform: none !important }
.antetituloNP {position:absolute; padding:0px 30px; 
	background:#ff9900; 
	border-bottom-right-radius:10px; 
	color:#fff}
.titus2 {background:#ff9900; height:132px}
.titus2 a {color:#fff}	
.titus2 a {font-size:15px}

.celdaNoti {height:380px; margin:10px; border-right:1px solid #ccc}
.anti {padding:10px 10px; border-bottom:1px solid #ccc}
.celdaNoti {padding:0 10px; border-bottom:3px solid}
.celdaNoti h4::first-line {font-size:1.1em !important}
.celdaNoti img {border:1px solid red}
.celdaNoti a {color:#000;}
.celdaNoti a:hover {text-decoration:none !important; color:#af4a00}
.paginador {text-align:center}
.celdaNoti {transition:.5s all}
.celdaNoti:hover {background:#ccc}


.celdaNoti h4 {font-size:16px !important; letter-spacing:.5px !important}
/*.celdaNoti h4::first-line {font-size:20px !important; letter-spacing:0px !important}*/
.celdaNoti {background:#f5f5f5}
#mizq li ul {width:280px}
#mizq li ul li {width:280px !important}
.celdaNoti a {font-weight:400 !important;
font-family:"Barlow Condensed"; font-size:20px; letter-spacing:-.2px}
.nuevaportada {width: 100%; height: 400px; margin-top: 160px}
.envoltorioSecundarias {padding: 0 !important}



@media (max-width:480px) {

.logo {font-size:22px; height:auto !important}
.menusup {position:relative}
.menusup .iso {width:100% !important;
height: 100px !important;margin:0 auto !important;position:absolute !important;
left:0; top:0 !important;} 
.menusup .iso img {width:80px; height:80%; margin:0 auto !important; display:block}
.iso a {display:block}

#mizq {display:block  !important; background:#bdbd78; position:relative; top:80px !important; padding:0; margin:0 10px}
#mizq li {width:100%; padding:0; border-bottom:1px solid; height:auto !important}
#mizq li a {padding:10px; margin:0; display:block !important; top:0; 
position:relative; height:auto !important; color:#000}
#mizq > li {margin-top: 0px;}
/*#mizq > li > ul {display:block !important; position:relative}*/

}

.box {width:14.0%}