:root {
background-color: #2c612c;
box-sizing: border-box;
font-family: Verdana,Geneva,sans-serif;
}

:any-link {
  text-decoration: none;
  color: inherit;
}

@font-face {
    font-family: 'Mostwaste';
    src: url('mostwasted/MostWazted.woff2') format('woff2'),
        url('mostwasted/MostWazted.woff') format('woff'),
        url('mostwasted/Mostwasted.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap; }

@font-face {
    font-family: 'BabyDoll';
    src: url('babydoll/BabyDoll.woff2') format('woff2'),
        url('babydoll/BabyDoll.woff') format('woff'),
        url('babydoll/Baby\ Doll.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    font-display: swap; }

.container {  display: grid;
height: 100vh;
    grid-template-columns: 1fr;
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "Wholepage";
}

.Wholepage {  display: grid;
  overflow:hidden;
  grid-template-columns: 2% 96% 2%;
  grid-template-rows: 2% 96% 2%;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    ". . ."
    ". background ."
    ". . .";
  grid-area: Wholepage;
}

.background {  display: grid;
    background-image: url(Images/space.jpg);
    border-radius: 10px;
    background-size:400px;
  grid-template-columns: 20% 80%;
  grid-template-rows: 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "Left working";
  grid-area: background;
}

.Left {  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    "Tags Tags Tags"
    "bullshit bullshit bullshit"
    "bullshit bullshit bullshit";
  grid-area: Left;
}

.Tags { grid-area: Tags;
text-align: center;
margin-top: 2%;
margin-left: 2%;
border: #52ff52 solid 4px;
border-radius: 10px; 
border-style:groove; }

.bullshit { grid-area: bullshit; 
 margin: 0 auto;
 text-align: center;}

.working {  display: grid;
  grid-template-columns: 30% 35% 35%;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-template-areas:
    ". Titleblock Titleblock"
    "contentrange contentrange contentrange"
    "contentrange contentrange contentrange"
    "contentrange contentrange contentrange"
    "contentrange contentrange contentrange";
  grid-area: working;
}

.Titleblock { grid-area: Titleblock;
  font-family: 'Mostwaste',Verdana,Geneva,sans-serif;
  color: white;
  font-size: 100px;}

.contentrange {  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  grid-template-rows: 1fr 1fr 1fr;
  gap: 0px 0px;
  grid-auto-flow: row;
  grid-area: contentrange;
}

.notebook { 
  grid-area: 1 / 1 / 4 / 4;
font-family: 'BabyDoll',Verdana,Geneva,sans-serif;}

.decorright { grid-area: 1 / 4 / 3 / 5;
overflow: hidden;}

.decoroverlap { grid-area: 3 / 3 / 4 / 5; 
  z-index: 2;
}

.linkdecoration {
  color: rgb(21, 114, 21);
  text-decoration: underline;
}

::-webkit-scrollbar {
  visibility: hidden;
}