html, body {
margin: 0;
padding: 0;
border: 0; 
bottom: 0; 
height: auto;
font-family: "Proxima Nova", sans serif;  
letter-spacing: 0.06em;
min-height: 100%;  
align-items: center;

} 
div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, 
pre, form, fieldset, input, textarea, p, blockquote, th, td {
margin: 0;
padding: 0; 
} 
h1 {
	font-size: 1.3em; 
	margin-bottom: 10px;
	font-family: Abel;
}
li {
	margin-bottom: 12px;
	margin-top: 12px;
}
@font-face {
font-family: "Proxima Nova";
src: url(fonts/Proxima-Light.otf);
}
@font-face {
font-family: "Helvetica Neue";
src: url(fonts/HelveticaNeue-Light.otf);
}
@font-face {
font-family: "Helvetica Neue";
src: url(fonts/HelveticaNeue-Heavy.otf);
font-weight: bold;
} 
@font-face {
font-family: "Abel";
src: url(fonts/Abel.ttf);
}
a.nav_link:link,
a.nav_link:visited{
color: #ed7d23;
text-decoration: none; 
}
a.nav_link:hover{
color: #fff;
}
a.dark:link,
a.dark:visited{
color: #000;
text-decoration: none; 
}
a.dark:hover{
color: #fff;
}
a:link,
a:visited,
a:active {
	color: #2ba6cb;
	 -webkit-transition: ease-out 0.5s;
    -moz-transition: ease-out 0.5s;
    -o-transition: ease-out 0.5s;
    transition: ease-out 0.5s;
}
a:hover {
	color: #222;
}

.wrapper {
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	min-height: 1000px;
	height: 100%;
	
} 

/* ===== LARGE SCREEN DISPLAY ===== */
@media screen and (min-width: 1000px) {
.nav {
    margin: 300px 0px 0px 20px;
	height: 500px;
	width: 130px;
	line-height: 2em;
	color: #000;
	font-size: 1.2em; 
	position: fixed;
	font-family: Abel;
	font-weight: bold;
} 
.title_box {
	position: absolute;
	top: 16px;
	left: 16px;
	height: 250px;
	width: 110px;
	color: #ed7d23; 
	font-family: Helvetica;
	font-weight: bold;
}
.sitemap_box {
	position: absolute;
	top: 10px;
	right: 16px;
	height: 250px;
	width: 90px;
	text-align: right;
	color: #fff;
	font-size: 1em;
}
.chevron {
	margin-right: 20px;
	margin-top: -10px;
}
.chevron2 {
	display: none;
}
.social {
    margin: 300px 0px 0px 0px;
	height: 400px;
	width: 50px;
	padding-right: 10px;
	line-height: 2em; 
	position: fixed; 
	right: 0px;
	z-index: 4;
	
}  
.facebook {
	background-image: url('../img/facebook.png');
	background-repeat: no-repeat;
	background-size: cover;
	height: 40px;
	width: 40px;
	margin: 0px 0px 16px 0px;
    transition: background-image 0.5s ease-out;
	
}
.facebook2 {
	background-image: url('../img/facebook2.png');
	background-repeat: no-repeat;
	background-size: cover;
    height: 40px;
	width: 40px;
	margin: 0px 0px 16px 0px;
}
.twitter {
	background-image: url('../img/twitter.png');
	background-repeat: no-repeat;
	background-size: cover;
	height: 40px;
	width: 40px;
	margin: 0px 0px 16px 0px;
    transition: background-image 0.7s ease-out;
}
.twitter2 {
	background-image: url('../img/twitter2.png');
	background-repeat: no-repeat;
	background-size: cover;
    height: 40px;
	width: 40px;
	margin: 0px 0px 16px 0px;
}
.google {
	background-image: url('../img/google.png');
	background-repeat: no-repeat;
	background-size: cover;
	height: 40px;
	width: 40px;
	margin: 0px 0px 16px 0px;
    transition: background-image 0.5s ease-out;
}
.google2 {
	background-image: url('../img/google2.png');
	background-repeat: no-repeat;
	background-size: cover;
    height: 40px;
	width: 40px;
	margin: 0px 0px 16px 0px;
}


} 
/* ====== SMALL SCREEN DISPLAY ===== */
@media screen and (max-width: 1000px) {
.nav {
	height: 18px;
	width: 100%;
	color: #fff;
	font-size: 1.2em;
	font-family: Abel;
	padding: 4px 0px 0px 10px;
} 
.title_box {
	display: none;
}
.sitemap_box {
	position: absolute;
	top: 10px;
	right: 16px;
	height: 18px;
	width: 200px;
	text-align: right;
	color: #fff;
	font-size: 0.9em;
}
.chevron{
	display: none;
}

.social {
    margin: 0px 0px 0px 230px;
	height: 40px;
	width: 200px;
	padding-right: 10px;   
	position: absolute;  
}  
.facebook {
	background-image: url('../img/facebook.png');
	background-repeat: no-repeat;
	background-size: cover;
	height: 26px;
	width: 26px;
	margin: 4px 4px 0px 0px;
	display: inline-block;
	
} 
.twitter {
	background-image: url('../img/twitter.png');
	background-repeat: no-repeat;
	background-size: cover;
	height: 26px;
	width: 26px;
	margin: 4px 4px 0px 0px;
	display: inline-block;
} 
.google {
	background-image: url('../img/google.png');
	background-repeat: no-repeat;
	background-size: cover;
	height: 26px;
	width: 26px;
	margin: 4px 4px 0px 0px;
	display: inline-block;
} 
} 
/* ======= SMALL DISPLAY END =======*/



