body {
  margin: 0;
}

.meow {
  width: 100%;
}

.header {
  height: 80px;
}

.header-content { padding: 10px; }

.icon { margin-right:0; }

.icon img {
  width: 60px;
  height: 60px;
}



.header-text h1 {
  font-size: 1.9rem;
  margin: 0;
  line-height: 60px;
}

.header-text p {
  display: none;
}

.footer {
  width: 100%;
  height: 75px;
}

.left-side {
  display: none;
}

nav{
  display: flex;
  position: sticky;
  top: 0;
  justify-content: center;
  align-items: center;
  background-color: var(--bonesdale-yellow);
  padding: 20px 15px 15px;
  border-left: 2px solid var(--bonesdale-red);
  border-right: 2px solid var(--bonesdale-red);
  border-bottom: 2px solid var(--bonesdale-red);
  z-index: 1000;
}

nav ul{
  display: block;
  position: absolute;
  background: var(--bonesdale-blue);
  color: var(--bonesdale-yellow);
  height: 100vh;
  border-left: 2px solid var(--bonesdale-red);
  border-bottom: 2px solid var(--bonesdale-red);
  border-right: 2px solid var(--bonesdale-red);
  list-style: none;
  flex-wrap: nowrap;
  flex-direction: column;
  /*margin: 55.2em 0 0 0;*/
  top: 35px;
  transform: translatex(-220px);
  transition: 0.15s linear;
  padding: 0 20px 0 20px;
}

nav{
  justify-content: start;
}

nav .list{
  display: block;
  color: var(--bonesdale-red);
  margin: 0 0 0 15px;
  z-index: 10000;
}
    
nav ul li{
  padding: 10px 2px;
}

nav ul li a{
  font-size: large;
  color: var(--bonesdale-yellow);
        
}



.appear{
  transform: translateX(-17px);
  transition: 0.15s linear;

}