/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}td:not([align]),th:not([align]){text-align:left}


  @font-face {
    font-family: "VT323-Regular";
    src: url("../fonts/VT323-Regular.ttf") format("truetype");
    font-weight: 300;/*! minireset.css v0.0.6 | MIT License | github.com/jgthms/minireset.css */html,body,p,ol,ul,li,dl,dt,dd,blockquote,figure,fieldset,legend,textarea,pre,iframe,hr,h1,h2,h3,h4,h5,h6{margin:0;padding:0}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}ul{list-style:none}button,input,select,textarea{margin:0}html{box-sizing:border-box}*,*::before,*::after{box-sizing:inherit}img,video{height:auto;max-width:100%}iframe{border:0}table{border-collapse:collapse;border-spacing:0}td,th{padding:0}td:not([align]),th:not([align]){text-align:left}


  @font-face {
    font-family: "VT323-Regular";
    src: url("../fonts/VT323-Regular.ttf") format("truetype");
    font-weight: 300;
  }

html, body {
    margin:0;
    padding:0;
    height:100%;
    width: 100%;
    background:#070C13;
    color:#ffd800;
    font-family:"VT323-Regular", helvetica;
    
}



body {
    overflow-x: hidden; 
    font-size:20px;
}
p {
	font-size:1.9em;
	margin-bottom:1rem;
}







.smooth {
  position: relative;
  width: 100%;
  height: 100%;
  scroll-behavior: smooth;
  overflow-y: scroll;
  scroll-snap-type: mandatory;
  scroll-snap-points-y: repeat(100vh);
  scroll-snap-type: y mandatory;
}

.header {
  position: fixed;
  top: 0;
  z-index: 10000;
  display: flex;
  width: 100%;
  min-height: 60px;
  font-size: 1.3rem;
  color:#ffd800;

  background-image: linear-gradient(180deg, #131C2A, rgba(19, 28, 42, 0.9), transparent);
  mix-blend-mode: luminosity;
}
.header ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: flex;
  width: 100%;
  justify-content: center;
}
.header ul li {
  margin: 0 -0.5em;
  padding: 1em;
}
.header ul li a {
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 600;
  color: #FFD800;
}
.header ul li a::after {
  position: absolute;
  bottom: -3px;
  left: 0;
  content: "";
  width: 0;
  height: 3px;
  transition: all 0.2s linear;
}
.header ul li a:hover::after {
  width: 100%;
  background-color: #FFD800;
}









.container {
    height: 100%;
    position: relative;
    min-width:320px;
    z-index:2;
}

.logo {
	display:block;
	text-align:center; 
	z-index:9999;
	position:relative;
  width: 120px;
  height: auto;
 }


.logo img{
	display:block; 
  width: 500%;
  height: auto;
}


.logo2 {
	display:block;
	text-align:center; 
	z-index:2;
	top:90px;
	position:relative;
	padding-bottom: 8%;
	
 }

.socials {
position:absolute;
z-index:5;
top:10px;
text-align:center;
width:100%;
}

.parallax-wrapper {
  overflow-y: hidden;
    height:100%; 
    min-width:320px;
     display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.parallax {
  background-size: 100%;
  background-position: left bottom;
  height:100%;
  background-repeat:no-repeat;
  position: absolute;
  top:0;
  width:100%;
  min-width:320px;
}

#level0 {
  background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  z-index:0;
}
#level1 {
  background-image: url('../images/level-1.png');
  z-index:1;
 
}
#level2 {
  background-image: url('../images/level-2.gif');
  z-index:2;
}
#level3 {
  background-image: url('../images/level-3.gif');
  z-index:3;
}
#level4 {
  background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  z-index:4;
}
.content {
	/* padding:5rem; */
	margin:auto;
	width:100%;
	position:relative;
	z-index:4;
    background:#131c2a;
      background-image: url('../images/background-1.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

.content > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}

.titler1 {
  padding-bottom: 3%;
}

.titler2 {
  padding-bottom: 10%;
}


.content1 {
	padding:2rem;
	margin:auto;
	width:100%;
	z-index:4;
    background:#131c2a;
      background-image: url('../images/background-1.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

.content1 > h2 {
	width: 70%;
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}

.content2 {
	padding:2rem;
	margin:auto;
	width:100%;

	z-index:4;
    background:#131c2a;
      background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

.content2 > h2 {
	width: 50%;
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}

.content2 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}


.content3 {
	padding:2rem;
	padding-top: 5%;
	padding-bottom: 5%;
	margin:auto;
	width:100%;
	position:relative;
	z-index:1;
    background:#131c2a;
      background-image: url('../images/background-1.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

.content3 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}



.content4 {
	padding:2rem;
	margin:auto;
	width:100%;
	position:relative;
	z-index:1;
    background:#131c2a;
      background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
  
}

.content4 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}


.content5 {
	padding:2rem;
	margin:auto;
	width:100%;
	position:relative;
	z-index:1;
    background:#131c2a;
      background-image: url('../images/background-1.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);

}

.content5 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
	font-size: 5.9vw;
}


.content6 {
	padding:2rem;
	margin:auto;
	width:100%;
	position:relative;
	z-index:1;
    background:#131c2a;
      background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);

}

.content6 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
	font-size: 5.9vw;
}


.content7 {
	padding:0rem;
	margin:auto;
	width:70%;
	height: 20%;
	position:relative;
	z-index:1;
    
    
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
 

}

.content7 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
	font-size: 5.9vw;
}



