/*CSS paras terrenosynaves.com*/
/*CSS paras terrenosynaves.com*/
/* 1. Declaración en el :root */
:root {
  --color-principal: #00226C;
  --color-secundario: #68A2B9;
  --color-fondo: #f4f4f4;
  --color-acento:#E74F3D;
  --color-link
    --fuente-titulos: 'Arial', sans-serif;
    --espaciado-base: 16px;
}
/**Genérico********************************/
/**Breadcrumbs**/
.breadcrumbs ul li:not(.activo) a{
  color:var(--color-acento);
  font-weight:bolder;
}
.breadcrumbs .activo a{
  color:#333!important;
  cursor:default;
  pointer-events:none;
}



#seccionInterna > h2 {
  text-decoration: underline;
}


/**Blog**/
#blog #articulosBlog{
  display:grid;
  grid-template-columns:1fr 1fr 1fr 1fr!important;
  column-gap:20px;
}

#blog #articulosBlog .articulo{
  background:white;
  border-radius: 6px;
  display:flex;
  flex-direction: column;
  overflow:hidden;
}
#blog #articulosBlog figure{
  width: 100%;
  height: 200px;
  margin: 0;padding: 0;
  overflow: hidden;
}
#blog #articulosBlog figure img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  margin:0;
}
#blog #articulosBlog figure .masInfo{
  position:absolute;
  bottom:10px;right:10px;
  z-index: 10000;
}
#blog #articulosBlog .contenido{
  padding:10px 20px 20px;
}
#blog #articulosBlog .contenido h3 a{
  color:var(--color-acento);
  font-weight:bolder;
  line-height:1.2em;
}
#blog #articulosBlog .contenido .fecha{
  display:none;
  
}
#blog #articulosBlog .contenido p{
  line-height:1.8em;
  height:calc(5 * 1.8em);
  overflow:hidden; 
  position:relative;
}
#blog #articulosBlog .contenido p:after{
 content: '. . .';
 background-color:white;
 position:absolute;
 bottom:0px;right:0;
 padding-left:.25em;
 width:50%;
 
}
#blog #articulosBlog .contenido .verMas{
  color:var(--color-acento);
}

/**Blog Post**/
.wrapArticulo{
  padding-bottom:40px;
}
.wrapArticulo p a{
  color:var(--color-acento);
  text-decoration:underline;
}
.wrapArticulo p a:hover{
  color:var(--color-primario);
}
.wrapArticulo h2{
  font-size:clamp(1.7rem,5.5vw, 3.5rem);
  text-transform: none;
  letter-spacing:0;
}
.wrapArticulo h3{
  font-size:clamp(1.5rem,5vw, 2.5rem);
  font-weight:bolder;
  margin:1.5em 0 1em;
  text-align:center;
}
.wrapArticulo h4{
  font-size:clamp(.5rem,4.5vw, 1.5rem);
  margin:1em 0 .5em
}
.wrapArticulo p,
.wrapArticulo li{
  font-size:1.1m;
  line-height:1.7em;
}
.wrapArticulo ul li{
  margin-left:1em;
  list-style: disc;
}



.imgBg{display:none;}
.wrapArticulo h2{
  margin-top:35px;
  line-height: 1.3em;  
}
.tabla-contenidos{
}
.tabla-contenidos > ul{
  background-color:var(--color-secundario);
  border-radius:10px;
  padding:20px 40px;
  margin:auto;
  max-width:500px;
}
.tabla-contenidos ul li{
  color:white;
  list-style: disc;
}
.tabla-contenidos ul ul{
  margin-left:1em;
}

/**Introducción**/
.wrapArticulo #introduccion{
  position:relative;
  display:flex;
  flex-direction: column;
 }
.wrapArticulo #introduccion img{
  max-width:50%;
  border-radius:15px;}
/*
.wrapArticulo #introduccion .texto-intro{
  position:absolute;bottom:20px;right:5%;
  background-color:rgba(255,255,255,1);
  padding:1em 2em;
  max-width:50%;
  border-radius:15px;box-shadow:0 20px 20px -10px rgba(0,0,0,.3);
  margin-top:-200px;
  z-index:10000;
}*/
.wrapArticulo #introduccion .texto-intro{
  background-color:rgba(255,255,255,1);
  padding:1em 2em;
  max-width:60%;
  border-radius:15px;box-shadow:0 20px 20px -10px rgba(0,0,0,.3);
  margin-top:-200px;margin-left:40%;
}


/**Destacado**/
.wrapArticulo  .destacado{
  background-color:rgba(255,255,255,.5);
  padding:.5em 1em;margin-top:2em;
  border-radius:10px;
  text-align: center;
  font-size:1.2em;
  
}

@media all and (max-width: 1260px) {  
  .wrapArticulo #introduccion .texto-intro{
    margin-top:-200px;margin-left:30%;
    max-width:70%!important;
  }
}
/* Desktop */
@media all and (min-width: 981px) {
  /* Your CSS */
}

/* Tablet */
@media all and (min-width: 768px) and (max-width: 980px) {
  .wrapArticulo #introduccion img{
    max-width:60%;
  }
  .wrapArticulo #introduccion .texto-intro{
    margin-top:-100px;margin-left:30%;
    max-width:70%!important;
  }
}

/* Mobile */
@media all and (max-width: 767px) {
  .wrapArticulo #introduccion img{
      max-width:80%!important;
   }
  .wrapArticulo #introduccion .texto-intro{
    margin-top:-30px;margin-left:10%;
    max-width:80%!important;
  }
}
/* Mobile */
@media all and (max-width: 460px) {
   .wrapArticulo #introduccion img{
      max-width:100%!important;
   }
  .wrapArticulo #introduccion .texto-intro{
    margin-top:-30px;margin-left:5%;
    max-width:80%!important;
  }
}