:root {
   --verde: #03a456;
   --verde: #33814e;
   --verde: #28623E;
   --verdito: #a6ebc0;
}

body {
   margin: 0;
   padding: 0 0 3rem 0;
   background: #fff;
   font-family: 'IBM Plex Sans Condensed', system-ui, sans-serif;
   font-size: 1.1rem;
}

@media (min-width: 1025px) and (max-width: 1366px) {
   div.container {
      width: 1024px !important;
      max-width: 99%;
   }
}

article ul {
   font-size: 1.4rem;
   line-height: 1.5;
}

@media (min-width:834px) {

   div.container,
   header p {
      width: 1199px;
      margin: 0 auto;
   }

   .row {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      grid-gap: 1rem;
   }

   #semanali {
      grid-gap: 2rem;
   }

   div#ocho {
      height: 620px;
      margin-top: 2rem;
   }

   .col-12 {
      grid-column: span 12;
   }

   .col-11 {
      grid-column: span 11;
   }

   .col-9 {
      grid-column: span 9;
   }

   .col-8 {
      grid-column: span 8;
   }

   .col-7 {
      grid-column: span 7;
   }

   .col-6 {
      grid-column: span 6;
   }

   .col-5 {
      grid-column: span 5;
   }

   .col-4 {
      grid-column: span 4;
   }

   .col-3 {
      grid-column: span 3;
   }

   .col-2 {
      grid-column: span 2;
   }

   article p,
   article h4,
   article h3,
   article h2 {
      padding-left: 4rem;
      padding-right: 4rem;
   }

   article ul {
      padding: 0 6rem;
   }
}

a.busca {
   float: right;
   margin-right: 1rem;
   font-size: 1.5rem;
   text-decoration: none;
   padding: .5rem;
}

header {
   background: #00A456;
   padding-top: .5rem;
   padding-bottom: .5rem;
}

div#nota img {
   max-width: 100%;
   height: auto;
}

figure {
   margin: 0;
}

h1#cabeza {
   font-size: 3.1rem;
   font-size: calc(1.4rem + 1vw);
   transform: translate(0, 0);
   padding: 0;
   font-weight: 600;
   line-height: 2.5rem;
   letter-spacing: -1px;
   margin: 1rem 0 .5rem 0;
   font-family: "IBM Plex Serif", sans-serif;
}

h2#balazo {
   font-size: 1.5rem;
   font-weight: 500;
   line-height: 1.65rem;
   font-weight: 300;
   padding: 1rem 0;
}

@media (max-width:768px) {
   h2#balazo {
      padding: 0 1rem;
      font-size: 1.35rem;
   }
}

h2,
h3,
h4 {
   margin: .5rem 0;
   font-size: 1.77rem;
   font-family: "IBM Plex Serif", sans-serif;
}

h4 {
   font-size: 1.8rem;
}

article p {
   margin-bottom: 1em;
   font-size: 1.43rem;
   line-height: 1.6;
}

blockquote {
   font-size: 1.3em;
   border-left: .4rem solid var(--verde);
   padding-left: .5rem;
   font-style: oblique;
   margin-left: 4rem;
}

address {
   font-style: normal;
   background: #f0fff8;
   padding: .5rem 0;
}

ul#eltema {
   margin: 0;
   min-height: 280px;
}

ul#eltema li {
   min-height: 90px;
   font-size: 1.3rem;
   border-bottom: 1px solid #ddd;
}

ul#eltema li a {
   display: block;
}

ul#eltema figure {
   float: left;
   margin-right: 1rem;
   height: 90px;
   overflow: hidden;
}

.text-center {
   text-align: center;
}

.list-unstyled {
   list-style: none;
}

a.none {
   text-decoration: none;
   color: #000;
}

p.jade {
   font-weight: 500;
   border-bottom: 1px dotted var(--verde);
   text-transform: uppercase;
   padding-bottom: .5rem;

   border-bottom: 1px solid var(--verde);

   padding-bottom: .5rem;
   text-transform: uppercase;
   font-size: .85rem;
   flex-wrap: nowrap;
   overflow-x: unset;
   white-space: nowrap;
}

