/*
    hemisferio.space
    nicolaz garcia
*/
@import url("gridlex.css");
@import url("f/font_style.css");

body {
    color: #1a1a1a;
    font: normal 300 16px/1 'Space Mono', sans-serif;
}

.content {
    margin: 0 auto;
    padding: 0 2%;
    /*max-width: 1200px;*/
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: 'Basteleur', sans-serif;
}

nav {
    position: fixed;
    top: 0;
    width: 100%;
    background: #F6E75A;
    border-bottom: 1px solid #000;
    -webkit-transition: transform 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000), padding 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -moz-transition: transform 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000), padding 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    -o-transition: transform 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000), padding 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    transition: transform 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000), padding 0.3s cubic-bezier(0.300, 0.100, 0.580, 1.000);
    z-index: 10;
}

nav.scrollUp {
    transform: translateY(-100%);
}

nav ul {
    text-align: center;
}

nav ul:before,
nav ul:after {
    content: '';
    width: 5vw;
    height: 100%;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    border-right: 1px solid #000;
    background: #F6E75A url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAqCAYAAABLGYAnAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAXdJREFUeNrEWO1tgzAQJVUH8AiMwAh0A0YgE7Qj0AkYwSNkBKcTkA3oBk4noFAdEaJ3jn0+m5PeH0T87Od3H6QoZKIEZI92xgSocxKXG+IFl5Afv0SSN8hmsoXZnXzKSW4R8jKX7IrwAZu8BTkXfBAEhcPZ7HvvEBktYqwleuTdCdZgxUAsuKaR2sg9Ot7DogK1OuIw5IJbFfonmzS7VNSIMc2zasXFek2j5wb/GckIbMKF3qd0dkQuxyrjnRG1MPHDbK/MQsKJ+4y3GTep9AtBcLvVgpIHDQijsNG8SG2i9GpcxFXi3DaurtYk7v01dEmxfh4aPSiM5vOQWPoJjPxXO07E3Svk2bvggPjJ6fvao3wOnqcXm1hXtJumpKWKzn5WpxasPDvjGHNnNvA0ClTRMGZV0h8LwVJy8/wmYXku+Q/y7JqLvDjy5IfKfkeefR0p+/eR5NdcXlG7/B5ymxWr6dn/ErHc2T7mzld3nwn3J4+oBvErwADfeHQfZj4dNgAAAABJRU5ErkJggg==') no-repeat 50% 50%;
    background-size: auto 30px;
}

nav ul:after {
    left: initial;
    right: 0;
    border-right: none;
    border-left: 1px solid #000;
}

nav li {
    width: 18vw;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    position: relative;
    border-right: 1px solid #000;
}
nav li:last-child {
    border-right: none;
}
nav li a {
    display: block;
    padding: 1em;
}
nav li.lasfuerzas {
    min-width: 20vw;
    border-right: none;
    padding: 0 1.3em;
}
nav li.lasfuerzas + li {
    border-left: 1px solid #000;
}
nav h1 {
    font-size: 1.85em;
}

nav a {
    color: #000;
}
nav a:hover {
    font-weight: bold;
}
nav li:hover .sub {
   opacity: 1; 
}
.sub {
    opacity: 0;
    position: absolute;
    top: 100%;
    width: 100%;
    background: #f6e75a;
    border: 1px solid #000;
    padding: 0.7em;
}
.ham {
    display: none;
    position: absolute;
    bottom: 24px;
    right: 12px;
}
.ham:after, .ham:before {
    content: '';
    display: block;
}
.ham, .ham:after, .ham:before {
    position: absolute;
    width: 40px;
    height: 4px;
    transition-timing-function: ease;
    transition-duration: .15s;
    transition-property: transform;
    border-radius: 4px;
    background-color: #000;
}
.ham:before {top: -10px;}
.ham:after {bottom: -10px;}
.ham.active {
    transform: rotate(90deg);
}
.ham.active:after {transform: translate3d(-8px,-10px,0) rotate(-45deg) scaleX(.7);}
.ham.active:before{transform: translate3d(-8px,10px,0) rotate(45deg) scaleX(.7);}
article {
    min-height: 88vh;
    border-top: 1px solid #000;
}

