@import url('https://fonts.googleapis.com/css?family=VT323&display=swap');

html {
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  height:auto;
  overflow-y: scroll;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none;  /* Internet Explorer 10+ */
}

::-webkit-scrollbar {
    width: 0px;  /* Remove scrollbar space */
    background: transparent;  /* Optional: just make scrollbar invisible */
}

@keyframes flicker {
  0% {
    opacity: 0.87861;
  }
  5% {
    opacity: 0.64769;
  }
  10% {
    opacity: 0.83604;
  }
  15% {
    opacity: 0.90626;
  }
  20% {
    opacity: 0.58128;
  }
  25% {
    opacity: 0.83891;
  }
  30% {
    opacity: 0.65583;
  }
  35% {
    opacity: 0.67807;
  }
  40% {
    opacity: 0.76559;
  }
  45% {
    opacity: 0.84693;
  }
  50% {
    opacity: 0.96019;
  }
  55% {
    opacity: 0.58594;
  }
  60% {
    opacity: 0.50313;
  }
  65% {
    opacity: 0.71988;
  }
  70% {
    opacity: 0.53455;
  }
  75% {
    opacity: 0.47288;
  }
  80% {
    opacity: 0.71428;
  }
  85% {
    opacity: 0.70419;
  }
  90% {
    opacity: 0.7003;
  }
  95% {
    opacity: 0.46108;
  }
  100% {
    opacity: 0.54387;
  }
}

::selection {
  background: orange;
  background: linear-gradient(
    to bottom,
    rgba(255,165,0,1),
    rgba(255,165,0,1) 50%,
    rgba(240,155,0,1) 70%,
    rgba(240,155,0,1)
  );
  background-size: 100% 0.3rem;
  color: black;
}

a {
  background: orange;
  background: linear-gradient(
    to bottom,
    rgba(255,165,0,1),
    rgba(255,165,0,1) 50%,
    rgba(240,155,0,1) 70%,
    rgba(240,155,0,1)
  );
  background-size: 100% 0.3rem;
  color: black;
  cursor: url(cursor.png), auto;
}

body {
  background-color: black;
  background: linear-gradient(
    to bottom,
    rgba(18,15,15,1),
    rgba(18,15,15,1) 50%,
    rgba(0,0,0,1) 70%,
    rgba(0,0,0,1)
  );
  background-size: 100% 0.3rem;
  border-radius: 2rem;
  color: orange;
  font-family: 'VT323', monospace;
  font-size: 18px;
cursor: url(cursor.png), auto;
text-shadow: 0px 0px 8px orange;
}

@keyframes scanblack {
	0% {
  background: linear-gradient(
    to bottom,
    rgba(18,15,15,1),
    rgba(18,15,15,1) 50%,
    rgba(0,0,0,1) 70%,
    rgba(0,0,0,1)
  );
  background-size: 100% 0.3rem;
  border-radius: 2rem;
  }
	100% {
  background: linear-gradient(
    to bottom,
    rgba(18,15,15,1),
    rgba(18,15,15,1) 55%,
    rgba(0,0,0,1) 75%,
    rgba(0,0,0,1)
  );
  background-size: 100% 0.3rem;
  border-radius: 2rem;
  }
}

@keyframes scanorange {
	0% {
  background: linear-gradient(
    to bottom,
    rgba(255,165,0,1),
    rgba(255,165,0,1) 50%,
    rgba(240,155,0,1) 70%,
    rgba(240,155,0,1)
  );
  background-size: 100% 0.3rem;
  }
	100% {
  background: linear-gradient(
    to bottom,
    rgba(255,165,0,1),
    rgba(255,165,0,1) 55%,
    rgba(240,155,0,1) 75%,
    rgba(240,155,0,1)
  );
  background-size: 100% 0.3rem;
  }
}

@keyframes glow {
	0% { text-shadow: 0px 0px 4px orange; }
	100% { text-shadow: 0px 0px 2px orange; }
}

