/* Reset */
@charset "utf-8";
/* CSS Document */

/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

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;
}
/* HTML5 display-role reset for older browsers */
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;
}

/* Fontface */

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

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

/* All Pages */
*{font-weight:100;}
body{display:none;}
body, html, .slide, #home{overflow:hidden;}
h1, h2, h3, h4, h5, h6, p, a, span, div{font-family: 'avenirlight', Arial, Helvetica, sans-serif; font-weight:100; }
h1{text-transform: uppercase; font-size: 16pt; color:rgba(150,150,150,1); padding:10px 0px;}
h2{font-size: 14pt; color:rgba(150,150,150,1); padding:10px 0px;}
h3{line-height:1.3em;}
h4{font-size: 12pt; padding:2px 0px;}
a{text-decoration:none; color:#000;}
a:hover{cursor:pointer;}
a:linked{}
a:visited{}
p{font-size:11pt; line-height:1.3em;}

/* Navigation */
#navbar {z-index:1;	left:50%;	top:26px;	margin-left: -298px;	width: 576px;	height:100px;	position: fixed;}
#navbar ul{	position:relative;	top:20px;	padding-left:35px;	padding-right:00px;}
#navbar li{	margin:0px;	padding-left: 15px;	padding-right: 15px;	position: relative;	display: inline-block;	text-align: center;	font-size: 11pt;	color: rgba(0,0,0,1);}
#navbar li a{	text-decoration:none;	-webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s;}
#navbar li a:hover{	-webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s;}
#navbox {	background-color: rgba(0,0,0,1);	top:26px;	height: 5px;	width: 37px;	position: relative;	left: 50px;}
#navbar_underline {	background-color: rgba(0,0,0,1);	height: 1px;	width: 576px;	top: 29px;	position: relative;}
#footer {	left:50%;	margin-left: -298px;	position: fixed; bottom:0px;	padding: 10px;	width: 576px;	text-align: center;	font-size: 11px;}
#footer-line {	background-color: rgba(0,0,0,1);	margin: 0 auto 0;	height: 1px;	bottom: 10px;	position: relative;}
#logo {width:194px;	height:70px; position:relative;	z-index:1;	background-image: url(images/Joug_Logo_Black.png);	margin: 0 auto 0;}
#logo:hover {cursor: pointer;}

/* Home Page */
#home{background-color: white; height: 100px; z-index: -1;	width: 100%; background-repeat: no-repeat; background-position: top center;}
.slideshow{margin: auto; min-width: 50%; min-height: 50%; top: 0; left: 0; right: 0; bottom: 0; position:relative;}
.slideshow_gallery{height:297px; width:580px; position:relative;}
.slideshow_gallery ul li{position:absolute; top:0px; left:0px; display:none;}
.slideshow img{position: absolute; width: 100%; min-width:900px; z-index:0; top:0px; margin: 0 auto 0;}​

/* Products Page */
#products{width: 100%; overflow:hidden;}
#productswrap{	position:relative;	width:1000px;	margin: 0 auto 0;	height:2300px;}
.productimage{position:absolute; -webkit-transition:2s;}
.productimage{cursor:pointer;}
.productimage h6{position: absolute; width: 100%; text-transform: uppercase; font-size: 15pt; text-align: center; color: rgba(0,0,0,0);	-webkit-transition: 1.3s;}
.hotspot{position:absolute; bottom:0px; width:100%; cursor:pointer; z-index:1;}
.hotspot:hover~img{ -webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s; -o-transition:0.5s;}
.hotspot:hover~h6{color:rgba(0,0,0,1); -webkit-transition:0.5s; -moz-transition:0.5s; transition:0.5s; -o-transition:0.5s;}
.faded{opacity:0.25; -webkit-transition:1s; -moz-transition:1s; transition:1s; -o-transition:1s;}
.faded_completely{opacity:0; -webkit-transition:1s; -moz-transition:1s; transition:1s; -o-transition:1s;}
.product_content{position:absolute; width:300px; height:400px; bottom:-200px; display:none; -webkit-transition:1s; -moz-transition:1s; transition:1s; -o-transition:1s; z-index:0;}
.product_content h3{font-style:italic;}
.product_content span{position:relative; top:-60px;}
.product_content p{margin-top: 70px; margin-bottom: 70px;}
.dark_bg{background-color:#000;}
.white{color:rgba(255,255,255,1);}
.product_content span:hover{opacity:0.5}
.black{color:rgba(0,0,0,1);}
.product_text_left1{left:-350px;}
.product_text_right1{right:-350px;}
.prod_button{cursor:pointer; padding:0px 10px; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s;}
.disabled{opacity:0.25; cursor:default;}
.img_right{right:310px;}
.img_left{left:310px;}
.offset_img100{top:100px !important;}
.offset_img-100{top:-100px !important;}
.offset_img80{top:80px !important;}
.offset_img-80{top:-80px !important;}
.offset_img50{top:50px !important;}
.offset_img-50{top:-50px !important;}
.offset_img20{top:20px !important;}
.offset_img-20{top:-20px !important;}
.dark_overlay{position:absolute; bottom:0px; left:0px; width:100%; height:100%;	background-repeat:no-repeat; background-position:bottom;	display:none;}
.product_content img{position:absolute; top:0px; padding:0px 20px 0px 20px; display:none; pointer:cursor;}
.btn_back{margin-top: 50px; cursor:pointer; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s; opacity:1;}
.btn_back:hover{opacity:0.5;}
.buy_btn{background: rgba(0,0,0,0.05); padding: 6px 30px; -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s;}
.buy_btn:hover{background:black; color:white;}
.buy_btn.white{background:rgba(255,255,255,0.25);}
.buy_btn.white:hover{background:white; color:black;}

/* Contact Page */
#contact{width: 100%;}
#contact p{line-height: 20px;}
.contact_mask{top:160px; width:100%; bottom:40px; position:absolute; overflow:auto;}
.contact_page{position: relative; margin: 0 auto 0; width: 576px;}

/* Stockists Page */
.stockists_accordion{position: relative; margin: 0 auto 0; width: 576px;}
#stockists{	position:relative; margin-left:auto; margin-right:auto; width:576px; padding:10px 0px;}
#stockists ul{display:block; width:800px; float:left;}
#stockists li{display:block; list-style-type:none; width:220px; float:left; padding:10px 10px 30px 0px;}
#stockists h1{-webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s;}
#stockists h1:hover{cursor:pointer; color:rgba(0,0,0,1); -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s;}
#stockists h2{}
#stockists h4{font-family: 'avenirbook', Arial, Helvetica, sans-serif; font-weight:600; color:#000;}	
#stockists h5{color:rgba(153,153,153,1); font-size:10pt; padding-top:5px;}
#stockists p{line-height: 20px;}
#stockists a:hover{opacity:0.5;}
.stockists_mask{top:160px; width:100%; bottom:60px; position:absolute; overflow:auto;}


/* JOUG Made Page */
#custom p{position:relative; padding: 40px 0px 40px 0px;}
#custom img{padding: 0px 0px 40px 0px;}
#custom{padding: 60px 0px;}
#custom h1{font-size: 16pt; color:rgba(150,150,150,1); -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s;}
#custom h1:hover{cursor:pointer; color:rgba(0,0,0,1); -webkit-transition:0.3s; -moz-transition:0.3s; transition:0.3s; -o-transition:0.3s; padding-left:0px; padding-right:0px;}
.mask{top:160px; width:100%; bottom:160px; position:absolute; overflow:auto;}
.accordion{	position: relative;	margin: 0 auto 0; width: 576px; min-height: 100%; padding:0px;}
.drop20px{margin-top:20px;}

.inactive{display:none;}
.active{display:block;}
#paragraph_float{float:left; width:50px;}
#contact a:hover{cursor:pointer; color:rgba(150,150,150,1);}

.rs-slideshow { height: 297px; overflow: hidden; position: relative; width: 576px;}
.rs-slideshow .slide-container {height: 297px; left: 0; overflow: hidden; position: absolute; top: 100; width: 100%; padding:0px;}
.rs-slideshow .slides {display: none;}