#somos {
    padding-top: 3em;
    background: #F6E75A;
    line-height: 1.2;
}

#somos [class*=grid-] {
    /*min-height: 88vh;*/
}
#somos .col-6_sm-12 {padding: 0}
#somos h2 {
    font-size: 2.88em;
    /*word-break: break-all;*/
    white-space: break-spaces;
}
#somos div:not(#creditos) > img {
    max-height: 60vh;
    margin: 0 auto;
    display: block;
}
#creditos {
    display: flex;
    position: absolute;
    top: 3em;
    left: 0;
    width: 100%;
    min-height: 100vh;
    background: #F6E75A;
    visibility: hidden;
    opacity: 0;
    transition: opacity .05s .65s linear;
}
#creditos.show {
    visibility: visible;
    opacity: 1;
}
#creditos a {
    color: #000;
    text-decoration: underline;
}
#creditos a:hover {
    color: #fff;
}
#creditos h6 {
    font-family: 'Space Mono', sans-serif;
}
#creditos span {
    font-weight: 300;
    font-size: .8em;
}
.cie {
    font-size: .9em;
}
#creditos .col-9_sm-11 {
    border: 1px solid #000;
    padding: 1em;
}
#creditos .col-6_sm-12 {
    padding: 1.3em;
}
#creditos .col-4_sm-12 a { display: block;}
#creditos .cerrar {
    font-size: .85em;
    display: inline-block;
    padding: 1em 2.4em;
    border: 1px solid #000;
    position: absolute;
    cursor: pointer;
    background: #F6E75A;
    top: 10%;
    left: 10%;
}
#creditos .cerrar:hover {
    /*background: #000;*/
    /*color: #F6E75A;*/
    font-weight: bold;
}
canvas {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
#somos p {
    line-height: 1.6;
    margin-bottom: 1.5em;
}
#somos .gal {
    height: 58vh;  
}
@media screen and (max-height: 50em) and (orientation: landscape) {
  #somos .gal {
    height: 72vh;  
}  
}

.gal li,.gal [aria-live="polite"],.gal [role="listbox"]{height: 100%;}
.gal li img {object-fit: cover;height: 100%;}
#somos .sm-uno {border-bottom: 1px solid #000;}
.b-l {border-left: 1px solid #000;}

#somos .sm-intro,
#somos .sm-det {
    margin-left: 5vw;
}
#somos .sm-intro p {
    font-size: .94em;
    padding-right: 5vw;
}
#somos .sm-det {
    padding: 2em 2em 2em 0;
    font-size: 1.12em;
}
#somos .sm-extra {
    border-left: 1px solid #000;
    padding: 2em 10vw 2em 2em;
    font-size: 1.12em;
}
.info-b {
    text-align: center;
}
.info-b span {
    display: inline-block;
    background: #4380D3;
    border-radius: 100%;
    border: 1px solid #000;
    padding: 1.2em;
}
#somos .paleblue {
    background: #B2CCE0;
    padding: 2em 0 .5em;
    border-top: 1px solid #000;
}