.kab {
	padding-top: 0%;

}


.float-container {
    border: 0px solid #fff;
    padding: 10px;
    display: flex;

}

.float-container > div {
  flex: 1; /*grow*/
}

.float-child {
    width: 50%;
    float: center;
    padding: 20px;
    border: 0px solid red;
}  

.float-child2 {
    width: 50%;
    float: center;
    margin-right: 20px;
    padding: 20px;
    border: 0px solid red;
}  
.float-child3 {
    width: 50%;
    float: center;
    
    padding: 20px;
    border: 0px solid red;
}  



a.social-link  {
	display:inline-block;	
	margin:20px 5px;
	
}

a.social-link svg {
	width:30px; 
	fill:#ffffff;
	position:relative;
}

a.social-link:hover svg {
	top:-3px;
 	cursor:pointer;
	fill:#f7d621;
	
}

a.button {
	display:inline-block;
	margin:auto;
	padding:13px 20px 12px;
	background:#f7d621;
	color:#1c050f;
	font-weight:bold;
	text-transform:uppercase;
	text-decoration:none;
	text-align:center;
	width:auto;
	position:relative;
	font-size:1.8em;
	margin-top:2rem;
	border-right:7px solid #1c050f;
	border-bottom:7px solid #1c050f;
	 box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

a.button:hover {
	top:-3px;
	background:#ffffff;
	cursor:pointer;
	color:#1c050f;
}

a {
  color: #FA28A1;
}

h1, h2, h3, h4, h5 {
    font-weight:bold;
}

h1 {
font-weight:bold;
font-size:3em;
color:#FA28A1;
}

 h2 {
	font-size:1.5em;
}

h3 {
font-weight:bold;
font-size:2em;

}

h4 {
font-weight:bold;
font-size:2.3em;
color:#00ffe9;
}

h5 {
font-weight:bold;
font-size:3em;

}

h6 {
font-weight:bold;
font-size:2em;
color:#FA28A1;
}

.characters {
	margin:2rem auto;
	padding:1rem 5vw;
	max-width:1200px;
	display: flex;
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
    }

.character {
    width: 70%;
    margin-bottom: -4.9%;
    min-width: 200px;
}

.character h2 {
	margin:1rem auto 0;
}
.character a,
.character img{
    width: 100%;
	display:block;
}
.character a.button {
	display:inline-block;
	width: auto;
	margin:1rem auto;
}
 
.footer {
	text-align:left;
	display:block;
	margin:auto;
	font-size:1.2em;
	padding:2rem 5vw;
	max-width:2000px;
	background:#131c2a;
}
.footer span {
	font-family:"BunkenTechSansPro-Book", helvetica; 
	font-weight:bold;
}


hr.new1 {
    border: 0.13rem dashed #9f8e24;   
}







/* hide scrollbar but allow scrolling */
body::-webkit-scrollbar{
    display: none;
  }

section::-webkit-scrollbar{
    display: none;
  }

  section::-webkit-scrollbar {
    width: 0 !important
    }

section {
    scrollbar-width: none;
  }

  html {
    scrollbar-width: none;
  }
div {
  -ms-overflow-style: none; /* for Internet Explorer, Edge */
  scrollbar-width: none; /* for Firefox */


}
div::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}

/* other styling */
div {


}











/*/ MEDIA QUERIES START HERE //////////////////////////////////////////////////////////////////////////////*/

@media (max-width: 768px) { /* Hand Held Device */

	body {
	font-size:13px;
	}
	.parallax {
		background-size: 150%;
	}
	.logo img{
		width:60vw; 
	}

	.content {
		padding:1rem;
	}
	.characters {
		gap: 1rem;
	}
	.character {
		width: 47%;
		margin-bottom: -9%;
		min-width: 400px;
	}
	hr.new1 {
    border: 0.13rem dashed #9f8e24;
       margin-bottom: -3%;
}

}


@media (max-width: 524px) { /*  Mobile */
  .parallax {
    background-size: 200%;
    }
    .logo img{
		width:80vw; 
	}
	.characters {
    	justify-content: center;
    }
	.character {
		width: 97%;
		margin-bottom: 3%;
		min-width: 200px;
	}
}