p.jade a {
   color: black;
   text-decoration: none;
   padding: 1rem;
}

p.jade a:first-child {
   font-size: 1.6rem;
   margin-right: 3rem;
   font-weight: bolder;
   text-decoration: underline;
}

@media (max-width:768px) {
   p.jade {
      overflow-y: hidden;
   }

   p.jade a {
      margin-right: .5rem;
   }

   p.jade a:first-child {
      margin-right: .5rem;
   }

   div#semanal {
      padding: 1rem;
   }
}

article cite {
   padding: 2rem;
   font-size: 1.55rem;
   display: block;
   color: #555;
   text-align: justify;
}

article cite:before {
   content: "❝";
   font-style: normal;
   font-size: 3rem;
   float: left;
   margin-right: 1rem;
   color: #ddd;
}

@media (max-width:768px) {
   article cite {
      padding: 1rem;
      font-size: 1.6rem;
      font-style: normal;
   }
}

ol#masvisto,
ol#masnuevo {
   list-style: none;
   margin: 0;
   padding: 0;
   counter-reset: unadevaqueros;
   font-size: 1.1rem;
   height: 820px;
}

ol#masvisto li,
ol#masnuevo li {
   counter-increment: unadevaqueros;
   min-height: 3rem;
   border-bottom: 1px dotted #ddd;
   padding-top: 1rem;
   padding-bottom: .5rem;
}

ol#masvisto li:before,
ol#masnuevo li:before {
   content: counter(unadevaqueros) " ";
   color: var(--verde);
   font-weight: 900;
   font-size: 3rem;
   width: 3.5rem;
   height: 3.5rem;
   float: left;
   text-align: center;
   position: relative;
   top: -.4rem;
   font-weight: 900;
   margin-right: .5rem;
}

ol#masvisto li a,
ol#masnuevo li a {
   color: black;
   font-size: 1.2rem;
   text-decoration: none;
}

div#recientes {
   height: 32rem;
}

div#recientes a {
   color: black;
   width: 45%;
   float: left;
   display: block;
   text-decoration: none;
   border-bottom: 1px solid #ddd;
   height: 7rem;
   padding: 2% 1.5%;
   overflow: hidden;
   position: relative;
   background: #fbfffc;
}

div#recientes a small {
   color: var(--verde);
}

p.h3 {
   font-size: 2rem;
   padding: 0;
   margin: 0 0 1rem 0;
}

.linea1 {
   padding: 0 1%;
   border-right: 1px dotted #ddd;
}

.selected {
   border-bottom: 5px solid var(--verde) !important;
   min-width: 15rem;
   display: inline-block;
}




/* Estilos para el contenedor de carga */
.cargando-texto {
   width: 300px;
   height: 20px;
   background-color: #e0e0e0;
   overflow: hidden;
   position: relative;
   border-radius: 4px;
}


/* Línea animada para simular el texto */
.linea {
   height: 100%;
   background: linear-gradient(90deg, rgba(240, 240, 240, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(240, 240, 240, 1) 100%);
   position: absolute;
   top: 0;
   left: -100%;
   width: 100%;
   animation: deslizar 1.5s infinite;
}

/* Animación de deslizamiento */
@keyframes deslizar {
   0% {
      left: -100%;
   }

   100% {
      left: 100%;
   }
}

/* Simulación de varias líneas */
.linea-medio {
   width: 80%;
}

.image,
article img {
   max-width: 100%;
   height: auto;
}

article footer {
   margin-top: 1.5rem;
   margin-bottom: 1.5rem;
}

article footer a {
   color: black;
   padding: 1rem 0;
}

.mr-3 {
   margin-right: 2rem;
}

@media (max-width:768px) {

   /*.busca { display:none; }*/
   header p {
      text-align: center;
      margin: 0;
   }

   h1#cabeza {
      padding: 0 1rem;
      line-height: 1.16;
      font-size: 1.8rem;
   }

   h2 {
      padding: 0 1rem;
      font-size: 1.7rem;
   }

   article address,
   article time,
   article p,
   article footer,
   article h3,
   article h4 {
      padding-left: 1rem;
      padding-right: 1rem;
   }

   aside .h3 {
      margin: 2rem 1rem 1rem 1rem;
   }

   iframe {
      width: 100%;
   }

   ul#eltema {
      height: 550px;
   }
}