.paleblue p:before {
    content: '';
    width: 1em;
    height: 1em;
    display: inline-block;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB8AAAAqCAYAAABLGYAnAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAXdJREFUeNrEWO1tgzAQJVUH8AiMwAh0A0YgE7Qj0AkYwSNkBKcTkA3oBk4noFAdEaJ3jn0+m5PeH0T87Od3H6QoZKIEZI92xgSocxKXG+IFl5Afv0SSN8hmsoXZnXzKSW4R8jKX7IrwAZu8BTkXfBAEhcPZ7HvvEBktYqwleuTdCdZgxUAsuKaR2sg9Ot7DogK1OuIw5IJbFfonmzS7VNSIMc2zasXFek2j5wb/GckIbMKF3qd0dkQuxyrjnRG1MPHDbK/MQsKJ+4y3GTep9AtBcLvVgpIHDQijsNG8SG2i9GpcxFXi3DaurtYk7v01dEmxfh4aPSiM5vOQWPoJjPxXO07E3Svk2bvggPjJ6fvao3wOnqcXm1hXtJumpKWKzn5WpxasPDvjGHNnNvA0ClTRMGZV0h8LwVJy8/wmYXku+Q/y7JqLvDjy5IfKfkeefR0p+/eR5NdcXlG7/B5ymxWr6dn/ErHc2T7mzld3nwn3J4+oBvErwADfeHQfZj4dNgAAAABJRU5ErkJggg==) no-repeat 50% 50%;
    background-size: contain;
    margin-right: 0.3em;
    vertical-align: middle;
}
.paleblue .col-4_sm-12 {
    padding: 0 4%;
}
.top-title {
    border-bottom: 1px solid #000;
    margin-bottom: 2em;
    text-align: center;
    position: relative;
}
.top-title h3 {
    text-transform: uppercase;
    font-family: 'Space Mono', sans-serif;
    font-weight: 400;
    padding: 0.5em;
}
#stickers {
    background: #F49DBE;
    text-align: center;
}
#stickers .top-title .ush {
    text-align: right;
    padding-right: 5vw;
}
#stickers .top-title .ush .txt {
    left: initial;
    right: 5vw;
    width: 60%;
}
#stickers span {
    display: inline-block;
}
#stickers span.bandera  { width: 14.2%; height: 20vh;}
#stickers span.olla     { width: 17.4%; height: 20vh;}
#stickers span.bombillo { width: 10.2%; height: 20vh;}
#stickers span.abrazo   { width: 18.5%; height: 20vh;}
#stickers span.megafono { width: 21.5%; height: 20vh;}
#stickers span.maiz     { width: 17.9%; height: 20vh;}
#stickers span.senora   { width: 19.5%; height: 35vh; margin-top: -30%;}
#stickers.view span {
    transform: rotate(5deg);
    animation: 1s cubic-bezier(.17,.67,.83,.67) infinite alternate inicio;
}
#stickers.view span:nth-child(even){
    animation-delay: .3s;
}
@keyframes inicio {
    
    to {transform: rotate(-5deg);}
}
#stickers .col-12_md-last {
    padding-top: 2em;
    text-align: center;
}
#stickers a {
    display: inline-block;
    width: 10em;
    font-size: 1.3em;
    color: #000;
    text-decoration: underline;
}
#stickers a:hover {
    color: #fff;
}
#stickers .subtext {
    background: #f6e75a;
    text-align: center;
    padding: 2em;
}
#stickers .subtext p {
    width: 70%;
    margin: 0 auto;
    line-height: 1.7;
    font-size: 1.3em;
}
#tarot {
    background: #DF6D3E;
    min-height: initial;
}

.slides li {
    padding: 0 1em;
    position: relative;
    transform: rotateY(-180deg);
    transition: transform 1s;
    transform-style: preserve-3d;
}

.tarjetas img {
    position: absolute;
    /*width: max-content;*/
    width: auto;
    height: 100%;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    top: 0;
    border-radius: 7px;
}
.tarjetas img.ft {
    position: initial;
}
.tarjetas img + img {
    transform: rotateY(-180deg);
}
.tarjetas li.slick-current,
.tarjetas li:hover {
    transform: rotateY(0);
}
.tarjetas li.slick-active:hover {
    /*tarjetas solo 1 
    transform: rotateY(180deg);*/
}
.tarjetas li.slick-current:hover{
    transform: rotateY(180deg);
}
#tarot.left .slides li {
    transform: rotateY(-180deg);
}
#tarot.right .slides li {
    transform: rotateY(180deg);
}
#tarot.right .tarjetas img + img {
    transform: rotateY(-180deg);
}
#tarot .subtext {
    padding: 2em 5vw;
}
#tarot .subtext p {
    padding: 1.3em 4em 0 1em;
    line-height: 1.5;
}
@media screen and (max-height: 50em) and (orientation: landscape) {
  #tarot .subtext p {
    padding: 1.3em 3em 0 1em; 
}  
}
#tarot .top-title .ush{
    text-align: right;
    padding-right: 5vw;
}
#tarot .top-title .ush .txt {
    left: initial;
    right: 3vw;
    width: 40%;
}
#comics {
    background: #FFE5D7;
    font-size: 0.9em;
}
#comics .col-4_sm-12,
#comics .col-4_sm-6{
    padding: 5%;
    text-align: center;
    position: relative;
}
#comics .grid-middle {
    position: relative;
    border-bottom: 1px solid #000
}

