@font-face {
    font-family: 'vcr';
    src: url('/melli/VCR_OSD_MONO.ttf');
}

body {
  background-color: black;
  font-size: 16px;
  font-family: VCR;
  font-style:normal;
  image-rendering: pixalated;
  color: palevioletred;
}
p {
  color: palevioletred;
}
h1 {
  font-size: 32px;
  font-weight: 100;
  text-align: center
}
h2 {
  font-weight: 100;
  text-align: center
}
h3 {
  font-weight: 100;
  text-align: center
}
h4 {
  text-align: center
}
weak {
  font-weight: lighter;
}
.container {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 1fr 1fr;
  column-gap: 5px;
}
.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.border {
  border-style: solid;
  border-color: #808080;
  border-width: thick;
  background-color: beige;
  margin: 2.5%;
  padding: 2.5%;
}
.secret {
  color: beige;
}
.fart {
  color: brown;
}
.titleborder {
  display: inline-block;
  border-style: solid;
  border-color: black;
  border-width: thick;
}
.smalltext {
  font-size: 15px;
}
.updatelog {
  font-size: 75%;
  text-align: center
}
.motd {
  font-size: 75%;
  text-align: center
}
.evil {
  max-width: fit-content;
  margin-left: auto;
  margin-right: auto;
}
.evil2 {
  max-width:max-content;
  margin-left: auto;
  margin-right: auto;
}
.box1border {
  width: 500px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.box2border {
  width: 420px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.box3border {
  width: 420px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.box4border {
  width: 420px;
  border-style: solid;
  border-color: #323232;
  background-color: #323232;
}
.box5border {
  width: 400px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.box6border {
  width: 400px;
  border-style: solid;
  border-color: #323232;
  background-color: #161616
}
.box7border {
  width: 200px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.box8border {
  width: 100px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.boxsideborder {
  width: 210px;
  height: 600px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.sidecontainer {
  width: 210px;
  height: 600px;
}
.rightbar1 {
  width: 210px;
  height: 300px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.rightbar2 {
  width: 210px;
  height: 250px;
  border-style: solid;
  border-color: #323232;
  background-color: black;
}
.rightbargap {
  width: 210px;
  height: 44px;
}
.centertext {
  text-align: center;
}
.videolink {
  display:flex;
  justify-content: center;
  margin:auto;
}
.columns {
  column-count: 3;
}
.white {
  color: white
}
.thenewthing {
  animation: tnt 3s linear infinite;
}
.defaultcolor {
  color: palevioletred;
}
.red {
  color: red;
}
.shutup {
  max-height: 100%;
  max-width: 100%;
  width: auto;
  height: auto;
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.shutup2 {
  color: white;
  max-height: 100%;
  max-width: 100%;
  position:fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
}
.shutup3 {
  display: flex;
  justify-content: center;
  align-items: center;
  border: 2px dotted rgb(96 139 168);
}
.shutup3 img {
  width: 100%;
  height: 100%;
}
.DAVEKAT {
  flex:1 1 50%;
  position: fixed;
  display: flex;
  flex-basis: 100vh;
  justify-content: center;
  align-items: center;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  
}
.return {
  flex:1 1 50%;
  position: fixed;
  display: flex;
  flex-basis: 100vh;
  justify-content: center;
  align-items: center;
  top: 20%;
  bottom: 0;
  left: 0;
  right: 0;
}
@keyframes tnt {
  0% {
    opacity: 1;
    transform: scale(.5)
  }
  50% {
    opacity: 1;
    transform: scale(2)
  }
  100% {
    opacity: 1;
    transform: scale(.5)
  }
}
.blinker {
  animation: blinker 3s linear infinite;
}
@keyframes blinker {
  0% {
    opacity: 0;
  }
  50% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
.thenewthing2 {
  animation: tnt2 3s linear infinite;
}

@keyframes tnt2 {
  0% {
    opacity: 1;
    transform: scale(.25)
  }
  50% {
    opacity: 1;
    transform: scale(1)
  }
  100% {
    opacity: 1;
    transform: scale(.25)
  }
}
.shutupani {
  animation: shutupani 0.5s steps(1)infinite;
}

@keyframes shutupani {
  0% {
    opacity: 1;
    transform: translateX(0%)
  }
  5%{
    opacity: 0;
  }
  10%{
    opacity: 1;
    transform: translateX(-10%) translateY(-10%)
  }
  15%{
    opacity: 0;
  }
  20%{
    opacity: 1;
    transform: translateX(0%)
  }
  25%{
    opacity: 0;
  }
  30%{
    opacity: 1;
    transform: translateX(10%) translateY(10%)
  }
  35%{
    opacity: 0
  }
  40%{
    opacity: 1;
    transform: translateX(0%)
  }
  45%{
    opacity: 0;
  }
  50%{
    opacity: 1;
    transform: translateX(10%) translateY(-10%)
  }
  55%{
    opacity: 0;
  }
  60%{
    opacity: 1;
    transform: translateX(0%)
  }
  65%{
    opacity: 0;
  }
  70%{
    opacity: 1;
    transform: translateX(-10%) translateY(10%)
  }
  75%{
    opacity: 0;
  }
  80%{
    opacity: 1;
    transform: translateX(0%)
  }
  85%{
    opacity: 0;
  }
  90%{
    opacity: 1;
    transform: translateX(10%) translateY(-10%)
  }
  95%{
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: translateX(0%)
  }

}