*{
    box-sizing: border-box;
  }
  .young{
    grid-template-columns: repeat(5,1fr);
    gap: 10px;
    display: grid;
    margin: 10px;

  }
  .y{
    width: 200px;
    height: 300px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 5px;
  }
  .o{
    width: 200px;
    height: 300px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 5px;
  }
  .u{
    width: 200px;
    height: 300px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 5px;
  }
  .n{
    width: 200px;
    height: 300px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 5px;
  }
  .g{
    width: 200px;
    height: 300px;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(6, 1fr);
    gap: 5px;
  }
  .block{
    background: #eb54e1;
    border-radius: 50%;
    mix-blend-mode: multiply; 
    filter: drop-shadow(10px 5px black);
    animation: changecolor 2s infinite alternate;
  }
  .no-block{
    border: none;
  }

  @keyframes changecolor{
    0%{
      background-color:#7feb54;
      border-radius: 15%;
    }
    100%{
      background-color:#eb54e1;
      border-radius: 50%;
    }
  }