#comics .grid-middle:before {
    content: 'comics';
    display: block;
    position: absolute;
    width: 38.5%;
    background: #B2CCE0;
    text-transform: uppercase;
    text-align: center;
    transform: rotate(-90deg);
    transform-origin: 0 0;
    top: 100%;

    padding: 0.6em;
    border-bottom: 1px solid #000;
}
#comics .grid-middle.ntsdvz:before {
    content: 'notas de voz';
    background: #E4D55A;
}
#comics .info-t {
    position: relative;
    padding-bottom: 4em;
    margin-top: -4em;
}
.info-t > p {
    text-transform: uppercase;
    line-height: 1.2;
    max-width: 80%;
    margin: 0 auto;
}
.info-t  .ush .txt {
    width: 160%;
    left: initial;
    right: 50%;
    top: -274%;
}
.info-t  .ush .txt p {
    padding-right: 5em;
}


.ush {
    position: absolute;
    width: 100%;
    top: 100%;
    left: 0;
    z-index: 4;
    text-align: center;
}
.ush span {
    position: relative;
    display: inline-block;
    width: 10em;
    border: 1px solid #000;
    border-radius: 100%;
    text-transform: uppercase;
    padding: 2em;
    line-height: 1.2;
    transform: translateY(-50%);
    z-index: 3;
    cursor: pointer;
    z-index: 2;
}
.ush span.red {background: #D56D3E;}
.ush span.red:hover {background: #458F4A;}
.ush span.blue {background: #4380D3; font-size: .85em; padding:.55em; text-align: center;}
.ush span.blue:hover {background: #F49DBE;}
.ush .txt {
    width: 80%;
    background: #BAD4E8;
    position: absolute;
    left: 50%;
    top: 0;
    z-index: 1;
    line-height: 1.5;
    text-align: left;
    height: 0;
    overflow: hidden;
    transition: all .55s linear;
}
.ush .txt:before {
    content: "\2715";
    display: inline-block;
    padding: .3em;
    color: #000;
    font-weight: bold;
    border-radius: 2px;
    position: absolute;
    top: 2px;
    right: 2px;
    cursor: pointer;
}
.ush .txt:before:hover {
    color: #fff;
    background: red;
    
}

.ush.show .txt {
    padding: 3em;
    height: auto;
    border: 1px solid #000;
}
.ush .dl {
    position: absolute !important;
    width: 50px;
    height: 30px;
    background: #D56D3E;
    border: 1px solid #000;
    padding: 2px;
    border-radius: 50%;
    right: 10%;
    text-align: center;
    text-transform: uppercase;
}
.ush a.dl {
    width: auto;
    text-transform: uppercase;
    padding: 0 0.7em;
    color: #f6e75a;
}
.ush .dl:hover {
    background: #458F4A;
}
#comics .col-4_sm-12 a,
#comics .col-4_sm-6 a{
    display: block;
    position: relative;
    color: #000;
}
#comics a span {
    display: block;
    overflow: hidden;
}
#comics a:hover span img {
    transform: scale(1.2);
}
#comics span[class^="ic"]{
    text-align: center;
    display: block;
    position: absolute;
    top: -9%;
    right: -9%;
    width: 58px;
    height: 58px;
    padding: 10px;
    border: 1px solid #000;
    background: #BAD4E8;
    border-radius: 50%;
    transition: all .44s cubic-bezier(.74,.32,.12,1.05);
    z-index: 2;
}
#comics span.ic2 {
    top: 50%;
    left: 50%;
    background: #EA93B4;
    margin: -29px;
}
#comics span[class^="ic"] svg,
.ush .dl svg {
    max-height: 100%;
    transition: transform .33s ease-in;
}
#comics a:hover span[class^="ic"] svg {
    transform: translateY(5px);
}
#comics a:hover span[class^="ic"] {
    background: #C5714C;
    transform: translateY(22%);
    animation: pulse 300ms cubic-bezier(0.9, 0.7, 0.5, 0.9) infinite alternate;
}
#comics a:hover span.ic2 {
    background: #527AD2;
    animation: pulse2 300ms cubic-bezier(0.9, 0.7, 0.5, 0.9) infinite alternate;
}
@keyframes pulse {
  0% {
    padding: 2px 0 6px;
    width: 82px;
    height: 47px;
  }
  40% {
    width: 58px;
    height: 58px;
    padding: 10px;
  }
}
@keyframes pulse2 {
    to {
        height: 48px;
        transform: scale(1.2);    
    }
}
#comics a:hover .ic.na,
#comics a:hover .ic.ve,
#comics a:hover .ic.as,
#comics a:hover .ic.am {
    width: 58px;
    height: 58px;
    padding: 10px;
}
#comics a:hover .ic.az,
#comics a:hover .ic.ro {
     transform: translateY(32%);
}
#comics li.visited .ic {
    opacity: 0;
}
#comics .ic.na,
#comics .ic.ve,
#comics .ic.as,
#comics .ic.am {
    padding: 2px 0 6px;
    width: 82px;
    height: 47px;
}
#comics .ic.na {  
    top: -7%;
}
#comics .ic.ve {
    top: 90%;
    right: initial;
    left: -9%;
}
#comics .ic.az {}
#comics .ic.as {
    top: 42%;
    right: initial;
    left: -13%;
}
#comics .ic.am {
    top: 90%;
    right: initial;
    left: -9%;
}
#comics .ic.ro {
    right: initial;
    left: -9%;
}
#comics h3 {
    font-family: 'Space Mono', sans-serif;
    font-weight: normal;
    display: inline-block;
    letter-spacing: -0.04em;
    text-transform: capitalize;
}
.titulo {
    text-transform: uppercase !important;
    display: block !important;
    padding: 1.2em 1.7em 0.15em;
    line-height: 1.5;
    font-size: 1.15em
}
#comics span {
    display: inline-block;
    font-size: .9em;
    position: relative;
}
/* enlace instagram
#comics .comic-info span a:before {
    opacity: 0;
    content: '';
    width: 25px;
    height: 25px;
    display: block;
    position: absolute;
    top: -48%;
    right: 115%;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24'%3E%3Cpath d='M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zM12 0C8.741 0 8.333.014 7.053.072 2.695.272.273 2.69.073 7.052.014 8.333 0 8.741 0 12c0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98C8.333 23.986 8.741 24 12 24c3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98C15.668.014 15.259 0 12 0zm0 5.838a6.162 6.162 0 1 0 0 12.324 6.162 6.162 0 0 0 0-12.324zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.406-11.845a1.44 1.44 0 1 0 0 2.881 1.44 1.44 0 0 0 0-2.881z'/%3E%3C/svg%3E");
    background-size: contain;
    transition: opacity .55s cubic-bezier(.61,-0.04,.3,.61);
}
*/

