* {
    box-sizing: border-box;
}

body {
    font-family: 'Quantico', sans-serif;
    background-image: url('assets/bgs/w1.jpg');
    background-repeat: repeat;
    color: #521d1d;
}

.nav {
  position: absolute;
  left: -110px;
  transition: 0.3s;
  padding: 15px;
  width: 150px;
  text-decoration: none;
  font-size: 20px;
  color: white; 
  border-radius: 0 5px 5px 0; 
  background-color: rgba(82, 29, 29, .8);
}

.nav:hover {
  left: 0;
}

.nav ul {
    list-style-type: none;
}

.nav a:link {
    color: white;
}

.nav a:visited {
    color: white;
}

.nav a:active {
    color: white;
}

.nav a:hover {
    color: grey;
}

.container {
  display: flex;
  justify-content: center; 
  align-items: center;
  height: 100vh; 
  margin-right: 500px;
}

.main {
    height: 90%;
    width: 90%;
}