@media (min-width: 481px) {
    .quote {
        left: 100%;
    }

    .quote .quote-titulo {
        top: 4vh;
        position: absolute;
        width: 92.5vh;

        font-size: 6.75em;
        font-weight: 500;
        line-height: 1.125em;
        letter-spacing: -.05em;
    }

    .quote .quote-texto {
        width: 80vh;
        top: 55vh;
        position: absolute;

        z-index: 1;
    }

    .quote .quote-texto .quote-subtitulo {
        font-size: 3.5em;
        font-weight: 500;
        font-style: italic;
        letter-spacing: -0.025em;

        margin-bottom: 3vh;
    }

    .quote .quote-texto .separador,
    .underline {
        width: 12vw;
        height: .125em;
        margin: 3vh 0 5vh 7px;
    }

    .quote .quote-texto .quote-descricao {
        font-size: 1.85em;
        font-weight: 300;
    }


    .paulozabeu {
        left: 100%;
        width: 60vh;

        background-image: url(../assets/images/paulozabeu.png);
        background-repeat: no-repeat;
        background-position-y: bottom;
        background-size: auto 100%;
    }


    .premios {
        top: 4vh;
        left: 100%;
        z-index: 1;
    }

    .premios .premios-titulo {

        width: 42.5vh;
        font-size: 4.5em;
        font-weight: 300;
        letter-spacing: -.05em;
        line-height: .95em;

    }

    .premios .separador {
        width: 8vw;
        height: 3px;
        margin: 1vh 0 3vh 7px;
    }

    .premios .premios-descricao {
        width: 56vh;
        font-size: 1.25em;
        line-height: 1.5em;
        font-weight: 100;
        margin-left: 5px;
    }

    
    .timeline {
        left: 100%;
        
        width: 100vw;
        height: 90vh;

        margin: 5vh 5vw 5vh 5vw;
        z-index: 0;
    }

    .timeline .box {
        width: 13.75vw;
        height: 47.5%;
        display: inline-flex;
    }

    .timeline .box .content {
        position: relative;
        width: 13.75vw;
    }

    .timeline .box .content.up {
        position: absolute;
        align-self: flex-end;
    }

    .timeline .box .content.half {
        width: 100%;
        left: 50%;
        display: inline-block;

    }

    .timeline .description {
        font-size: 1em;
        font-weight: 300;
        font-style: italic;
        letter-spacing: .0125em;

        width: 85%;
    }

    .timeline .description:before {
        content: "''";
    }

    .timeline .description:after {
        content: ";";
    }

    .timeline .box .content.up p.description {
        margin: 0 0 1.5em 0;
    }

    .timeline .box .content.half p.description {
        margin: 0 0 1.5em 0;
    }

    .timeline .year {
        margin: 2vh 0 0 0;
        font-weight: 500;
        font-size: 2em;
        letter-spacing: -0.05em;
    }

    .timeline .half .year {
        margin: 0 0 2vh 0;
    }

    .timeline .dots {
        width: 100%;
        height: 3vh;
    }

    .timeline .dots .dot {
        width: 7.0125vw;
        float: left;
        margin: 0; 
        padding: 0;

        background-image: url(../assets/svg/timeline_dots.svg);
        background-repeat: repeat-x;
        background-size: auto 100%;
    }

    .timeline .dots .dot.last {
        width: 1.4vw;
    }


    .background-image.glypho_a {
        background-image: url(../assets/images/glypho_a.png);
        background-repeat: no-repeat;
        background-size: auto 100%;

        height: 45vh;
        width: 35vh;

        top: 50vh;
    }

    .background-image.glypho_3 {
        background-image: url(../assets/images/glypho_3.png);
        background-repeat: no-repeat;
        background-size: auto 100%;

        height: 12vh;
        width: 12vh;
        
        top: 30vh;
        z-index: 0;
    }

    .background-image.glypho_o {
        background-image: url(../assets/images/glypho_o.png);
        background-repeat: no-repeat;
        background-size: auto 100%;
        
        height: 45vh;
        width: 60vh;

        bottom: 20vh;
        z-index: 0;
    }

    .background-image.glypho_s {
        top: 3vh;
        background-image: url(../assets/images/glypho_s.png);
        background-repeat: no-repeat;
        background-size: auto 100%;

        height: 10vh;
        width: 30vh;
        /* opacity: 0.8; */
    }

    .background-image.glypho_2 {
        background-image: url(../assets/images/glypho_2.png);
        background-repeat: no-repeat;
        background-size: auto 100%;

        height: 30vh;
        width: 40vh;
        bottom: 20vh;
    }

    .background-image.glypho_m {
        background-image: url(../assets/images/glypho_m.png);
        background-repeat: no-repeat;
        background-size: auto 100%;

        height: 30vh;
        width: 50vh;
        
        top: 15vh;
    }

    .background-image.glypho_p {
        background-image: url(../assets/images/glypho_p.png);
        background-repeat: no-repeat;
        background-size: auto 100%;
        
        height: 20vh;
        width: 40vh;
        top: 2vh;
    }

    .background-image.glypho_u {
        background-image: url(../assets/images/glypho_u.png);
        background-repeat: no-repeat;
        background-size: auto 100%;
        
        height: 30vh;
        width: 50vh;
        top: 20vh;
        
        z-index: 2;
    }

    .background-image.glypho_r {
        background-image: url(../assets/images/glypho_r.png);
        background-repeat: no-repeat;
        background-size: auto 100%;

        height: 10vh;
        width: 25vh;
        bottom: 10vh;
    }

    .background-image.glypho_o_menor {
        background-image: url(../assets/images/glypho_o_menor.png);
        background-repeat: no-repeat;
        background-size: auto 100%;

        height: 20vh;
        width: 50vh;
        top: 35vh;
        
        z-index: 2;
    }

    .background-image.glypho_a_menor {
        background-image: url(../assets/images/glypho_a_menor.png);
        background-repeat: no-repeat;
        background-size: auto 100%;

        height: 10vh;
        width: 15vh;
        bottom: 15vh;
    }

    .background-image.glypho_s_menor {
        background-image: url(../assets/images/glypho_s_menor.png);
        background-repeat: no-repeat;
        background-size: auto 100%;
        
        height: 5vh;
        width: 30vh;
        top: 5vh;
    }





}

