html {
  text-align: center;
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

body {
  background-color: #121212;
  background-image: url('/assets/bg.png');
  background-attachment: fixed;
  background-repeat: repeat;
  color: #AE91E1;
  font-family:ms gothic;
  display: flex;
  flex-direction: column;
}

html, body {
  height: 100% !important;
  min-height: 100% !important;
}

footer {
  flex-shrink: 0;
}

a {
  color: #91e19d;
  font-weight: bold;
  text-decoration: none;
  transition: 0.4s;
}

svg {
  width: 70px;
  height: 70px;
  fill: #AE91E1;
  transition: 0.4s;
}

path, rect, circle {
  transition: .75s;
}

a:hover path, a:hover rect, a:hover circle {
  fill: #91e19d;
}

.content {
  width:750px;
	background-color:black;
	color: #AE91E1;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	margin-top:40px;
	text-align:center;
	border-color: #AE91E1;
	border-style: solid;
  border-width: 5px;
  border-bottom-width: 20px;
  border-bottom-right-radius: 50px; 
  border-top-left-radius: 50px;
  padding:10px;
  font-family:ms gothic;
  overflow: hidden;
}

.bigger {
  border-bottom-right-radius: 100px; 
  border-top-left-radius: 0px;
  border-top-right-radius: 0px; 
  border-bottom-left-radius: 0px;
  width: 1080px;
  height: auto;
  margin-right: 0px;
  margin-top: 0px;
  padding: 30px;
  font-size: 18pt;
  padding-top: inherit;
  display:table-cell;
}

.side {
  border-radius: 0px; 
  width: 200px;
  height: auto;
  margin-top: 0px;
  float: left;
  padding: 5px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.smaller {
  border-bottom-right-radius: 0px; 
  border-top-left-radius: 100px;
  border-top-right-radius: 0px;
  border-bottom-left-radius: 0px;
  margin-right: 0px;
  width: 100%;
  height: 25%;
  border-bottom-width: 5px;
  border-top-width: 20px;
  margin-top: 0px;
  padding: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.logolink {
  position:absolute;
  right:0px;
  width:30%;
  height: auto;
  padding:5px;
  z-index: 2;
}

.buttonfooter {
  padding:5px;
  width:auto;
  display:flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.socicon {
  padding: 10px;
  width: 100%;
  height: 80px;
  display: flex;
  justify-content: center;
  align-items: center;  
}

#message {
  width:750px;
	background-color:#AE91E1;
	color: yellow;
	text-align:center;
	border-color: black;
	border-style: solid;
  border-width: 5px;
  font-family:ms gothic;
}


.contentlink {
  background-color: #121212;
  border-color: #AE91E1;
  border-style: solid;
  border-width: 5px;
  border-bottom-width: 20px;
  border-radius: 50px;
  width: 18%;
  height: 75px;
  position: relative;
  display: inline-block;
  margin: 5px;
  transition: 0.4s;
  font-size: 87%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-shadow: none;
  color: #AE91E1;
  font-weight: bold;
}

.contentlink:hover {
  background-color: #AE91E1;
  color: #91e19d;
  border-color: #91e19d;
  border-top-width: 20px;
  border-bottom-width: 5px;
}

#status {
    color: #FFFF00;
    font-size: 24pt;
    font-family:'minecraftfont';
    text-shadow:3px 3px #3F3F00;
    position: relative;
    left: 0px;
    bottom: 50px;
    width: 60%;
    height: 0px;
    line-height: auto;
}

#new {
    color: #FFFF00;
    font-size: 24pt;
    font-family:'minecraftfont';
    text-shadow:3px 3px #3F3F00;
    position: relative;
    left: 0px;
    top: 10px;
    width: 0px;
    height: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
    width:100%;
    line-height: auto;
    visibility: hidden;
    z-index: 1;
}

#status a {
  color: #FFFF00;
  text-decoration: underline; 
}

.pop {
    animation: pop 0.58s infinite;
}
@keyframes pop {
    from {
        transform:scale(0.95)
    }
    50% {
        transform:scale(1)
    }
    to {
        transform:scale(0.95)
    }
}
.tilt {
    transform: rotate(-18deg);
}
@font-face {
    font-family:'minecraftfont';
    src: url('/minecraft.otf');
}

#dir{
	background-color:black;
	color: #AE91E1;
	width:750px;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
	border-color: #AE91E1;
	border-style: solid;
  border-width: 5px;
  padding:5px;
    font-family:ms gothic;
}

