



html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}

article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}



#preloader {z-index:1000;}
#progress {z-index: 903;}
#progressbg {z-index: 902;}
#persistentNav {z-index: 900;}
#social {z-index: 903;}
.disruptor {z-index: 800;}

.container {z-index: 600;}
.section-body {z-index: 600;}





#skrollr-body { width: 100%; }

body {
	font-family: 'FontsiteLight';
	font-size: 16px;
	line-height: 1.5;

	background-color: white;
	background-repeat: repeat;
	
}
	
	
.section-wrapper,
.container,
.disruptor,
.top-left,
.top-right,
.bottom-left,
.bottom-right,
.sequence-container,
.static-container,
.arrows  {display: block;}

.scene-wrapper {
	overflow: hidden;
	display: block;
}

.section-wrapper {
	width: 100%;
	height: 1000px;
	overflow: hidden;
	position: relative;
}

.disruptor {
	width: 100%;
	
	position: relative;	
	
	  -moz-box-shadow: 	0 0 10px #000;
-webkit-box-shadow: 0 0 10px #000;
box-shadow: 		0 0 10px #000;
}
	
.disruptor .container {
	height: 500px;
}



.container {
	width: 1000px;
	height: 700px;
	top: 50%;
	left: 50%;
	margin-left: -500px;
	margin-top: -350px;
	position: fixed;
}

.disruptor-container {
	width: 1000px;
	margin: 0 auto;
	height: 500px;
	position: relative;

}

.section-head {
	position: absolute;
	top: 0;
	left: 0;

}

.section-body {
	position: absolute;
	bottom: 0;
	left: 0;

}

.grid,
.full {
	float: left; 
	margin: 0; 

	position: relative; 
	display: block;		  
}

.grid {width: 500px;}
.full {width: 1000px;}

.push {margin-left: 500px;}

.center-center {
	width: 750px; 
	height: auto;
	position: absolute; 
	top: 50%;
	left: 50%;

	margin-left: -375px; 
}

.sequence-container {
	width: 1000px;
	height: 575px;
	top: 50% !important;
	left: 50%;

	position: absolute;
	margin-left: -500px;
	margin-top: -288px;
	

}

.sequence-container img {
	height: 561px;
	width: 1000px;
}

.static-container {
	width: 1000px;
	height: 575px;
	

	left: 50%;
	top: 50%;
	position: absolute;
	margin-left: -500px;
	margin-top: -275px;

	display: none;
}

.static-copy-container {
	width: 1000px;
	height: 600px;
	top: 50%;
	left: 50%;
	margin-left: -500px;
	margin-top: -200px;
	position: absolute;
}
	