@media only screen and (max-width: 720px) {

   body { 
      font-size: 0.9em; 
      height: 70%;
   }

}

@media screen and (min-width: 3240px ) { /* 4K */

}
  }

html, body {
    margin:0;
    padding:0;
    height:100%;
    width: 100%;
    background:#070C13;
    color:#ffd800;
    font-family:"VT323-Regular", helvetica;
    
}



body {
    overflow-x: hidden; 
    font-size:20px;
}
p {
	font-size:1.9em;
	margin-bottom:1rem;
}







.smooth {
  position: relative;
  width: 100%;
  height: 100%;
  scroll-behavior: smooth;
  overflow-y: scroll;
  scroll-snap-type: mandatory;
  scroll-snap-points-y: repeat(100vh);
  scroll-snap-type: y mandatory;
}

.header {
  position: fixed;
  top: 0;
  z-index: 10000;
  display: flex;
  width: 100%;
  min-height: 60px;
  font-size: 1.3rem;
  color:#ffd800;

  background-image: linear-gradient(180deg, #131C2A, rgba(19, 28, 42, 0.9), transparent);
  mix-blend-mode: luminosity;
}
.header ul {
  margin: 0;
  padding: 0;
  list-style-type: none;
  display: flex;
  width: 100%;
  justify-content: center;
}
.header ul li {
  margin: 0 -0.5em;
  padding: 1em;
}
.header ul li a {
  position: relative;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 600;
  color: #FFD800;
}
.header ul li a::after {
  position: absolute;
  bottom: -3px;
  left: 0;
  content: "";
  width: 0;
  height: 3px;
  transition: all 0.2s linear;
}
.header ul li a:hover::after {
  width: 100%;
  background-color: #FFD800;
}









.container {
    height: 100%;
    position: relative;
    min-width:320px;
    z-index:2;
}

.logo {
	display:block;
	text-align:center; 
	z-index:9999;
	position:relative;
 }


.logo img{
	display:block; 
	margin:auto; 
	width:42vw; 
}


.logo2 {
	display:block;
	text-align:center; 
	z-index:2;
	top:90px;
	position:relative;
	padding-bottom: 8%;
	
 }

.socials {
position:absolute;
z-index:5;
top:10px;
text-align:center;
width:100%;
}

.parallax-wrapper {
  overflow-y: hidden;
    height:100%; 
    min-width:320px;
     display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.parallax {
  background-size: 100%;
  background-position: left bottom;
  height:100%;
  background-repeat:no-repeat;
  position: absolute;
  top:0;
  width:100%;
  min-width:320px;
}

#level0 {
  background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  z-index:0;
}
#level1 {
  background-image: url('../images/level-1.png');
  z-index:1;
 
}
#level2 {
  background-image: url('../images/level-2.gif');
  z-index:2;
}
#level3 {
  background-image: url('../images/level-3.gif');
  z-index:3;
}
#level4 {
  background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  z-index:4;
}
.content {
	/* padding:5rem; */
	margin:auto;
	width:100%;
	position:relative;
	z-index:4;
    background:#131c2a;
      background-image: url('../images/background-1.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

.content > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}

.titler1 {
  padding-bottom: 3%;
}

.titler2 {
  padding-bottom: 10%;
}


.content1 {
	padding:2rem;
	margin:auto;
	width:100%;
	z-index:4;
    background:#131c2a;
      background-image: url('../images/background-1.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

.content1 > h2 {
	width: 70%;
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}

.content2 {
	padding:2rem;
	margin:auto;
	width:100%;

	z-index:4;
    background:#131c2a;
      background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

.content2 > h2 {
	width: 50%;
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}

.content2 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}


.content3 {
	padding:2rem;
	padding-top: 5%;
	padding-bottom: 5%;
	margin:auto;
	width:100%;
	position:relative;
	z-index:1;
    background:#131c2a;
      background-image: url('../images/background-1.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

.content3 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}



.content4 {
	padding:2rem;
	margin:auto;
	width:100%;
	position:relative;
	z-index:1;
    background:#131c2a;
      background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
  
}

.content4 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
}


.content5 {
	padding:2rem;
	margin:auto;
	width:100%;
	position:relative;
	z-index:1;
    background:#131c2a;
      background-image: url('../images/background-1.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);

}

.content5 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
	font-size: 5.9vw;
}


.content6 {
	padding:2rem;
	margin:auto;
	width:100%;
	position:relative;
	z-index:1;
    background:#131c2a;
      background-image: url('../images/background-2.png');
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
  box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);

}

.content6 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
	font-size: 5.9vw;
}


.content7 {
	padding:0rem;
	margin:auto;
	width:70%;
	height: 20%;
	position:relative;
	z-index:1;
    
    
    background-size: auto;
    background-repeat: repeat; 
  background-position: left top;
 

}

.content7 > h2 {
	margin:auto;
	padding:1rem 5vw;
	max-width:1200px;
	font-size: 5.9vw;
}



.kab {
	padding-top: 5%;
}


.float-container {
    border: 0px solid #fff;
    padding: 10px;
    display: flex;

}

.float-container > div {
  flex: 1; /*grow*/
}

.float-child {
    width: 50%;
    float: center;
    padding: 20px;
    border: 0px solid red;
}  

.float-child2 {
    width: 50%;
    float: center;
    margin-right: 20px;
    padding: 20px;
    border: 0px solid red;
}  
.float-child3 {
    width: 50%;
    float: center;
    
    padding: 20px;
    border: 0px solid red;
}  



a.social-link  {
	display:inline-block;	
	margin:20px 5px;
	
}

a.social-link svg {
	width:30px; 
	fill:#ffffff;
	position:relative;
}

a.social-link:hover svg {
	top:-3px;
 	cursor:pointer;
	fill:#f7d621;
	
}

a.button {
	display:inline-block;
	margin:auto;
	padding:13px 20px 12px;
	background:#f7d621;
	color:#1c050f;
	font-weight:bold;
	text-transform:uppercase;
	text-decoration:none;
	text-align:center;
	width:auto;
	position:relative;
	font-size:1.8em;
	margin-top:2rem;
	border-right:7px solid #1c050f;
	border-bottom:7px solid #1c050f;
	 box-shadow: 0px 0px 10px 3px rgba(24,48,84,0.9);
}

a.button:hover {
	top:-3px;
	background:#ffffff;
	cursor:pointer;
	color:#1c050f;
}

a {
  color: #FA28A1;
}

h1, h2, h3, h4, h5 {
    font-weight:bold;
}

h1 {
font-weight:bold;
font-size:3em;
color:#FA28A1;
}

 h2 {
	font-size:1.5em;
}

h3 {
font-weight:bold;
font-size:2em;

}

h4 {
font-weight:bold;
font-size:2.3em;
color:#00ffe9;
}

h5 {
font-weight:bold;
font-size:3em;

}

h6 {
font-weight:bold;
font-size:2em;
color:#FA28A1;
}

.characters {
	margin:2rem auto;
	padding:1rem 5vw;
	max-width:1200px;
	display: flex;
    justify-content: center;
    gap: 2rem;
    flex-wrap: wrap;
    }

.character {
    width: 70%;
    margin-bottom: -4.9%;
    min-width: 200px;
}

.character h2 {
	margin:1rem auto 0;
}
.character a,
.character img{
    width: 100%;
	display:block;
}
.character a.button {
	display:inline-block;
	width: auto;
	margin:1rem auto;
}
 
.footer {
	text-align:left;
	display:block;
	margin:auto;
	font-size:1.2em;
	padding:2rem 5vw;
	max-width:2000px;
	background:#131c2a;
}
.footer span {
	font-family:"BunkenTechSansPro-Book", helvetica; 
	font-weight:bold;
}


hr.new1 {
    border: 0.13rem dashed #9f8e24;   
}







/* hide scrollbar but allow scrolling */
body::-webkit-scrollbar{
    display: none;
  }

section::-webkit-scrollbar{
    display: none;
  }

  section::-webkit-scrollbar {
    width: 0 !important
    }

section {
    scrollbar-width: none;
  }

  html {
    scrollbar-width: none;
  }
div {
  -ms-overflow-style: none; /* for Internet Explorer, Edge */
  scrollbar-width: none; /* for Firefox */


}
div::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}

/* other styling */
div {


}











/*/ MEDIA QUERIES START HERE //////////////////////////////////////////////////////////////////////////////*/

@media (max-width: 768px) { /* Hand Held Device */

	body {
	font-size:13px;
	}
	.parallax {
		background-size: 150%;
	}
	.logo img{
		width:60vw; 
	}

	.content {
		padding:1rem;
	}
	.characters {
		gap: 1rem;
	}
	.character {
		width: 47%;
		margin-bottom: -9%;
		min-width: 400px;
	}
	hr.new1 {
    border: 0.13rem dashed #9f8e24;
       margin-bottom: -3%;
}

}


@media (max-width: 524px) { /*  Mobile */
  .parallax {
    background-size: 200%;
    }
    .logo img{
		width:80vw; 
	}
	.characters {
    	justify-content: center;
    }
	.character {
		width: 97%;
		margin-bottom: 3%;
		min-width: 200px;
	}
}

@media only screen and (max-width: 720px) {

   body { 
      font-size: 0.9em; 
      height: 70%;
   }

}

@media screen and (min-width: 3240px ) { /* 4K */

}