#comics img {
    transition: all .33s cubic-bezier(.61,-0.04,.87,.79); 
}
#comics .col-4_sm-12.visited img,
#comics .col-4_sm-6.visited img{
    transition: all 1.3s cubic-bezier(.61,-0.04,.87,.79);
    /*max-width: 80%;
    opacity: .4;*/
}

#comics .urbano .ic {background: #ECDD5A;}
#comics .urbano a:hover .ic {background: #568251;}
#comics .audios .ic {background: #DC93B0;}
#comics .audios a:hover .ic {background: #527AD2;}

#comics .info-t {
    position: relative;
}
footer {
    background: #F6E75A;
    /*border-top: 1px solid #000;*/
    padding-top: 3em;
    line-height: 1.3;
}
footer .logos {
    border-top: 1px solid #000;
    background: #FFEDDF;
    padding-top: 1.5em!important;
}
footer .logos h2 {
    display: inline-block;
    vertical-align: middle;
}
footer .logos h2 a {
    display: block;
    height: 0;
    overflow: hidden;
    background-image: url(img/entrevinetas_sprite.png);
    background-repeat: no-repeat;
}
footer .logos h2:hover {
    transform: scale(.97);
}
footer .logos h2.entrevinetas {
    vertical-align: middle;
    margin-top: -0.8em;
    /*margin-top: 3em;*/
}
footer .logos h2.entrevinetas a {
    width: 261px;
    padding-top: 49px;
}
footer .logos h2.embajada a {
    width: 148px;
    padding-top: 136px;
    background-position: 0 -49px;
}footer .logos h2.juntanza a {
    width: 178px;
    padding-top: 59px;
    background-position: -155px -49px;

}

