@charset "utf-8";
/* CSS Document */
@font-face {
  font-family: 'proxima_nova_rgregular';
  src: url("fonts/proximanova-reg-webfont.eot");
  src: url("fonts/proximanova-reg-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/proximanova-reg-webfont.woff") format("woff"), url("fonts/proximanova-reg-webfont.ttf") format("truetype"), url("fonts/proximanova-reg-webfont.svg#proxima_nova_rgregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'proxima_nova_rgbold';
  src: url("fonts/proximanova-bold-webfont.eot");
  src: url("fonts/proximanova-bold-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/proximanova-bold-webfont.woff") format("woff"), url("fonts/proximanova-bold-webfont.ttf") format("truetype"), url("fonts/proximanova-bold-webfont.svg#proxima_nova_rgbold") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'proxima_nova_ltlight';
  src: url("fonts/proximanova-light-webfont.eot");
  src: url("fonts/proximanova-light-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/proximanova-light-webfont.woff") format("woff"), url("fonts/proximanova-light-webfont.ttf") format("truetype"), url("fonts/proximanova-light-webfont.svg#proxima_nova_ltlight") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'nexa_lightregular';
  src: url("fonts/nexa_light_0-webfont.eot");
  src: url("fonts/nexa_light_0-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/nexa_light_0-webfont.woff") format("woff"), url("fonts/nexa_light_0-webfont.ttf") format("truetype"), url("fonts/nexa_light_0-webfont.svg#nexa_lightregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'steelfishregular';
  src: url("fonts/steelfish_rg-webfont.eot");
  src: url("fonts/steelfish_rg-webfont.eot?#iefix") format("embedded-opentype"), url("fonts/steelfish_rg-webfont.woff") format("woff"), url("fonts/steelfish_rg-webfont.ttf") format("truetype"), url("fonts/steelfish_rg-webfont.svg#steelfishregular") format("svg");
  font-weight: normal;
  font-style: normal;
}

html, body { font-family: "nexa_lightregular", Arial, Helvetica, sans-serif; }

body { overflow-x:hidden;}

#about-us p { font-size:17px; }

#top-box { width:100%; height:195px; }

#header .top, #menu2 > ul, #our-brands .content, #about-us, #event, #contact-us .content, #product-con { max-width:1200px; min-width:250px; margin:0 auto; }

#header { position:fixed; top:0px; left:0; width:100%; background-color:#FFF; z-index:9991; }

#header .top { overflow:hidden; }

#header .logo { float:left; margin-top:20px; margin-bottom:20px; }

#header .logo a { display:block; background:url(../images/KH_logo.png) left top no-repeat; width:300px; height:89px; }

#header .brand { float:right; overflow:hidden; margin-top:50px; }

#header .brand .pd { width:160px; float:left; border-right:#999 1px solid; padding:0 15px;; }

#header .brand .pd.last { border:0; }

#header .brand .pd img { width:100%; }

#header .brand .pd a {}

.panel {
    position: fixed;
    left: -15.625em; /*left or right and the width of your navigation panel*/
    width: 15.625em; /*should match the above value*/
}

#menu { z-index:999; }

#menu > ul { margin:180px 0 0 20px; }

#menu ul ul { margin:0 0 0 10px; }

#menu ul li { font-size:20px; }

#menu ul li a { color:#000; text-decoration:none; display:block; padding:5px; }

#menu2 a.menu-link { height:40px; padding:5px; padding-top:8px; }

#menu2 a.menu-link img { height:100%; }

#menu2 { width:100%; background-image:url(../images/nav_bar.jpg); background-repeat:repeat-x; position:fixed; top:125px; left:0; z-index:9991; }

#menu2 > ul > li { float:left;  }

#menu2 > ul > li { position:relative; }

#menu2 ul li ul { position:absolute; border:#CCC 1px solid; background-color:#FFF; margin-left:20px; width:220px; display:none; }

#menu2 ul li ul li a { color:#000; display:block; padding:10px; text-decoration:none; }

#menu2 ul li ul li a:hover { background-color:#F4FBF4; }

#menu2 > ul > li a {  color:#FFF; display:block; padding:20px 50px 20px 20px; text-decoration:none; }

#menu2 > ul > li.first a { padding-left:11px; }

#about-us { margin:25px auto 80px auto; overflow:hidden; zoom:1; }

#about-us .text { float:left; width:56%; padding:0 2% 0 10px; }

#about-us .img { float:right; width:35%; padding-right:2%; padding-top:1.5%; }

#about-us .img img { width:100%; }

#about-us h2 { font-size:24px; color:#888; font-weight:bold; }

#about-us p { margin-top:10px; }

#our-brands { margin-top:25px; margin-bottom:40px; }

#our-brands .banner { width:100%; }

#our-brands .banner img { width:100%; }

#our-brands .content h2 { font-size:24px; color:#777; margin-bottom:20px; margin-left:10px; font-weight:bold; }

#our-brands .content { margin:25px auto 80px auto; }

#our-brands .content .products { width:100%; overflow:hidden; margin-top:20px;  }

#our-brands .content .products div { position:relative; width:350px; height:206px; }

#our-brands .content .products div a { position:absolute; left:0; top:0; width:100%; }

#our-brands .content .products div.first { float:left; margin-left:5%; }

#our-brands .content .products div.last { float:right; margin-right:5%; }

#our-brands .content .products div.first img, #our-brands .content .products div.last img { width:100%; }

#our-brands .content .products div .back { opacity:0.5; }

#event { margin:25px auto 80px auto; }

#event h2 { font-size:24px; color:#888; margin-bottom:0; margin-left:10px; font-weight:bold; }

#event table td { padding:2px; }

#event .content { margin:0 10px; margin-top:20px; overflow:hidden; zoom:1; }

#event .content .event {  position:relative; cursor:pointer; width:300px; }

#event .content .event img { width:100%; }

#event .content .event.first { float:left; margin-left:5%; }

#event .content .event.last { float:right; margin-right:5%; }

#event .content .event h3 { font-size:20px; }

#event .content .event .bg { position:absolute; width:100%; height:100%; background-color:#000; opacity:0.8; top:0px; left:0px; display:none; }

#event .content .event .text { color:#fff; position:absolute; top:20px; left:20px; display:none; }

#contact-us-banner { width:100%; }

#contact-us-banner img { width:100%; }

#contact-us { width:100%; background-color:#DDD; }

#contact-us .content { margin:0 auto 0 auto; }

#contact-us .content .text { padding:20px 10px 50px 18px; font-size:17px; }

#contact-us .content h3 { color:#888; font-size:24px; font-weight:bold; }

.add, .tel, .fax, .mail { color:#666; padding-top:5px; }

.tel a, .fax a, .mail a { color:#666; text-decoration:none; }

.tel a:hover, .fax a:hover, .mail a:hover { color:#FFF; }

#contact-us table td { padding-top:5px; width:50%; vertical-align:text-top; }

#contact-us div { padding-top:5px; }

#contact-us a { color:#666; text-decoration:none; }

#contact-us a:hover { color:#FFF; }

#contact-us .content .text form { margin-top:20px; }

#contact-us .content .text form .inputtext { margin-bottom:5px; overflow:hidden;}

#contact-us .content .text form input { width:97%; }

#contact-us .content .text form input { padding:5px 10px; }

#contact-us .content .text form .textarea { overflow:hidden; }

#contact-us .content .text form textarea { width:97.1% }

#contact-us .content .text form textarea { padding:5px 10px; height:250px; }

#contact-us .content .text form .button { text-align:right; width:100%; }

#contact-us .content .text form .button a { width:auto; float:right; display:block; color:#FFF; background-color:#476668; padding:5px 20px; text-decoration:none; margin-top:5px; }

#contact-us-m { max-width:1200px; margin:0 auto; }

.parallax-window .img2 { width:100%; }

.parallax-window .img { width:100%; position:absolute; left:0; bottom:0; }

.parallax-window .img3 { width:100%; position:absolute; left:0; top:-30%; }

.parallax-window {
    background: transparent;
	position:relative;
	overflow:hidden;
}

.font-text { text-align:center; }

.panel { background-color:#FFF; }

.panel ul { margin-top:250px; }

.overlay { visibility:hidden; position:absolute; left:-100%; top:-100%; }

.overlay .b-close { position:absolute; top:1%; right:1%; background:url(images/close.png) left top no-repeat; width:36px; height:36px; cursor:pointer; z-index:1; }

.mobile { display:none; }
.desktop { display:block; }

@media only screen and (max-width: 1240px) {
	.wrap { margin:0 2%; }
}

@media only screen and (min-width: 1000px) {
	#our-brands .content .products div.first {margin-left:10%; }
	#our-brands .content .products div.last {margin-right:10%; }
	#event .content .event.first { margin-left:10%; }
	#event .content .event.last { margin-right:10%; }
}

@media only screen and (max-width: 800px) {
	#our-brands .content .products div.first { margin-bottom:4%}
	#our-brands .content .products div.first, #our-brands .content .products div.last { margin-left:2%; margin-right:2%; width:96%; }
	#event .content .event { margin-left:2%!important; margin-right:2%!important; width:96%; }
	#event .content .event { margin-bottom:4%; }
	#about-us .text, #about-us .img { width:96%; padding:2%; }
	#about-us, #our-brands, #event { margin-bottom:1%; }
	#about-us { margin-top:1%; }
	.mobile { display:block; }
	.desktop { display:none; }
	#top-box { height:165px; }
	#header .logo { margin-bottom:5px; }
	#header .logo a { background-size:80%;}
	#menu2 { top: 105px; }
	.wrap { position: relative; }
	#header .brand { display:none; }
	#our-brands .content { margin-bottom:5%; }
	#event .content .event .text { display:block; position:inherit; top:0; left:0; color:#777; padding:5px; border:#999 1px solid; }
	#contact-us .content .text { padding:20px 10px 50px 10px; }
	#contact-us .content .text form textarea { width:95.3%; }
	#contact-us .content .text form input { width:95%; }
}

@media only screen and (max-width: 420px) {
	#contact-us .content .text form textarea { width:92.3%; }
	#contact-us .content .text form input { width:92%; }
}
	
@media (max-width: 1100px) and (orientation:landscape) { 
	
}