mainStyle.css

html div {
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 30pt;
  color: black;
}

br {
   display: block;
   margin: 10pt 0;
   content: " ";
}

.outer-div
{
     display: flex;
     position: absolute;
     bottom: 30px;
     width: 100%;
}
.inner-div
{
     margin: 0 auto;
}

#quote {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  width: 50%;
  height: 30%;
  margin: auto;
  background-color: rgb(249, 248, 248, 0.7);
  padding-top: 50;
}

#quote_bg {
  /* Absolutely position it, but stretch it to all four corners, then put it just behind #search's z-index */
  position: absolute;
  top: 0px;
  right: 0px;
  bottom: 0px;
  left: 0px;
  z-index: 99;

  /* Pull the background 70px higher to the same place as #bg's */
  background-position: center -70px;

  -webkit-filter: blur(10px);
  filter: url('/media/blur.svg#blur');
  filter: blur(10px);
}

@font-face {
font-family: 'BitReg';
font-style: normal;
font-weight: normal;
src: local('BitReg'), url('BitReg.woff') format('woff');
}

@font-face {
font-family: 'GrtVibe';
font-style: normal;
font-weight: normal;
src: local('GrtVibe'), url('GrtVibe.woff') format('woff');
}


/*------------------------------------*\
    BORDERS
\*------------------------------------*/

/* Create a series of empty pseudo-elements... */
html:before,html:after,body:before,body:after{
    content:"";
/*    background:#f43059;*/
    position:fixed;
    display:block;
    z-index:5;
}

/* ...and position them! */
html:before{
    height:5pt;
    left:0;
    right:0;
    top:0;
}
html:after{
    width:5pt;
    top:0;
    right:0;
    bottom:0;
}
body:before{
    height:5pt;
    right:0;
    bottom:0;
    left:0;
}
body:after{
    width:5pt;
    top:0;
    bottom:0;
    left:0;
}