body {
  font-family: "Trebuchet MS", sans-serif;
}

.sidenav {
  height: 100%;
  width: 0;
  position: fixed;
  z-index: 1;
  top: 0;
  left: 0;
  background-color: #212529;
  overflow-x: hidden;
  transition: 0s;
  padding-top: 50px;
  text-align:center;
}

.sidenav a {
  text-decoration: none;
}

.sidenav div {
  padding: 4px 4px 4px 32px;
  font-size: 18px;
  color: #EEEEEE;
  display: block;
  transition: 0.3s;
  line-height: 1.2;
}

.sidenav div:hover{
  color: #f1f1f1;
}

.sidenav .closebtn {
  position: absolute;
  top: 0;
  right: 25px;
  font-size: 50px;
  margin-left: 50px;
}

/* IphoneXS 2436x1125px at 458ppi */
@media only screen
and (min-device-width: 375px) 
and (max-device-width: 812px) 
and (-webkit-min-device-pixel-ratio: 3)
{ 
  // Navigation Menu
  .sidenav { padding-top: 20px;}
}


/* Responsive Font-Size */
html { font-size: calc(1em) }
h1 { font-size: 2em }
h2 { font-size: 1.5em }
button { font-size: inherit }
input { font-size: inherit }