body {
    background-color: #282828;
    color: #909097;
    font-family: Helvetica ;
    font-weight: lighter;
    font-size: 1.75vh;
    text-align: center;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    margin: 0;
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
    monospace;
}

li {
    padding-top: 0.25em;
    list-style: none;
}

a {
    color: #f0f0f0;
    text-decoration: none;
    font-weight: bold;
}

#wrapper {
    margin: auto;
    margin-top: 10vw;
    width: 50vw;
    height: auto;
}

#infoBar {
    color: #f0f0f0;
    text-align: right;
    font-weight: bold;
    margin-top: 2vw;
    margin-right: 2vw;
    /*margin-left:2vw;*/
}

#links {
    display: grid;
    grid-auto-rows: minmax(12.5vh, auto);
    text-align: left;
    justify-items: center;
}

@media screen and (min-width: 40em) {
  #links {
    grid-template-columns: repeat(3, 1fr);
    grid-gap: 0.5rem 0.75rem;
  }
}

@media screen and (max-width: 40em) {
  #links {
    grid-template-rows: repeat(3, 1fr);
    grid-gap: 0.5rem 0.75rem;
    justify-items: left;
    font-size: 3.5vh;
  }
  #infoBar {
    font-size: 1.75vh;
  }
}