.main-year {
    grid-area: year;
}

.main-plz {
    grid-area: plz;
}

.main-display {
    grid-area: display;
}

.main-selects {
    grid-area: selects;
}

.main-buttons {
    grid-area: buttons;
}

.wrapper {
    display: grid;
    gap: 10px;
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
        "year plz"
        "display display"
        "selects selects"
        "buttons buttons";

}

@media (min-width: 500px) {
    .wrapper {
        grid-template-columns: 1fr 1fr 2fr;
        grid-template-areas:
            "year plz display"
            "selects selects buttons";
    }
}

@media (min-width: 850px) {
    .wrapper {
        grid-template-columns: 1fr 1fr 2fr 2fr 2fr;
        grid-template-areas:
            "year plz display selects buttons";
    }
}


.mrktstmmfile-wrapper {
    display: grid;
    gap: 0px;
    grid-template-columns: [name mail app] auto;
    grid-auto-flow: row dense;
    border: 1px dotted #e9e9e9;
    margin-bottom: 20px;
  }
  
  @media (min-width: 600px) {
    .mrktstmmfile-wrapper {
      display: grid;
      gap: 0px;
      grid-template-columns: [name] auto [mail] auto [date] auto;
      grid-auto-flow: row dense;
    }
  }
  
  .mrktstmmfile-wrapper>div {
    border: 1px solid #e9e9e9;
    padding: 10px;
  
  }
  
  .mrktstmmfile-wrapper>.file-name {
    grid-column: name;
    grid-row: auto;
  }
  
  
  .mrktstmmfile-wrapper>.file-mail {
    grid-column: mail;
    grid-row: auto;
  
  
  }
  
  .mrktstmmfile-wrapper>.file-date {
    grid-column: date;
    grid-row: auto;
  
  }

  .mzm-import-file{
    display: grid;
    gap: 0px;
    grid-template-columns: 30% 30% 40%;
    grid-auto-flow: row dense;
    border: 1px dotted #e9e9e9;
    margin-bottom: 20px;
  }
  .mzm-import-file>div {
    border: 1px solid #e9e9e9;
    padding: 10px;
    text-align: top;
  }
  .mzm-import-file>.box1 {
    grid-column-start: 1;
    grid-column-end: 4;
    grid-row-start: 1;
    grid-row-end: 1;
  }
.mzm-import-file-ul{
  padding-left: 0px;
}