@import url('https://fonts.googleapis.com/css?family=Roboto');
@import url('https://fonts.googleapis.com/css?family=Montserrat');

body {background: url("graficos/fondo_ciudad_degrade_3.png"); background-repeat: repeat-x}



.container {background: #fff; }
.container-fluid { }
a {text-decoration: none; color: black;}
a:hover {text-decoration: none; }
a:active {text-decoration: none; }
a:visited {text-decoration: none; }

.marca {font-size: 200%; position: relative; left: 20px; color: #48503c;  font-weight: bolder;}
.lema {font-size: 40%;}
.contenedor-logo {width: 60px; height: 60px; border-radius: 5px; border: 5px solid silver; margin-top: 0px; float: left; z-index: 100; }
.contenedor-logo img {width: 100%; height: auto;}
.eltiempo {display: none;}



.logo-mobile {width: 70px; height: 70px; border-radius: 5px; border: 5px solid silver; margin-left: -10px; margin-top: 0px; float: left; z-index: 100;}
.logo-mobile img {width: 100%; height: auto;}


.icon-facebook2{color: #3b5999; font-size: 120%; float: left; display: inline;}
.icon-instagram {color: #e4405f; font-size: 120%;  float: left; display: inline;}
.icon-twitter {color: #55acee; font-size: 120%;  float: left; display: inline;}

#sb_instagram {overflow: auto;}
#instagram-feed-widget-2 {height: 100%}
.sb_instagram_header {display: flex; justify-content: space-between; align-items: center; position: sticky; top: 0; z-index: 1000; background: #8EA1AB; }
.sbi_hicon {font-size: 35px}

.textwidget p {margin: 0px padding: 0px; display: none;}
.contenedor-publicidad .widgettitle {display: none;}
.contenedor-publicidad li {display: block;}



/*---------- CABECERA  ----------------*/



.marca-cabecera {width: 100%; height: 80px; margin-top: 20px; display: flex; flex-wrap: wrap;  overflow: hidden;}
.marca-cabecera h3 {font-size: 200%; color: #48503c;  font-weight: bolder; text-align: center; margin: 0px; padding: 0px;}
.marca-cabecera h3.lema {font-size: 70%; color: #48503c;  font-weight: bolder; text-align: center; margin: 0px; padding-top: 0px;}

.marca-cabecera {display: none;}
.navbar {margin-top: 10px; border: none; background: transparent;}

.marca-mobile {margin-left: 10px;}

h3 {font-size: 200%; color: #48503c;  font-weight: bolder; text-align: left; margin: 0px; padding: 0px;}
span.lema {font-size: 90%; color: #48503c;  font-weight: bolder; text-align: left; margin: 0px; padding-top: 0px; float: left;}

8
.caja1-marca-cabecera {width: 80px;}
.caja2-marca-cabecera {width: 230px; overflow: hidden;}
.caja3-marca-cabecera {width: 0px; position: relative; top: 25px; left: 30px; display: none; }




/*----- BLOQUE 1 ------------ */






.bloque-uno {display: flex; flex-wrap: wrap; }
.noticias-bloque-uno article { width: 100%; background: #DDDAD0;  max-height: 400px; overflow: hidden; margin-bottom: 20px; border-radius: 5px;}
.noticias-bloque-uno article h1 {font-size: 200%; width: 100%; margin: 0px; padding: 5px; text-transform: uppercase; font-family: Roboto;}
.noticias-bloque-uno article .contenedor-foto {width: 100%; height: 240px; overflow: hidden; background: #424242;}
.noticias-bloque-uno article .contenedor-foto img {width: 100%; height: auto;}
.noticias-bloque-uno article .bajada {display: none;}
.lateral-bloque-uno {display: none; margin-bottom: 20px;}



.noticias-bloque-uno article:first-child .contenedor-foto {width: 100%; height: 450px; overflow: hidden;}
.noticias-bloque-uno article:first-child .bajada {display: block; width: 100%; height: 500px; background: #DDDAD0; position: relative; top: -450px; opacity: 0;}
.noticias-bloque-uno article:first-child .bajada p {padding: 15px; font-size: 140%;}
.noticias-bloque-uno article:first-child .bajada:hover  {color: black; -webkit-animation: fadeIn .3s ease-in 1 forwards; animation: fadeIn .3s ease-in 1 forwards; opacity: 0.5; }


.noticias-tira-tres {display: flex; flex-wrap: wrap;}
.noticias-tira-tres article {width: 100%; background: #DDDAD0; max-height: 400px; overflow: hidden; margin-bottom: 20px; border-radius: 5px;}
.noticias-tira-tres article h1 {width: 100%; margin: 0px; padding: 5px; font-size: 170%; text-transform: uppercase; font-family: Roboto;}
.noticias-tira-tres article .contenedor-foto {width: 100%; height: 200px;overflow: hidden; background: #424242;}
.noticias-tira-tres article .contenedor-foto img {width: 100%; height: auto;}
.noticias-tira-tres article .bajada {display: none;}
.noticias-tira-tres .publicidad {width: 100%; min-height: 250px; margin-bottom: 20px; background: #48503c; }


.categorias {display: flex; flex-wrap: wrap;}
.categorias article {width: 100%; background: #DDDAD0; max-height: 400px; overflow: hidden; margin-bottom: 20px; border-radius: 5px;}
.categorias article h1 {width: 100%; margin: 0px; padding: 5px; font-size: 170%; text-transform: uppercase; font-family: Roboto;}
.categorias article .contenedor-foto {width: 100%; height: 200px;overflow: hidden; background: #424242;}
.categorias article .contenedor-foto img {width: 100%; height: auto;}
.categorias article .bajada {display: none;}
.categorias .publicidad {width: 100%; min-height: 250px; margin-bottom: 20px; background: #48503c; }





.cuadro-widget { width: 97%; min-height: 225px; margin-bottom: 25px; padding-left: 2%;}
.contenedor-publicidad {width: auto; background: gray;  min-height: 225px; overflow: hidden;}
.contenedor-publicidad img {width: 100%; height: auto;}


.foto-de-la-semana {padding: 30px; background: #424242; margin-bottom: 30px;}

.foto-de-la-semana article {display: flex; flex-wrap: wrap;}

.foto-de-la-semana article .contenedor-foto {width: 100%; height: auto; overflow: hidden; }

.foto-de-la-semana article .contenedor-foto img {width: 100%; height: auto;}

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana { width: 100%; margin-left: 20px; }

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana h1 { font-size: 155%; background: white; padding: 3px; display: inline; line-height: 50px;}

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana h1.cintillo { font-size: 155%; color: white; background: #48503c;; display: inline; line-height: 50px; clear: both;}



.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana h1 { font-size: 155%; background: white; padding: 3px; display: inline; line-height: 50px;}

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana h1.cintillo { font-size: 155%; color: white; background: #48503c;; display: inline; line-height: 50px; clear: both;}


.titulo-categoria {width: 100%; display: block;}

/* ----------   MEDIA QUERIES PARA DISPOSITIVOS CHICOS  576 and up  ------------   */

@media (min-width: 576px) {

.marca {font-size: 200%; position: relative; left: 20px;}
.lema {font-size: 60%;}
.contenedor-logo {width: 60px; height: 60px; border-radius: 5px; border: 5px solid silver; margin-top: 0px; float: left; z-index: 100;}
.contenedor-logo img {width: 100%; height: auto;}

.noticias-bloque-uno article .contenedor-foto { height: 400px; }
.noticias-tira-tres article .contenedor-foto { height: 400px;}







/* ----------   MEDIA QUERIES PARA DISPOSITIVOS TABLETS 768 and up  ------------   */


@media (min-width: 768px) {

/*---------- CABECERA  ----------------*/


.marca-cabecera {width: 100%; height: 180px; margin-top: 20px; display: flex; flex-wrap: wrap;  overflow: hidden;}
.marca-cabecera h3 {font-size: 460%; color: #48503c;  font-weight: bolder; text-align: center; margin-top: 30px;}
.marca-cabecera h3.lema {font-size: 110%; color: #48503c;  font-weight: bolder; text-align: center; margin: 0px; padding-top: 0px;}


.logo-mobile {display: none;}
.marca-mobile {display: none;}

.navbar {margin-top: 10px; border: none; background: #fafafa; border: 1px solid #eeeeee;}


.caja1-marca-cabecera {width: 130px;}
.caja2-marca-cabecera {width: 370px; }
.caja3-marca-cabecera {width: 180px; position: relative; top: 25px; left: 30px; display: block;}


.navbar {float: left; margin-left: 0px;  }
.barra-de-navegacion {width: 720px;}
.marca {font-size: 300%; width: 70%;  float: left; margin-left: 30px; overflow: hidden; }
.lema {font-size: 50%;}
.contenedor-logo {width: 120px; height: 120px; border-radius: 5px; border: 5px solid silver; margin-top: 15px; float: left;}
.contenedor-logo img {width: 100%; height: auto;}
.noticias-tira-tres .publicidad {width: 100%; height: 250px; margin-bottom: 20px; background: silver; overflow: hidden;}
.cuadro-widget a {margin: 0px; padding: 0px;}
.cuadro-widget a img {margin: 0px; padding: 0px;}

}


/* ----------   MEDIA QUERIES PARA DISPOSITIVOS DE ESCRITORIO  min-width: 992  und up------------   */



@media (min-width: 992px) {


/*---------- CABECERA  ----------------*/


.marca-cabecera {width: 100%; height: 180px; margin-top: 20px; display: flex; flex-wrap: wrap;  overflow: hidden;}
.marca-cabecera h3 {font-size: 600%; color: #48503c;  font-weight: bolder; text-align: center; margin-top: 10px;}
.marca-cabecera h3.lema {font-size: 160%; color: #48503c;  font-weight: bolder; text-align: center; margin: 0px; padding-top: 0px;}


.caja1-marca-cabecera {width: 200px;}
.caja2-marca-cabecera {width: 500px; }
.caja3-marca-cabecera {width: 200px; position: relative; top: 25px; left: 30px; }

.navbar {float: left; margin-left: 0px;  }

.barra-de-navegacion {width: 930px;} 

.container-cabecera {margin-top: 15px;}


.marca { width: 50%; line-height: 10px; float: left; margin-bottom: 0px; padding-bottom: 0px; margin-left: 40px; overflow: hidden; }
.marca1 {font-size: 200%; line-height: 80px;}
.lema {font-size: 50%;line-height: 40px;}





.contenedor-logo {width: 140px; height: 140px; border-radius: 5px; border: 5px solid silver; margin-top: 15px; float: left;}
.contenedor-logo img {width: 100%; height: auto;}



.noticias-bloque-uno {width: 615px; margin-top: 15px;}
.noticias-bloque-uno article {max-height: 430px;}
.noticias-bloque-uno article:first-child { float: left; width: 353px; height: 380px;}
.noticias-bloque-uno article:first-child h1 {font-size: 250%;}
.noticias-bloque-uno article:first-child .contenedor-foto {width: 100%; height: 250px; overflow: hidden;}
.noticias-bloque-uno article:first-child .bajada {display: block; width: 100%; height: 500px; background: #DDDAD0; background: red; position: relative; top: 300px; opacity: 0;}
.noticias-bloque-uno article:first-child .bajada p {padding: 15px; font-size: 140%;}
.noticias-bloque-uno article:first-child .bajada:hover  {color: black; -webkit-animation: fadeIn .3s ease-in 1 forwards; animation: fadeIn .3s ease-in 1 forwards; opacity: 0.5; }


.noticias-bloque-uno article:nth-child(2) {width: 240px; height: 185px; float: left; margin-left: 22px;}
.noticias-bloque-uno article:nth-child(2) h1 {font-size: 140%;}
.noticias-bloque-uno article:nth-child(2) .bajada {display: block; width: 100%; height: 250px; background: #DDDAD0;; position: relative;top: -300px; opacity: 0;}
.noticias-bloque-uno article:nth-child(2) .bajada p {padding: 15px; font-size: 110%;}
.noticias-bloque-uno article:nth-child(2) .bajada:hover  {color: black; -webkit-animation: fadeIn .3s ease-in 1 forwards; animation: fadeIn .3s ease-in 1 forwards; opacity: 0.5; }
.noticias-bloque-uno article:nth-child(2) .contenedor-foto {width: 100%; height: 300px; overflow: hidden;}

.noticias-bloque-uno article:last-child {width: 240px; height: 175px; float: left; margin-left: 22px; }
.noticias-bloque-uno article:last-child h1 {font-size: 140%;}
.noticias-bloque-uno article:last-child .bajada {display: block; width: 100%; height: 250px; background: #DDDAD0;; position: relative;top: -300px; opacity: 0;}
.noticias-bloque-uno article:last-child .bajada p {padding: 15px; font-size: 110%;}
.noticias-bloque-uno article:last-child .bajada:hover  {color: black; -webkit-animation: fadeIn .3s ease-in 1 forwards; animation: fadeIn .3s ease-in 1 forwards; opacity: 0.5; }
.noticias-bloque-uno article:last-child .contenedor-foto {width: 100%; height: 300px; overflow: hidden;}


.lateral-bloque-uno {background-color: red; width: 300px; height: 380px; display: inline;  margin-bottom: 40px; float: left; margin-left: 23px; margin-top: 15px; }


.noticias-tira-tres article {width: 205px; height: 250px; border-left:  5px solid #48503c;}
.noticias-tira-tres article h1 {font-size: 140%; padding:  10px; min-height: 90px; }
.noticias-tira-tres article .bajada {display: block; width: 100%; height: 250px; background: #DDDAD0;; position: relative;top: -300px; opacity: 0;}
.noticias-tira-tres article .bajada p {padding: 15px; font-size: 110%;}
.noticias-tira-tres article .bajada:hover  {color: black; -webkit-animation: fadeIn .3s ease-in 1 forwards; animation: fadeIn .3s ease-in 1 forwards; opacity: 0.5; }
.noticias-tira-tres article .contenedor-foto {width: 100%; height: 300px; overflow: hidden;}


.categorias article {width: 33%; height: 250px; border-left:  5px solid #48503c;}
.categorias article h1 {font-size: 140%; padding:  10px;}
.categorias article .bajada {display: block; width: 100%; height: 250px; background: #DDDAD0;; position: relative;top: -300px; opacity: 0;}
.categorias article .bajada p {padding: 15px; font-size: 110%;}
.categorias article .bajada:hover  {color: black; -webkit-animation: fadeIn .3s ease-in 1 forwards; animation: fadeIn .3s ease-in 1 forwards; opacity: 0.5; }
.categorias article .contenedor-foto {width: 100%; height: 300px; overflow: hidden;}


.foto-de-la-semana {padding: 30px; background: #424242; margin-bottom: 30px;}

.foto-de-la-semana article {display: flex; flex-wrap: wrap;}

.foto-de-la-semana article .contenedor-foto {width: 70%; height: 400px; overflow: hidden; }

.foto-de-la-semana article .contenedor-foto img {width: 100%; height: auto;}

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana { width: 25%; margin-left: 20px; }

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana h1 { font-size: 180%; background: white; padding: 3px; display: inline; line-height: 50px;}

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana h1.cintillo { font-size: 140%; color: white; background: #48503c;; display: inline; line-height: 80px;}


.noticias-tira-tres .publicidad {width: 300px; margin-left: 25px; }

.eltiempo {position: relative; top: 18px; left: 30px; display: block;}

.cuadro-widget {width: 300px; height: 250px; margin-left: 20px; margin-bottom: 25px; padding-left: 0%;}
.contenedor-publicidad {background: silver; width: 300px; height: 250px;  overflow: hidden;}
.contenedor-publicidad img {width: 100%; height: auto;}



}




/* ----------   MEDIA QUERIES PARA DISPOSITIVOS DE ESCRITORIO GRANDES min-width: 1200 and up-----------   */


@media (min-width: 1200px) {



  /*---------- CABECERA  ----------------*/


.marca-cabecera {width: 100%; height: 180px; margin-top: 20px; display: flex; flex-wrap: wrap;  overflow: hidden;}
.marca-cabecera h3 {font-size: 600%; color: #48503c;  font-weight: bolder; text-align: center;}
.marca-cabecera h3.lema {font-size: 160%; color: #48503c;  font-weight: bolder; text-align: center; margin: 0px; padding-top: 0px;}




.caja1-marca-cabecera {width: 200px;}
.caja2-marca-cabecera {width: 690px; }
.caja3-marca-cabecera {width: 250px; position: relative; top: 25px; left: 30px; }

.barra-de-navegacion {width: 1130px;}


.noticias-bloque-uno {width: 1130px;}
.noticias-bloque-uno article {max-height: 550px; border-radius: 5px;}
.noticias-bloque-uno article:first-child { float: left; width: 655px; height: 550px;}
.noticias-bloque-uno article:first-child h1 {font-size: 250%;}
.noticias-bloque-uno article:first-child .contenedor-foto {width: 100%; height: 500px; overflow: hidden;}
.noticias-bloque-uno article:first-child .bajada {top: -450px; }

.noticias-bloque-uno article:nth-child(2) {width: 450px; height: 265px; float: left; margin-left: 24px;}
.noticias-bloque-uno article:nth-child(2) h1 {font-size: 150%;}

.noticias-bloque-uno article:last-child {width: 450px; height: 265px; float: left; margin-left: 24px; }
.noticias-bloque-uno article:last-child h1 {font-size: 140%;}


  

.noticias-bloque-uno article:first-child .contenedor-foto {width: 100%; height: 450px; overflow: hidden;}
.noticias-bloque-uno article:first-child .bajada {display: block; width: 100%; height: 500px; background: #DDDAD0; position: relative; top: -450px; opacity: 0;}
.noticias-bloque-uno article:first-child .bajada p {padding: 15px; font-size: 140%;}
.noticias-bloque-uno article:first-child .bajada:hover  {color: black; -webkit-animation: fadeIn .3s ease-in 1 forwards; animation: fadeIn .3s ease-in 1 forwards; opacity: 0.5; }




.lateral-bloque-uno {background-color: yellow; width: 0px; height: 450px; overflow: hidden; display: inline; margin-bottom: 40px; float: left; margin-left: 23px; }


.foto-de-la-semana {padding: 30px; background: #424242; margin-bottom: 30px;}

.foto-de-la-semana article {display: flex; flex-wrap: wrap;}

.foto-de-la-semana article .contenedor-foto {width: 70%; height: 400px; overflow: hidden; }

.foto-de-la-semana article .contenedor-foto img {width: 100%; height: auto;}

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana { width: 25%; margin-left: 20px; }



.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana h1 { background: white; padding: 3px; display: inline; line-height: 50px;}

.foto-de-la-semana article .contenedor-titulo-foto-de-la-semana h1.cintillo { font-size: 180%; color: white; background: #48503c;; display: inline; line-height: 80px;}



.noticias-tira-tres article {width: 272px; height: 250px; border-left:  8px solid #48503c;}
.noticias-tira-tres article h1 {font-size: 130%; padding:  10px;}
.noticias-tira-tres .publicidad {width: 300px; margin-left: 23px;}

.eltiempo {position: relative; top: 18px; left: 125px; display: block;}




}







/*Animaciones*/
    @-webkit-keyframes fadeIn {
      to {
        opacity: 0.9;
      }
    }

    @keyframes fadeIn {
      to {
        opacity: 0.9;
      }
    }
/*Fin Animaciones*/





/*  WIDGETS  */


li.widget {list-style: none;}
.widgettitle {display: none;}


/* Personalizacion de plugin de instagram para mobile */

@media (max-width: 500px) {

  #sb_instagram {
    width: 70%;
  } 


}