@font-face {
    font-family: pixel;
    src: url("PixelGame.otf") format("opentype");
}
@font-face {
    font-family: pixeled;
    src: url("Pixeled.ttf") format("truetype");
}
audio {
    display: none !important;
}
body {
  background-image: url('https://i.imgur.com/BZmfeAI.png');
}
h1, h2, h3, h4, h5 {
  font-family: pixel, sans-serif;
  font-size: 2.5vw;
  margin: 0;
  color: #c4472e;
}
p, a {
  font-family: pixeled, sans-serif;
  margin: 0;
}
marquee {
  font-family: pixeled, sans-serif;
  margin: 0;
  color: #c4472e;
}
body #header {
  justify-content: center;
  align-self: center;
  align-items: center;
  text-align: center;
  top: 0;
}
.container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
.left {
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 5vw;
  border: 20px solid;
  border-image: url('images/boxborder.png') 24 round;
  border-image-slice: fill;
  background-color: #ffd789;
  background-clip: padding-box;
  font-size: 10px;
}
.nav {
  display: flex;
  flex-direction: column;
  margin-bottom: 15px;
}
.socials {
  display: flex;
  flex-direction: column;
}
.right {
  display: flex;
  flex-direction: column;
  justify-content: center;
  border: 20px solid;
  border-image: url('images/boxborder.png') 24 round;
  border-image-slice: fill;
  background-color: #ffd789;
  background-clip: padding-box;
  margin: 15px;
}
.overlay {
  position: absolute;
  z-index: 2;
  width: 15vw;
  right: 15vw;
}
.overlay img{
  position: relative;
  z-index: 0;
}
.info-box {
  width: 70vw;
}
.info {
  display: flex;
  flex-direction: row;
}
.boxes {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
.blog {
  display: flex;
  flex-direction: column;
  width: 150px;
  border: 20px solid;
  border-image: url('images/cloudbox.png') 24 round;
  border-image-slice: fill;
  background-color: #e8eff4;
  background-clip: padding-box;
  word-wrap: break-word;
}
.blog p{
    font-size: 0.5vw;
}
.guest {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}
iframe {
    overflow-clip-margin: content-box !important;
    overflow: clip !important;
    border-width: 0px;
    border-style: inset;
    border-color: transparent;
    border-image: none;
}
.updates {
  display: flex;
  flex-direction: column;
  width: 150px;
  border: 20px solid;
  border-image: url('images/cloudbox.png') 20 round;
  border-image-slice: fill;
  background-color: #e8eff4;
  background-clip: padding-box;
  word-wrap: break-word;
}
.updates p{
    font-size: 0.5vw;
}
.pixelbfs {
  z-index: 2;
  position: absolute;
  right: 150px;
  top: 150px;
}
.pixelbfs img {
  width: 7vw;
}