nav > a {
  color: black;
  padding: 1em;
}
#icon {
  display: block;
  margin: auto;
  width: 15em;
}
.compactIcon {
  display: block;
  width: 8em;
  margin: auto;
}

h1 {
  display: block;
  margin: 0.5em auto;
  text-align: center;
}
h2 {
  text-align: center;
}
nav {
  text-align: center;
}
article {
  max-width: 50em;
  display: block;
  margin: auto;
}
header {
  font-weight: bold;
  padding: 0.5em 0;
}
body {
  display: flex;
  flex-direction: column;
  height: 100vh;
  margin: 0;
}
main {
  flex-grow: 1;
}
header,
main,
footer {
  flex-shrink: 0;
}
.select-studiengang {
  display: grid;
  grid-template-columns: auto auto auto;
}
.form-field >label{
    display: block;
}
.form-field{
    max-width: 20em;
}
footer {
  padding: 1em;
}
header {
  font-weight: normal;
}

.add-button{
    color: green;
    background: none;
    border: none;
}

.remove-button{
    color: red;
    background: none;
    border: none;
}

.ical > a{
    display: block;
}


@font-face {
    font-family: 'Material Icons';
    font-style: normal;
    font-weight: 400;
    src: url(fonts/MaterialIcons-Regular.eot); /* For IE6-8 */
    src: local('Material Icons'),
      local('MaterialIcons-Regular'),
      /* url(fonts/MaterialIcons-Regular.woff2) format('woff2'),
      url(fonts/MaterialIcons-Regular.woff) format('woff'), */
      url(fonts/MaterialIcons-Regular.ttf) format('truetype');
  }
  

  .material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;  /* Preferred icon size */
    display: inline-block;
    line-height: 1;
    text-transform: none;
    letter-spacing: normal;
    word-wrap: normal;
    white-space: nowrap;
    direction: ltr;
  
    /* Support for all WebKit browsers. */
    -webkit-font-smoothing: antialiased;
    /* Support for Safari and Chrome. */
    text-rendering: optimizeLegibility;
  
    /* Support for Firefox. */
    -moz-osx-font-smoothing: grayscale;
  
    /* Support for IE. */
    font-feature-settings: 'liga';
  }
  
.configure{
    padding: 3em;
    display: grid;
    grid-template-columns: 50% 50%;
}
.configure > h2{
    grid-column: 1 /3;
}
#stundenplan{
    display: grid;
}
.termin{
  border: .5pt solid black;

}