@charset "utf-8";
/* Css document */

@import url(http://fonts.googleapis.com/css?family=Roboto:500,400italic,300,700,400);

*{
    margin: 0;
    padding: 0;
}

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

body{
    background-color:#929292;
    margin: auto;
    margin-top: 0;
    margin: 0;
    padding: 0;
}

.contenedor2 {
             width: 960px;
             background-color:#FFF;
             margin: auto;
}

header {
       background-color: #FFF;
       width: 100%;
       height: 110px;
    }

.redsocial {
           float:right;
           width: 12%;
           height: 20px;
           margin: 94px 1% 10px 0%;
           
}

.facebook{
           widht: 23%;
           height: 20px;
           margin: 5px 1% 5px 3%;
           float:right;
}

.twitter{
           widht:24%;
           height: 20px;
           margin: 5px 1% 5px 3%;
           float:right;
}

.youtube {
           widht:24%;
           height: 20px;
           margin: 5px 1% 5px 3%;
           float:right;
}

.gmail {
        widht:24%;
           height: 20px;
           margin: 5px 1% 5px 3%;
           float:right;
}

.logo {
    padding-top: 20px;
    width: 21%;
    height: 97px;
    margin-left: 40%;
    float: left;
        
}

#navegador {
           display: flex;
           justify-content: center;
           width: 100%;               
}

.nav {
width: 100%;
    margin-top: 10px;
}

.celeste {
        background-color: #009FDA;
        width: 100%;
        height: 30px;
        padding-top: 10px;
}

#submenu_celeste li a{ 
     		 background-color: #009FDA;
             width: 100%;
             height: auto;
             padding: 2% 0 5% 5%;
             text-align: left;
}

#submenu_celeste li a:hover{ 
     		 background-color: #45b9e4;	 
}


.naranja {
         background-color: #E98300;
         width: 100%;
         height: 30px;
         padding-top: 10px;
}

#submenu_naranja li a{
         background-color: #E98300;
         width: 100%;
         height: auto;
         padding: 2% 0 5% 5%;
         text-align: left;
}

#submenu_naranja li a:hover{ 
     		 background-color: #e2a558;	 
}


.violeta {
         background-color: #522398;
         width: 100%;
         height: 30px;
         padding-top: 10px;
}

#submenu_violeta li a{
         background-color: #522398;
         width: 100%;
         height: auto;
         padding: 2% 0 5% 5%;
         text-align: left;
}

#submenu_violeta li a:hover{ 
     		 background-color: #8659ca;	 
}


.verde {
       background-color: #739600;
       width: 100%;
       height: 30px;
       padding-top: 10px;
}

#submenu_verde li a {
       background-color: #739600;
       width: 100%;
       height: auto;
       padding: 2% 0 5% 5%;
       text-align: left;
}

#submenu_verde li a:hover{ 
     		 background-color: #9eb64e;	 
}

.negro {
       background-color: #353735;
       width: 100%;
       height: 30px;
       padding-top: 10px;
}

#submenu_negro li a {
       background-color: #353735;
       width: 100%;
       height: auto;
       padding: 2% 0 5% 5%;
       text-align: left;
}

#submenu_negro li a:hover{ 
     		 background-color: #585c58;	 
}

.submenu{
	list-style:none;
    font-size: 10pt;
    width: 76%;
    
    
}

.submenu li{
    width: 100%;
}

.submenu li a{
	width: 100%;
	/*display:block;*/
   
}

ul{
	padding-left: 0;
   
}

ul,ol {
    list-style:none;
}

a {
    color: #fff;
    text-decoration: none;
    font-family: 'Roboto', sans-serif;
    font-variant:300;
    font-size: 13pt;
    
}

ul li a {
        padding:0px;
        display: inline-block;
}

ul li a:hover{
              color: #FFF;
              font-variant: 700;
              
}

.nav li ul li{
              width: 100%;
}

.nav li ul{
           width: 13.75em;   
}

nav > ul > li{
          float: left;
          text-align: center;
}

.nav li ul{
	display:none;
	position:absolute;
    z-index: 10;
    
}

.nav li {
width: 20%;
}

.nav li:hover > ul{
	display:block;
}

#slider {
         margin: auto;
         background-color: black;
         width: 98%;
         height: 200px;
         margin-top: 10px;
}

.centrados{
           margin-left: 1%;
           width: 77%;
           height: 370px;
    margin-top: 10px;
    float: left;
    margin-bottom: 10px;
}

.columna1 {
          float: left;
          margin-right: 1%;
          width: 49%;
    height: 370px;
}

.tele {
      
      width: 100%;
      height: 180px;
      float: left;
}

.antena {
         
         width: 100%;
         height: 180px;
         float: left;
         margin-top: 10px;
}

.columna2 {
          float: right;          
          width: 50%;
    height: 370px;
    
}

.destacado {
    background-color: #009FDA;        
    width: 100%;
    height: 180px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
            
}

