:root{
  --principal: #333;
  --primario: #a1344e;
  --secundario: #182d4e;
  --complementario:#108e71;
  --blanco:#fff;
  --fondo:#eee;
  --oswald: 'Oswald', sans-serif;
  --sans:'Source Sans Pro', sans-serif;
}
html {
  box-sizing: border-box;
  min-height: 100%;
}
*, *:before, *:after {
  box-sizing: inherit;
}

/*General */
body{    font-size: 16px;    font-family: var(--oswald);    width: 100%;}
.card-body{ padding: 0.5rem;}
.button {border: 1px solid var(--primario);    color: var(--primario);    background:#fff0;    padding: 15px 32px;    text-align: center;    text-decoration: none;    display: inline-block;    font-size: 16px;    margin: 4px 2px;    cursor: pointer;    transition: 0.5s all; }  
.button:hover{background:var(--primario);  }
a .button{ color: var(--primario);text-decoration: none;}
a .button:hover{ color: var(--blanco);}
p{font-size: 16px;}
/*--------- NAVBAR ----------*/ 
.nav-item:hover{ border-bottom: 2px solid var(--primario);}
.nav-link img{ width: 280px;}
@media (max-width: 768px){ .nav-link img{width: 200px;}}

/*Banner Video */
.banner {position: relative; width: 100%; min-height: 100vh; padding: 0 50px;display: flex;  justify-content: flex-start; align-items: center; background: rgba(0, 0, 0, 0.88);}
.banner video {position: absolute;  top: 0;left: 0;width: 100%;height: 100%;object-fit: cover;opacity: 0.1;pointer-events: none;}
.banner .textBox {  position: relative;  max-width: 550px;  z-index: 2;}
.banner .textBox h2 {color: var(--blanco);font-size: 2em;}
@media (max-width:360px){
.banner .textBox h2 {color: var(--blanco);font-size: 1.7em;}
}
.banner .videoBx{  position: relative;  background: var(--blanco);  width: 100%;  height: 310px;  z-index: 1;}
.banner .videoBx video{  opacity: 1;}
@media (max-width: 991px) {   
.banner {padding: 20px 15px;min-height: 50vh;}
.banner:before {display: none; }
.banner .textBox { max-width: 100%;}  
.banner .videoBx {width: 100%;height: 310px;margin: 40px 0 100px; }
}
.idiomas{ list-style:none;}
.idiomas li{padding: 5px 10px;transition: 0.3s all; }
.idiomas li:hover{padding: 5px 10px;background: var(--primario);}
.idiomas a{color: var(--blanco);text-decoration: none;transition: 0.3s all; }
.idiomas a:hover{color: var(--fondo);}
.idiomas p{margin: 0;}
.texto-inicio h1{color: rgba(25, 46, 79, 0.7);font-weight: 700;}

/*comunidad*/
.comunidad {border-left: 5px solid var(--primario);}
.comunidad h3{color: var(--principal); font-size: 3.5em;}
.comunidad p{color: var(--principal); font-size: 1.15em;}
.comunidad button{width: 200px;font-size: 2em;}

/*--------- RED DE DIARIOS ----------*/  
.red-site{ background-color: var(--fondo);}
@media (max-width: 768px){ .card{margin-top: 1rem; margin-bottom: 1rem;}}
.red-site .card-body{text-align: center;height: 14rem;display: grid;grid-template-rows: repeat(auto, 1fr, auto); }
.red-site .card-body:hover{animation-name: zoom;animation-duration: 1s;}
@keyframes zoom {
from {transform: scale(1.0);}
  to {transform: scale(1.1);}
}
@media (max-width: 768px){.red-site .card-body{height: 22rem;}}
.box8{overflow:hidden}
.box8,.box8 .icon li a{text-align:center}
.box8 .icon li,.box8 .title{display:inline-block}
.box8 .icon,.box8 .title{margin:0;position:absolute}
.box8{box-shadow:0 0 3px rgba(0,0,0,.3);position:relative}
.box8 img{width:100%;height:auto; filter: brightness(0.7);}
.box8 .box-content{width:100%;height:100%;background:rgba(235, 228, 228, 0.6);opacity:0;position:absolute;top:0;left:0;transform:perspective(400px) rotateX(-90deg);transform-origin:center top 0;transition:all .5s ease 0s}
.box8 .icon li a,.box8 .title{background:var(--primario);font-size:20px;color:#fff}
.box8:hover .box-content{opacity:1;transform:perspective(400px) rotateX(0)}
.box8 .title{padding:5px 7px;border-radius:5px;font-weight:600;bottom:20px;left:20px;transition:all .9s ease 0s; font-size: 1.9rem;}
.box8 .icon li a,.box9 .box-content,.box9 .icon li,.box9 img{transition:all .35s ease 0s}
.box8:hover .title{bottom:-40px}
.box8 .icon{list-style:none;padding:0;left:0;right:0}
.box8 .icon li a{display:block;width:40px;height:40px;line-height:40px;border-radius:50%;margin-right:7px}
.box8 .icon li a:hover{background:#fff;color:var(--secundario)}
@media only screen and (max-width:990px){.box8{margin-bottom:20px}  }
.somos-site{  background-image: linear-gradient(rgba(0,0,0,0.5), rgba(0,0,0,0.75)), url('../img/somos2.jpg');  background-position: center;  background-repeat: no-repeat;  background-size: cover;  position: relative;  color: #fff;}
.somos-site h1{font-family: 'Source Sans Pro', sans-serif;font-weight: 600; font-size: 3.8em;}
.somos-site p{font-family: 'Source Sans Pro', sans-serif;font-weight: 600; font-size: 1.15em;}
.somos-site p a{color: var(--blanco);}
.somos-site p a:hover{color: var(--primario);text-decoration: none;}


/*--------- QUIENES SOMOS Y GRUPOS ----------*/ 
/* ------------ CAROUSEL ------------- *//*--Contenedor Título y Controles---*/
/*--Contenedor principal y flecha */
.contenedor{width: 90%; margin: auto;}
.grupos-site {background: rgba(0, 0, 0, .3);}
.grupos-site .contenedor-principal p{text-align: center;color: var(--blanco);font-family: var(--oswald); font-size: 0.88em;}
.grupos-site .contenedor-principal .h6{font-family: var(--oswald);font-weight: 700;}
.grupos-site .contenedor-principal a:hover{text-decoration: none;}
.grupo p:hover{color: var(--primario);}
.grupos-site .contenedor-principal .grupo-pais{font-size: 1.2em; text-decoration: underline;}
.grupos-site .contenedor-principal .carousel {display: flex; flex-wrap: wrap; justify-content: space-between;}
@media only screen and (max-width:760px){.grupos-site .contenedor-principal .carousel {display: flex; flex-wrap: wrap; justify-content: space-between;}}
.grupos-site .contenedor-principal .carousel .card{background: rgba(0, 0, 0, .3);width: 12rem; margin: 5px;}
@media only screen and (max-width:760px){.grupos-site .contenedor-principal .carousel .card{width: 45%; margin: 5px;}}
.grupos-site .contenedor-principal .carousel .card img{filter: grayscale(100%);}
.grupos-site .contenedor-principal .carousel .card img:hover{filter: none;}


/*--------- EDITORIALES Y REVISTAS ----------*/ 
.revista-archivo-site{background-color: var(--fondo);}
.revista h4 a{color: var(--principal);text-decoration: none;}
.archivo h4 a{color: var(--principal);text-decoration: none;}
#myBtn {display: none;position: fixed;bottom: 20px;right: 30px;z-index: 99;font-size: 25px;border: none;    outline: none;background-color: #555;color: white;cursor: pointer;padding: 10px;border-radius: 4px;}
#myBtn:hover {background-color: var(--primario);}

/*----------------footer --------------------*/
.copyright {font-size: 14px; font-family: var(--oswald); padding-top: 10px; padding-bottom: 10px;}


/*Publicaciones*/
.portada-publicaciones{
  position: relative;
  width: 100%;
  height: 50vh;
  /*background: url(../img/portada-publicaciones.jpg) ;*/
  background: url(../img/imagenFT.png);
  background-size: cover;
  background-attachment: fixed;
  display: flex;
  justify-content: center;
  align-items: center;  
  filter: grayscale(70%);
}
.portada-publicaciones .content{
  text-align: center;
}
.portada-publicaciones .content h3{
  font-size: 5em;
  color: var(--blanco);
  font-weight: 600;
}
.logos-semanarios a{
  color: var(--principal);
  filter: grayscale(1);
}
.logos-semanarios a:hover{
  text-decoration:none; 
  filter: none;
}
@media (max-width: 768px){
  .portada-publicaciones{
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: inherit;
    height: 25vh;
  }  
  .portada-publicaciones .content h3{
    font-size: 2em;
  }
}
.logos-semanarios{
display: flex;
flex-wrap: nowrap;
justify-content: space-between;
align-items: center;
margin-bottom: 25px;
}
.logos-semanarios .texto a:hover{
color: var(--primario);
}
.logos-semanarios a img{
  filter: grayscale(90%);
}
.logos-semanarios a img:hover{
  filter: none;  
}
@media (max-width: 768px){
  .logos-semanarios{
    flex-wrap: wrap;
    justify-content: center;
  }
  .logos-semanarios a img{
    margin: 20px 0 20px 0;    
  }
}
.publicaciones-links{
  color: var(--principal);
}

.publicaciones-links p a{
color: var(--primario);
}
.publicaciones-links p a:hover{
  color: var(--complementario);
  text-decoration: none;
}
/*Comunidad */
.portada-comunidad{
  position: relative;
  width: 100%;
  height: 50vh;
  background: url(../img/imagenFT.png);
  background-size: cover;
  background-attachment: fixed;
  display: flex;
  justify-content: center;
  align-items: center;  
  filter: grayscale(70%);
}
.portada-comunidad .content{
  text-align: center;
}
.portada-comunidad .content h3{
  font-size: 5em;
  color: var(--blanco);
  font-weight: 600;
}
.portada-comunidad .content h2{
  font-size: 4em;
  color: var(--blanco);
  font-weight: 600;
}
@media (max-width: 768px){
  .portada-comunidad{
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment: inherit;
    height: 25vh;
  }  
  .portada-comunidad .content h3{
    font-size: 2em;
  }
  .portada-comunidad .content h2{
    font-size: 1.7em;
  }
}
.seccion-comunidad h3 {
  color: var(--principal);
  font-size: 5em;
}
.seccion-comunidad p{
  color: var(--primario);
  font-size: 1.5em;
}

.botones-comunidad{
  background: rgb(24,45,78);
  background: linear-gradient(162deg, rgba(24,45,78,1) 16%, rgba(2,0,36,1) 90%, rgba(28,53,92,1) 100%);  
}
.botones-comunidad h4 a{
  color: var(--blanco);
}
.botones-comunidad h4 a:hover{
  color: var(--primario);
  text-decoration: none;
}
@media (max-width: 768px){
  .seccion-comunidad h3 {
    color: var(--principal);
    font-size: 2.5em;
  }
  .seccion-comunidad p{
    color: var(--primario);
    font-size: 1.1em;
  }
  .botones-comunidad{
    border-radius: 0px;
  }
}