/*@import url("alt_2b.css");
@import url("alt_3b.css");
@import url("alt_4d.css");*/
html, body, div, span, p, a, del, em, img, ol, ul, li, fieldset, form, label {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	/*font: inherit;*/
	vertical-align: baseline;
}

a:link{
	color:#22b6cc;
	
	text-decoration:none;
}

a:visited {
color:#999;
text-decoration:none;
}

a:hover, a:active {
    color:#22b6cc;
}
		
		
#easing4 a:link{
	color:#666;
	
	text-decoration:none;
}

#easing4 a:hover, a:active {
    color:#22b6cc;
}
			

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

html, body {
	line-height: 1;
	min-height:100%;
	
    
}

#radio{
	
	position: fixed;
	z-index: 113;
	margin-top:38px;
	margin-left: 65%;
	visibility: hidden;
	
	
}

#giassonrock{
	display:none;
	background-image:url('')
}

#gilliganrock{
	
	display:none; 
	background-image:url('')
}

#glowrock{
	
	display:none; 
	background-image:url('')
}


#rock1 { display:none; 
	background-image:url('');
	width: 0px;
	z-index:80;}

#rock2 {display:none; 
	background-image:url('');
	width: 0px;
	z-index:80;
}


#introrock{
	
	display:none; 
	background-image:url('');
	width: 0px;
	z-index:80;
	
}

#intropage{
	
	display:none; 
	background-image:url('')
}

#thainrock{
	
	background-image:url('');
	display: none;
}


#sisselrock{
	
	background-image:url('');
	display: none;
}

#adamrock{
	
	background-image:url('');
	display: none;
}

#nicolerock{
	
	background-image:url('');
	display: none;
}

#colorpicker{
	width: 12px;
	height: 12px;
	background-color: deeppink;
}

#colorpicker2{
	width: 12px;
	height: 12px;
	background-color: yellow;
}

#colorpicker3{
	width: 12px;
	height: 12px;
	background-color: darkorange;
}

#colorpicker4{
	width: 12px;
	height: 12px;
	background-color: dodgerblue;
}

#colorpicker5{
	width: 12px;
	height: 12px;
	background-color: mediumpurple;
}

#colorpicker6{
	width: 12px;
	height: 12px;
	background-color: lightgreen;
}

#colorpicker7{
width: 12px;
	height: 12px;
	background-color: whitesmoke;
}

#colorpicker8{
	width: 12px;
	height: 12px;
	background-color: grey;
}

#colorpicker9{
	width: 11px;
	height: 11px;
	border-color: white;
	border: 1px;
	/*background-color: red;*/
	border-style: solid;
	
}

#colorpicker10{
	width: 11px;
	height: 11px;
	border-color:deeppink;
	border: 1px;
	/*background-color: red;*/
	border-style: solid;
	
}

#colorpicker11{
	width: 12px;
	height: 12px;
	background-color:darkred;
	
}

#plaintextbox{
	font-size: 12px;
	width: 100%;
	height: 11px;
	background-color: #fff;
	border: 1px;
	color: #333333;
	/*background-color: red;*/
	
}

#pinkestpinkbox{
	font-size: 12px;
	width: 100%;
	height: 11px;
	background-color: deeppink;
	border: 1px;
	color: #333333;
	/*background-color: red;*/
	
}
#yellowbox{
	font-size: 12px;
	width: 100%;
	height: 11px;
	background-color: yellow;
	border: 1px;
	color: #333333;
	/*background-color: red;*/
	
}


#pinkestpinkintro{
	
	width:300px;
	height:300px;
	padding-top:0%;
	align-content: center;
	margin-left: 280px;
	z-index:110;
	
	
	/*background-image:url("../bluestring.png");*/
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}



#pinkestpink{
	
	width:90%;
	height:75px;
	
	padding-top:0%;
	align-content: center;
	/*margin-left: 280px;*/
	margin-left: 5%;
	z-index:110;
	opacity:0.4;
	
	
	/*background-image:url("../bluestring.png");*/
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


