/* for laptops, tablets & pcs with larger screens */
@media screen and (min-width: 960px) {

    blockquote:before, blockquote:after {
        font-size: 3em;
        font-size: 4vw;
    }

}

/* for phones and tablets with smaller screens */
@media screen and (max-width: 959px) {

    blockquote:before, blockquote:after {
        font-size: 1.5em;
        font-size: 7.5vw;
    }

}

.quoteContainer {
    z-index: 1;
    background: white;
    padding: 2em;
    padding: 2vw;
}

blockquote {
    padding: 2em;
    padding-right: 1.5em;
    padding: 3vw;
    padding-right: 2.5vw;
    position: relative;
    color: #999;
}

blockquote p {
    color: #555;
}

blockquote {
    border-color: gray;
    border-style: solid;
    border-width: 1px;
    border-width: 0.1vw;
}
blockquote:before, blockquote:after {
    background-color: white;
    font-weight: 800;
    position: absolute;
    height: 20px;
    height: 2vw;
    z-index: 2;
}

blockquote:before {
    content:"\201D";
    padding: 0 12px 11px 0;
    padding: 0vw 1vw 2vw 0vw;
    left: -8px;
    left: -1vw;
    top: -8px;
    top: -1.5vw;
}

blockquote:after {
    content:"\201C";
    padding: 9px 0 0 11px;
    padding: 0.5vw 0vw 0vw 1vw;
    right: -8px;
    right: -1vw;
    bottom: -7px;
    bottom: -0.5vw;
}

blockquote cite {
    margin-top: 5px;
    margin-top: 1vw;
}

blockquote cite:before {
    content:"\2014 \2009";
}