@media (max-width:768px) {
   body { padding-top:1rem; }
}
article {
   font-family: var(--font2);
   font-size:1.25rem;
   line-height:1.8rem;
   color:#111;
   /*
   -webkit-user-select:none;
   user-select: none;
   */
}
article header {
   font-size:1.1rem;
   text-transform:uppercase;
   margin:1rem auto;
   font-family: var(--font0);
   position:relative;
}
article img {
   /*filter: brightness(1.1) saturate(1.1);*/
   filter: saturate(1.1);
}
article header span { margin-right:1rem; }
.cabeza h1 { margin:0 0 1.5rem; font-family: var(--font2); }
.cabeza h2 {
   font-size:1.3rem; 
   font-weight:500; 
   margin:1rem auto; 
   font-family:var(--font2);
}
/*
.cabeza h2:before {
   content: "";
   height:8px;
   width:8px;
   margin:.3rem .5rem;
   display:inline-block;
   background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0'%3F%3E%3Csvg viewBox='0 0 120 120' version='1.1' xmlns='http://www.w3.org/2000/svg'%3E%3Ccircle cx='60' cy='60' r='50'/%3E%3C/svg%3E");
}
*/
figure figcaption { margin:0;padding:0 1rem .5rem; font-size:1rem; }
.pop { height:440px; overflow:hidden; }
iframe.galerias { width:100%; }
a.foto:before {
   content:"www.elsiglodetorreon.com.mx";
   position:relative;
   top:-1px;
   color:#dadada;
   text-align:center;
}
a.foto { color:#333; margin:4rem auto; display:block; background: linear-gradient(165deg,#f1f1f1,#fff); }
a.foto p { font-size:1rem; }
figure img,.image { max-width:100%; height:auto; width:100%; }
main { overflow:hidden; } /* body */
/* pc: */
.lee img, .lee amp-img { width:150px; float:right; margin-left:1rem; height:auto; border-radius:.6rem; }
.vertical { max-width:100%; }
div#similares figure { height:7rem; overflow:hidden; }
@media (min-width:768px) {
      article { padding-right:1rem; }
      figure {
         overflow:hidden;
         position:relative;
         margin-bottom:1rem;
      }
      main { padding-right:5rem; }
      figure:first-child {
         height:30rem;
      }
      figure.image-cuadro {
         height:250px;
         width:50%;
      }
      figure figcaption {
         position:absolute;
         bottom:0;
         right:0;
         left:0;
         background: linear-gradient(0deg, #000,transparent);
         color:#fff;
         padding: 3rem 2rem 2rem;
         line-height:1.5rem;
         font-size:1.1rem;
      }
      h1 {
         font-size:3rem;
         line-height:3.2rem;
         margin-bottom:0;
      }
      .pub250in { float:right; margin-left:1rem; }
      article .row .col-10 > p:nth-child(1) {
         border-left:10px solid red;
         padding-left:2rem;
         font-size:1.35rem;
         color:#000;
      }
      iframe.galerias { min-height:400px; }
      .lee img { width:200px; float:right; margin:0 0 1rem 1rem; }
      a.foto img { width:50%; height:auto; float:left; margin-right:1rem; }
      .h-900 { height:1200px; }
      /* foto vertical */
      .vertical {
         width: 79% !important;
         margin: 0 auto;
      }

      div#similares { display:grid; grid-template-columns: repeat(3, 1fr); }
      div#similares a { font-size:1.3rem; margin:0 .7rem; }
      div#similares figure { height:9rem; }
   }
   /* ipad */
   @media(max-width:1024px) {
      figure { min-height:15rem; }
   }
   /* mobile: cel: */
   @media (max-width:768px) {
      .h-900 { min-height:100px; }
      article header { font-size:.81rem; }
      figure { margin: 0 -1rem; /*overflow:hidden;*/ }
      a.foto { margin:2rem -1rem; padding:1rem; }
      h1 { line-height:2.2rem; }
      header.row {
         display: grid;
         grid-template-columns: repeat(12,1fr);
      }
      video {
         max-width:100%;
         overflow:hidden;
      }
      div#similares { display:grid;grid-gap:.5rem; grid-template-columns: repeat(2, 1fr); }
      div#similares a { padding:.5rem; font-size:1.14rem; }
   }
   .text-dark { color:#000; }
 /* seguir leyendo */
   .lee {
      display: block; 
      margin-bottom: 2rem; 
      margin-top: 2rem; padding:.5rem; 
      background:#fdfdfd;
      min-height:120px;
      font-family: var(--font0);
      line-height:1.3rem;
   }
         .lee p { font-size:1.2rem; font-weight:bold;margin:0; }
         .lee p strong { color:red; display:block; margin-bottom:.5rem; font-size:1.15rem; }
         .lee small { color:#666; font-size:1rem; font-family:var(--font0); }
         div.numeralia {
            padding: 1rem;
            width: 45%;
            border: 10px solid #d1d1d1;
            float:left;
            margin-right:2rem;
         }
         div.numeralia p { margin:.1rem; }
         div.numeralia p:nth-child(2) { font-weight:bold; }
         div.numeralia big { font-size:4rem; font-weight:900; }


         div.comparte .comentarios {
            color:#333; 
            font-size: 1rem;
            /*position: absolute;*/
         }
         div.comparte small { display:block;font-size:.6rem !important; text-align:center; font: var(--font0); color:#999; }
         /* mobile */
         @media (max-width:768px) {
            div.comparte { margin-right:-1rem; background-size:30px; overflow:hidden; clear:both; }
            div.comparte small { display:none; }
            div.comparte a {
               width: 2rem;
               height:1.8rem;
               background-size:auto 3rem;
               padding-top:0;
               background-position-y:-1.2rem;
               margin-right:.4rem;
            }
            div.comparte .tw { background-position-x: -30px; }
            div.comparte .share { background-position-x: -93px; }
            div.comparte .mail { background-position-x: -61px; }
            #comentarios { 
               background-position-x: -124px;
               transform: translateY(2px);
               font-size: .76rem;
               padding-top: 0;
            }
         }
         /* pc */
         @media (min-width:768px) {
            a.lee { padding:.5rem 2rem; }
            #comentarios { 
               background-position-x: -206px;
               background-position-y: -31px;
               width: 48px;
               color:#333;
               font-size:1rem;
               padding-top:.6rem;
               height:2.5rem;
            }
            div.comparte a {
               width: 50px;
               height:25px;
               background-position-y:-31px;
               margin-bottom:.5rem;
               margin-top:.5rem;
            }
            div.comparte .tw { background-position-x: -51px; }
            div.comparte .mail { background-position-x: -105px; }
            div.comparte .share { background-position-x: -156px; }
         }
         p.seccion {
            max-width: var(--ancho); 
            margin:.5rem auto; 
            font-family: var(--font1);
            font-size:1.5rem;
            padding:.5rem;
         }
         main blockquote {
            border-left: 1rem solid #ddd;
            padding-left: 1rem;
            color: #444;
            font-size: 1.2rem;
            margin-left: 1rem;
            font-family: var(--font0);
         }
         @media (min-width:1024px) {
            /*
            padding-left:3rem;
            margin-left:3rem;
            */
         }



         /* lightbox */
         div#imagesl div {
            display:none;
         }
         div#imagesl div img { max-width:100%;width:100%; height:auto; }
         div#imagesl div:target {
            overflow:hidden;
            position: fixed;
            left: 7%;
            top: 7%;
            width:80%;
            display: flex;
            align-items: center;
            justify-content: center;
            padding:2rem;
            background:#fbfbfb;
            background:#fbfbfbdb;
         }
         @media (max-width:768px) {
            div#imagesl div:target {
               left:0;
               right:0;
               padding:1rem;
               width:92%;
            }
         }
         div#imagesl div .close::after {
            right: 1rem;
            top: 1rem;
            width: 3rem;
            height: 3rem;
            position: absolute;
            display: flex;
            z-index: 1;
            align-items: center;
            justify-content: center;
            background-color: red;
            border-radius: 50%;
            color: white;
            content: "x";
            cursor: pointer;
            font-size:1.6rem;
            box-shadow:0px 2px 5px rgba(1,1,1,.15);
         }
         div.twitter-tweet  {
            margin:1rem auto;
         }
         div#dibujamea { height:20px; }
         div#dibujamea a:after { content: " » "; color:red; }
         div#dibujamea a:last-child:after { content: ""; }

         .embed-responsive {
            position: relative;
            overflow: hidden;
            width: 100%;
            padding-top: 56.25%;
         }
         .embed-responsive-item {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
            width: 100%;
            height: 100%;
         }
         .tacha { text-decoration:line-through }

         ol.listado {
            font-size:1.1rem;
         }
         ol.listado li { padding:.3rem 0; }

         p.tags {
            background: #f9f8f8;
            padding: 1rem;
            font-family: var(--font2);
            border-radius: 0.5rem;
            font-size: 1.05rem;
         }
         p.tags a:after {
            content: "»";
            margin: 0 0.2rem 0 0.4rem;
            color: #afafaf;
         }

         div.cortoView {
            background: #fffdf7;
            padding: 1rem;
            margin-bottom: 2rem;
         }
         main#lanota a {
            color: #900;
         }


         div.pub.pubvid {
            background: #fdfdfd;
            margin:2rem auto;
         }

         main p:first-child {
            font-weight: bold;
            border-left: 1rem solid #ededed;
            padding-left: 0.8rem;
            font-size: 1.4rem;
         }
         div#trends a {
            color: #000;
            text-decoration: none;
            padding: 0.3rem .4rem;
            border: 1px solid #f3efc9;
            border-radius: 0.75rem;
            margin-right:.5rem;
         }
         div#trends a:hover {
            background: #fffcdd;
            border: 1px solid #ffeb18;
         }
         div.pdf {
            margin-top: 2rem;
            margin-bottom: 2rem;
            background: #fdf5e8;
            padding: 1rem;
         }
         p.tiktok { width:324px; margin:0 auto; }
         div#lasfotos {
               display: none;
               position: fixed;
               z-index: 9999;
               top: 0;
               left: 0;
               width: 100vw;
               height: 100vh;
               background-size: contain;
               background-repeat: no-repeat no-repeat;
               background-position: center center;
               background-color: black;
               cursor:pointer;
            }

            p.numeralia { background:#f1f1f1; padding:1rem; }
            p.numeralia em { display:block; font-size:3rem; font-style:normal; font-weight:bold; }

	div#lasrelacionadas {
	  	display:grid;
 		grid-gap:1rem;
   		grid-auto-flow: column;
   		overflow-x: scroll;
   		scroll-snap-type: x proximity;
   		grid-auto-columns: minmax(15rem, 1fr);
   		min-height:17rem;
	 }
	div#lasrelacionadas a {
		display: inline-block;
  	 }
    div#lasrelacionadas figure { height:8rem; }
	div#lasrelacionadas h2 {
		font-size: 1.15rem;
	        font-family: var(--font2);
	 }

mark {
   background: #fff3cd;
   padding: 0.18rem;
}
