/*begin reset*/

* {
vertical-align: baseline;
font-weight: inherit;
font-family: sans-serif;
font-style: inherit;
font-size: 100%;
border: 0 none;
outline: 0;
padding: 0;
margin: 0;
}

/*for older browsers that don't understand HTML5*/
div, article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, .gal img {
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	}


/*End Reset*/

.clear:after{
	display:block;
	height: 0;
	content: ".";
	clear:both;
	visibility: hidden;/*note this out to see where it places the "."*/
}

/*IE fixes*/

/* IE 6*/
* html .clear{
	height: 1%;
}

/* IE7 */
*:first-child+html .clear{
	min-height: 1px;
}

/* End IE fixes */

@-ms-viewport{
    width: device-width;
}
/* base structure*/
#pagewrapper{
	width: 100%;
}

.content{
	position: relative;
	max-width: 960px;
	/*background: #ccc;*/
	margin: 0 auto;
}

.top{
	font-size: 1.25em;
	font-weight: 100;
		color:#ffa400;
}

.logo_home{
	width: 100%;
	height: 60px;
	background: #fff;
	text-align: center;
	margin: 0 auto;
	padding: 0 0 60px;
}
footer{
	width: 100%;
	text-align:center;
	font-size: .75em;
	line-height: 1.8em;
	color:#ccc;
	padding: 20px 0;
	color:rgba(000,000,000, .1);
	
}

/*training wheels*/

.space{
	width:100%;
	position: relative;
	height:auto;
	margin: 25px 0;
	z-index: 3;
	overflow: hidden;
}

.effect_con{
	width: 100%;
	position: absolute;
	bottom:0;
	
}

/* end base structure*/


p{
	margin: .8em;
	color:rgba(0,0,0,.55);
}

h1{
	font-weight: 500;
	font-size: 2em;
	text-align: center;
	color:#ffa400;
	border-bottom: 1px solid #ccc;
}

h3{
	color:rgba(0,0,0, .5);
	font-size: 1.45em;	
}
.list{
	opacity: .3;
	font-size: .85em;
	margin: 0 0 0 35px;
}
.title{
	text-align: center;
	font-size: 2em;
	font-weight: 100;
	color:rgba(255,255,255, 1);
	padding: 50px 0;
	margin-top: 10px;
	margin-bottom: 10px;
	background: rgba(000,000,000, .07);
}

.home_h1{
	font-size: 3.75em;
		color:#ffa400;
		border: 0;
}
.b2{
	font-weight: 500;
	color:#ccc;
}

.b3{
	color:#ccc;
}
/* navigation*/
/*chem nav*/
.chem{
	position: relative;
	width:260px;
	height:110px;
	margin:110px auto 0;
}
.chem li{
	display: block;
	border-radius: 50%;
	border: 5px solid #c7c7c7; 
	z-index: 100;
	box-shadow:inset -5px -4px 8px rgba(000,000,000, .1);
}

.chem a{
	display: block;
}

.bn1, .bn2, .bn3, .bn4{
	background: #fff;
	z-index: 2;
	position: absolute;
	-webkit-transition: .5s ease;
	transition: .5s ease;
}



.bn1{
	width: 40px;
	height: 40px;
	top:53px;
	left:40px;
	z-index: 1;
	-webkit-animation: fadebounce .5s;
	-webkit-animation-delay: 1s;
	-webkit-animation-fill-mode: forwards; 
	animation: fadebounce .5s;
	animation-delay: 1s;
	animation-fill-mode: forwards;
}

.bn1 a{
	width: 40px;
	height: 40px;
}

.bn2{
	width: 60px;
	height: 60px;
	top: 0px;
	left:84px;
	z-index: 3;
	-webkit-animation: fadebounce .5s;
	-webkit-animation-delay: 2s;
	-webkit-animation-fill-mode: forwards;
	animation: fadebounce .5s;
	animation-delay: 2s;
	animation-fill-mode: forwards; 
}

.bn2 a{
	width: 60px;
	height: 60px;
}

.bn3{
	width: 30px;
	height: 30px;
	top:58px;
	left:150px;
	z-index: 6;
	-webkit-animation: fadebounce .5s;
	-webkit-animation-delay: 2.5s;
	-webkit-animation-fill-mode: forwards;
	animation: fadebounce .5s;
	animation-delay: 2.5s;
	animation-fill-mode: forwards;
}

