@font-face {
        font-family: 'DaDa';
        src: url('https://house-on-the-hill.neocities.org/fonts/DaDa.ttf');
      }
      @font-face {
        font-family: 'Positions';
        src: url('https://house-on-the-hill.neocities.org/fonts/PositionsByArixbored-Regular%20.otf');
      }
      @font-face {
        font-family: 'Neraphic';
        src: url('https://house-on-the-hill.neocities.org/fonts/Neraphic.otf');
      }
      
    body{
      background-image:url('https://bettysgraphics.neocities.org/images/backgrounds/stars%202.gif');     
      .container {
        display: grid;
        grid-template-areas:
        "header header"
        "box box"
        "footer footer";
        grid-template-columns: 
        1fr 3fr;
        padding: 5px;
        gap: 0px;
        width: 1000px;
        margin: auto;
        justify-content: center;
        
      }
      .container div{
       background-color: rgba(0,0,0,0.60);
       padding: 10px;
       border-width: 3px;
       border-color: #12355B;
       border-style: solid;
       color: #fcea20;
      }
      .container div.box {
        background-color: rgba(0,0,0,0.60);
        border-radius: 40px 0px 0px 0px;
        height: 550px;
      }
      .container div.header {
        grid-area: header;
        height: 0px; 
        background-color: none;
        margin-top:20px;
        border-radius: 40px 40px 0px 0px;
        border-style: none;
        border-width: 3px;
        border-color: #12355B;
      }
      .container div.footer {
        grid-area: footer;
        text-align: center;
        height: 60px;
        border-radius: 0px 0px 40px 40px;
        border-width: 3px;
        border-color: #12355B;
        box-shadow: 0px 0px 15px #53d9e8;
      }
      
      .innerContainer {
        display: grid;
        grid-template-areas:
        "status thing"
        "images other";
        grid-template-columns:
        1.5fr 2fr;
        border-style: none;
        background-color: transparent;
      }
      .innerContainer div {
        height: 200px;
        border-style: none;
        background-color: transparent;
      }
      .innerContainer div.status{
        background-color: rgb(0 255 197 / 0.15); 
        border-radius: 25px;
      }
      .innerContainer div.thing{
      }
      .innerContainer div.images{
        
      }
      .innerContainer div.other{

      }
      
      h1{
        font-family: 'DaDa';
        color: #fcea20;
        text-align: center;
        margin: 5px;
        font-size: 50px;
      }
      h2{
        font-family: 'DaDa';
        color: #fcea20;
        text-align: center;
        margin: 5px;
        font-size: 20px;
      }
      p {
        font-family:'Neraphic';
        color: #EC0B43;
        margin: 5px;
        font-size: 16px;
        line-height: 26px;
      }
      a {
        color: #00FFC5;
        font-family:'Neraphic';
        font-size: 16px;
        line-height: 26px;
        margin: 5px;
        text-decoration: none;
      }