footer a {
    color: #000;
}
footer a:hover {
    text-decoration: underline;
}
.social {
    text-transform: lowercase;
}
.social li:before {
    content: '+';
    display: inline-block;
    padding-right: .5em;
}
.alt li {
    display: inline-block;
    margin-right: 1.3em;}
img.cc {
    width: 80px;
}
div.cc {border-bottom: 1px solid #aaa03e; margin:2em 0 1em;}
.ccinfo {
    text-align: right;
}
@media screen and (orientation: portrait) {}

/*480*/
@media screen and (min-width: 30em) {
    body {
        text-rendering: optimizeSpeed;
    }
}

/*768*/
@media screen and (min-width: 48em) {}

/*960*/
@media screen and (min-width: 60em) {
    #comics .grid-middle .col-4_sm-12:first-of-type,
    #comics .grid-middle .col-4_sm-6:first-of-type{
        margin-left: 5%;
    }
}

/*1240*/
@media screen and (min-width: 76em) {
    .tarjetas li.slick-active {
        /*transform: rotateY(0);*/
    }
}
@media screen and (min-width: 95em) {
    body {
        font-size: 22px;
    }
    nav h1 {
        /*font-size: 2.375em;*/
    }
}
/*1440*/
@media screen and (min-width: 90em) {
    nav h1 {
        font-size: 2.175em;
    }
    #somos h2 {
        font-size: 2.988em;
    }
    article {
        min-height: initial;
    }
}
/*1280*/
@media screen and (max-width: 80em) {}

/*1216*/
@media screen and (max-width: 76em) {}

/*960*/
@media screen and (max-width: 60em) {
    
    article {min-height: initial;}
    #somos div:not(#creditos) > img {max-height: 40vh;}
    #stickers span.bombillo {display: none;}
    #stickers div.br {display: none;}
    #stickers span:not(.red) {width: 28%!important; margin: 1em;}
    #stickers span.senora {margin:1em 0 0 -6%;}
    nav h1 {font-size: 1.5em;}
    nav ul {display: flex; justify-content: center; align-items: center;}
    nav ul:before, nav ul:after {border: none;}
    nav li {width: auto;}
    #comics .grid-middle {padding-top: 4em;}
    #comics .grid-middle:before {width: 100%; transform: none; top: 0;}
    #comics .info-t {margin-top: 0;}
    #stickers .top-title .ush .txt,
    #tarot .top-title .ush .txt,
    .info-t .ush .txt {width: 66vw;}
}
/*768*/
@media screen and (max-width: 48em){
    #somos { padding-top: 5em;}
    #somos .sm-intro, #somos .sm-det {margin-left:0; padding-left: 2em;}
    .info-t .ush .txt {
        bottom: 100%;
        top: initial;
        right: 0;
    }
    .info-t .ush .txt p {
        padding: 0;
    }
}

