*{
  box-sizing: border-box;
}

.flex-container{
  display: flex;
  flex-wrap: nowrap;
}

.letter{
  width: 200px;
  height: 800px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(5, 1fr);
  gap: 5px;
  margin-right: 40px;
}

.block{
  background-color: rgb(0 255 0);
  border-radius: 50% 0 0% 0;
  transform: rotate(10deg);
  filter: drop-shadow(15px 15px yellow);
   mix-blend-mode: multiply; 
/*  filter: blur(30px);*/
/*  transition: background-color 600ms ease-in-out;*/
  animation: changebg 3s infinite alternate;
}

/*.block:hover{
  background-color: rgb(63,94,251,1);
}*/
.no-block{
/*  border: 5px solid red;*/
}
.text-shadow{
  position: fixed;
  top: 0;
  color: white;
  font-size: 100px;
  font-weight: bold;
  -webkit-text-stroke: 1px #6F0000;
  text-shadow: 10px 10px 0px #6F0000;
}

@keyframes changebg{
  0%{
    background-color: yellow;
/*    border: 5px solid black;*/
    transform: rotate(0deg);
  }
  100%{
    background-color: blue;
/*    border: 5px dotted red;*/
    transform: rotate(180deg);
  }
}


.square{
  width: 100px;
  height: 100px;
  border: 3px solid black;
}

.fixed{
  position: fixed;
  top: 100px;
  left: 500px;
}

.absolute{
  position: absolute;
  top: 100px;
  left: 500px;
}

.absolute-container{
  width: 500px;
  height: 500px;
  border: 1px solid blue;
  position: relative;
  top: 30px;
  left: 30px;
}




