body{
    background-image: url(Background-SCP999.png);
    background-size: cover;
    height: 100vh;
    margin: 0;
    background-repeat: no-repeat;
}


.tickle-monster h1{
    color: #b33b72;
    text-align: center;
    position: absolute;
    text-shadow: 5px 5px black;
    font-size: 3rem;
    margin-top: 120px;
}

#buttongiggle{
    position: absolute;
    margin-left: 55vw;
    margin-top: 40vh;
    background-color: pink;
    width: 300px;
    height: 60px;
    font-size: x-large;
}

#tickle-monster{
    display: none;
    justify-content: center;
}

#SCP-999{
    position: absolute;
    margin-left: 30vw;
    margin-top: 30vh;
    height: 60vh;
    width: 40vw;
    filter: drop-shadow(0 0 25px rgba(255,170,0.6));
}

#SCP-999:hover{
    animation-name: wobble;
    animation-duration: 0.5s;
    animation-iteration-count: infinite;
    cursor: grab;
}

    @keyframes wobble {
        0%{scale:1}
        50%{scale:1.1}
        100%{scale:1}
    }

.notes{
  height: 95vh;
  width: 30vw;
  min-width: 100px;
  background-color: white;
  margin-right: auto;
  margin-left: 0;
  overflow-y: scroll;
}

.notes p{
  margin-left: 15px;
  margin-right: 15px;
}

.headofnote{
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.notes h1{
    color: red;
    margin-left: 15px;
}

.notes h2{
  margin-left: 15px;
  margin-bottom: 10px;
}

.objectdescription{
  margin-top: 80px;
}

@media screen and (max-width: 1280px){
  
  body{
    height: 100vh;
  }
  
  .notes{
  position: absolute;
  z-index: 1;
  width: 80vw;
  margin-left: 50px;
  margin-top: 100vh;
  }
  
  #SCP-999{
    width: 90vw;
    margin-left: 5%;
  }

  #buttongiggle{
    margin-left: 15vw;
  }

}