#pinkestpink2{
	
	width:300px;
	height:300px;
	padding-top:0%;
	align-content: center;
	/*margin-left: 280px;*/
	margin-left: 5%;
	z-index:110;
	opacity:0.4;
	background-color: deeppink;
	
	
	/*background-image:url("../bluestring.png");*/
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


/*#pinkestpinkunder{
	
	width:40%;
	height:40%;
	padding-top:0%;
	align-content: center;
	z-index:110;
	background-color: deeppink;
	
	
	/*background-image:url("../bluestring.png");*/
	
	/*-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}*/

#weightrock1 {
	
	background-image:url('');
	background-size: 0px;
	display: none;
	z-index: 108;
}





#string{
	
width:1000px;
	height:900px;
	padding-top:30%;
	margin-left:20%;
	z-index:119;
	background-image:url("");
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#paint1{
	width:1000px;
	height:900px;
	padding-top:30%;
	margin-left:20%;
	z-index:130;
	background-image:url("");
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#paint2{
	width:1000px;
	height:900px;
	padding-top:30%;
	margin-left:20%;
	z-index:131;
	background-image:url("");
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#paint3{
	width:1000px;
	height:900px;
	padding-top:30%;
	margin-left:20%;
	z-index:132;
	background-image:url("");
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#paint4{
	width:1000px;
	height:900px;
	padding-top:30%;
	margin-left:20%;
	z-index:133;
	background-image:url("");
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#paint5{
	width:1000px;
	height:900px;
	padding-top:25%;
	margin-left:18%;
	z-index:134;
	background-image:url("");
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#paint6{
	width:1000px;
	height:900px;
	padding-top:5%;
	margin-left:15%;
	z-index:135;
	background-image:url("");
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#paint7{
	width:1000px;
	height:900px;
	padding-top:40%;
	margin-left:45%;
	z-index:136;
	background-image:url("");
	background-repeat: no-repeat;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

body {
	background-color: #ffffff;
	background: -webkit-linear-gradient(top, #FFF, #FFF 100%);
	background: -moz-linear-gradient(top, #FFF, #FFF 100%);
	background: -o-linear-gradient(top, #FFF, #FFF 100%);
	background: -ms-linear-gradient(top, #FFF, #cccccc 100%);
	background: linear-gradient(top, #FFF, #FFF 100%);
	background-attachment:fixed;
	font-weight:normal;
	line-height: 1;
	min-height:100%;
	font-family: "didact-gothic","josefin-sans","muli", Helvetica Neue, Helvetica, Arial, sans-serif;
	background-image: url();
	margin-left: 0px;

}

#linkimage{
	
	width: 0px;
	height: 0px;	
}

ol, ul {
	list-style: none;
}

.style1 {color: #CCCCCC}
.style2 {color: #000000}


p {
	margin:1em;
	line-height:1.9em;
	font-size:17px;
	font-weight:normal;
	color:#333;
	opacity:1.0;
	font-family:  Helvetica Neue, Helvetica, Arial, sans-serif;
	
	background-color:transparent;
	/*background-color: black;*/
	display:inline;
}


.p2{
margin:1em;
	line-height:1.9em;
	font-size:16px;
	font-weight:normal;
	color:#fff;	
	opacity:0.8;
	font-family: AppleGothic, sans-serif;
	
	background-color:transparent;
	/*background-color: black;*/
	display:inline;
}

.p3 {
	
	color:#666666;
}

.p4{
	margin:1em;
	line-height:1.9em;
	font-size:17px;
	font-weight:normal;
	color:#333;
	opacity:1.0;
	font-family:  Helvetica Neue, Helvetica, Arial, sans-serif;
	
	/*background-color:white;
	background-blend-mode: screen;*/
	/*background-color: black;*/
	display:inline;}


.p5{
	margin:1em;
	line-height:1.9em;
	font-size:17px;
	font-weight:normal;
	color:white;
	opacity:1.0;
	font-family:  Helvetica Neue, Helvetica, Arial, sans-serif;
	
	/*background-color:white;
	background-blend-mode: screen;*/
	/*background-color: black;*/
	display:inline;}

.p6{
	margin:1em;
	line-height:1.2em;
	font-size:11px;
	font-weight:normal;
	color:#3B3B3B;
	opacity:1.0;
	font-family:  Helvetica Neue, Helvetica, Arial, sans-serif;
	
	/*background-color:white;
	background-blend-mode: screen;*/
	/*background-color: black;*/
	display:inline;}

.red {
	font-size:10px;
	color:#CCC;
	opacity:0;
}




#topmenulevel{
position:fixed;
z-index:300;
top:0em;
width:100%;


}

#topmenu {
	position:fixed;
	top: 0em;
	z-index:120;
	background:#09C;
	width:100%;
	opacity: 0.8;
	
}

#rightpadding {
padding: 16px 22px 8px 12px;
display:block;
}

#rightmenu {
position:fixed;
top:8%;
z-index:121;
/*background-color:#CCCCCC;*/
height:100%;
text-align:right;
right:0;
vertical-align:top;

}

#nav {
    overflow: hidden;   
    height: 20px; 
	right:0;
	text-align:right;
	position:fixed;
	top:0em 0;
	
}








#n1 {
	position: absolute;
	top: 1000px;
	}
	