h1,h2,h3, h4 {font-family:  'Microsoft YaHei', Î¢ÈíÑÅºÚ, Arial, Lucida Grande, Tahoma, sans-serif; color: #222; text-transform: uppercase; display: block; }
h1 {font-size: 72px; text-align: center; line-height: 1;}
h2 {font-size: 48px; line-height: 1}
h3 {font-size: 24px;}
h4 {font-size: 16px;}

.condensed {font-family: 'FontsiteBold'; text-transform: uppercase;}
.lightCondensed {font-family: 'FontsiteLight'; text-transform: none;}
.white {color: #fff;}
.subhead {color: #c60b22; margin-top: -10px;}
.number {color: #c60b22; font-size: 24px; font-family: 'FontsiteLight';}

strong {font-family: 'FontsiteBold'; color: #000; text-transform: uppercase;}

.left {text-align: left;}
.right {float: right; text-align: right;}
.centered {text-align: center;}

p {font-family: 'FontsiteThin'; font-size: 16px; line-height: 1.5em; color: #444; }

.section-body p{
border-left: 4px solid #c60b22;
padding: 5px 10px;
}


i {font-family: 'entypo';}


	



#progress {width: 5px; background: #c60b22; display: block; position: fixed; left: 0; top:0; }
#progressbg {width: 5px; background: #6d0815; display: block; position: fixed; left: 0; top:0; height: 100%;}



	#persistentNav {
		width: 250px;
		position: fixed;
		left: -250px;
		top:50%;	
		margin-top: -245px;
		-webkit-transition: ease 0.3s;  
	    -moz-transition: ease 0.3s;  
	    -o-transition: ease 0.3s;  
	    -ms-transition: ease 0.3s;  
	    transition: ease 0.3s; 
	    background-color: rgba(0, 0, 0, 0.9);
	}
	
	
		#persistentNav:hover {
		left: 0px;
	}
	
	
	#persistentNav ul {list-style-type: none; position: absolute; }
	
	#persistentNav ul li {list-style-type: none; overflow: hidden; zoom: 1;}
	
	#persistentNav ul li a{
		font-family: 'FontsiteLight';
		text-decoration: none;
		overflow: hidden; zoom: 1;
		}
	
	
	
	#leftNav li a{
		color: #888;
		background-color: rgba(0, 0, 0, 0.9);
		width: 266px;
		height: 24px;
		padding-left: 24px;
		padding-top: 15px;
		display: block;
		border-bottom: 1px solid #222;
		border-right: 1px solid #222;
		letter-spacing: 0.10em;
		text-transform: uppercase;
		font-size: 12px;
		text-align: left;
		overflow: hidden;
		zoom: 1;
		
		-webkit-transition: ease 0.3s;  
	    -moz-transition: ease 0.3s;  
	    -o-transition: ease 0.3s;  
	    -ms-transition: ease 0.3s;  
	    transition: ease 0.3s; 
	}
	
	#leftNav li.last {
		border-bottom: 10px solid #222;
	}
	
	#leftNav li a.shop {
			background: #000;
			color: #fff;
			border-bottom: 1px solid #222;
		
			
	}
	
	#leftNav li a.shop span {
		background: #c60b22;
		font-family: 'entypo';
		font-size: 16px;
		padding: 12px 10px 17px 10px;
		font-weight: 200;
		border-left: 1px solid #222;
	}
	
	
	#leftNav li a.shop:hover {
		background: #6d0815;
		border-right: 1px solid #c60b22;
		
	}
	#leftNav li a.shop:hover span{
		background: #c60b22;
		border-left: 1px solid #6d0815;
		color: #fff;
	}
	
	#leftNav li a span {
		float: right;
		text-align: center;
		width: 18px;
		height: 10px;
		padding: 15px 10px 14px 10px;
		margin-top: -15px;
		background: #141414;
		color: #fff;
		border-left: 1px solid #222;
		
		-webkit-transition: ease 0.3s;  
	    -moz-transition: ease 0.3s;  
	    -o-transition: ease 0.3s;  
	    -ms-transition: ease 0.3s;  
	    transition: ease 0.3s; 
	}
	
	#leftNav li a:hover {
		color: #fff;
		background-color: rgba(0, 0, 0, 1);
	}
	
	#leftNav li a:hover span {
		color: #c60b22;
		background: #000;
	}
	
	#leftNav .social {
	height: 24px;
	background: #000;
	}
	
	#leftNav li.facebook,
	#leftNav li.twitter {
		background-color: rgba(0, 0, 0, 0.9);
		width: 266px;
		height: 24px;
		padding-left: 24px;
		padding-top: 15px;
		display: block;
		border-bottom: 1px solid #222;
		border-right: 1px solid #222;
		letter-spacing: 0.10em;
		text-transform: uppercase;
		font-size: 12px;
		text-align: left;
		
		-webkit-transition: ease 0.3s;  
	    -moz-transition: ease 0.3s;  
	    -o-transition: ease 0.3s;  
	    -ms-transition: ease 0.3s;  
	    transition: ease 0.3s; 
	}
		
	#leftNav li.facebook span,
	#leftNav li.twitter span {
		background-color: rgba(0, 0, 0, 1);
		font-family: 'entypo';
		font-size: 16px;
		padding: 8px 10px 21px 10px;
		font-weight: 200;
		border-left: 1px solid #222;
		float: right;
		text-align: center;
		width: 18px;
		height: 10px;
		margin-top: -15px;
		color: #fff;
		
		-webkit-transition: ease 0.3s;  
	    -moz-transition: ease 0.3s;  
	    -o-transition: ease 0.3s;  
	    -ms-transition: ease 0.3s;  
	    transition: ease 0.3s; 

	}
	

	
	#leftNav li.facebook:hover span {
		background-color: rgba(59,89,152, 1);
	}
	
	#leftNav li.facebook:hover {
		background-color: rgba(59,89,152, 0.9);
	}
	

	#leftNav li.twitter:hover span  {
		background-color: rgba(64,153,255, 1);
	}
	
	#leftNav li.twitter:hover   {
		background-color: rgba(64,153,255, 0.9);
	}
	
	#leftNav li.facebook iframe{
		position: absolute;
		bottom: 50px;
		left: 22px;
	}
	
	#leftNav li.twitter iframe {
		position: absolute;
		bottom: 10px;
		left: 22px;
	}

	
	



#start {
height: 850px; 