.imagendestacado {
                
                width: 50%;
                height: 180px;
                float: left;
}

.textodestacado {
                 
                 width: 48%;
                 float: right;
                 padding-right: 1%; 
    padding-left: 1%;
    padding-bottom: 10px;
    padding-top: 10px;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.proyecto {
         margin-top: 10px;
         height: 180px;
         width: 100%;
         background-color:#739600;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.imagenproyecto {
                
                width: 50%;
                height: 180px;
                float: left;
}

.textoproyecto {
               width: 48%;
               height: 171px;
               float: right;
               padding-right: 1%; 
    padding-left: 1%;
    padding-bottom: 10px;
    padding-top: 10px;
}

.textohorario1{
     border-bottom: 1px solid #fff;
     padding-bottom: 10px;
}

.columna3 {        
          margin-left: 1%;
    margin-top: 10px;
    margin-right: 1%;
          padding: 1%;
          background-color: #353735;
          width: 18%;
          height: 352px;
          float: right;
    margin-bottom: 10px;
             
}

.imagenhorario {               
               width: 70%;
               height: 100px;
               margin: 5px 15% 10px 15%;
}

.textohorario {
              background-color:#353735;
              width: 90%;
              height: 230px;
              margin: 5%;
              border-bottom: 1px solid #fff;
              
}

.hr {
     color: #FFFFFF;
     border: 1px;
     float: left;
}

.videos {
        margin: 10px 1% 10px 1%;
        background-color: #522398;
        width: 98%;
        height: 200px;
        clear: both;
}

.titulo {
    padding-top: 1%;
    padding-left: 1%;
}

.videos1 {
         float: left;
         margin: 1%;
         width: 31%;
         height: 120px;
}

.cap1, .cap3, .cap5 {
         float: left;
         width: 48%;
         height: 120px;
         margin-right: 2%;
         
        
} 

.cap2, .cap4, .cap6 {
         float: left;
         width: 48%;
         height: 120px;
         margin-left: 2%;
         
}

.videos2 {
         float: left;
    margin: 1%;
    width: 31%;
         height: 120px;
}

.videos3 {
         float: left;
         margin: 1%;
         width: 31%;
         height: 120px;
}

.redsocial2 {
           float:right;
           width: 12%;
           height: 20px;
           margin-top: 10px;
           margin-right: 1%;
}

.mapadesitio {
    width: 80%;
    margin-top: 10px;
    margin-left: 5%;
    padding-bottom: 10px;
}

.noti {
  height: 100px;
  float: left;
  list-style-type: none;
  padding-right: 10px;
    margin-right: 10px;
}

ul.noti li a {
    color: #FFF;
    text-align: left;
    text-decoration: none;
    font-family: 'Roboto', sans-serif;
    line-height: 10pt;
    font-size:8pt;
    list-style-type: none;
    margin-right: 1%;
    width: 100%;
}

.noso {
  height: 100px;
  margin-left: 0%;
  float: left;
  padding-right: 10px;
    margin-right: 10px;
}

ul.noso li a {
    color: #FFF;
    text-align: left;
    text-decoration: none;
    font-family: 'Roboto', sans-serif;
    line-height: 10pt;
    font-size:8pt;
    list-style-type: none;
}

.prog {
  height: 100px;
  margin-right: 0%;
  margin-left: 0%;
  float: left;
  padding-right: 10px;
    margin-right: 10px;
}

ul.prog li a {
    color: #FFF;
    text-align: left;
    text-decoration: none;
    font-family: 'Roboto', sans-serif;
    line-height: 10pt;
    font-size:8pt;
    list-style-type: none;
}

.proy {
  height: 100px;
  margin-right: 0%;
  float: left;
  padding-right: 10px;
    margin-right: 10px;
}

ul.proy li a {
    color: #FFF;
    text-align: left;
    text-decoration: none;
    font-family: 'Roboto', sans-serif;
    line-height: 10pt;
    font-size:8pt;
    list-style-type: none;
}

.hora {
  height: 100px;
  float: left;
  
}

ul.hora li a {
    color: #FFF;
    text-align: left;
    text-decoration: none;
    font-family: 'Roboto', sans-serif;
    line-height: 10pt;
    font-size:8pt;
    list-style-type: none;    
}

ul.hora a {
    list-style-type: none;
    text-decoration: none;
    text-decoration-style: none;
}

footer {
        margin-top: 10px;
        padding: 10px 1% 10px 1%;
        background-color: black;
        list-style-type: none;
        clear: both;
        overflow: auto;   
}

footer p {
    display: block;
    float: left;
    text-align: center;
    margin-left: 30%;
    margin-top: 12px;
    font-family: 'Roboto', sans-serif;
    font-style: 400;
    line-height:10pt;
    font-size:8pt;
    color: #FFF;
    padding-top: 10px;

    
}

.legales {
    width: 40%;
    margin-left: 35%;
    clear: both;
    text-align: center;
    padding-top: 1%;
}

.legales ul li a {
    float: left;
    padding-right: 4%;
    
}

.legales ul li a h4:hover {
    color: darkgray;
}


h1 {
    font-family: 'Roboto', sans-serif;
    font-variant: 700;
    font-size:16pt;
    line-height: 18pt;
    color: #FFF;
    margin: 0px;
    padding: 0px;
}

h2 {
    margin: 0px;
    padding-bottom: 5px;
}

h3 {
    font-family: 'Roboto', sans-serif;
    font-variant: 700;
    font-size:14pt;
    line-height: 16pt;
    color: #FFF;
    margin: 0px;
    padding-bottom: 5px;
    
}

h4 {
    font-family: 'Roboto', sans-serif;
    font-variant: 300;
    font-size:12pt;
    line-height: 14pt;
    color: #FFF;
    margin: 0px;
    padding-bottom: 5px;    
}
 
h5 {
    font-family: 'Roboto', sans-serif;
    font-variant: 500;
    font-size: 10pt;
    line-height: 12pt;
    color: #FFF; 
    margin: 0px;
    padding-bottom: 5px;
    
}

h6 {
    font-family: 'Roboto', sans-serif;
    font-variant: 500;
    font-size: 8pt;
    line-height: 10pt;
    color: #FFF;
    margin: 0px;
    padding-bottom: 5px;
}

h6:hover{
         color: grey;
         
}

p {
    font-family: 'Roboto', sans-serif;
    font-variant: 400;
    line-height: 12pt;
    font-size:10pt;
    color: #FFF;
    margin: 0px;
    padding: 0px;
}
    
em {
    font-family: 'Roboto', sans-serif;
    font-style:300;
    font-size:9pt;
    line-height:11pt;
    color: #FFF;
    text-align: center;
    margin: 0px;
    padding: 0px;
    float: left;
    margin: 20px 20px 10px 20px;
}

.textohorario4 {
    display: none;
}

.mapadesitio2 {
    display: none;
}


/*******inicio Petitorio*******/


.encabezado_petitorio{

   width: 98%;
   margin: 10px 1% 10px 1%;      
}

.encabezado_petitorio img{
     width: 100%;
    height: 120px;
    background: black;
}


.petitorio {
       width: 98%;
       
       margin: 1%;
}



.petitorio1 {
    -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
          display: inline-block;
          width: 47.7%;    
          height: 610px;     
        margin: 1%;
         vertical-align: top;
          background-color: #ed9c00;          
           
}

.petitorio1 p,.petitorio1 h3,.petitorio1 h4{
    padding: 2%;

}



.p01, .p02, .p03, .p04, .p05, .p07,.p08 {
    width: 90%;
    margin-bottom: 10px;
    height: 30px;
    background-color: rgba(234, 193, 139, 0.47);
    padding: 3%;
    margin: 0 auto;
}

.p06 {
    padding: 5px 2%;
    width: 23%;
    margin-bottom: 10px;
    height: 20px;
    background-color: #9eb64e;
}

.p07 {
    width: 90%;
    margin-bottom: 10px;
    height: 100px;
    background-color: rgba(234, 193, 139, 0.47);
}

.p08 {
    padding-top: 10px;
    padding: 5px 2%;
    width: 30%;
    margin-bottom: 10px;
    height: 25px;
    background-color: rgba(234, 193, 139, 0.47);
    
}
.p08 h4{
    text-align: center;
}

.p08:hover{
background: rgba(249, 184, 99, 1);
color: white;

-webkit-transition: background-color 500ms ease-out 0s;
    -moz-transition: background-color 500ms ease-out 0s;
    -o-transition: background-color 500ms ease-out 0s;
    transition: background-color 500ms ease-out 0s;
}


/*****fin petitorio*******/



/* ---------------------------------------lo que cambia en tablets horizontales */

@media screen and (max-width: 60em) {
    
    .contenedor2 {
    width: 720px;
    }
    .columna3 {
        width: 96%;
        height: 155px;
        margin-top: 0;
    }
    
    .imagenhorario {
    margin-left: 4%;
    margin-top: 2%;
        margin-right: 0%;
        }
    
    .imagenhorario, .textohorario1, .textohorario2, .textohorario3 {
        width: 21%;
        float: left;
    }

    .textohorario4 {
    display: block;
        width: 23%;
        float: left;
    }
    
    .textohorario1{
    width: 63%;
    float: left;
    padding-top: 1%;
    }
        
    .textohorario2, .textohorario3 {
    
    }
    
    .centrados {
    width: 98%;
    }
    
    .nav li ul{ 
               width: 10.3em;
    }
    
.textodestacado, .textoproyecto{
    height: 173px;
}

    .legales {
        width: 100%;
    }
}

/* ------------------------------------- lo que cambia en tablets verticales */

@media screen and (max-width: 40em) {
    
    .contenedor2 {
    width: 640px;
    }
    
    .columna3 {
        width: 96%;
        height: 155px;
        margin-top: 0;
    }
    
    .imagenhorario {
        margin-left: 4%;
        margin-top: 2%;
        margin-right: 0%;
        
    
    }
    
    .imagenhorario, .textohorario1, .textohorario2, .textohorario3 {
        width: 21%;
        float: left;
    }

    .textohorario4 {
    opacity: 1;
        width: 23%;
        float: left;
    }
    
    .textohorario1{
    width: 63%;
    float: left;
    padding-top: 1%;
    }
        
    .textohorario2, .textohorario3 {
    
    }
    
    .centrados {
    width: 98%;
    }
    
    .nav li ul{ 
               width: 9.15em;
    }
.textodestacado, .textoproyecto{
    height: 171px;
}

    .legales {
        width: 100%;
    }
}

/*--------------------------------------- lo que cambia en celulares */

@media screen and (max-width: 30em) {
    
.contenedor2 {
    width: 95%;
    }
    #slider{
        display: none;
    }
    
    .centrados{
        margin-top: 0;
    }
    
    .columna1{
        display: none;       
    }
    
    .columna2{
        width: 98%;
        margin-top: 10px;
        margin-right: 1%;
        margin-bottom: 10px;        
    }
    
    .columna3{
          width: 94%;
          margin-top: 10px;
          margin-right: 2%;
          margin-left: 2%;
          height: auto;
        padding-bottom: 10px;
        
        
    }
    
    .destacado{
        padding-bottom: 0px;
        width: 100%;
        margin-bottom: 10px;
    }
    
    .proyecto {
        padding-bottom: 0px;
        width: 100%;
        margin-bottom: 10px;
    }      
    
    .imagenhorario {
        width: 40%;
        margin: auto;
        padding: 2%;
        float: none;
    }
    
    .textohorario1 {
        width: 96%;
        float: none;
        padding: 0px 2% 0px 2%;
    }
        
.textohorario2 {
        width: 46%;
        float: left;
        padding: 0px 2% 0px 2%;
}
    
    .textohorario3 {
        width: 48%;
        float: right;
        padding: 0px 2% 0px 0%;
    }

    .textohorario4 {
    display: none;
    }
    
    .videos{
        background-color: #522398;
        width: 96%;
        margin-left: 2%;
        padding-bottom: 5px;
        height: auto;
        }
    
    .titulo {
    padding-top: 2%;
    padding-left: 2%;
}
    
    .videos3 {
        display: none;
    }
    
    .videos1, .videos2 {
        float: none;
        width: 96%;
        margin-left: 2%;
    }
    
    .videos1, .videos2 {
        margin-bottom: 10px;
    }
    
    .cap1, .cap3 {
         float: left;
         width: 49%;
         height: 120px;
         margin-right: 1%;
         background-color: black;        
} 

.cap2, .cap4 {
         float: left;
         width: 49%;
         height: 120px;
         margin-left: 1%;
         background-color: black;
}
    
.mapadesitio, footer p {
    display: none;
    }

.mapadesitio2 {
    width: 60%;
    float: left;
    display: block;
    margin-left: 2%;
}
    
.redsocial2 {
           float: right;
           width: 32%;
           height: 30px;
           margin-top: 0px;
           margin-left: 2%;
           margin-bottom: 0px;
           
    }
    
em {
        float: left;    
        margin-left: 2%;
        width: 96%;
        text-align: left;
        margin-top: 10px;
}
    
 footer {
    overflow: auto;
 }
    
#navegador{
        display: block;
    }