#n2 {
	position: absolute;
	top: 15000px;
}

#n3 {
	position: absolute;
	top: 32500px;
}

#n4 {
	position: absolute;
	top: 46200px;
}


#n5 {
	position: absolute;
	top: 61200px;
}

#n6 {
	position: absolute;
	top: 72000px;
}


#n7 {
	position: absolute;
	top: 75600px;
}

#n8 {
	position: absolute;
	top: 81000px;
}

#n9 {
	position: absolute;
	top: 84180px;
}



#t1 {
	position: absolute;
	top: 91850px;
}
	
#t2 {
	position: absolute;
	top: 93200px;
}


#t3 {
	position: absolute;
	top: 98000px;
}

#t4 {
	position: absolute;
	top: 115000px;
}

#t5 {
	position: absolute;
	top: 119800px;
}

#properties p{
	line-height:2.1em;
}
#properties2 p{
	line-height:2.1em;
}

#easing2 p{
	line-height:2.1em;
}

#easing p{
	line-height:2.1em;
}

q {
	font-style:italic;
	color:#333;
}

h1 {
	/*font-size:2.91em;*/
	font-family: "anonymous-pro", "didact-gothic", "josefin-sans", Helvetica Neue, sans-serif;
	font-size:1.7em 26px;
	line-height:1.9em;
	margin:0;
	color:#333333;
	text-decoration: underline;
	background-color: white;
	opacity: 0.9;
	padding-left:2%;
}

.timesexc {
	font-family:"Times New Roman", Times, serif;
}


h2 {
	font-size:75px;
	line-height:0.5em;
	margin:0;
	/*font:"Times New Roman", Times, serif;*/
	font-weight:normal;
	opacity:0.2
}

container h2{
	font:"Times New Roman", Times, serif;
}



h3 {
	color:#666;
	/*font-size:1.41em;*/
	font-size: 1.2em;
	line-height:0.1em;
	margin:1em 0;
}

h3:first-child {margin-top:0;}



h4 {
	color:#333333;
	/*font-size:1.11em;*/
	font-size:14px;
	margin:1em 0;
	line-height:1.4em;
	font-weight:normal;
	padding-left: 2%;
	background-color: white;
	opacity: 0.6;
	
}



h5 {
	margin-right:10%;
	margin-left:5%;
	line-height:1.8em;
	font-size:14px;
	/*font-size:1.11em;*/
	color:#fff;
	text-align:right;
	font-weight:normal;
}

h6 { 
	margin:5%;
	line-height:0.8 em;
	font-size:0.8em;
	text-align:left;
	font-weight:normal;

}

#progress {
	height:2%;
	background:#999;
	bottom:0;
	z-index:200;
}