background-color: white;
background-attachment: fixed;
}

#start .container {top: 100px; left: 50%; margin-left: -500px; margin-top: 0px; position: fixed; }

   #parallax1,
   #parallax2,
   #parallax3,
   #parallax4  
     {
   position: absolute;
   left: 0px;
   top: 0px;
   background-attachment: fixed; 
   width: 100%; 
   height: 100%;
   
   background-position:  center 50px;
   }


   #parallax1 {
   	background-image: url("../images/kaishi/airbrakemx-intro-new.jpg");
   	background-repeat: no-repeat;
   }

   #parallax2 {
   	background-image: url("../images/kaishi/dirt-layer1.png");
   	background-repeat: no-repeat;

   }

   #parallax3 {
   	background-image: url("../images/kaishi/dirt-layer2.png");
   	background-repeat: no-repeat;

   }

   #parallax4 {
   	background-image: url("../images/kaishi/dirt-layer3.png");
   	background-repeat: no-repeat;

   }

   #parallax5 {
    background-image: url("../images/kaishi/rock-1.png");
    background-repeat: none;
    top: 28%;
    left: 19%;
    height: 170px;
    width: 200px;
    position: fixed;
  }

  #parallax6 {
    background-image: url("../images/kaishi/rock-2.png");
    background-repeat: none;
    top: 18%;
    right: 7%;
    height: 170px;
    width: 200px;
    position: fixed;
    }


#scroll {
font-family: 'entypo';
font-size: 16px;
color: #fff;
background: #000;
padding: 20px 40px;
position: absolute;
bottom: 40px;
left: 50%;
margin-left: -50px;
}




#social {
position: fixed;
top: 50%;
margin-top: -40px;
right:-100px;
-webkit-transition: ease 0.3s;  
-moz-transition: ease 0.3s;  
-o-transition: ease 0.3s;  
-ms-transition: ease 0.3s;  
transition: ease 0.3s; 
display: none;
}

#social:hover {
right: 0;
}

#social ul li {
	font-family: 'entypo';
	font-size: 16px;
	height: 40px;
	width: 140px;
	text-align: center;
	background-color: rgba(0, 0, 0, 0.9);
}

#social ul li.facebook {
	height: 39px;
	border-bottom: 1px solid #222;
}

#social ul li.facebook span{
	background: #3B5998;
}

#social ul li.twitter {
}

#social ul li.twitter span{
	background: #4099FF;
}

#social ul li span {
	width: 40px;
	height: 30px;
	display: block;
	text-align: center;
	color: #fff;
	padding-top: 10px;
	float: left;
	position: absolute;
	left: 0;
}

#social ul li iframe,
#social ul li a {
	margin-left: 50px;
	margin-top: 10px;
}

		
		
		
	
#video {
	height: 800px;
	text-align: center;
	background: #000;

}	

#video h1 {color: #fff; font-size: 65px;}
#video h3 {color: #c60b22; font-size: 22px; }


#video a.play {
	font-family: 'entypo';
	font-size: 36px;
	color: #fff;
	padding: 15px 16px 15px 14px;
	background: #111;
	border: 3px solid #fff;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	-ms-border-radius: 50px;
	margin-bottom: 24px;
	display: inline-block;
	
	-webkit-transition: ease 0.3s;  
    -moz-transition: ease 0.3s;  
    -o-transition: ease 0.3s;  
    -ms-transition: ease 0.3s;  
    transition: ease 0.3s; 
}

#video a.play:hover {
	background: #c60b22;
}


	

img#impact {
 position: absolute;
 left: -50px;
 top: 50%;
 margin-top: -100px;
 display: block;
 height: 75px;
 width: 101px;
 }
 
#impact-data {
position: absolute;
margin-left: -75px;
 top: 50%;
 margin-top: -200px;
 
 }




	
 #maximum-peripheral .section-head h2{display: none;}






#roll-off-system {
background-image: url("../images/kaishi/rolloff.jpg");
background-repeat: none;
background-attachment: fixed;
background-size: cover;
background-position: center;
width: 100%; 
height: 600px;
}












.mycontainer{
	width: 1000px; overflow: hidden; height: 600px; margin: 0 auto;
}

.mycontainer .section-body{
	position: relative; top: 180px; text-shadow: 0px 0px 5px rgba(0,0,0,.5);
}















.slide-container {
	width: 100%;
	height: 550px;
	position: relative;
	display: inline-block;	
}

.span-wrap{
	width: 750px;
	margin: 0 auto;
	padding-top: 200px;
	text-align: center;
}