/*640*/
@media screen and (max-width: 40em) {
    .ham {
        display: block;
    }
    nav {transform: translateY(calc(-100% + 3em));}
    nav.slide {transform: none;}
    nav ul {display: flex;
    flex-direction: column;}
    nav ul:before, nav ul:after {display: none;}
    nav li {
        width: 100% !important; 
        border-top: 1px solid #000;
        border-right: none;
    }
    nav li.lasfuerzas + li {border-left: none;}
    .sub {
        position: initial;
        opacity: 1;
        border: none;
        border-top: 1px solid #000;
        padding: 1em;
    }
    
    nav li.lasfuerzas {
        order: 1;
        display: initial;
        padding: 0.8em;
        border: none;
        border-top: 1px solid #000;
    }
    
    #somos h2 {
        font-size: 2.28em;
    }
    #stickers .subtext p {
        width: 100%;
        font-size: 1.1em;
    }
    #stickers span:not(.red) {width: 38%!important; margin: .3em;}
    #stickers .top-title .ush .txt, #tarot .top-title .ush .txt, .info-t .ush .txt {
        width: 90vw;
        right: 0;
    }
    
    .info-t .ush .txt {
        /*bottom: 100%;
        top: initial;*/
        width: 90vw;
        right: 0;
    }
    .info-t .ush .txt p {
        padding: 0;
    }
}

/*ipad /* For portrait layouts only */
@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) {
    .tarjetas img {max-height: 438px;}
}

/* Slider */
.slick-slider {
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list {
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}

.slick-list:focus {
    outline: none;
}

.slick-list.dragging {
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-list,
.slick-track {
    height: 100%;
}

.slick-track:before,
.slick-track:after {
    display: table;

    content: '';
}

.slick-track:after {
    clear: both;
}

.slick-loading .slick-track {
    visibility: hidden;
}

.slick-slide {
    display: none;
    float: left;
    /*height: 100%;*/
    min-height: 1px;
}

[dir='rtl'] .slick-slide {
    float: right;
}

.slick-slide img {
    display: block;
}

.slick-slide.slick-loading img {
    display: none;
}

.slick-slide.dragging img {
    pointer-events: none;
}

.slick-initialized .slick-slide {
    display: block;
}

.slick-loading .slick-slide {
    visibility: hidden;
}

.slick-vertical .slick-slide {
    display: block;

    height: auto;

    border: 1px solid transparent;
}

.slick-arrow.slick-hidden {
    display: none;
}

@charset 'UTF-8';

/* Slider */
.slick-loading .slick-list {
    background: #fff url('img/load.gif') center center no-repeat;
}

/* Arrows */
.slick-prev,
.slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}

.slick-prev:hover,
.slick-prev:focus,
.slick-next:hover,
.slick-next:focus {
    color: transparent;
    outline: none;
    background: transparent;
}

.slick-prev:hover:before,
.slick-prev:focus:before,
.slick-next:hover:before,
.slick-next:focus:before {
    opacity: 1;
}

.slick-prev.slick-disabled:before,
.slick-next.slick-disabled:before {
    opacity: .25;
}

.slick-prev:before,
.slick-next:before {
    font-size: 20px;
    line-height: 1;

    opacity: .75;
    color: white;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-prev {
    left: 25px;
}

[dir='rtl'] .slick-prev {
    right: -25px;
    left: auto;
}

.slick-prev:before {
    content: '←';
}

[dir='rtl'] .slick-prev:before {
    content: '→';
}

.slick-next {
    right: 25px;
}

[dir='rtl'] .slick-next {
    right: auto;
    left: -25px;
}

.slick-next:before {
    content: '→';
}

[dir='rtl'] .slick-next:before {
    content: '←';
}

/* Dots */
.slick-dotted.slick-slider {
    margin-bottom: 30px;
}

.slick-dots {
    position: absolute;
    bottom: -25px;

    display: block;

    width: 100%;
    padding: 0;
    margin: 0;

    list-style: none;

    text-align: center;
}

.slick-dots li {
    position: relative;

    display: inline-block;

    width: 20px;
    height: 20px;
    margin: 0 5px;
    padding: 0;

    cursor: pointer;
}

.slick-dots li button {
    font-size: 0;
    line-height: 0;

    display: block;

    width: 20px;
    height: 20px;
    padding: 5px;

    cursor: pointer;

    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
    outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
    opacity: 1;
}

.slick-dots li button:before {
    font-size: 6px;
    line-height: 20px;

    position: absolute;
    top: 0;
    left: 0;

    width: 20px;
    height: 20px;

    content: '•';
    text-align: center;

    opacity: .25;
    color: black;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.slick-dots li.slick-active button:before {
    opacity: .75;
    color: black;
}