*{box-sizing:border-box}html{height:100%;background:#333 url("background.jpg") center center no-repeat;background-size:cover}body{color:#fff;font-family:"Montserrat",serif}button{background-color:inherit;color:#fefefe;border:none;opacity:.5}button:hover{opacity:1}a{text-decoration:none;opacity:.5}a:hover{opacity:1}.container{margin:0 auto}.panel-quote{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:50%;margin:auto;box-sizing:border-box;background-color:#000;opacity:.95;display:flex;flex-direction:column;min-height:300px;justify-content:space-between}.quote-progress{width:0;height:3px;background-color:#9e9e9e}blockquote{padding:30px;font-size:2.5em}.quote{font-family:"Crimson Text",serif;font-size:2em}.author{font-size:.5em;font-weight:lighter;text-align:right;font-style:italic}.quote-nav{display:flex;align-items:stretch;width:100%;padding-bottom:30px;position:relative;bottom:0}.previous{margin:auto}.next{margin:auto}@media screen and (max-width:460px){.panel-quote{width:100%}blockquote{font-size:2.5em}}@media screen and (min-width:461px) and (max-width:768px) and (orientation:portrait){.panel-quote{width:100%}}@media screen and (min-width:461px) and (max-width:768px) and (orientation:landscape){.panel-quote{width:50%}}@media screen and (min-width:769px){blockquote{font-size:2em}}