h1 { font-family: 'Noe Display'; }

a.boton-01 { text-decoration: none; position: relative; display: inline-block; color: #000; background-color: #transparent; border-bottom: 1px solid #000; padding: 8px 50px 8px 0; transition: all 0.3s; }
a.boton-01::before { content: ''; position: absolute; top: 50%; right: 1px; margin-top: -0.5px; height: 1px; width: 15px; display: block; background-color: #000; transition: all 0.3s; }
a.boton-01::after  { content: ''; position: absolute; top: 50%; right: 1px; margin-top: -5px; height: 10px; width: 10px; display: block;  border-width: 1px 1px 0 0; border-color: #000; border-style: solid; transition: all 0.3s; }
a.boton-01::after  { -ms-transform: rotate(45deg);  -webkit-transform: rotate(45deg);  transform: rotate(45deg); }
a.boton-01:hover { color: #fff; background-color: #000; transition: all 0.3s; border-radius: 2px; padding: 8px 40px 8px 10px; }
a.boton-01:hover::before { right: 10px; background-color: #fff; }
a.boton-01:hover::after { right: 10px; border-color: #fff; }

.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 15px; }
.grid-5 { display: grid; grid-template-columns: repeat(5, 1fr); grid-gap: 15px; }

section.breadcrumbs a { text-decoration: none; }
section.breadcrumbs span.separador { display: inline-block; margin: 0 10px; }
section.breadcrumbs span.current { display: inline-block; font-weight: bold; }

section.home-title div.ronin-content { padding: 0 15px; }

div.ronin-header div.ronin-container { max-width: 1400px; }
div.ronin-header div.ronin-content { min-height: 100px; max-width: 1400px; }
div.ronin-header a.home-link { line-height: normal; }
div.ronin-header a.home-link img { width: 160px; margin-bottom: -45px; scale: 0.8; }
div.ronin-header div.usuario-carrito { position: absolute; bottom: 5px; right: 15px; }
div.ronin-header div.usuario-carrito a.usuario { display: inline-block; text-decoration: none; vertical-align: middle; font-size: 0.9rem; margin-right: 15px; }
div.ronin-header div.usuario-carrito a.carrito { display: inline-block; text-decoration: none; vertical-align: middle; background-image: url('../../images/cart-icon.svg'); background-size: contain; background-position: center; width: 24px; height: 24px; }

ul.nav.menu { line-height: 30px; text-align: left; }
ul.nav.menu li a { text-transform: uppercase; font-weight: bold; }
ul.nav.menu li.current a { color: #e1251b; }
ul.nav.menu li:hover a { color: #24b9d7; }

section.home-top { height: 500px; background-image: url('../../images/imagen-categoriablog-sm.jpg'); background-position: left center; }
section.home-top .title { margin: 180px 0 -10px; font-size: 4.0rem; color: #fff; text-align: center; font-family: 'Noe Display'; }
section.home-top .subtitle { margin: 0; font-size: 0.9rem; color: #fff; text-align: center; line-height: 120%; }

section.header-categoria { margin-top: 50px; }
section.header-categoria div.ronin-content { padding: 0 15px; }
section.header-categoria .title { font-size: 2.5rem; font-weight: bold; }

section.bloque-entradas { margin: 25px 0 50px; overflow: hidden; }
section.bloque-entradas::before { content: ''; position: absolute; top: 35px; left: 50%; background-color: #ddd; z-index: 55; width: 1px; height: 100%; margin-left: -0.5px; }
section.bloque-entradas .item { width: 47%; padding: 35px 0;}
section.bloque-entradas .item:nth-child(4n-1)::before { content: ''; position: absolute; top:0; left: -50vw; background-color: #eee; width: 150vw; height: 100%; }
section.bloque-entradas .item .imagen { padding-top: 90%; margin-bottom: 25px; }
section.bloque-entradas .item .enlace-titulo { text-decoration: none; }
section.bloque-entradas .item .titulo { font-family: 'Noe Display'; font-size: 1.8rem; }
section.bloque-entradas .item .fecha { font-size: 0.9rem; color: #999; }
section.bloque-entradas .item .descripcion { font-size: 1.1rem; color: #444;}
section.bloque-entradas .item .enlace { font-size: 0.9rem; font-weight: bold; }

section.post-content .imagen { height: 400px; }
section.post-content .title { font-family: 'Noe Display'; font-size: 2.0rem; text-align: center; margin: 25px 0; line-height: 120%; }
section.post-content h2 { font-family: 'Noe Display'; margin-top: 25px; font-size: 1.6rem; }
section.post-content p { font-size: 1.1rem; line-height: 180%; }
section.post-content ol li { margin-bottom: 10px; }
section.post-content ul li { margin-bottom: 10px; }
section.post-content .fecha { color: #999; margin-bottom: 0; line-height: 140%; }
section.post-content .autor { margin-bottom: 25px; line-height: 140%; }

section.bloque-newsletter { background-color: #000; padding: 25px 0 15px; }
section.bloque-newsletter .title { color: #fff; text-align: center; margin-bottom: 5px; font-weight: bold; font-size: 1.1rem; text-transform: uppercase; }
section.bloque-newsletter .subtitle { color: #fff; text-align: center; font-size: 0.9rem; }
section.bloque-newsletter form { max-width: 500px; margin: 0 auto; }
section.bloque-newsletter .left input { background-color: #000; color: #fff; border: none; border-bottom: 1px solid #aaa; display: block; padding: 10px; }
section.bloque-newsletter .right input { background-color: #fff; color: #000; display: block; width: 100%; padding: 10px; border: none; }
section.bloque-newsletter .row-acepto .texto { color: #fff; }
section.bloque-newsletter .row-acepto input[type="checkbox"] + label::before { background-color: #fff; }

section.footer-links { padding: 50px 0; border-top: 2px solid #000; }
section.footer-links .titulo { font-size: 1.0rem; font-weight: bold; }
section.footer-links .bloque-enlaces { margin: 0 0 35px; }
section.footer-links .bloque-enlaces ul { list-style-type: none; margin: 0; }
section.footer-links .bloque-enlaces a { text-decoration: none; margin-bottom: 5px; color: #555; transition: 0.3s; font-size: 0.9rem; }
section.footer-links .bloque-enlaces a:hover { color: #000; transition: 0.3s; }
section.footer-links .bloque-enlaces p { margin-bottom: 5px; color: #555; transition: 0.3s; font-size: 0.9rem; }

#ronin_page div.ronin-footer { border-top: 1px solid rgba(0,0,0,0.1); height: 80px; }
#ronin_page div.ronin-footer div.ronin-content { padding: 0; }
#ronin_page div.ronin-footer p.copyright { line-height: 75px; margin: 0; color: #555; }
#ronin_page div.ronin-footer a { text-decoration: none; }

section.titulo-bloque-relacionados { margin-bottom: 0; }
section.titulo-bloque-relacionados .ronin-content { padding-top: 0; padding-bottom: 0; }
section.titulo-bloque-relacionados .title { font-family: 'Noe Display'; font-size: 2.0rem; margin: 0; line-height: 120%; }
section.bloque-relacionados { margin-top: 0; }

div.auto-pagination { display: none; }
div.auto-pagination.visible { display: block; }
/*============================================================================*/
@media screen and (max-width:575.98px){
    .grid-4 { grid-template-columns: repeat(2, 1fr); }
    .grid-5 { grid-template-columns: repeat(3, 1fr); }
    section.bloque-entradas::before { display: none; }
    section.bloque-entradas .item { width: 100%; }
    div.ronin-header div.ronin-content { text-align: left; }
    div.ronin-header div.usuario-carrito { right: 15px; }
    section.bloque-entradas .item:nth-child(4n-1)::before { display: none; }
    section.bloque-entradas .item:nth-child(2n+0)::before { display: block; content: ''; position: absolute; top:0; left: -50vw; background-color: #eee; width: 150vw; height: 100%; }
    section.footer-links .bloque-enlaces .titulo { text-align: center; }
    section.footer-links .bloque-enlaces ul li { text-align: center; }
}
@media screen and (min-width:576px) and (max-width:767.98px){
    .grid-4 { grid-template-columns: repeat(3, 1fr); }
    .grid-5 { grid-template-columns: repeat(4, 1fr); }
    div.ronin-header div.usuario-carrito { right: 15px; }
    section.footer-links .bloque-enlaces .titulo { text-align: center; }
    section.footer-links .bloque-enlaces ul li { text-align: center; }
}
@media screen and (min-width:768px) and (max-width:991.98px){
    section.home-top { background-image: url('../../images/imagen-categoriablog-lg.jpg'); }
    ul.nav.menu > li.inicio { display: none; }
    div.ronin-header div.usuario-carrito { right: 15px; }
    section.footer-links .bloque-enlaces .titulo { text-align: center; }
    section.footer-links .bloque-enlaces ul li { text-align: center; }
}
@media screen and (min-width:992px) and (max-width:1199.98px){
    section.home-top { background-image: url('../../images/imagen-categoriablog-lg.jpg'); }
    div.ronin-header div.usuario-carrito { right: 15px; }
}
@media screen and (min-width:1200px){
    section.home-top { background-image: url('../../images/imagen-categoriablog-lg.jpg'); }
}