@charset "UTF-8";
/* CSS Document */


.body {
	

	margin:0px;
  font-size: 32px;
  line-height: 1.5;
font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	   max-width: 100%;
    overflow-x: hidden;

}



.colorguide {
  position: fixed;
  z-index: 1;
  top:-100px;
  left:800;	
  padding-top: 100px;
  padding-left: 480px;
 
  transform: translate3d(0px, -2000px, 0px);
  transition: transform 0.8s ease;
}

.x_out {
	z-index: 1;
	position: fixed;
	cursor: pointer;
	top: 80px;
	right: 60px;
	transform: translate3d(0px, -1000px, 0px);
    transition: transform 0.8s ease;
}




a:link {
    text-decoration: none;
	color: aliceblue;
}



.header {
  position: fixed;
  overflow-y: scroll;
  cursor: pointer;
mix-blend-mode: luminosity;
  z-index: 1;
  top:0;
  left:0;
  padding-top: 50px;
  padding-left: 20px;

}

.menu_toggle {
	position: fixed;
    overflow-y: scroll;
	cursor: pointer;
    z-index: 3;
    top:0;
    left:0;	
	mix-blend-mode: multiply;
	padding-top: 225px;
	padding-left: 50px;
	transition: transform 0.3s ease;
	
}
 

.question {
	z-index: 3;
position: fixed;
	right: 0px;
    overflow-y: scroll;
	padding: 60px;
	transition: transform 0.3s ease;
	
}
 

.speaker {
	position: fixed;
	left: 60px;
	top: 450px;
	overflow-y: scroll;
	padding: 145px 120px 0px 0px;
   transition: transform 0.8s ease;
	
	
}


.nav-a {
    position: absolute;
	z-index: 4;
	left:30px;
	top:125px;	
}


.nav-b {
    position: absolute;
    z-index: 5;
	left:30px;
	top:225px;	
}

.nav-c {
    position: absolute;
	z-index: 6;
	left:30px;
	top:325px;	
}



.menu {
	position: fixed;
	overflow-y: scroll;
	top:160px;
	left:0;
	padding-top:65px;
    z-index: 7;
	transform: translate3d(-100%, 0px, 0px);
	transition: transform 0.5s ease;
	mix-blend-mode: multiply;
	
}


/*.slide-A {
  	position: absolute;
	width: 100vw;
	overflow-x: hidden;
	
	float: left;
	top: 1300px;
	left: 8px;
	z-index: -2;

	
 }*/

.slide-B {
  	position: absolute;
	width: 100vw;
	overflow-x: hidden;
	float: left;
	top: 20px;
	left: 8px;
	z-index: -2;

	
 }

.slide-C {
  	position: absolute;
	width: 100vw;
	overflow-x: hidden;
	float: left;
	top: 20px;
	height: 100%;
	left: 8px;
	z-index: -2;

	
 }


.footer_main {
	position: absolute;
	z-index: 10;
	top: 1200px;
	font-family:namskin;
	left: 60px;
	color:#FFFFFF;
	
	
}


.footer_main_b {
	position: absolute;
	z-index: 10;
	top: 850px;
	font-family:namskin;
	left: 60px;
	color:#00000;
	
	
}

.footer_main_c {
	position: absolute;
	z-index: 10;
	top: 850px;
	font-family:namskin;
	left: 60px;
	color:#FFFFFF;
	
	
}
.label {
	position: absolute;
	z-index: 10;
	top: 1200px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	right: 60px;
	color:white;
	
}

.label_sept {
	position: absolute;
	z-index: 10;
	top: 830px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	right: 60px;
	color:black;
	
}

.label_sept:link {
	position: absolute;
	z-index: 10;
	top: 830px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	right: 60px;
	color:black;
	

}

.label_headsea {
	position: absolute;
	z-index: 10;
	top: 830px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	right: 60px;
	color:white;
	
}

.label_headsea:link {
	position: absolute;
	z-index: 10;
	top: 830px;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	right: 60px;
	color:white;
	

}
 
.insta {
	position: absolute;
	top: 57px;
	left: 120px
}


.linkedIn {
	position: absolute;
	top: 60px;
	left: 40px;
	
}


.text {
	position: absolute;
	top: 150px;
	left: 20px;
}

.xoutmenu {
	position: absolute;
	top: 95px;
	left: 200px;
}


.informationLW {
	position: fixed;
	overflow-y: scroll;
	top: 550px;
	left: 0px;
	z-index: 8;
	font-family:"Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", Verdana, "sans-serif";
	transform: translate3d(-100%, 0px, 0px);
	transition: transform 0.5s ease;
	mix-blend-mode: multiply;

}

.song_neptune_headsea {
	z-index: 20px;
	position: absolute;
	top: 780px;
	left: 50px;
}



.open {
  transform: translateX(0);
}




.hide {
	transform: scale(0);
}

.hide2 {
	transform: scale(.5);
}


.open2 {
	transform: translateX(0);
}

.open3 {
	transform: translateY(0);	
}

@media (max-height: 720px) {
	
	.colorguide {
        z-index: 13px;
		width: 400px;
		height: 400px;
		top: 0px;
	
		
	}
	
	.x_out {
		z-index: 13px;
		width: 80px;
		height: 40px;
		right: 50px;
		top: 10px;
	}
	
	.question {
		left: 333px;
		top: 300px;
	}
	
	.insta {
	
	top: 20px;
	left: 120px
}


.linkedIn {
	
	top: 20px;
	left: 40px;
	
}


.text {
	
	top: 50px;
	left: 20px;
}
	
.informationLW {

	top: 400px;
	left: 0px;
		

}
	
	.footer_main {
		
		top: 1000px;
	
	}
}

@media (max-width: 1260px){
	.body {
		background-color: aqua;
	}
	
	.colorguide {
        z-index: 13px;
		width: 700px;
		eight: 700px;
        padding-left: 250px;
		top:0px;
		
	}
	
	.x_out {
		z-index: 13px;
		width: 80px;
		height: 40px;
		right: 50px;
		top: 75px;
		padding: 20px;
	}
	
	.question {
		left: 455px;
	}
	
	
 
.insta {
	position: absolute;
	top: 57px;
	left: 120px
}


.linkedIn {
	position: absolute;
	top: 60px;
	left: 40px;
	
}


.text {
	position: absolute;
	top: 150px;
	left: 20px;
}
.informationLW {
	position: fixed;
	overflow-y: scroll;
	top: 550px;
	left: 0px;
	z-index: 8;
}


.footer_main {
		
		top: 1000px;
	
	}
	
	.mainpic {
		height: 1280px;
	}
	
	
}





@media (max-width: 640px) {
	
	.slide-A {
		width: 100vw;
	}
	
	.colorguide {
		position: fixed;
        z-index: 15;
		padding: 0;
		top: 300px;
	    width: 500px;
		left: 0px;
		
	
	}
	
	.question {
		left: 200px;
		top: 0px;
	
	}
	
	.x_out {
		
		width: 50px;
		height: 50px;
		right: 40px;
		top: 90px;
		padding: 20px;
		overflow-y: hidden;
	}
	
	
	.footer_main {
		
		top: 1000px;
	
	}
	
	.mainpic {
		height: 1280px;
	}
}