/* styles for metahuman lounge vs. 1
  ascii art  internet art meta lounge

    font-family: 'DotGothic16', sans-serif;

    font-family: 'Metal Mania', cursive;

    font-family: 'UnifrakturCook', cursive;
*/


body {
    padding: 0 5vw;
}

.main {
  display: flex;
  flex-direction: row;
  text-align: center;
}
.topCat {
 flex: 25%;
 padding-top: 3em;
}
.header{
    font-size: .5em;
}
.flex-right {
  flex: 75%;
}

ul {
    list-style-type: none;
    font-size: 2em;
    font-family: 'DotGothic16', sans-serif;
   
  }
  
  li {
    float: left;
    padding: 1em 1.5em
  }

  li a:hover {
  color: white;
  }
  li a:active {
    color: orange;
    transform: scale(.97);
  }

  /* Responsive layout - makes a one column-layout instead of two-column layout */
@media (max-width: 1100px) {
  .main {
    flex-direction: column;
  }
  .header {
    font-size: 4px;
  }
  .mary {
   width:100%;
  }
}