.bn3 a{
	width: 30px;
	height: 30px;
}
.bn4{
	width: 25px;
	height: 25px;
	top:31px;
	left: 187px;
	z-index: 7;
	-webkit-animation: fadebounce .5s;
	-webkit-animation-delay: 3s;
	-webkit-animation-fill-mode: forwards;
	animation: fadebounce .5s;
	animation-delay: 3s;
	animation-fill-mode: forwards;
}

.bn4 a{
	width: 25px;
	height: 25px;
}
.bn1:hover, .bn2:hover, .bn3:hover, .bn4:hover{
	background: #ffa400;
}

.label{
	display: block;
	position: absolute;
	height:0px;
	background: #000000;
	padding: 5px;
	color:#fff;
	opacity: 0;
	border-radius: 5px;
	-webkit-transition: .2s ease;
	transition: .2s ease;	
}
.l1{left:-35px; top:-35px;}
.l2{right:-80px; top:-15px;}
.l3{left:-55px; top:10px;}
.l4{bottom:-40px; left:16px;}

.apr{height:20px; opacity: .2; }

.line{
	display: block;
	position: absolute;
	background: #c7c7c7;
}

.p1, .p2, .p3{
	
}
.p1{
	width: 30px;
	height: 10px;
	z-index: 1;
	top:57px;
	left:139px;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);


}
.p2{
	width: 10px;
	height:30px;
	top:40px;
	left:86px;
	z-index: 1;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	
}
.p3{
	height:30px;
	width:10px;
	top:45px;
	left:189px;
	z-index: 1;
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	
}

/*boring navigation*/
#boring_nc{position: relative; max-width: 960px; height: 30px;}
#boring_n, #boring_n a, #tab{
-webkit-transition:1s ease;
	-moz-transition:1s ease;
	transition:1s ease;
}

#boring_n{
	position:relative;
	background: #f8f8f8;
	height:30px;
	margin: 30px auto;
	overflow: hidden;
	border-radius:10px;
	
}
#boring_n li {
	display: block;
	float:left;
	margin: 3px 5px;
}

#boring_n a{
	text-decoration: none;
	display: block;
	padding: 3px 5px;
	background: #eaeaea;
	color:#ccc;
	border-radius: 5px;
	}
#boring_n a:hover{
	background: #333;
	color:#f3f3f3;
}
#tab{
	position: absolute;
	right:0;
	width:130px;
	height:30px;
	background: #f3f3f3; 	
	font-size: .84em;
	text-align: center;
	color: #333;
	border-radius:10px;	
	cursor:pointer;

}
#tab p{ 
	margin: 7px;
	-webkit-touch-callout:none;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}


.n1{width:130px;}
.out{width:410px;}

/*inner pages*/
.inner_n{
	padding: 79px 0 5px 0;
}

.inner_n li{
	display:inline;
	float: left;
}

.inner_n a{
	margin: 0 5px 0 0;
	padding: 5px;
	}

/*sticky navigation*/
.stuck{
	position: fixed;
	width: 100%;
	top:0;
	background: #f3f3f3;
	/*background: rgba(0, 0, 0, .02 );*/
	z-index: 200;
	-webkit-transition: .5s ease;
	transition: .5s ease;
}

.fixed_n{
	max-width: 960px;
	margin:0 auto;
	
}

#inner_n{
	float:right;
	display: block;
	height: 90px;
	width: 100%;
	
}

#inner_n ul{
	float:right;
	display: block;
	margin:61px 0 0;
	width:65%;		
}

#inner_n li{
text-align: center;
	display:block;
	width:24%;
	float:left;
}


#inner_n a{
	position: relative;
	display: block;
	padding: 5px 0;
	width:100%;
	z-index: 3;
	text-decoration: none;
	border-radius:2px;
	color: rgba(0,0,0,.1);
	/*background:rgba(0,0,0,.01);*/
	-webkit-transition: .5s ease;
	transition: .5s ease;
}

#inner_n a:hover{
	color:#fff;
	background:rgba(0,0,0,.1);
}

.n_line{
	display: block;
	border-left: 2px solid #ccc;
	height: 25px;
	float:left;
	margin:4px 0 0;
}