.bordered {
  margin: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  -ms-transform: translate(-50%, -50%);
  -webkit-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  -o-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  border-style: solid;
  border-color: orange;
  border-width: thin;
  padding: 10px 20px 10px 20px;
}

.footer {
  margin: 0;
  /*position: absolute;*/
  top: 100%;
  left: 50%;
  -ms-transform: translate(-50%, -95%);
  -webkit-transform: translate(-50%, -95%);
  -moz-transform: translate(-50%, -95%);
  -o-transform: translate(-50%, -95%);
  transform: translate(-50%, -95%);
  background: black;
  background: linear-gradient(
    to bottom,
    rgba(18,15,15,1),
    rgba(18,15,15,1) 50%,
    rgba(0,0,0,1) 70%,
    rgba(0,0,0,1)
  );
  background-size: 100% 0.3rem;
  color: orange;
  position: fixed;
  height:40px;
}
.footer2 {
  margin: 0;
  /*position: absolute;*/
  top: 100%;
  left: 0%;
  -ms-transform: translate(0%, -95%);
  -webkit-transform: translate(0%, -95%);
  -moz-transform: translate(0%, -95%);
  -o-transform: translate(0%, -95%);
  transform: translate(0%, -95%);
  background: black;
  background: linear-gradient(
    to bottom,
    rgba(18,15,15,1),
    rgba(18,15,15,1) 50%,
    rgba(0,0,0,1) 70%,
    rgba(0,0,0,1)
  );
  background-size: 100% 0.3rem;
  border-radius: 2rem;
  color: orange;
  position: fixed;
  height:40px;
  width:99vw;
}

.copyleft {
  display:inline-block;
  transform: rotate(180deg);
}

.frame1 {
	opacity: 0;
    -webkit-animation: fadeout 4s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadeout 4s; /* Firefox < 16 */
        -ms-animation: fadeout 4s; /* Internet Explorer */
         -o-animation: fadeout 4s; /* Opera < 12.1 */
            animation: fadeout 4s;
}

.frame2 {
	padding-top:5%;
	padding-bottom:5%;
    -webkit-animation: fadein 4s; /* Safari, Chrome and Opera > 12.1 */
       -moz-animation: fadein 4s; /* Firefox < 16 */
        -ms-animation: fadein 4s; /* Internet Explorer */
         -o-animation: fadein 4s; /* Opera < 12.1 */
            animation: fadein 4s;
}

.header{
  background: orange;
  background: linear-gradient(
    to bottom,
    rgba(255,165,0,1),
    rgba(255,165,0,1) 50%,
    rgba(240,155,0,1) 70%,
    rgba(240,155,0,1)
  );
  background-size: 100% 0.3rem;
  color: black;
  position: fixed;
  top: 0%;
  width:99vw;
  height:50px;
}

.alignleft {
  width:33%;
  text-align:left;
}
.aligncenter {
  width:33%;
  text-align:center;
}
.alignright {
 width:33%;
 text-align:right;
}

.headerCard{
  border-style: solid;
  border-color: orange;
  border-width: thin;
  width: 50%;
}

th {
  background: orange;
  background: linear-gradient(
    to bottom,
    rgba(255,165,0,1),
    rgba(255,165,0,1) 50%,
    rgba(240,155,0,1) 70%,
    rgba(240,155,0,1)
  );
  background-size: 100% 0.3rem;
  color: black;
}

.card{
  background: black;
  background: linear-gradient(
    to bottom,
    rgba(18,15,15,1),
    rgba(18,15,15,1) 50%,
    rgba(0,0,0,1) 70%,
    rgba(0,0,0,1)
  );
  background-size: 100% 0.3rem;
  color: orange;
  border-style: solid;
  border-color: orange;
  border-width: 1px;
}

@keyframes fadein {
	0% { opacity: 0; }
	50% { opacity: 0; }
	51% { opacity: 1; }
	100% { opacity: 1; }
}

@keyframes fadeout {
	0% { opacity: 1; }
	50% { opacity: 1; }
	51% { opacity: 0; }
	100% { opacity: 0; }
}


