@font-face{
	font-family: dotMatrix;
	src: url('/fonts/dotmatri.woff2');
	font-display: swap;
}

div#container{
	background-color: #ffffff;
	background-image:
	    linear-gradient(rgba(0,0,0,.08) 1px, transparent 1px),
	    linear-gradient(90deg, rgba(0,0,0,.08) 1px, transparent 1px),
	    linear-gradient(rgba(0,0,0,.18) 2px, transparent 2px),
	    linear-gradient(90deg, rgba(0,0,0,.18) 2px, transparent 2px);
   	background-size:
	    10px 10px,
	    10px 10px,
	    50px 50px,
	    50px 50px;
}

div#container > div#story{
  font-family: dotMatrix;
  padding: 26px;
  font-size: 22pt;
  background: repeating-linear-gradient(
    0deg,
    #CBDFD6,
    #CBDFD6 20px,
    #FDFFFE 0px,
    #FDFFFE 40px
  );
  border-width: 0 32px;
  border-color: #FDFFFE ;
  border-style: solid;
  background-repeat: repeat;
  color: #000000;
  box-shadow: 0 8px 8px rgba(33,33,33,.7);
  h1{
    margin: 0;
    font-size: 22pt;
    text-align: center;
  }
  hr{
    border: 0;
    height: 4px;
  }
  @media only screen and (max-width: 769px){
    font-size: 16pt;
    border-width: 0;
  }
}