.grid-container {
  display: grid;
  grid-template-columns: 250px 250px 250px 250px;
  repeat(3, 1fr);
  grid-template-rows: repeat(10, 1fr);
  gap: 7px 10px;
}

.grid-item {
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content:flex-start;
  color: white;
  font-weight: 600;
}
.image-wrapper {
  float:left;
  padding:5px;
}

.signs {
  column-count: 3;
  border-style: solid;
  border-radius: 3px;
  border-color: orange;
  margin:5px;
  padding:15px;
  background-color:#d1e1f2;
}

.item-1 {
  grid-column: 1 / 2;
  grid-row: 1 / 2;
    justify-content:center;
}

.item-2 {
  grid-column: 1 / 2;
  grid-row: 2 / 3;
  background-color: #f59e0b;
}

.item-3 {
  grid-column: 1 / 2;
  grid-row: 3 / 4;
  background-color: #f59e0b;
}

.item-4 {
  grid-column: 1 / 2;
  grid-row: 4 / 5;
  background-color: #f59e0b;
}

.item-5 {
  grid-column: 1 / 2;
  grid-row: 5 / 6;
  background-color: #8b5cf6;
}

.item-6 {
  grid-column: 1 / 2;
  grid-row: 6 / 7;
  background-color: #06b6d4;
}

.item-7 {
  grid-column: 1 / 2;
  grid-row: 7 / 8;
  background-color: #f97316;
}

.item-8 {
  grid-column: 1 / 2;
  grid-row: 8 / 9;
  background-color: #84cc16;
}

.item-9 {
  grid-column: 1 / 2;
  grid-row: 9 / 10;
  background-color: #ec4899;
}

.item-10 {
  grid-column: 1 / 2;
  grid-row: 10 / 11;
  background-color: #6366f1;
}

.item-11 {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
  background-color: #06b6d4;
      justify-content:center;
}

.item-12 {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
  background-color: #ef4444;
}

.item-13 {
  grid-column: 2 / 3;
  grid-row: 3 / 4;
  background-color: #10b981;
}

.item-14 {
  grid-column: 2 / 3;
  grid-row: 4 / 5;
  background-color: #f59e0b;
}

.item-15 {
  grid-column: 2 / 3;
  grid-row: 5 / 6;
  background-color: #8b5cf6;
}

.item-16 {
  grid-column: 2 / 3;
  grid-row: 6 / 7;
  background-color: #06b6d4;
}

.item-17 {
  grid-column: 2 / 3;
  grid-row: 7 / 8;
  background-color: #f97316;
}

.item-18 {
  grid-column: 2 / 3;
  grid-row: 8 / 9;
  background-color: #84cc16;
}

.item-19 {
  grid-column: 2 / 3;
  grid-row: 9 / 10;
  background-color: #ec4899;
}

.item-20 {
  grid-column: 2 / 3;
  grid-row: 10 / 11;
  background-color: #6366f1;
}

.item-21 {
  grid-column: 3 / 4;
  grid-row: 1 / 2;
  background-color: #3b82f6;
      justify-content:center;
}

.item-22 {
  grid-column: 3 / 4;
  grid-row: 2 / 3;
  background-color: #ef4444;
}

.item-23 {
  grid-column: 3 / 4;
  grid-row: 3 / 4;
  background-color: #10b981;
}

.item-24 {
  grid-column: 3 / 4;
  grid-row: 4 / 5;
  background-color: #f59e0b;
}

.item-25 {
  grid-column: 3 / 4;
  grid-row: 5 / 6;
  background-color: #8b5cf6;
}

.item-26 {
  grid-column: 3 / 4;
  grid-row: 6 / 7;
  background-color: #06b6d4;
}

.item-27 {
  grid-column: 3 / 4;
  grid-row: 7 / 8;
  background-color: #f97316;
}

.item-28 {
  grid-column: 3 / 4;
  grid-row: 8 / 9;
  background-color: #84cc16;
}

.item-29 {
  grid-column: 3 / 4;
  grid-row: 9 / 10;
  background-color: #ec4899;
}

.item-30 {
  grid-column: 3 / 4;
  grid-row: 10 / 11;
  background-color: #6366f1;
}