.history_wrapper {
  display: grid;
  grid-template-columns: 1fr;
  grid-template-areas: none;
  gap: 16px;
  background-color: #00001b;
  box-shadow: 0 0 5px rgba(0, 0, 27, 0.25);
  border-radius: 16px;
  padding: 16px;
}

.history_img_wrap {
  grid-area: auto;
  height: auto;
  border-radius: 16px;
  overflow: hidden;
}

.history_content_wrap {
  grid-area: auto;
}

.history_content {
  font-size: 12px;
  font-weight: 500;
  color: #adadb6;
}

@media screen and (min-width: 768px) {
  .history_wrapper {
    grid-template-columns: repeat(2, 1fr);
  }

  .history_wrapper:nth-child(odd) {
    grid-template-areas: "img content";
  }

  .history_wrapper:nth-child(even) {
    grid-template-areas: "content img";
  }

  .history_img_wrap {
    grid-area: img;
  }

  .history_content_wrap {
    grid-area: content;
  }
}

@media screen and (min-width: 1024px) {
  .history_content {
    font-size: 14px;
  }
}

@media screen and (min-width: 1200px) {
  .history_wrapper {
    gap: 24px;
    padding: 24px;
  }
}

@media screen and (min-width: 1440px) {
  .history_content {
    font-size: 16px;
  }
}