body {
  background-image: url('/images/noise1.gif');
  background-blend-mode:color-dodge;
  background-color: rgb(12, 12, 12);
  
  
}

.rubik-vinyl-regular {
  font-family: "Rubik Vinyl", system-ui;
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'cry kitty';
  src: url('/fonts/crykitty.ttf');
}

@font-face {
  font-family: 'punk-kid';
  src: url('/fonts/punk kid.ttf');
}

@font-face {
  font-family: 'shlop';
  src: url('/fonts/shlop rg.otf');
}

@font-face {
  font-family: 'sinder';
  src: url('/fonts/SINDER FREEBIE FINAL.ttf');
}

@font-face {
  font-family: 'special elite';
  src: url('/fonts/SpecialElite.ttf');
}



.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}

.banner {
  position: relative;
  text-align: center;
  color: rgb(19,19,19);
  font-size: 6vw;
  word-spacing: 2.5vw;
  letter-spacing: -0.1vw;
  white-space:nowrap;
  font-family:"Rubik Vinyl", system-ui;
  
  
}


.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);

}

.buttonline {
height:auto;
  width:40vw;
  padding: 0.1vw;
  margin-right: auto; 
  margin-left: auto;
  position:top;
  margin-top:0.5vh;
  margin-bottom:0.4vh;
  display:flex;
  white-space:nowrap;

}

.button {
  background-color: #a1a18d; /* Green */
  border: none;
  color: white;
  padding-top: 1.25vh;
  padding-bottom:1.25vh;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  width:7vw;
  font-size: 0.8vw;
  margin-left:0.2vw;
  margin-right:0.2vw;

  
}

.button:hover {
  background-color: #84917d;
  color:#161616;
}


.hor {
  max-height:auto;
  position:relative;
  display:flex;
  flex-direction:row;
  justify-content:center;
  align-content:flex-start;

}

/* Style page content */
.main {
  height:auto;
  width:38vw;
  padding: 1vw;
  margin-right: 1vw; 
  margin-left: 1vw;
  background-color:rgb(66, 66, 51);
  position:top;
  left: 50%;
  overflow:auto;
  align-content:flex-start;
  }

  .side {
    height:auto;
    width:20vw;
    padding: 1vw;
    margin-right: 0vw; 
    margin-left: 1vw;
    margin-top:2vh;
    position:absolute;
    font-size:3vh;
    font-family:sinder;
    color: #c9bd17;
    


  }



div.gallery {
  width: 7vw;
  float:left;
  margin: 0.2vw;
  transition: transform .2s;
  box-shadow: 0px 3px;
  margin-top: 0.001vh;
  
  
  
}

div.gallery:hover {
  -ms-transform: scale(1.01); /* IE 9 */
  -webkit-transform: scale(1.01); /* Safari 3-8 */
  transform: scale(1.1); 
}

div.gallery img {
  width: 7vw;
  height: auto;
  border-style:solid;
  border-color:black;
  display:block;
  
}


* { box-sizing: border-box; }




/* The sidebar menu */
.sidenav {
  height: 100%; /* Full-height: remove this if you want "auto" height */
  width: 260px; /* Set the width of the sidebar */
  position: fixed; /* Fixed Sidebar (stay in place on scroll) */
  z-index: 1; /* Stay on top */
  top: 0; /* Stay at the top */
  right: 0;
  background-color: #111; /* Black */
  overflow-x: hidden; /* Disable horizontal scroll */
  padding-top: 20px;
}

/* The navigation menu links */
.sidenav a {
  padding: 6px 8px 16px 46px;
  text-decoration: none;
  font-size: 30px;
  color: #818181;
  display: block;
}

/* When you mouse over the navigation links, change their color */
.sidenav a:hover {
  color: #f1f1f1;
}








/* On smaller screens, where height is less than 450px, change the style of the sidebar (less padding and a smaller font size) */
@media screen and (max-height: 450px) {
  .sidenav {padding-top: 15px;}
  .sidenav a {font-size: 18px;}
}