.splash {
	background: url('../img/chem_bg.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-attachment: fixed;
	height: 100%;
	width: 100%;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
}
.splash_wrapper {
	margin: 0px auto;
	width: 800px; 
	padding-top: 60px;
	position: relative;
	z-index: 3;
}
 
.l_spacer {
	height: 200px;
	width: 130px;
	display: inline-block;
	float: left;
}
.r_spacer {
	height: 200px;
	width: 100px;
	display: inline-block;
	float: right;
}
 
.box1 {
	margin: 7px 5px 7px 5px;
	background: url('../img/white_80.png'); 
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 250px;
	width: 233px;
	display: inline-block;
	padding: 10px;
	overflow: hidden;   
} 
.box1:hover {
	background-color: #fff;
}
.box1_space {
	margin: 7px 5px 7px 5px; 
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 250px;
	width: 233px; 
	padding: 10px; 
	display: none;
} 
.box1_view{ 
    display: none;
	margin: 7px 5px 7px 5px;  
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 240px;
	width: 233px; 
	padding: 10px;
	overflow: hidden; 
	position: absolute;
	margin: 0px 0px 0px -10px;
	font-size: 1.2em; 
	background-image: -webkit-linear-gradient(transparent 150px, white);
	background-image: -moz-linear-gradient(transparent 150px, white);
	background-image: linear-gradient(transparent 150px, white);
	
}
.box1_view p {
	position: absolute;
	bottom: 5px;
	right: 8px;
	z-index: 1;
}
.box1_view img {
	margin: 0px 6px 1px 0px;
}
.box1:hover .box1_view{ 
display: block;
}
 
.box2 {
	margin: 7px 5px 7px 5px;
	background: url('../img/white_80.png'); 
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 250px;
	width: 501px;
	display: inline-block;
	padding: 10px;
	overflow: hidden;
	text-align: justify; 
}
.box2:hover {
	background-color: #fff;
}
.box2_space {
	margin: 7px 5px 7px 5px; 
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 250px;
	width: 501px; 
	padding: 10px; 
	display: none;
} 
.box2_view{ 
    display: none;
	margin: 7px 5px 7px 5px;  
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 240px;
	width: 501px; 
	padding: 10px;
	overflow: hidden; 
	position: absolute;
	margin: 0px 0px 0px -10px;
	font-size: 1.2em; 
	background-image: -webkit-linear-gradient(transparent 150px, white);
	background-image: -moz-linear-gradient(transparent 150px, white);
	background-image: linear-gradient(transparent 150px, white);
}
.box2_view p {
	position: absolute;
	bottom: 5px;
	right: 8px;
	z-index: 1;
}
.box2_view img {
	margin: 0px 6px 1px 0px;
}
.box2:hover .box2_view{ 
display: block;
}

.big_close {
	height: 100%;
	width: 100%;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	position: fixed;
	z-index: 1;
	background: url('../img/blk_40.png');
	display: none;
	-webkit-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    -moz-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    -o-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    transition:width 300ms ease-in-out, height 300ms ease-in-out;
	cursor: pointer; 
	color: #efefef;
	font-size: 1.2em; 
}  
.big_close_text {
	bottom: 6px;
	left: 6px;
	margin-bottom: 0px;
	position: fixed;
}
.big_back {
	width: 52px;
    height: 120px;
	margin: 230px 0px 0px -46px;
	-webkit-border-radius: 6px;  
	-moz-border-radius: 6px;  
	border-radius: 6px; 
	background-color: #464f5c;
	position: fixed;
	z-index: 2;
	display: none;
	-webkit-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    -moz-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    -o-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    transition:width 300ms ease-in-out, height 300ms ease-in-out;
	cursor: pointer;
}
.big_back img {
	margin: 21px 12px 0px 9px; 
}
.big_next {
	width: 52px;
    height: 120px;
	margin: 230px 0px 0px 792px;
	-webkit-border-radius: 6px;  
	-moz-border-radius: 6px;  
	border-radius: 6px; 
	background-color: #464f5c;
	position: fixed;
	z-index: 2;
	display: none;
	-webkit-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    -moz-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    -o-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    transition:width 300ms ease-in-out, height 300ms ease-in-out;
	cursor: pointer;
}
.big_next img {
	margin: 21px 9px 0px 20px; 
}
.box3 {
	margin: 7px 5px 7px 5px;
	background: url('../img/white_80.png'); 
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 280px;
	width: 327px;
	display: inline-block;
	padding: 10px 30px 10px 30px;
	overflow: hidden;
	text-align: justify;
}

.box3_space {
	margin: 7px 5px 7px 5px; 
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 250px;
	width: 367px; 
	padding: 10px; 
	display: none;
} 
.box3_view{ 
    display: none;
	margin: 7px 5px 7px 5px;  
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 268px;
	width: 367px; 
	padding: 10px;
	overflow: hidden; 
	position: absolute;
	margin: 0px 0px 0px -30px;
	font-size: 1.2em; 
	background-image: -webkit-linear-gradient(transparent 150px, white);
	background-image: -moz-linear-gradient(transparent 150px, white);
	background-image: linear-gradient(transparent 150px, white);
}
.box3_view p {
	position: absolute;
	bottom: 5px;
	right: 8px;
	z-index: 1;
}
.box3_view img {
	margin: 0px 6px 1px 0px;
}
.box3:hover .box3_view{ 
display: block;
}

.box_cat {
	position: relative;
	height: 16px;
	width: 100%; 
	font-size: 0.8em;
	margin-top: -4px;
}
.big {
	margin: 7px 0px 0px 5px;  
	-webkit-border-radius: 3px;  
	-moz-border-radius: 3px;  
	border-radius: 3px; 
	height: 50%;
	width: 610px;
	display: inline-block;
	padding: 10px 90px 10px 90px;
	overflow: scroll;
	text-align: left;
	position: fixed;
	z-index: 10;
	background: url('../img/white_95.png'); 
	-webkit-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    -moz-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    -o-transition:width 300ms ease-in-out, height 300ms ease-in-out;
    transition:width 300ms ease-in-out, height 300ms ease-in-out;
}
.big img.ichi{
	float: right;
	margin: 10px 0px 10px 10px;
	border: 1px solid #bbb;
	padding: 12px;
} 
.big img.ni{
	float: left;
	margin: 12px;
} 
.big h1{
font-size: 2.2em;
text-deocration: none;
font-family: Proxima Nova;
margin-bottom: 10px;
margin-top: 10px;
}
.body { 
	height: 100%;
	width: 100%;
	top: 0px;
	right: 0px;
	bottom: 0px;
	left: 0px;
	background-color: #efefef;
}
.body_wrapper {
	margin: 0px auto;
	width: 806px; 
	padding-top: 96px;
}
.bodycontent {
	border: 1px solid #ccc;
} 
#footer {
width: 100%;
height: 100px;
margin: 100px 0px 0px 0px;
background-color: #bbb; 
position: relative;
color: #fff;  
text-align: center;
font-size: 0.9em; 
bottom: 0px; 
padding: 64px 0 0 0;  
}
#footer a:link,
#footer a:visited{
color: #555;
text-decoration: none;  
transition: .3s ease;
}
#footer a:hover{
color: #2ba6cb;
transition: .3s ease;
cursor: hand;
} 
















.rt {
	float: right;
}
.lt {
	float: left;
}
.hidden {
	visibility: hidden;
}
.inline-block {
	display: inline-block;
}