.dirh{
  
	background-color:black;
	color: #AE91E1;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	text-align:center;
  padding:5px;
  transition: 0.4s; 
}

    .dirh:hover {
      background-color: #4a995e;
    }

.linkimg {
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5;
}

.button {
  -moz-transition: .5s;
  -webkit-transition: .5s;
  transition: .5;
  width: 88px;
  height: 31px;
}

.linkimg:hover {
  cursor: pointer;
}

.button:hover {
  transform: scale(1.3, 1.1); 
}

.multielement {
   display: flex;
   justify-content: center;
   align-items: center;
   overflow: visible;
}

.glitch {
  animation: glitch 3s steps(100) infinite;
  font-weight: bold;
  }

.portrait {
  position:relative;
  width: 60%;
  height:auto;
  animation: portrait 5s ease infinite;
}

.portrait:hover {
  cursor: pointer;
}


@keyframes portrait {
  50% {
    transform: translate(0px, -20px); } 
  0%, 100% {
    transform: translate(0px, 0px); } 

@keyframes glitch { 
  0% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  1% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  2% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  3% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  4% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  5% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  6% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  7% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  8% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  9% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  10% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  11% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0.5px);}
  12% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0.5px);}
  13% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0.5px);}
  14% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0);}
  15% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0);}
  16% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  17% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  18% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  19% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  20% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  21% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  22% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  23% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  24% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  25% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  26% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0.5px);}
  27% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0.5px);}
  28% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  29% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  30% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  31% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  32% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  33% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  34% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  35% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0.5px);}
  36% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0.5px);}
  37% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0.5px);}
  38% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  39% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  40% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  41% { text-shadow: 45px 0 0 #0c33f5, -45px 0 0 lime; filter: blur(0);}
  42% { text-shadow: 0 0 0 #0c33f5, 0 0 0 lime; filter: blur(0);}
  43% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0);}
  44% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0);}
  45% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0);}
  46% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0.5px);}
  47% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0.5px);}
  48% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  49% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  50% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  51% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  52% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  53% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  54% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  55% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0.5px);}
  56% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0.5px);}
  57% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0.5px);}
  58% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  59% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  60% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  61% { text-shadow: 30px 0 0 red, -30px 0 0 lime; filter: blur(0);}
  62% { text-shadow: 0 0 0 red, 0 0 0 lime; filter: blur(0);}
  63% { text-shadow: 1px 0 0 red, -1px 0 0 #0c33f5; filter: blur(0);}
  64% { text-shadow: 1px 0 0 red, -1px 0 0 #0c33f5; filter: blur(0);}
  65% { text-shadow: 1px 0 0 red, -1px 0 0 #0c33f5; filter: blur(0);}
  66% { text-shadow: 1px 0 0 red, -1px 0 0 #0c33f5; filter: blur(0.5px);}
  67% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0.5px);}
  68% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  69% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  70% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  71% { text-shadow: 50px 0 0 red, -50px 0 0 #0c33f5; filter: blur(0);}
  72% { text-shadow: 0 0 0 red, 0 0 0 #0c33f5; filter: blur(0);}
  73% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  74% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  75% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  76% { text-shadow: 3px 0 0 red, -3px 0 0 #0c33f5; filter: blur(0);}
  77% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  78% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  79% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  80% { text-shadow: -3px 0 0 red, 3px 0 0 #0c33f5; filter: blur(0);}
  81% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0);}
  82% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0);}
  83% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0.5px);}
  84% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0.5px);}
  85% { text-shadow: 1px 0 0 red, -1px 0 0 lime; filter: blur(0.5px);}
  86% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0.5px);}
  87% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0.5px);}
  88% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  89% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  90% { text-shadow: -3px 0 0 red, 3px 0 0 lime; filter: blur(0);}
  91% { text-shadow: 60px 0 0 lime, -60px 0 0 #0c33f5; filter: blur(0);}
  92% { text-shadow: 0 0 0 lime, 0 0 0 #0c33f5; filter: blur(0);}
  92% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  93% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  94% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  95% { text-shadow: 0.8px 0 0 #0c33f5, -0.8px 0 0 lime; filter: blur(0);}
  96% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  97% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  98% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  99% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);}
  100% { text-shadow: -3px 0 0 #0c33f5, 3px 0 0 lime; filter: blur(0);} }