@media (max-width: 480px) {
    
    .quote {
        margin: 0 0 2em 0;
    }

    .quote .quote-titulo {
        font-size: 4em;
        font-weight: 500;
        letter-spacing: -.05em;
        line-height: 1.1em;
    }

    .quote .quote-texto {
        margin-top: 1.25em;
    }

    .quote .quote-texto .quote-subtitulo {
        font-size: 2.5em;
        font-weight: 300;
        font-style: italic;
    }

    .quote .quote-texto .quote-descricao {
        margin-top: 1em;
        line-height: 1.5em;
        font-size: 1.5em;
        font-weight: 300;
    }

    .premios {
        text-align: left;
        margin-bottom: 1em;
    }

    .premios .premios-titulo {
        font-size: 2.75em;
        font-weight: 300;
    }

    .premios .separador {
        width: 20vw;
        height: 3px;
        display: inline-block;
        margin: 1vh 0 3vh 5px;
    }

    #premios .box.left {
        text-align: left;
    }

    #premios .box.right {
        text-align: right;
    }

    #premios .box {
        margin-bottom: 1.25em;
    }

    #premios .box .year {
        font-size: 1.75em;
        font-weight: 500;
        margin-bottom: .25em;
    }

    #premios .box .description {
        font-size: 1.35em;
        line-height: 1.35em;
        font-weight: 300;
        font-style: italic;
        letter-spacing: .0125em;
        
    }

}