 body{
   background-image:url(/main/maccat.png);
   background-size: 100px 100px;
   background-repeat:repeat;
   max-width:100%;
   cursor: url("/cursor/arrow.png"), auto;
 }

 p, i, ul{
   font-size:14px;
   font-family: 'virtue', arial;
 }
 
 h2{
   text-align:center;
   font-family:'virtue', arial;
   font-size:18px;
   margin-top:4px;
 }
 h3{
   font-family: 'virtue', arial;
   font-size:14px;
 }
 
 #square{
   height:10px;
   width:10px;
   border: 1px solid black;
   margin: 3px 0 0 3px;
 }
 
 .grid-container{
   display:grid;
   width:60%;
   height:80%;
   text-align:left;
   gap:40px;
   grid-template-columns: 33% 66%;
   grid-template-rows: repeat(10, 10%);
 }
 
 .side{
   grid-column: 1;
   grid-row: 1;
 }
 
 .side2{
   grid-column: 1;
   grid-row: 2;
   text-align:left;
 }
 
 .main{
   grid-column: 2;
   grid-row: 1 / 4;
 }
 
 
 
 .footer{
   text-align:center;
   grid-column: 2;
   grid-row: 10;
 }
 
 .side, .side2, .main{
   background-color:#dddddd;
   border-left: 2px black solid;
   border-right: 2px black solid;
   border-bottom: 2px black solid;
 }
 
 .sideheader, .side2header, .mainheader{
   background-color:#dddddd;
   border-top: 2px black solid;
   height:25px;
 }
 
 .sidecontent, .side2content, .maincontent{
   padding:15px;
   border: 2px inset;
   border-color: black white;
   margin: 5px;
   -webkit-box-shadow: 0px 0px 0px 1px rgba(92,92,92,1);
   -moz-box-shadow: 0px 0px 0px 1px rgba(92,92,92,1); 
   box-shadow: 0px 0px 0px 1px rgba(92,92,92,1);
 }
 

 
 @font-face{
font-family:'charcoal';
src: url(/fonts/CHARCOAL.TTF); 
}

@font-face{
  font-family:'chicago';
  src: url(/fonts/ChiKareGo.ttf);
}

@font-face{
  font-family:'virtue';
  src: url(/fonts/virtue.ttf);
}