.quote-text span {
	font-size: 36px;
	font-family: 'FontsiteBold';
	color: #fff;
	text-transform: uppercase;
	padding: 15px 15px 10px 15px;
	line-height: .75;
	background-color: rgba(0, 0, 0, 0.8);
	display: inline-block;
}

.quote-text  span.author {
	font-family: 'FontsiteLight';
	font-size: 18px;
	color: #777;
	text-transform:none;

	padding: 15px;
}




#roll-off-system .bx-prev {position: absolute; top: 275px; left: 50px;}
#roll-off-system .bx-next {position: absolute; top: 275px; right: 50px;}

.bx-prev,
.bx-next {
	font-family: 'entypo';
	font-size: 16px;
	color: #fff;
	padding: 20px 15px;
	background: #000;

	-webkit-transition: ease 0.3s;  
    -moz-transition: ease 0.3s;  
    -o-transition: ease 0.3s;  
    -ms-transition: ease 0.3s;  
    transition: ease 0.3s; 
}

.bx-prev:hover,
.bx-next:hover {
	background: #c60b22;
}


	

#adaptable .sequence-container {
margin-top: -250px;
}








	

#switchlock {}







#render {
	background: #000;
	background-size: cover;
	display: block !important;
}


#render video {
  width: 100%    !important;
  height: auto   !important;
  padding-bottom: 0px !important;

}

#render #vid-hover {
	font-family: 'FontsiteLight';
	font-size: 16px;
	color: #fff;
	text-transform: uppercase;
	padding: 30px;
	background-color: rgba(250,250,250, 0.1);
	position: absolute;
	top: 50%;
	left: 50%;
	margin-top: -42px;
	margin-left: -114px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	-ms-border-radius: 50px;
	-o-border-radius: 50px;
	border-radius: 50px;
}

#render:hover  #vid-hover{
	display: none;
}


#render #vid-overlay {
display: block;
top:0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.7);
position: absolute;

}

#render:hover #vid-overlay {
	display: none;
}

#render #dot-overlay {
display: block;
top:0;
left: 0;
width: 100%;
height: 99%;
background-image: url("../images/dot-overlay.png");
background-repeat: repeat;
opacity: 0.3;
position: absolute;
}

#render:hover #dot-overlay {
	display: none;
}



	



#comfort-performance .section-wrapper {
 height: 1200px;	
}






	

#airbrakemx {
	height: 1200px;
}

#airbrakemx .container {
	height: 750px;
}


	
ul.cta {
	list-style-type: none;
	text-align: center;
	width: 500px;
	margin: 0 auto;
}

ul.cta li {
	display: inline-block;
	margin: 12px;
}



#shadow {
position: absolute;
bottom: -150px;
left: 0px;
}	


#airbrakemx p{
	border-left: none;
	padding: none;
	text-align: center;
}


	
	
	
#store-locator iframe{
	height: 1px;
	width: 1px;
}
	
	



a {
	line-height: 1;
	color: #c60b22;
	text-decoration: none;
}

a.button {
	font-size: 14px;
	font-family: 'FontsiteLight';
	color: #fff;
	width: 171px;
	text-align: center;
	position: relative;
	display: block;
	text-decoration: none;

}

a.button span.button-body {
	background: #c60b22;
	padding: 15px 0px 11px 0px;
	text-transform: uppercase;
	width: 130px;
	display: block;
	position: relative;
	left: 0;

}

a.button span.button-arrow {
	font-family: 'entypo';
	font-size: 11px;
	position: absolute;
	font-weight: 200;
	left: 131px;
	top: 0px;
	background: #c60b22;
	width: 36px;
	padding: 15px 2px 14px 2px;
	
		-webkit-transition: ease 0.3s;  
	    -moz-transition: ease 0.3s;  
	    -o-transition: ease 0.3s;  
	    -ms-transition: ease 0.3s;  
	    transition: ease 0.3s; 	


}

a.button:hover span.button-arrow {
	background: #111;

}

a.text-button {
	font-family: 'FontsiteLight';
	text-decoration: none;
	display: block;

	text-align: center;
	#color: #c60b22;
		text-transform: uppercase;
		font-size: 14px;	
}

a.text-button span {
	font-family: 'Helvetica', Arial, sans-serif;
	opacity: 0.7;
	display: inline-block;
	position: relative;
	font-size: 16px;
	
		-webkit-transition: ease 0.3s;  
	    -moz-transition: ease 0.3s;  
	    -o-transition: ease 0.3s;  
	    -ms-transition: ease 0.3s;  
	    transition: ease 0.3s; 	
}