article figure figcaption {
   margin-bottom: 1.5rem;
   background: #f7f7f7;
   padding: .5rem;
   text-transform: uppercase;
   font-size: .85rem;
}

hr {
   height: 1px;
   border: 1px solid #3aa800;
}

.lapbg {
   height: 17.5rem;
   text-align: center;
   overflow: hidden;
}

@media (max-width:728px) {
   .lapbg {
      height: 21.4375rem;
   }

   blockquote {
      margin-left: 1rem;
   }

   blockquote p {
      margin: 0;
   }
}

div#boss {
   height: 1.5rem;
   text-align: center;
}

div#boss a {
   background: #ffd;
}

.float-right {
   float: right;
}

.text-muted {
   color: #999;
}

.small {
   font-size: .85rem;
}

.info {
   background: #eeffef;
   padding: 1rem;
   font-size: 1rem;
   height: 5.3rem;
}

.smallcaps {
   text-transform: uppercase;
   font-size: .85rem;
}

.mt-1 {
   padding-top: 1rem;
}

article pre {
   white-space: pre-wrap;
}

.h20 {
   height: 13rem;
   overflow: hidden;
   margin-bottom: .5rem;
}

.h11 {
   height: 10rem;
   overflow: hidden;
   margin-bottom: .5rem;
}

.separa:before {
   content: "〉";
   display: inline-block;
   width: 1rem;
   height: 1rem;
   padding: 0 0 0 .5rem;
   color: #999;
}

.ventana {
   border: 0;
   margin: 0 auto;
   display: block;
}

@media (min-width:1024px) {
   .ventana {
      width: 80%;
      margin: 0 auto;
   }
}

.sopear {
   background: #f2fff4;
   padding: 2rem 1rem;
}

.sopear a {
   display: block;
   height: 82px;
   overflow: hidden;
}

.sopear img {
   margin-top: -66px;
   float: left;
   margin-right: 1rem;
}

div#areasoft {
   height: 37px;
   font-weight: bold;
}

p#topsoft {
   padding: 0;
   margin: 0 !important;
   font-size: 1rem;
}

p#topsoft a {
   display: inline-block;
   padding: .5rem;
   color: #28623E;
   text-decoration: none;
}

p#topsoft a:before {
   content: "〉";
   color: black;
}

.compartir {
   float: right;
}

.compartir a {
   display: inline-block;
   padding-right: 1rem;
}

p.alert {
   background: #edffee;
   padding-top: .5rem;
   padding-bottom: .5rem;
   font-weight: bold;
}

a.comenta {
   background: white url(/i/comentar.svg) no-repeat 5% center;
   background-size: 25px;
   padding: .75rem 1rem .75rem 2.5rem;
   font-size: .9rem;
   border: 1px solid var(--verdito);
   border-radius: .5rem;
   cursor: pointer;
}

/*pppppp*/
div#espacioA {
   height: 200px;
}

div#espacioC {
   height: 280px;
   margin-top: 1rem;
}

@media (min-width:834px) {
   div#espacioA {
      width: 100%;
      height: 200px;
      margin: 0 auto;
   }
}

div#seguir {
   background: #f7f7f7;
   padding: 1rem;
   margin: 2rem 0;
}

div#seguir h3 {
   font-size: 1.4rem;
}

div#seguir small {
   text-transform: uppercase;
   color: darkgreen;
}



.relacionada-placeholder {
   height: 5.5rem;
   border-bottom: 1px dotted var(--verde);
   border-top: 1px dotted var(--verde);
   margin-bottom: 1.5rem;
   padding-top: .5rem;
}

@media (max-width:768px) {
   .relacionada-placeholder {
      height: 5rem;
      margin: 1rem;
   }
}

.relacionada-placeholder .relacionada-link img {
   float: left;
   margin-right: 1rem;
}

