Верстка цитаты — Mike

<section class="t-bq-section" id="mike">
    <div class="t-bq-wrapper t-bq-wrapper-boxed">
        <div class="t-bq-quote t-bq-quote-mike">
            <div class="t-bq-quote-mike-qmark"><span>&#10077;</span></div>
            <div class="t-bq-quote-mike-base">
                <blockquote class="t-bq-quote-mike-text" cite="Albert Einstein">
                    If you can't explain it to a six year old, you don't understand it yourself.
                </blockquote>
            </div>
        </div>
    </div>
</section>

.t-bq-quote-mike {
    position: relative;
    border-top: 0.38em solid darkslateblue;
    border-bottom: 0.38em solid darkslateblue;
    padding: 20px 0!important;
    letter-spacing: -0.08em;
    transform: rotate(2deg);
    max-width: 640px;
    font-family: "Open Sans", sans-serif;
    margin: 40px auto;
}

.t-bq-quote-mike .t-bq-quote-mike-qmark {
    position: absolute;
    font-size: 10em;
    color: midnightblue;
    opacity: 0.2;
    bottom: 10px;
    right: 0;
    -moz-user-select: none;
    -ms-user-select: none;
    -webkit-user-select: none;
    user-select: none;
}

.t-bq-quote-mike .t-bq-quote-mike-base .t-bq-quote-mike-text {
    font-weight: bold;
    font-size: 2.4rem;
    line-height: 1.3em;
    color: darkslateblue;
}

.t-bq-quote-mike .t-bq-quote-mike-base .t-bq-quote-mike-text:after {
    content: "\2014\00A0" attr(cite);
    display: block;
    font-size: 0.5em;
    color: midnightblue;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    font-weight: bold;
    margin-top: 10px;
    margin-left: -1.38em;
}

@media screen and (max-width: 768px) {
    .t-bq-quote-mike .t-bq-quote-mike-base .t-bq-quote-mike-text:after{
        margin-left: 0;
    }
}


@media screen and (max-width: 480px) {
    .t-bq-quote-mike .t-bq-quote-mike-base .t-bq-quote-mike-text {
        font-size: 1.8rem;
    }
}