#logo{
	position: absolute;
	z-index: 30;
	width: 200px;
}

#logo img{
	margin: 5px;
}


/*end navigation*/

/* grids */

.grid_5,.grid_10,.grid_15,.grid_20,.grid_25,.grid_30,.grid_35,.grid_40,.grid_45,.grid_50,.grid_55,.grid_60,.grid_65,.grid_70,.grid_75,.grid_80,.grid_85,.grid_90,.grid_95,.grid_100m,.grid_66,.grid_33{ 
	padding: 15px;
	z-index: 50;
}

.grid_100{
	width:100%;
	margin-top:5px;
	clear: both;
}

.grid_5{
	width:5%;	
	background: #c1c1c1;
	margin-top:5px;	
}

.grid_95{
	width:95%;
	background: #ccc;
	margin-top:5px;	
}

.grid_10{
	width: 10%;
	background: #c1c1c1;
	margin-top:5px;	
}

.grid_90{
	width:90%;
	margin-top:5px;	
}

.grid_15{
	width: 15%;
	margin-top:5px;	
}

.grid_85{
	width:85%;
	background: #ccc;
	margin-top:5px;	
}

.grid_20{
	width: 20%;
	margin-top:5px;	
}

.grid_20i{
		
}


.grid_80{
	width:80%;
	background: #ccc;
	margin-top:5px;	
}

.grid_25{
	width: 25%;
	margin-top:5px;	
}

.grid_75{
	width:75%;
	margin-top:5px;	
}

.grid_30{
	width: 30%;
	margin-top:5px;	
}

.grid_70{
	width:70%;
	background: #ccc;
	margin-top:5px;	
}

.grid_35{
	width:35%;
	background: #ccc;
	margin-top:5px;	
}

.grid_65{
	width:65%;
	background: #ccc;
	margin-top:5px;	
}

.grid_40{
	width:40%;
	margin-top:5px;	
}

.grid_60{
	width:60%;
	margin-top:5px;	
}

.grid_45{
	width:45%;
	margin-top:5px;	
}

.grid_55{
	width:55%;
	margin-top:5px;	
}

.grid_50{
	width: 50%;
	margin-top:5px;	
}

/* thirds*/
.grid_33{
	width: 33.33333333333333333333333333333%;
	margin-top:5px;	
}

.grid_66{
	width:66.666666666666666666666666%;
	background: #ccc;
	margin-top:5px;	
}
/*end thirds*/

/* end grids */

.left{
	float:left;
}
.right{
	float:right;
}

.center{
	margin-left: auto;
	margin-right: auto;
	clear:both;
}




/*para stuff*/
.mover_2, .m0, .m1, .m2, .m3{
opacity:.25;
}

.mover_2{
	position: absolute;
	bottom: 0;
	z-index: 1;
	width: 40px;
	height: 40px;
	border-radius:50%;
}

.m0{
	left:5.2%;
	bottom: 20px;
	}
.m1{
	left:10.4%;
}
.m2{
	
	left:20.8%;
	bottom: 50px;
}

.m3{
	left:41.6%;
	bottom:-150px;
}
.m4{
	bottom:-200px;
}
/*distance*/
.d2{
	left:31.25%;
}
.d3{
	left:46.875%;
}
.d4{
	left:52%;
}

.d5{
	left:57.3%;
}

.r1, .r2, .r3, .r4, .r5,.r6{
	/*background: #94b2ff;*/
	height: 70px;
	width: 70px;
	opacity: .45;
}

.r1{
	left:83.33%;
}

.r2{
	left:68.75%;
}
.r3{
	left:46.875%;
}
.r4{
	left:47.92%;
}

.r5{
	left:42.70%;
}
.r6{
	left:21%;
}

.plus_100{
	padding-bottom: 100px;
}

.gal img{
	box-shadow: 0px 0px 5px #ccc;
	border-radius: 50%;
	z-index: 50;
	float:left;
	-webkit-transition: .5s ease;
	transition: .5s ease;
}

.bi,.bk,.em,.cd,.wed{
	display: block;
	width: 18%;
	padding:5px;
	margin: 1%;
}

