@charset "utf-8";

.stage.A {
    transition:none !important;
}

.intro {
    height: 50vh;
    font-family: Charm-Regular, Arial, sans-serif;
    font-size: 13vw;
}

.intro > div:last-child {
    top: 58%;
    bottom: auto;
    animation: smallTitleMove 2s;
    animation-fill-mode: forwards;
}

@keyframes smallTitleMove {
    from {transform:translate(0, -30%); color: rgba(255,255,255,0); text-shadow: 2px 2px rgba(0, 0, 0, 0);}
    to {transform: translate(0, -50%); color: rgba(255,255,255,1); text-shadow: 2px 2px rgba(0, 0, 0, 0.55);}
}

@media only screen and (min-width: 1200px), only screen and (min-height: 1200px)  {
    .intro {
        font-size:144px;
    }
}

@media only screen and (orientation: landscape) and (min-aspect-ratio:3/2) {
    .web.mobile:not(.topSmall) > .top .logo {
        display: none !important;
    }
    .web.mobile .intro > div:last-child {
        top: 50%;
    }
    .intro {
        font-size: 11vw;
    }
}