/* Google Fonts */
@import url(https://fonts.googleapis.com/css?family=Anonymous+Pro);
@import url('https://fonts.googleapis.com/css2?family=M+PLUS+1p:wght@500&display=swap');
html {
	#Background: linear-gradient(Black, DeepSkyBlue);
    #Background: -moz-linear-gradient(Black, DeepSkyBlue);
    #Border-right: 1px solid rgba(0, 0, 0, 0.3);
    #Border-right: -moz-background-clip: padding-box;
    #Border-left: 1px solid rgba(0, 0, 0, 0.3);
    #Border-left: -moz-background-clip: padding-box;
    #Background-clip: padding-box;
       /* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
  opacity:0;  /* make things invisible upon start */
  -webkit-animation:fadeIn ease-in 1;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation:fadeIn ease-in 1;
  animation:fadeIn ease-in 1;

  -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  animation-duration:1s;
}
body {
	position: fixed;
	width: 99%;
	max-width: 1024px;
	height: 99%;
	max-height: 1024px;
	#border: 1px solid black;
	margin: 1px;
	padding: 1px;
	transform: translate(-50%, -50%);
	top: 50%;
	left: 50%;
    #display: none;
    #background: #fff;
    #box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
    #color: #545454;
    #font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    #font-size: 16px;
    #line-height: 1.5;
    #margin: 0 auto;
    #max-width: 800px;
    #padding: 2em 2em 4em;
}
footer {
	width: 900px;
	height:;
	max-height: 200px;
	#border: 1px solid black;
	position: absolute;
	top: 90%;
	left: 50%;
	transform: translate(-50%, -50%);
}
h1 {
	text-align: center;
	#border: 1px solid black;
	width: 900px;
	height: 50px;
	position: absolute;
	top: ;
	left: 50%;
    #color: #222;
    font-weight: 600;
    line-height: 1.3;
	font-family: 'M PLUS 1p', sans-serif;
	transform: translate(-50%, -50%);
	font-size: 42px;
	#color: black;
}
h2 {
	text-align: center;
	#border: 1px solid black;
	width: 900px;
	height: 50px;
	position: absolute;
	top: 60px;
	left: 50%;
    color: #222;
	font-family: 'M PLUS 1p', sans-serif;
	transform: translate(-50%, -50%);
	font-size: 24px;
}
h3, h4, h5, h6 {
	text-align: center;
	#border: 1px solid black;
	width: 900px;
	height: 50px;
    color: #222;
    font-weight: 600;
    line-height: 1.3;
	font-family: 'M PLUS 1p', sans-serif;
	#transform: translate(-50%, -50%);
}
p {
	text-align: justify;
	#border: 1px solid black;
	width: 900px;
	height: 50px;
	color: #222;
	font-family: 'M PLUS 1p', sans-serif;
}
a {
    color: #0083e8;
    text-decoration: none;
}
b, strong {
    font-weight: 600;
}
samp {
    display: none;
}
blink {
        animation: blinker 4.5s linear infinite;
        color: #1c87c9;
        #cursor: not-allowed;
       }
      @keyframes blinker {  
        50% { opacity: 0.3; }
       }
            .blink-one {
                animation: blinker-one 1s linear infinite;
            }
       @keyframes blinker-one {  
         0% { opacity: 0; }
       }
            .blink-two {
                animation: blinker-two 1.4s linear infinite;
            }
       @keyframes blinker-two {  
         100% { opacity: 0; }
       }
notice {
    font-size: 90px;
    text-shadow: 3px 3px 20px black;
    font-family: sans-serif;  
    text-align: center;
}
td {
	font-family: 'M PLUS 1p', sans-serif;
}
.blerb {
	width: 900px;
	height:;
	position: absolute;
	top: 70px;
	left: 50%;
	#border: 1px solid black;
	transform: translate(-50%, -50%);
}
.centered-logo {
  position: fixed;
  top: 75%;
  left: 10%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}
.centered {
  position: fixed;
  top: 50%;
  left: 50%;
  /* bring your own prefixes */
  transform: translate(-50%, -50%);
}
tt {
    font-size: 50px;
    text-shadow: 3px 3px 20px black;
    #text-shadow: 3px 3px 20px #1c87c9;
}
.buddy {
    position: fixed;
    top: 95%;
    left: 97%;
}

/*--Fade in for Page--*/
.container {
    #position: fixed; top: 25%; left: 25%;
    #border: 10px solid black;
}
.globalsocial {
	position: fixed;
	top: 95%;
	left: 92%;
}

/* make keyframes that tell the start state and the end state of our object */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }

.fade-in {
  opacity:1;  /* make things invisible upon start */
  -webkit-animation:fadeIn ease-in 0.5;  /* call our keyframe named fadeIn, use animattion ease-in and repeat it only 1 time */
  -moz-animation:fadeIn ease-in 0.5;
  animation:fadeIn ease-in 0.5;

  -webkit-animation-fill-mode:forwards;  /* this makes sure that after animation is done we remain at the last keyframe value (opacity: 1)*/
  -moz-animation-fill-mode:forwards;
  animation-fill-mode:forwards;

  -webkit-animation-duration:1s;
  -moz-animation-duration:1s;
  animation-duration:1s;
}

.fade-in.one {
  -webkit-animation-delay: 0.7s;
  -moz-animation-delay: 0.7s;
  animation-delay: 0.7s;
}

/*.fade-in.two {
  -webkit-animation-delay: 1.2s;
  -moz-animation-delay:1.2s;
  animation-delay: 1.2s;
}

.fade-in.three {
  -webkit-animation-delay: 1.6s;
  -moz-animation-delay: 1.6s;
  animation-delay: 1.6s;
}
*/
/*---make a basic box ---*/
/*.box{
  width: 200px;
  height: 200px;
  position: relative;
  margin: 10px;
  float: left;
  border: 1px solid #333;
  background: #999;

}*/
backlinks {
	position: fixed;
	top: 110%;
	font-family: ;
	color: white;
	font-size: 1px;
}