@font-face {
    font-family: groovy;
    src: url("groovy.ttf");
}


body {
    background-image: url(https://images.unsplash.com/photo-1575184560884-5f3ece6e636c?q=80&w=1170&auto=format&fit=crop&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D);

 min-height: 100vh; 
    font-family: sans-serif;
    color:aliceblue

    padding: 20px;
}
.header {
    margin-top: 10px;
    margin-left: 10px;
    text-align: center;
  
}

h1 {
    font-family: groovy;
    font-size: 87px;
      color: rgb(231, 123, 34);
       -webkit-text-stroke: 2px rgb(92, 11, 25);

}
.sidebar {
    width: 17%;
    height: 70%;
    position: absolute;
  
    top: 15%;
    left: 4%;
    border: 3px solid rgb(92, 11, 25);
    background-color: rgba(219, 94, 72, 0.712);
    background-repeat: repeat;
    text-align: center;
 
   
}

.button {
  background-color: rgb(117, 52, 32);
  border: 3px solid rgb(196, 131, 78);
  color: rgb(196, 131, 78);
  border-radius:10px;
  text-align: center;
  text-decoration: none;
  font-size: 40px;

  padding: 15px 32px;
  display: inline-block;
   margin: 4px 2px;
  transition-duration: 0.4s;
  cursor: pointer;
 
}

.button:hover {
    background-color: rgba(39, 4, 4, 0.712);
     color: rgb(172, 13, 13);
      border: 3px solid rgba(39, 4, 4, 0.712);
}




.sidebtn:hover{
    opacity: 0.5;
}



#webmaster {
height: 290;
width: 240px;
border-radius: 6px;
margin-top: 10px;
margin-left: 25px;
padding: 0px;
font-size: 15px;
line-height: 15px;
font-family: pencil;
  border: 1px solid lime;

background-size: 60%;
        background-blend-mode: darken;
  background-color: rgba(0,0,0,0.0);
}

.content {

border-radius: 6px;
  border: 3px solid rgb(92, 11, 25);
    background-color: rgba(219, 94, 72, 0.712);
width: 900px;
margin-left: 520px;
margin-top: 30px;
overflow-y:auto;
text-align: left;
height: 500px;
color: rgb(255, 155, 61);
padding: 15px;
font-size: 25px;
font-family:"pencil";
}