body {
    background-color: black;
  }

  .menu, .about-me {
    position: absolute;
    top: 50%;
    left: 50%;
  }

  .menu {
    display: block;
    transform: translate(-50%, -50%);
    opacity: 1;
    transition: opacity 0.5s ease-in-out 0.5s, transform 0s linear 0.5s;
  }
  
  .submenu {
    position: relative;
    display: flex;
    justify-content: space-between;
  }
  
  .submenu, .projectMenu {
    margin: 0;
    padding: 0;
  }
  
  .submenu li {
    opacity: 0.65;
  }
  
  .submenu li:hover {
    opacity: 1;
  }
  
  a {
    text-decoration: none;
  }
  
  a, h1, li, .about-me {
    font-family: 'Roboto', sans-serif;
    color: #E41A38;
  }
  
  h1 {
    font-size: 7em;
    animation-name: opaqueness;
    animation-direction: alternate-reverse;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    margin: 0;
  }
  
  li {
    font-size: 2em;
  }
  
  .projectMenu li a {
    color: white;
    font-size: 0.85em;
  }
  
  @keyframes opaqueness {
    from {
      opacity: 1;
    } to {
      opacity: 0.5;
    }
  }
  
  input[type="checkbox"] {
    display: none;
    visibility: hidden;
  }
  
  .submenu, .projectMenu {
    list-style: none;
  }
  
  .projectMenu {
    visibility: hidden;
  }
  
  #projectsToggle:checked ~ .submenu .projectItem {
    opacity: 1;
  }
  
  #projectsToggle:checked ~ .container .menu .submenu .projectMenu {
    visibility: visible;
  }

  #aboutToggle:checked ~ .container .menu {
    transform: translateX(-1000%);
    opacity: 0;
    transition: opacity 0.5s ease-in-out, transform 0s linear 0.5s;
  }
  
  .about-me {
    display: block;
    color: white;
    border: 0.35em solid #E41A38;
    padding: 1em;
    width: 488px;
    transform: translateX(-1000%);
    opacity: 0;
    transition: opacity 0.5s ease-in-out, transform 0s linear 0.5s;
  }

  #aboutToggle:checked ~ .container .about-me {
    transform: translate(-50%, -50%);
    opacity: 1;
    transition: opacity 0.5s ease-in-out 0.5s, transform 0s linear 0.5s;
  }

  .backButton {
    color: white;
    font-size: 2em;
    position: absolute;
    right: 0;
    top: 0;
  }

  .backButton:hover {
    opacity: 0.5;
  }