.bye{
	opacity: 0;
	visibility: hidden;
}
.spacer{
	display: block;
	margin-bottom: 200px;
}
.orange{
	color:#ffa400;/*rgba(225,164,0, 1);*/
	font-weight: 500;
}
.iseeyou{
	background: #ccc;
}
.all{
	cursor:pointer;
}
.notme{
	position: absolute;
	opacity: 0;
	width: 0%;
	padding:0px;
	margin: 0%;
}

#sorter{
	display: block;
}

#sorter li{
	display: block;
	margin:10px 5px 10px 0;
	padding: 5px;
	background: #f3f3f3;
	color:#ccc;
	font-size: .90em;
	float:left;
	cursor:pointer;
	border-radius: 10px;
	-webkit-transition: 1s ease;
	transition: 1s ease;
}

#sorter li:hover{
	background: rgba(225,164,0, 1);
	color:#fff;
}
.back{
	visibility: hidden;
	text-align: center;
	padding: 30px 0;
}
.back a{
	background: #f3f3f3;
	padding: 5px;
	border-radius:10px;
	text-decoration: none;
	color:rgba(225,164,0, 1);
}
/*contact form rules*/
#contFrm li{
	display: block;
	width: 100%;
	float: left;
}

#contFrm label{
	display: block;
	margin: 5px;
	color:#333;
	
}

#contFrm input,#contFrm textarea{
	background: #f3f3f3;
	background:rgba(0,0,0,.025);
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 10px;
	box-shadow: 1px 1px 5px #ccc;
	margin: 5px 0
}
#contFrm textarea{
	width:70%;
}
#contFrm input:focus,#contFrm textarea:focus{
	background:#fff;
	box-shadow: inset 0px 0px 10px rgba(0,0,0, .25); 
}
#send{
	padding:10px; 
	background: rgba(225,164,0, 1);
	color: rgba(225,255,255, .75);
	border-radius: 10px;
	-webkit-transition:.5s;
	transition:.5s;
}
#send:hover{
	background: rgba(0,0,0, .5);
	color: rgba(225,255,255, .75);
	box-shadow: inset 0px 0px 30px rgba(0,0,0, .5);
}

/*animation*/

@-webkit-keyframes fadein{
	0%{opacity:0;}
	100%{opacity:1;}
	
}
@-webkit-keyframes fadebounce{
	0%{}
	50%{
		-webkit-transform: scale(1.5);
		-webkit-transform-origin: center center;
		}
	100%{}
	
}

@keyframes fadein{
	0%{opacity:0;}
	100%{opacity:1;}
	
}
@keyframes fadebounce{
	0%{}
	50%{
		transform: scale(1.5);
		transform-origin: center center;
		}
	100%{}
	
}


/*mobile rules*/

@media screen and (max-width: 480px){
#logo{
	width: 40%;
	margin: 2% 0 0 0;
}
.chem{
	margin:60px auto 0;
}

#inner_n ul{
	width: 60%
}
#inner_n a{
	font-size: .75em;
}

.hid{
	display: none;
}
.back{
	visibility: visible;
}
#boring_n{
	width: 85%;
	height: 63px;
}

#boring_n li{
	width: 46%;
	text-align: center;
}
#boring_nc{
	height: 60px;
}


}

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

.grid_5,.grid_10,.grid_15,.grid_20,.grid_25,.grid_30,.grid_35,.grid_40,.grid_45,.grid_50,.grid_55,.grid_60,.grid_65,.grid_70,.grid_75,.grid_80,.grid_85,.grid_90,.grid_95,.grid_100m,.grid_66,.grid_33{
	width: 100%;
	margin: 5px 0 0;	
}

#pagewrapper{
	overflow-x: hidden;
}

.chem{
	margin:60px auto 0;
}

#logo{
	width:10px;
	position: relative;
	margin: 0 auto;
}
#inner_n ul{
	margin: 0px auto;
	width: 100%;
}
#inner_n li{
	width: 49%;
}
.hidden{
	opacity: 0;
}

.home_h1{
	font-size: 3em;
}
.stuck{
	height: 122px;
}

.out{
	width: 320px;
	height: 100px;
}

.grid_20, .grid_30{
	width: 80%;
	text-align: center;
}

.bi,.bk,.cd,.em,.wed{
	width: 31.3333333333%;
}
.notme{
	width: 0%;
	display: none;
	}
	

}