a.text-button:hover {
	text-decoration: underline;
}

a.text-button:hover span{
	opacity: 1;
	color: #111;	
	left: 3px;
}



.feature-video {
	margin: 25px 0px;
	background-color: rgba(0, 0, 0, 0.1);
	position: relative;
	display: inline-block;
	border-radius: 50px;
		-webkit-border-radius: 50px;
		-moz-border-radius: 50px;
}

.feature-video:hover {
	background-color: rgba(0, 0, 0, 0.2);
}

.feature-video i.play-icon {
	font-family: 'entypo';
	font-size: 18px;
	color: #000;
	padding: 5px;
	margin: 8px 10px;
	border: 3px solid #000;
	border-radius: 50px;
	-webkit-border-radius: 50px;
	-moz-border-radius: 50px;
	-ms-border-radius: 50px;
	float: left;
}

.feature-video span {
	padding-right: 30px;
	display: inline-block;
	color: #000;
}

.feature-video span.title {
	font-family: 'FontsiteBold';
	font-size: 14px;
	text-transform: uppercase;
	padding-top: 12px;
	line-height: 1em;
	
}

.feature-video span.cta {
	font-size: 14px;
	color: #444;
}

.play-min {
	font-family: 'FontsiteBold';
	font-size: 16px;
	text-transform: uppercase;
	padding-left: 15px;
	margin-top: 20px;
	display: inline-block;
	color: #000;
	position: relative;
	
	

}

.play-min i.play-icon {
	font-family: 'entypo';
	font-size: 14px;
	color: #000;
	padding: 4px;
	border: 3px solid #000;
	margin-right: 10px;
	
	border-radius: 20px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	
	-webkit-transition: ease 0.3s;  
    -moz-transition: ease 0.3s;  
    -o-transition: ease 0.3s;  
    -ms-transition: ease 0.3s;  
    transition: ease 0.3s; 
}

.play-min:hover i.play-icon {
	color: #c60b22;
	border: 3px solid #c60b22;
}







#preloader {
    position:absolute;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:#000; 
   
   text-align: center;
 
}

#preloader .center-center {
	margin-top: -150px;
}

#preloader h1 {
	color: #fff;
}


#status {
    width:200px;
    height:200px;
    position:absolute;
    left:50%; 
    top:50%; 
    background-image:url("../images/_status.gif"); 
    background-repeat:no-repeat;
    background-position:center;
    margin:-100px 0 0 -100px; 
}






@font-face {
	font-family: 'FontsiteBlack';
	src: url("../type/fontsitesansblack.eot");
	src: url("../type/fontsitesansblack.eot?#iefix") format('embedded-opentype'),
			 url("../type/fontsitesansblack.woff") format('woff'),
			 url("../type/fontsitesansblack.ttf") format('truetype'),
			 url("../type/fontsitesansblack.svg#fontsitesansthin") format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'FontsiteBold';
	src: url("../type/fontsitesansbold.eot");
	src: url("../type/fontsitesansbold.eot?#iefix") format('embedded-opentype'),
			 url("../type/fontsitesansbold.woff") format('woff'),
			 url("../type/fontsitesansbold.ttf") format('truetype'),
			 url("../type/fontsitesansbold.svg#fontsitesansthin") format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'FontsiteLight';
	src: url("../type/fontsitesanslight.eot");
	src: url("../type/fontsitesanslight.eot?#iefix") format('embedded-opentype'),
			 url("../type/fontsitesanslight.woff") format('woff'),
			 url("../type/fontsitesanslight.ttf") format('truetype'),
			 url("../type/fontsitesanslight.svg#fontsitesansthin") format('svg');
	font-weight: normal;
	font-style: normal;
}


@font-face {
	font-family: 'FontsiteThin';
	src: url("../type/fontsitesansthin.eot");
	src: url("../type/fontsitesansthin.eot?#iefix") format('embedded-opentype'),
			 url("../type/fontsitesansthin.woff") format('woff'),
			 url("../type/fontsitesansthin.ttf") format('truetype'),
			 url("../type/fontsitesansthin.svg#fontsitesansthin") format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'entypo';
	src:url("../type/entypo.eot");
	src:url("../type/entypo.eot?#iefix") format('embedded-opentype'),
		url("../type/entypo.woff") format('woff'),
		url("../type/entypo.ttf") format('truetype'),
		url("../type/entypo.svg#entypo") format('svg');
	font-weight: normal;
	font-style: normal;
}







