.modal_header-bg,
.modal_about-bg,
.modal_import-bg {
  display: none;
  background-image: repeating-linear-gradient(
    90deg,
    #4256b1 0%,
    #4256b1 25%,
    #4154a7 25%,
    #4154a7 50%,
    #4256b1 50%,
    #4256b1 75%,
    #4154a7 75%,
    #4154a7 100%
  );
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 99999;
  animation: backInRight;
  animation-duration: 1s;
}
.modal_header-bg {
  overflow-y: scroll;
}
.modal_header-display,
.modal_about-display,
.modal_import-display {
  display: block;
}

#modal_header-text,
#modal_about-text,
#modal_import-text {
  margin: 15px;
  cursor: pointer;
  position: absolute;
  left: 100;
  transition: all 0.6s;
  box-sizing: content-box;
}

#modal_header-text:hover,
#modal_about-text:hover,
#modal_import-text:hover {
  color: var(--white);
  transform: rotate(180deg);
}

.modal_header,
.modal_about,
.modal_import {
  padding: 30px;
  margin: 100px auto;
  max-width: 750px;
}

.modal_header div,
.modal_about div,
.modal_import div {
  text-align: justify;
}

.modal_header span,
.modal_about span,
.modal_import span {
  color: var(--white);
  font-size: var(--text);
  line-height: 40px;
}

@media (max-width: 750px) {
  .modal_header span,
  .modal_about span,
  .modal_import span {
    line-height: 25px;
  }
}