#scrollbar {
	position:fixed;
	right:2px;
	height:50px;
	width:6px;
	background:#444;
	background:rgba(0,0,0,0.6);
	border:1px solid rgba(255,255,255,0.6);
	z-index:300;
	border-radius:1px;
}

.skrollr-desktop #scrollbar {display:none;}

#bg1, #bg2, #bg3 {
	z-index:50;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:url(strobe_1.gif) repeat 0 0;
}

#bg2 {
	z-index:49;
	background-image:url(strobe_1.gif);
}

#bg3 {
	z-index:48;
	background-image:url(images/lighter.gif);
}
#tangenttext{
	color: transparent;
	margin-right: 0%;
	visibility: hidden;
}

#tangenttext2{
	
	
	visibility:hidden;
	
}
/*
#tangenttext p{
	color: transparent;
	
}*/

#intro2 {
	display: block;
	width:87%;
	height:100%;
	padding-top:5%;
	/*text-align:justified;*/
	margin-left:5%;
	z-index:110;
	font-weight:normal;
	background-color:transparent;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#intro3 {
	display: block;
	width:87%;
	height:100%;
	padding-top:5%;
	/*text-align:justified;*/
	margin-left:5%;
	z-index:110;
	font-weight:normal;
	background-color:transparent;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#introtitle {
	display: block;
	width:87%;
	height:100%;
	padding-top:5%;
	/*text-align:justified;*/
	margin-left:5%;
	z-index:110;
	font-weight:normal;
	background-color:transparent;
	
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}




#morales {
	display: block;
	width:87%;
	height:2000px;
	padding-top:5%;
	text-align:center;
	margin-left:5%;
	z-index:110;
	font-weight:normal;
	background-color:transparent;
	

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


#sisselimage {
	width:90%;
	height:1100px;
	padding-right: 3%;
	padding-top:5%;
	margin-left:3%;
	z-index:109;
	background-image: url(../exhimages/sissel-penink.jpg);
	background-size: 1000px;
	
	opacity: 0.9;
	

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}



#sisselwhite {
	width:90%;
	height:1100px;
	padding-right: 3%;
	padding-top:5%;
	text-align:justified;
	margin-left:3%;
	z-index:109;
	background-color: white;
	background-size: 1000px;
	
	opacity: 0.3;
	

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}


#intro {
	width:87%;
	height:2000px;
	padding-top:5%;
	text-align:justified;
	margin-left:5%;
	z-index:110;
	font-weight:normal;
	

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#intro p{
font-weight:normal;
}




#transform {
	width:70%;
	left:50%;
	top:20%;
	margin-left:-35%;
	text-align:center;
	font-size:150%;

	/*transform-origin(50%, 50%);*/
}

#properties {
	width:90%;
	height:100%;
	padding-top:10%;
	text-align:justified;
	margin-left:5%;
	z-index:110;

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

#properties2 {
	width:90%;
	height:100%;
	padding-top:5%;
	margin-left:5%;
	line-height:2.1em;
	text-align:justify;
	z-index:118;
	

	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}



#easing_wrapper {
	width:100%;
	height:100%;
	display: block;
}


#easing_wrapper2{
	width:100%;
	height:100%;	
}

#drop_wrapper {
	width:100%;
	height:100%;
}

#article_wrapper{
	width:90%;
	height:100%;
	margin-left:5%;
}

#easing {
	top:5%;
	width:85%;
	z-index:101;
	margin-left:5%;
}

#easingtest {
	top:5%;
	width:90%;
	z-index:101;
	margin-left:5%;
}

#easing3 {
	top:5%;
	width:90%;
	z-index:101;
	margin-left:5%;
	height:100%;
}

#easing4under {

	top:5%;
	width:90%;
	z-index:100;
	margin-left:0%;
}

#easing4over {

	top:5%;
	width:90%;
	z-index:119;
	margin-left:0%;
}


#easing4 {

	top:5%;
	width:90%;
	z-index:101;
	margin-left:0%;
}


