* {
  font-family    : 'Open Sans';
  margin         : 0;
  padding        : 0;
  border-spacing : 0;
  box-sizing     : border-box;
  -moz-box-sizing: border-box;
  scrollbar-width: none;
}

html {
  width                   : 100%;
  min-width               : 100%;
  height                  : 100%;
  min-height              : 100%;
  -webkit-text-size-adjust: 100%;
}

body {
  top                    : 0;
  left                   : 0;
  bottom                 : 0;
  right                  : 0;
  /* width:100%;
height: 100%;
min-height: 100%; */
  font-size              : 16px;
  text-rendering         : optimizeLegibility;
  -webkit-font-smoothing : antialiased;
  -moz-osx-font-smoothing: grayscale;
  z-index                : 100;
}

a {
  text-decoration: none;
  font-family    : Open Sans;
  font-size      : 16px;
  color          : #000000;
}

table,
td,
tr {
  border         : 0;
  border-spacing : 0;
  border-collapse: collapse;
  margin         : 0;
  padding        : 1px;
  vertical-align : top;
}

img {
  display: inline-block;
}

.ico {
  height : 1em;
  width  : auto;
  display: inline;
}

.container {
  top           : 3vh;
  left          : 25vw;
  width         : 600px;
  padding-bottom: 3vh;
  display       : block;
  position      : absolute;
}

.overlay {
  top             : 0;
  bottom          : 0;
  left            : 0;
  right           : 0;
  background-color: #000000dd;
  width           : 100vw;
  height          : 100vh;
  justify-content : center;
  align-items     : center;
  display         : none;
  position        : fixed;
  z-index         : 30;
}

.img_overlay {
  vertical-align: middle;
  max-width     : 95vw;
  max-height    : 95vh;
}

.item {
  padding: 0 0 30px;
  width  : 600px;
}
/* why? */
.item p {
  padding: 0 0 10px;
}

.img_600 {
  width : 600px;
  height: auto;
}

.img_grid_200 {
  width : 100%;
  height: auto;
}

.item table tr .table_title {
  padding-bottom: 10px;
}

.item table tr:not(:first-child) .table_title {
  padding-top: 30px;
}

.cv_item {
  white-space: pre-line;
}

.td_date {
  padding-right: 1em;
}

.description {
  width     : 100%;
  text-align: center;
  font-size : 11px;
}

.nowrap {
  white-space: nowrap;
}

.title {
  font-style: italic;
}
/* Menu */
.head {
  font-size: 20px;
}
/* a[href$=".pdf"]::before { */
/* //Works, hat aber keine Möglichkeit die Größe zu bestimmen. */
/* content: url("../img/pdf_ico.png"); */
/* } */
.menu_wrapper {
  top               : 0;
  left              : 0;
  height            : 100vh;
  width             : 20vw;
  padding-left      : 1.5vw;
  display           : grid;
  grid-template-rows: repeat(10, 1fr);
  position          : fixed;
}

.item1 {
  padding-top: 3vh;
  grid-row   : 1;
  white-space: nowrap;
}

.item2 {
  grid-row: 2 / 10;
}

.item2 p {
  padding    : 0 0 15px;
  white-space: nowrap;
}

.item3 {
  grid-row: 10;
}

.item4 {
  display: none;
}

.menup {
  vertical-align: middle;
}
/* iPAD */
@media all and (max-width: 768px) {}
/* iPAD */
@media all and (max-width: 1200px) {
  .container {
    left                                 : 25vw;
    top                                  : 10vh;
    bottom                               : 0;
    width                                : 50vw;
    height                               : 100vh;
    display                              : grid;
    grid-template-rows                   :repeat(2, 1fr;) grid-template-columns: 1fr;
    position                             : absolute;
    z-index                              : -1;
  }

  .item {
    width   : 100%;
    position: relative;
    /* text-align:center; */
  }

  .item p:not(.description) {
    text-align: left;
  }

  .img_600,
  table {
    width : 100%;
    height: auto;
  }

  .menu_wrapper {
    /* border: 1px solid blacK; */
    height               : auto;
    width                : 100vw;
    padding              : 0 0 10px;
    display              : grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows   : 1fr 1fr;
    background-color     : #ffffffdd;
    border-bottom        : 1px solid white;
    box-shadow           : 0 0 10px #ffffff;
  }

  .item1 {
    grid-column: 1 / 4;
    grid-row   : 1;
    padding    : 5px 0 0 5px;
  }

  .item2 {
    padding-top          : 5px;
    grid-column          : 1 / 5;
    grid-row             : 2;
    display              : grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    justify-items        : center;
  }

  .item2 p {
    padding: 0;
  }

  .item3 {
    grid-column          : 4;
    grid-row             : 1;
    padding              : 5px 1.5vw 0 0;
    display              : grid;
    grid-template-columns: 1fr 1fr;
    justify-items        : flex-end;
  }
}
@media all and (max-width: 1000px) {
  .container {
    left : 20vw;
    width: 60vw;
  }
}
@media all and (max-width: 800px) {
  .container {
    left : 10vw;
    width: 80vw;
  }
}
@media all and (max-width: 640px) {
  .container {
    top    : 15vh;
    left   : 0;
    width  : 100vw;
    padding: 0 10px;
  }

  .menu_wrapperOpen {
    width                : 100vw;
    grid-template-rows   : repeat(7, 1fr);
    grid-template-columns: 1fr;
    align-items          : center;
  }

  .menu_wrapper {
    width                : 100vw;
    grid-template-rows   : 1fr;
    grid-template-columns: 1fr 1fr;
    align-items          : center;
  }

  .item1 {
    grid-column: 1;
    grid-row   : 1;
  }

  .item2 {
    grid-column          : 1/3;
    grid-row             : 5/8;
    display              : grid;
    grid-template-columns: 1fr;
    grid-template-rows   : 1fr 1fr 1fr 1fr;
  }

  .item3 {
    grid-column          : 1/3;
    grid-row             : 3/4;
    padding              : 0;
    display              : grid;
    grid-template-columns: 1fr;
    grid-template-rows   : 1fr 1fr;
    justify-items        : center;
  }

  .item4 {
    grid-column: 2;
    grid-row   : 1;
    cursor     : pointer;
    text-align : right;
    padding    : 5px 1.5vw 0 0;
    display    : block;
  }

  .item4 span {
    padding: 0.1rem;
  }

  .item4 span:last-Child {
    font-size: 1.3rem;
  }

  video {
    max-width: 635px;
  }

  .video_em {
    max-width: 635px;
    width    : 600px;
    height   : 337px;
  }

  .itemClosed {
    display: none;
  }

  .td_date {
    padding-right: 0.5em;
  }
}