.nav {
    float: none;
    }
    
.celeste,.naranja,.violeta,.verde,.negro{
        width: 100%;
    }
    
nav ul li{
        float: none;
    }
    
.nav li{
        width: 100%;
        margin: 0;
    }
    
.submenu{
        width: 75%;
    }
    
.logo{
        float: left;
        width: 50%;
        margin-left: 0;
}

.nav li ul{ 
            width: 31.25em;
    }
    
.redsocial{
        width: 32%;
        height: 30px;
    }
        
    .legales {
        width: 100%;
        
    }
}
    
<!--Fin de sección index.html-->
<!--Comienzo de sección noticias.html-->

.nada{
    margin: 0px;
    padding: 0px;
}

.encabezado {    
    width: 98%;
    height: 120px;
    margin: 10px 1% 0px 1%;
    background-color: black;
}

.centradosnoti {
           margin: 10px 1% 10px 1%;
           width: 98%;
           height: 355px;
        background-color: #418997;
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;

}

.imagendia{
           width: 50%;
           height: 355px;
           float: left;
           
}

.textodia{ 
          width: 48%;
          height: 335px;
          float: right;
          padding: 10px 1%;
}

.subnoti {
    width: 98%;
    height: 560px;
    margin: auto;
}

.columna1subnoti {
    width: 49.5%;
    height: 560px;
    float: left;
    margin-right: 1%;
}