#easing4margin {

	top:5%;
	width:30%;
	z-index:101;
	margin-left:0%;
}

#easing4margin2 {

	top:5%;
	width:75%;
	z-index:101;
	margin-left:0%;
}


#easing4tangents {

	top:5%;
	width:90%;
	z-index:101;
	margin-left:0%;
}

#easing4tangents h1{
	margin-left:0%;
}

#easing4tangents h3{
	margin-left:0%;
}


#easing4 h1{
	margin-left:5%;
}

#easing4 h3{
	margin-left:5%;
}

#easing5 {
background-color:#000;
	top:5%;
	width:100%;
	z-index:105;
	margin-left:0%;
}

#easing5 p{
margin-left:5%;
margin-right:5%;
font-weight:150;
}

#easing5text {
	z-index:106;
	margin-left:5%;
width:90%;
}

#network {
background-image: url("../images/network.jpg"); 
background-repeat: repeat-x;
top:5%;
	width:100%;
	z-index:109;
	margin-left:0%;
	}

#easing5 h1{
	margin-left:5%;
}

#easing5 h3{
	margin-left:5%;
}

#nest {
	margin-left:5%;
}

.drop {
	background:#fff;
	/*background-color:transparent;*/
	font-weight:bold;
	padding:1em;
}

.drop2 {
	background:#fff;
	/*background-color:transparent;*/
	font-weight:bold;
	padding:1em;
}
.drop3 {
	background:#666;
	/*background-color:transparent;*/
	font-weight:bold;
	color:#FFF;
	padding:1em;
}


.drop3 a:link{
	color:#fff;
}

.drop3 a:hover, a:active {
    color:#22b6cc;
}



.dropimage {
	
	background-color:transparent;
	/*color:#FFF;*/
	padding:1em;
}

.drop4 {
	background:#fff;
	background-color:transparent;
	font-weight:bold;
	padding:1em;
	
}

.drop4 h5{
	text-align:center;
}



.drop_intro{
	background:#000;
	color:#FFF;
	font-weight:bold;
	padding:1em;
}

.drop p {
	font-size:18px;
}


#whiteout {
	color: #FFF;
	font-family: "Century Gothic", Arial, Helvetica;
}
.whiteout_2 {
	color: #FFF;
}

.easing4greyout {
	color: #666666;
}

.container {
  position: relative;
  max-width: 400px;
  margin: 0 auto;
  padding: 5%;
  text-align:center;
	display: block;
}

.container2 {
  position: relative;
  max-width: 1200px;
  margin: 0 auto;
  padding: 5%;
  text-align:left;
}
.container--offset {
  margin-left: 10%;
}

.layer:nth-child(1) {
  opacity: 0.55;
}

.scene {
  padding: 0;
  margin: 0;
  border:0;
}
.scene2 {
  padding: 0;
  margin: 10px;
  
}

.fill {
	position: absolute;
	bottom: 5%;
	right: 5%;
	left: 36px;
	top: 5%;
}

.fill2 {
  position: absolute;
  bottom: 5%;
  right: 5%;
  left: 9%;
  top: 5%;
}

.expand-width {
  width: 100%;
  
}
.aspect {
  opacity: 1.0;
}


#creature {
	width:2000px;
	height:2000px;
	 
	background-image:url(../creature_test.png)
}

#creaturered {
	width:2000px;
	height:2000px;
	 
	background-image:url(../floride.png)
}

#creatureblue {
	width:2000px;
	height:2000px;
	 
	background-image:url(../turquois.png);
	background-repeat: no-repeat;
}

#creaturegreen {
	width:2000px;
	height:2000px;
	background-image:url(../dotsplash.png);
	background-repeat: no-repeat;
	margin-left:25%;
}

#creaturestone {
	width:2000px;
	height:2000px;
	 
	background-image:url(../oranges.png);
	background-repeat: no-repeat;
}

#creaturescene {
	width:2000px;
	height:2000px;
	 
	background-image:url(../orangestring.png);
	background-repeat: no-repeat;
	margin:60%;
}