.relacionada-placeholder .relacionada-link p {
   margin: 0;
   line-height: 1.3;
   font-size: 1.3rem;
   color: #333;
}

.relacionada-placeholder .relacionada-titulo::before {
   content: "🔗 ";
}

.relacionada-placeholder .relacionada-link {
   text-decoration: none;
   color: black;
   font-size: 1.3rem;
}

small.tema {
   font-weight: normal;
   color: var(--verde);
   display: block;
   margin-bottom: .3rem;
   margin-top: .3rem;
   font-size: .85rem;
}

small.tema strong {
   color: #000;
}

/**/
div#marketplace {
   clear: both;
}

div#marketplace a {
   color: black;
}

.cuadros figure {
   height: 5rem;
   overflow: hidden;
   border-bottom: 5px solid #f2f2f2;
}

.cuadros figure img {
   float: left;
   margin-right: 1rem;
}

.verdito {
   background: #d5ffb3;
   font-weight: normal;
   padding-left: .5rem;
   padding-right: .5rem;
   border-radius: 0.5rem;
}

iframe.ig {
   display: block;
   margin: 0 auto;
   width: 412px;
   max-width: 100%;
   height: 650px;
   border: none;
}

fieldset.numeralia {
   width: 380px;
   max-width: 95%;
   margin: 0 auto;
   background: #eefff0;
   border-radius: 1.5rem;
   border-color: #c5ffcc;
   font-size: 2.5rem;
}

fieldset.numeralia legend {
   color: #00733C;
   font-size: 1.1rem;
}

fieldset.numeralia p {
   padding: 0;
   font-style: italic;
}



/* /assets/comments.css */
div#comments-root {
   width: 512px;
   margin: 2rem auto;
   max-width: 95%;
}
.comments {
   border-top: 1px solid #eee;
   padding-top: 12px;
   font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

.comments__title {
   font-size: 1.125rem;
   margin: 0 0 8px;
}

.comments__form {
   margin-bottom: 12px;
}

.comments__textarea {
   width: 100%;
   resize: vertical;
   padding: 8px;
   border: 1px solid #ddd;
   border-radius: 8px;
   font: inherit;
   line-height: 1.4;
   background: #fff;
}

.comments__formbar {
   display: flex;
   justify-content: space-between;
   align-items: center;
   margin-top: 6px;
}

.comments__counter {
   font-size: .875rem;
   color: #666;
}

.comments__send {
   background: #00733C;
   color: #fff;
   border: 0;
   padding: 6px 12px;
   border-radius: 12px;
   cursor: pointer;
}

.comments__send[disabled] {
   opacity: .6;
   cursor: default;
}

.comments__error {
   margin-top: 6px;
   color: #b00020;
   font-size: .9rem;
}

.comments__loading,
.comments__empty {
   color: #666;
   font-size: .95rem;
   padding: 8px 0;
}

.comments__list {
   list-style: none;
   margin: 0;
   padding: 0;
   display: grid;
   gap: 12px;
}

.comments__item {
   border: 1px solid #eee;
   border-radius: 10px;
   padding: 10px;
   background: #fff;
}

.comments__meta {
   display: flex;
   gap: 8px;
   align-items: baseline;
   font-size: .85rem;
   color: #666;
   margin-bottom: 4px;
}

.comments__user {
   font-weight: 600;
   color: #333;
}

.comments__body {
   margin: 6px 0 8px;
   word-wrap: break-word;
}

.comments__actions {
   display: inline-flex;
   align-items: center;
   gap: 6px;
}

.comments__score {
   min-width: 1.5em;
   text-align: center;
   font-weight: 600;
}

.comments__replyBtn,
.comments__report {
   background: transparent;
   border: 0;
   color: #00733C;
   cursor: pointer;
}

.comments__report {
   color: #a00;
   margin-left: 8px;
}

.comments__children {
   list-style: none;
   margin: 8px 0 0 14px;
   padding-left: 12px;
   border-left: 2px solid #eee;
   display: grid;
   gap: 10px;
}

.comments__replybox {
   margin-top: 8px;
   padding-top: 8px;
   border-top: 1px dashed #eee;
}