.subnoti1 {
    width: 100%;
    height: 180px;
    margin-bottom: 10px;
    
}

.imagensubnoti1 {
    width: 50%;
    height: 180px;
    float: left;
    
}

.textosubnoti1 {
      width: 46%;
      height: 160px;
      padding: 10px 2%;
      background-color: #076386;
      float: right;
      border-top-right-radius: 10px;
      border-bottom-right-radius: 10px;
}

.subnoti2 {
    width: 100%;
    height: 180px;
    margin-bottom: 10px;
    
}

.imagensubnoti2 {
      width: 50%;
      height: 180px;
      float: left;
      
}

.textosubnoti2 {
    width: 46%;
    height: 160px;
      padding: 10px 2%;
    background-color: #076386;
    float: left;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.subnoti3 {
    width: 100%;
    height: 180px;
    
}

.imagensubnoti3 {
    width: 50%;
    height: 180px;
    float: left;
    
}

.textosubnoti3 {
      width: 46%;
      height: 160px;
      padding: 10px 2%;
      background-color: #076386;
      float: left;
      border-top-right-radius: 10px;
      border-bottom-right-radius: 10px;
}

.columna2subnoti {
    width: 49.5%;
    height: 560px;
    float: right;
}

.subnoti4 {
    width: 100%;
    height: 180px;
    margin-bottom: 10px;
    
}

.textosubnoti4 {
   text-align: right;
    width: 46%;
      height: 160px;
      padding: 10px 2%;
    background-color: #076386;
    float: left;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.imagensubnoti4 {
    width: 50%;
    height: 180px;
    float: right;
    
}

.subnoti5 {
    width: 100%;
    height: 180px;
    margin-bottom: 10px;
    
}

.textosubnoti5 {
    text-align: right;
    width: 46%;
      height: 160px;
      padding: 10px 2%;
    background-color: #076386;
    float: left;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.imagensubnoti5 {
    width: 50%;
    height: 180px;
    float: left;
    
}

.subnoti6 {
    width: 100%;
    height: 180px;
    
}

.textosubnoti6 {
   
    text-align: right;
    width: 46%;
      height: 160px;
      padding: 10px 2%;
    background-color: #076386;
    float: left;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.imagensubnoti6 {
    width: 50%;
    height: 180px;
    float: left;
    
}

<!--Fin de sección noticias.html-->

<!--Comienzo de sección destacadas.html-->

.nada {}

.fila1 {
       width: 98%;
       height: 120px;
       margin: 10px 1% 10px 1%;
}

.subfila1 {
          width: 49.5%;
          height: 120px;
          float: left;
          margin-right: 1%;
          background-color: #45b9e4;
          border-top-right-radius: 10px;
          border-bottom-right-radius: 10px;
}

.imagensubfila1 {
           width: 50%;
           height: 120px;
           background-color: black;
           float: left;
}

.textosubfila1 {
           width: 48%;
           height: 100px;
           float: right;
           padding: 10px 1%;
    
}

.subfila2 {
          width: 49.5%;
          height: 120px;
          float: left;
          background-color: #45b9e4;
          border-top-right-radius: 10px;
          border-bottom-right-radius: 10px;
}

.imagensubfila2{
           width: 50%;
           height: 120px;
           background-color: black;
           float: left;
}

.textosubfila2{
           width: 48%;
           height: 100px;
           float: right;
           padding: 10px 1%;
}

.centradosdest{
          width: 98%;
          height: 370px;
          margin: 10px 1% 0px 1%;
}

.columna1dest{
          width: 39%;
          height: 370px;
          float: left;
          margin-right: 1%;            
}

.dest1{
          width: 100%;
          height: 180px;
          margin-bottom: 10px;
           
}

.imagen1dest{
          width: 50%;
          height: 180px;
          background-color: black;
          float: left;
}

.texto1dest{
          width: 46%;
          height: 160px;
          background-color: #418997;
          float: right;
          padding: 10px 2%;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.dest2{
          width: 100%;
          height: 180px;
}

.imagen2dest{
          width: 50%;
          height: 180px;
          background-color: black;
          float: left;
}

.texto2dest{
          width: 46%;
          height: 160px;
          background-color: #418997;
          float: right;
          padding: 10px 2%;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}


.columna2dest{
          width: 60%;
          height: 370px;
          background-color: #0076bd;
          float: right;
}

.imagen3dest{
         width: 96%;
    height: 180px;
         background-color: black;
         margin: 10px 2%;
}

.texto3dest{
         width: 96%;
         height: 80px;
         margin: 10px 2%;
}

.fila2{
         width: 98%;
         float: right;
         margin: 1%;
}

.subfila3{
         width: 32.6%;
         height: 210px;
         float: left;
         margin-right: 1%;
}

.imagensubfila3{
          width: 100%;
          height: 120px;
          background-color: black;
}

.textosubfila3{
          width: 96%;
          height: 50px;
          padding: 10px 2%;
          
}

.subfila4{
         width: 32.6%;
         height: 210px;
         float: left;
         margin-right: 1%;
}

.imagensubfila4{
          width: 100%;
          height: 120px;
          background-color: black;
          
}

.textosubfila4{
          width: 96%;
          height: 50px;
          padding: 10px 2%;          
}

.textosubfila3 p, .textosubfila4 p, .textosubfila5 p, .textosubfila3 h3, .textosubfila4 h3, .textosubfila5 h3 {
    color: #076386;
}

.subfila5{
         width: 32.6%;
         height: 210px;
         
         float: right;
}

.imagensubfila5{
          width: 100%;
          height: 120px;
          background-color: black;
}

.textosubfila5{
          width: 96%;
          height: 50px;
          padding: 10px 2%;
}

<!--Fin de sección destacadas.html-->
<!--Inicio de sección historiadelcanal.html-->
.nada {}

.generalcanal {
    width: 98%;
    margin: 10px 1%;
}

.general {
    background-color: #e98300;
    width: 100%;
    height: 255px;
    margin: 10px 0% 10px 0%;
}

.tituvilo {
    height: 235px;
    width: 57%;
    margin: 10px 1% 0px 1%;
    padding: 10px 1% 0px 0%;
    float: left;
}



.imagenvilo{
      background-color: black;
      width: 39%;
      height: 235px;
      margin: 10px 1% 10px 0px;
      float: left;
}

.videovilo{
    width: 98%;
    height: auto;
    margin: 0px 1% 10px 1%;
}

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

.general2{
    background-color: #e98300;
    width: 98%;
    height: 200px;
    margin: 10px 1% 10px 1%;
}

.textovilo2 {
    width: 59%;
    height: 180px;
    margin: 10px 1% 10px 0%;
    float: right;
}



.imagenvilo2 {
      background-color: black;
      width: 38%;
      height: 180px;
      margin: 10px 1% 10px 1%;
      float: left;
}

<!--Fin de sección historiadelcanal.html-->
<!--Inicio de sección historiadelbarrio.html-->

.nada{}

.centradosnoti01 {
width: 98%;
    margin: 10px 1%;
    height: 380px;
}


.imagenhis {
           width: 100%;
           height: 185px;
           background-color: black;
}

.columna2his {    
    height: 185px;
    width: 100%;
    margin: 10px 0% 0px 0%;
}

.textohis { 
          width: 68%;
          height: 185px;
          padding: 0px 1%;
    float: right;
}

.textohis h1, .textohis p {
    color: #8e5200;
}



.imagentiempo01{
    width: 30%;
    height: 185px;
    background-color: black;
    float: left;
}


<!--Fin de sección historiadelbarrio.html-->
<!--Comienzo de sección integrantes.html-->

.nada {}

.centrados_box{
    width: 98%;
    padding: 15px 0%;
    overflow: auto;
    margin-top: 10px;
    margin-left: 1%;
    border-radius: 10px;
    background-color: #c9601b;
}

.box {
    width: 16%;    
    float: left;
    margin: 10px 2%;
 }

.box img {
    background-color: black;
    height: 150px;
    margin-bottom: 10px;    
}

.box img:hover,
.box img:focus,
.box img:active {
    transform: scale(0.9);
}
<!--Fin de sección integrantes.html-->

<!--Comienzo de sección conocimiento.html-->
.nada{}

.conocimiento {
       width: 98%;
       height: 735px;
       margin: 1%;
}

.conocimiento1 {
          width: 49.5%;
          height: 735px;
          background-color: #522398;
          float: left;
          margin-right: 1%;          
}

.titulocono1 {
         width: 96%;
    height: 30px;
    padding-top: 5px;
         text-align: center;
         margin: 10px 2%;
         background-color: #8659ca;
}

.imagencono1 {
      width: 96%;
      height:400px;
      margin: auto;
}

.textocono1 {
      width: 96%;
      height: 264px;
      padding: 10px 1%;
      text-align:left; 
    margin: auto;
}

.conocimiento2 {         
          width: 49.5%;
          height: 735px;
          background-color:#522398;
          float: right;
          
}

.titulocono2 {
         width: 96%;
    height: 30px;
    padding-top: 5px;
         text-align: center;
         margin: 10px 2%;
         background-color: #8659ca;
}

.imagencono2 {
      width: 96%;
      height: 400px;
      margin: auto;
}

.textocono2 {
      width: 96%;
      height: 254px;
      padding: 10px 1%;
    margin: auto;
      text-align: left;
}
         
<!--Fin de sección conocimiento.html-->




/******inicio de ciencia y tecno*******/


.encabezado_ciencia img,.videociencia,.general_ciencia,.texto_ciencia{ 
    -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}


.encabezado_ciencia{

   width: 98%;
   margin: 10px 1% 10px 1%;      
}

.encabezado_ciencia img{
     width: 100%;
    height: 120px;
    background: black;
}


.videociencia {
    width: 98%;
    margin: 10px 1%;
}

.general_ciencia{
    background-color: #363b8f;
    border: 1px solid #666;
    width: 98%;    
    margin: 10px 1% 10px 1%;

}


.texto_ciencia{
    margin: 10px 2%;     
    width: 75%;
    padding: 10px 2%;
   
}



/******fin de ciencia y tecno*******/



<!--Comienzo de sección arte.html-->
.nada{}

.arte {       
    height: 405px;
    width: 98%;
    margin: auto;
    margin-top: 10px;
}

.arte1 {
          width: 32.6%;
          background-color: #722784;
          float: left;
          margin-right: 1%;
          overflow: auto;
          margin-bottom: 10px;
}

.tituloarte1{
         width: 96%;
         height: 30px;
         padding-top: 5px;
         text-align: center;
         margin: 10px 2%;
         background-color: #8659ca;
}

.imagenarte1{
      width: 96%;
      height: 210px;
      margin: auto;
}

.textoarte1{
      width: 94%;
      margin: 2% 0px 2% 10px;
      text-align: left;
      padding-top: 25px 0% 10px;
      overflow: auto;
      
}
      
.arte2 {
          width: 32.6%;
          background-color: #722784;
          float: left;
          margin-right: 1%;
          overflow: auto;
}

.tituloarte2{
          width: 96%;
          height: 30px;
          padding-top: 5px;
          text-align: center;
          margin: 10px 2%;
          background-color: #8659ca;
}

.textoarte2{
        width: 94%;
        margin: 2%;
        text-align: left;
        overflow: auto;
        padding-top: 25px 0% 10px;      
}

.imagenarte2{
      width: 96%;
      height: 210px;
      margin: auto;
}

.arte3 {
          width: 32.6%;
          background-color:#722784;
          float: left;
          overflow: auto;
          
}

.tituloarte3{
         width: 96%;
  padding-top: 5px;
  text-align: center;
  margin: 10px 2%;
  background-color: #8659ca;
  height: 30px;
}

.textoarte3{
      width: 94%;
      margin: 2%;
      text-align: left;
      overflow: auto;
      padding-top: 25px 0% 10px;
}

.imagenarte3{
      width: 96%;
      height: 210px;
      margin: auto;
}

<!--Fin de sección arte.html-->

<!--Inicio de sección ultimosproyectos.html-->

.nada{}

.centradosult {
           margin: 10px 1% 0px 1%;
           width: 98%;
           height: 180px;
}

.columnault1 {
    height: 180px;
    width: 50%;
    float: left;
}

.columnault {
           width: 50%;
           height: 180px;
    background-color: #739600;
    float: left;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;

}

.tituloult {
    width: 98%;
    padding:10px 3%;
}

.centradosvideos {
        margin: 1%;
        width: 98%;
        height: 440px;
}

.videosult1 {
        margin-bottom: 10px;
        background-color: #9eb21a;
        width: 100%;
        height: 140px;
}

.videosult2 {
    margin-bottom: 10px;
        background-color: #438934;
        width: 100%;
        height: 140px;
}

.videosult3 {
            background-color: #9eb64e;
        width: 100%;
        height: 140px;
}

.videos1ult {
    float: left;
         margin: 10px 1%;
         width: 31%;
}

.videos2ult {
    float: left;
          margin: 10px 1%;
         width: 31%;
}

.videos3ult {
    float: left;
          margin: 10px 1%;
         width: 31%;
}

.textoult1 {
        float: left;
         width: 48%;
         height: 65px;
         text-align: center;
         margin-right: 2%;
         padding-top: 55px;
}

.cap3ult, .cap5ult {
         float: left;
         width: 48%;
         height: 120px;
         margin-right: 2%;
         background-color: black;
        
} 

.cap2ult, .cap4ult, .cap6ult {
         float: left;
         width: 48%;
         height: 120px;
         margin-left: 2%;
         background-color: black;

}

<!--Fin de sección ultimosproyectos.html-->
<!--Inicio de sección subituproyecto.html-->

.nada {}

.columna07 {
    width: 18%;
    margin: 10px 1%;
    background-color: black;
    height:  620px;
    float: left;
}

.columna05 {
    width: 50%;
    margin: 10px 0%;
    background-color: #445d18;
    float: left;
    height:  610px;
    padding-left: 10%;
    padding-top: 10px;
}

.columna06 {
    width: 18%;
    margin: 10px 1%;
    float:left; 
    background-color: black;
    height:  620px;
}

.columna05 p {
    margin-bottom: 20px;
    width: 80%;
}

.columna05 h3 {
    margin-bottom: 10px;
    width: 80%;
}

.renglon08 h4:hover {
    color:#445d18;
}

.renglon01, .renglon02, .renglon03, .renglon04, .renglon05 {
    width: 80%;
    margin-bottom: 10px;
    height: 30px;
    background-color: #9eb64e;
}

.renglon06 {
    padding: 5px 2%;
    width: 23%;
    margin-bottom: 10px;
    height: 20px;
    background-color: #9eb64e;
}

.renglon07 {
    width: 80%;
    margin-bottom: 10px;
    height: 100px;
    background-color: #9eb64e;
}

.renglon08 {
    padding-top: 10px;
    padding: 5px 2%;
    width: 10%;
    margin-bottom: 10px;
    height: 15px;
    background-color: #9eb64e;
    
}

<!--Fin de sección subituproyecto.html-->

<!--Inicio de sección contacto.html-->
.nada {}

.contacto {
    width: 98%;
    height: 370px;
    margin-top: 10px;
    margin-right: 1%;
    margin-left: 1%;
}

.columna04 {
    width: 31%;
    height: 370px;
    float: left;
}

.titulo04 {
width: 96%;   
    padding-top: 10px;
    text-align: right;
    padding-right: 5%;
    background-color: #028fc3;
}

.texto1 {
    width: 96%;
    height: 291px;
    padding-top: 30px;
    text-align: right;
    padding-right: 5%;
    background-color: #028fc3;
    
}

.texto1 h4 {
    color: #FFF;
}

.columna03 {
    width: 49%;
    height: 370px;
    margin-right: 1%;
    float:left; 
    background-color: #028fc3;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

.renglon0  {
    width: 90%;
    height: 20px;
    margin-bottom: 17px;
    margin-top: 70px;
    padding-top: 15px;
    border: 2px;
    border-style: solid;
    border-color: #FFFFFF;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: #FFFFFF;
    opacity: 0.6;
}

.renglon1  {
    width: 90%;
    height: 20px;
    margin-bottom: 17px;
    padding-top: 15px;
    border: 2px;
    border-style: solid;
    border-color: #FFF;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: #FFF;
    opacity: 0.6;
}

.renglon2 {
    width: 90%;
    height: 70px;
    padding-top: 15px;
    border: 2px;
    border-style: solid;
    border-color: #FFF;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
    background-color: #FFF;
    opacity: 0.6;
}

.enviar {
    margin-top: 10px;
    padding: 5px;
}

.enviar:hover {
background-color: skyblue;
    width: 12%;
    height: 20px;
    
}

.enlaces {
    width: 19%;
    height: 370px;
    float: right;
}

.tele2 {
    width: 100%;
    height: 180px;
    margin-bottom: 10px;
    background-color: black;
}

.antena2 {
    width: 100%;
    height: 180px;
    background-color: black;
}

<!--Fin de sección contacto.html-->

<!--Inicio de sección mapadesitio.html-->
.nada {}

.contacto02 {
    width: 98%;
    height: 825px;
    margin-top: 10px;
    margin-right: 1%;
    margin-left: 1%;
    padding-bottom: 10px;
    
}

.uno {
    width: 9%;
    height: 800px;
    padding: 2%;
    background-color: #009fda;
    float: left;
    text-align: center;
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    
}

.dos {
    width: 25%;
    height: 800px;
    padding: 2%;
    background-color: #739600;
    float: left;
}

.tres {
    width: 25%;
    height: 800px;
    padding: 2%;
    background-color: #e98300;
    float: left;
    
}

.cuatro{
    width: 25%;
    height: 804.5px;
    padding: 1.3% 2% 2% 2%;
    background-color: #522398;
    float: left;
    
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
}

 hr {
     margin-bottom: 5px;
 }

<!--Fin de sección mapadesitio.html-->
<!--Comienzo Horariosdeldía.html-->
.nada {}

.contienetodo {
width: 98%;
margin: auto;
height: auto;
    margin-bottom: 10px;
    margin-top: 10px;
}

.horariodia {
               width: 16%;
               height: auto;
    float: left;
               margin:0px; 
}
.fechadia1 {
          width: 98%;
		  padding: 5px 1%;
          height: 55px;
          background-color: #929292;
          border-radius: left;
		  border-bottom-right-radius: 10px;
          margin-bottom: 10px;
    text-align: center;
}

.fechadia1:hover {
    background-color: #1c1d1b;
}

.fechadia {
          width: 98%;
		  padding: 5px 1%;
          height: 55px;
          background-color: #353735;
          border-radius: left;
		  border-bottom-right-radius: 10px;
          margin-bottom: 10px;
    text-align: center;
}

.fechadia:hover {
    background-color: #1c1d1b;
}



.grilla {
	     width: 32%;
		 height: auto;
		 float: left;
		 margin-top: 0px;
    margin-left: 1%;
}

.pro {
      height: 45px;
	  width: 96%;
	  background-color: #585658;
	  padding: 10px 2%;	
      margin-bottom: 10px;
}

.grillatexto {
    float: right;
    width: 51%;
    height: auto;
    
}

.pro2 {
      height: 45px;
	  width: 96%;
	  background-color: #585658;
	  border-top-right-radius: 10px;
      border-bottom-right-radius: 10px;
	  padding: 10px 2%;	
      margin-bottom: 10px;
}


    


    
    
    
    










          























