/**
 * Quote.
 */

#quote, #quote-2 {
    background-color: var(--main-bg-color);
    text-align: center;
    height: 300px;
}

.quote-wrapper {
    display: inline-block;
    margin-top: 100px;
    font-family: var(--display-font);
}

.quote-wrapper span {
    display: block;
    font-size: 2em;
}

.quote-wrapper span:nth-child(odd) {
    color: var(--main-theme-light);
}

.quote-wrapper span:nth-child(even) {
    color: var(--main-theme-dark);
}

@media only screen and (max-width: 600px) {
    #quote, #quote-2 {
        height: 150px;
    }

    .quote-wrapper {
        margin-top: 50px;
    }

    .quote-wrapper span {
        display: block;
        font-size: 1.2em;
    }
}