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

body{ padding:0;
margin:0;
background: url(images/background.jpg) repeat center top; font-family: 'comic';  }

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

.main{ width:100%; float: left; background: #fff  }

#intro { background: none !important; }

.logo{ position:absolute; top:0; z-index:999; left: -20px; }

.menu ul{ margin:0; padding:0; list-style:none; margin-top:10px; }

.menu ul li{ float:left; margin:0 16px; }

.menu ul li a{ text-decoration:none; color:#3b3022; font-size:19px; font-family: 'comic'; line-height:51px; display:block; padding:0 12px; cursor: pointer; } 

.menu ul li a:hover{ color:#3b3022; background:url(images/menu-back.png) repeat-x center; border-radius:5px;  }

.main_back{ background:#fff; width:100%; margin:0 auto; height:auto;  border-bottom:3px solid #616161;  }

.main_backc{ background:#fff; width:100%; float: left;  min-height:517px;  }

.copyright{ color:#3b3022; font-size:13px; font-family: 'comic'; line-height:25px; border-top:3px solid #616161; background : url("images/background.jpg") repeat scroll center top; width: 100%; float : left; padding: 10px 0; font-weight: 700;}

.copyright a{ color:#3b3022;}

.clr{ clear:both; }
.menu select {
	width: 100%;
	border: 0;
	background:#337c42;
	color: #000;
	height: 40px;
	padding: 10px 3%;
	display: none;
	}

audio{
display: none;
}

.age{ font-family: 'comic'; font-size:40px; margin-top:30px; color:#3b3022; }

.age span{  font-size:30px; color:#666 }

.banner{ margin-top:40px; margin-bottom:40px; }

.form{
    font-size: 20px;
    margin: auto;
    max-width: 1100px; }
	
.form a{ text-decoration:none; color:#900; }
	
.field{ width:250px; height:35px; border:1px solid #ccc; border-radius:5px; }

textarea{ width:350px; height:150px; border:1px solid #ccc; border-radius:5px; }

.submit{ border:1px solid #ccc; background:#999; padding:10px; border-radius:5px; color:#fff; font-size:15px; font-weight:bold; cursor:pointer; }

.slide{ max-width: 1100px; margin:auto;}

.fl{ float:left; }

.botel{ margin-left: 240px;
    margin-right: 130px;
    margin-top: 83px; }
	
.fr{ float:right; }

.detail{ margin-top:83px; font-family: 'comic'; width:610px; text-align:justify; }

#content{ width:1000px; margin:0 auto; padding-top:20px; }

.maphome td{ padding:0px; border:1px solid #333; border-radius:3px; text-align:center; }

.audio{ height:0; width:0; overflow:hidden; }

.menuH
{
    /* You will get totally diffrent menu alignment and layout by setting following margin, width, and float with different values.
    For detailed instruction please visit www.menucool.com/horizontal/change-menu-alignment  */
   
    /*following "behavior" works for IE6, IE7, and IE8. Other browsers will ignore it.*/
    /*Note: Unlike image file, htc file path is relative to the page, not this CSS file.*/
   
  z-index:999;
   
   
   
}

.menuH li
{
    padding: 0;
    /*margin: 0;
    display: block; TODO: I am testing them if they can be removed. If can, remove them.*/
    float: left;
    
    position: relative;/*move it into .menuH if you want submenu to be positioned relative to the whole menu instead of this li element*/
}
.menuH li:hover, .menuH li.onhover
{
   
}

ul.menuH a
{
   
}
.menuH a:hover
{
    
}

 
        
/*Used to align a top-level item to the right*/        
.menuH .menuRight
{
    float: right;
    margin-right: 0px;
}
        
/*for the top-level separators*/
.menuH li.separator
{
    font-size:0;
    overflow:hidden;
    border-left:1px solid #F7F7F7;
    border-right:1px solid #BBBBBB;
}
               
        
/*######sub level###########*/
        
ul.menuH ul
{
    width:266px;
    position: absolute;
    left: -9999px;
    border: 1px solid #DDD;
    border-top: 0; 
    background: #FFF;    
    text-align: left;
    list-style: none; margin: 0;  
    /*Following 1px(padding-right) will determine how much it is overlapped by the sub-sub-menu */
    padding: 20px 1px 30px 0;
    box-sizing:content-box;
	z-index:999;
}

.menuH li li
{
    float: none;
    white-space:nowrap;
    height: 26px;
}
.menuH li li:hover, .menuH li li.onhover
{
    
}
.menuH ul a
{
    padding: 0 20px;
    line-height: 26px;
    font-size: 0.9em;
    font-weight: normal;
    color: #0066CC;
    text-align: left;
	width:230px;
	line-height:20px !important;
}

.menuH ul a:hover
{
    color: red;
}

.menuH li:hover ul, .menuH li.onhover ul
{
    left: -1px;/*Use this property to change offset of the dropdown*/
    top: auto;
}

.menuH li:hover .dropToLeft, .menuH li.onhover .dropToLeft
{
    left: auto;
    right: -1px;
    top: auto;
}
.menuH ul ul
{
    border-top: 1px solid #DDD;
	margin-top:-20px;
}

.menuH li:hover ul ul, .menuH li:hover ul ul ul, .menuH li:hover ul ul ul ul,
.menuH li.onhover ul ul, .menuH li.onhover ul ul ul, .menuH li.onhover ul ul ul ul
{
    left: -9999px;
    top:0;
}

.menuH li li:hover ul, .menuH li li li:hover ul, .menuH li li li li:hover ul,
.menuH li li.onhover ul, .menuH li li li.onhover ul, .menuH li li li li.onhover ul
{
    left: 245px;
}
        
/*####### special effects ##########*/
        
.decor1 
{
    /*-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;

    -moz-box-shadow: 0px 1px 4px #eee;
    -webkit-box-shadow: 0px 1px 4px #eee;
    box-shadow: 0px 1px 4px #eee;*/
            
}
.menuH ul 
{
    -moz-border-radius: 0px 0px 4px 4px;
    -webkit-border-radius: 0px 0px 4px 4px;
    border-radius: 0px 0px 4px 4px;

    -moz-box-shadow: 0px 6px 6px #CCC;
    -webkit-box-shadow: 0px 6px 6px #CCC;
    box-shadow: 0px 6px 6px #CCC;  
    
    /*for older IE browsers, the htc file fix will disable this feature when box-shadow was also applied.*/
    filter:alpha(opacity=90);
    opacity: 0.90;  
            
    /* Gradient background */
    background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#EEEEEE)); 
}

.menuH li ul li a:hover{ background:none; color:#A00; }



.jTscroller button{ border:0; padding:0; background:none; cursor:pointer; }


.jTscroller button:hover{
    -moz-transform: translate(-0px, -15px);
    -ms-transform: translate(-0px, -15px);
    -o-transform: translate(-0px, -15px);
    -webkit-transform: translate(-0px, -15px);
    transform: translate(-2px, -15px)
}

.product img{ -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
border-radius:5px;
margin-bottom:20px; }

.popup_background{ z-index:999; }

.popup_wrapper{ z-index:999; }

.details{ width:600px; text-align:justify; } 
#product_thumb {
	width:25%;
	float:left;
	}

@media only screen 
and (max-width : 1024px) {
.age{
font-size: 27px;
}
.inner {
    max-width: 547px!important;
    width: 100%;
}
.cat-logo-box{
	max-width:547px!important;
	margin: 0 auto;
	}
#menu li {
    float: left;
    margin: 0 7px;
}
#brand-logo img {
    width: 100%;
}
.product-thumb-nail img{
    width: 100%;
}

#product_thumb {
    float: left;
    width: 47%!important;
}
#banner-fade, #banner-slide {
    width: 723px;
}
#banner-fade, #banner-slide {
    width: 70.5%!important;
}
#menu ul{
width: 237px!important;
}
#menu a{
font-size : 17px!important;
}

#menu ul ul {
    left: 237px!important;
}

#menu li {
    float: left;
    margin: 0 7px!important;
}
}


@media only screen 
and (max-width : 980px) {
.age{
font-size : 25px;
}
.age span{
font-size: 22px;
}
#product_thumb {
    float: left;
    width: 50%!important;
}

.product-subdesc h1 {
    margin: 0;
}
#banner-fade, #banner-slide{
width: 100%!important;
}
.iframe{width : 100%;
}
#bottles ul li{
  width: 278px!important;
}
.video{
    width: 100%!important;
}
.video h1{
	 width: 100%;
	 float: left;
}
}
@media only screen 
and (max-width : 900px) {
#content {
	width:100%;
	}
.logo {
	position:relative;
	text-align: center;
    width: 100%;
	}

.age{
font-size : 22px;
}
.age span{
font-size: 17px;
}
}

#slider img{
	width:auto!important;
	height:auto;
	}
#slider, #slider div.sliderInner {
		width:100%!important;
	}
/*#bottles ul {
		padding:0!important;
		width:100%;
		left:0!important;
	}
#bottles ul li {
	padding:0!important;
	}*/
}
.stacktable { width: 100%; }
.st-head-row { padding-top: 1em; }
.st-head-row.st-head-row-main { font-size: 1.5em; padding-top: 0; }
.st-key { width: 49%; text-align: right; padding-right: 1%; }
.st-val { width: 49%; padding-left: 1%; }



/*.responsive p EXAMPLE */

.stacktable.large-only { display: table; }
.stacktable.small-only { display: none; }

@media (max-width: 800px) {
  .stacktable.large-only { display: none; }
  .stacktable.small-only { display: table; }
  .menu select {
	display:inline-block;
	}	
.menu  ul{
	display:none;
	}
	.menu{
    margin-bottom: 0!important;
	}
	.iframe{
	width: 100%;
	}
	#bottles ul li {
    width: 192px !important;
}
}
.menu {
    float: right;
    margin-right: 48px;
	margin-bottom: 10px;
}

.video-outer{
max-width : 576px;
margin : auto;
border: 1px solid #777777;
padding: 7px;
}
.video-outer .video{
	width: 100%;
	float: none;
}

.top {
    float: left;
    width: 100%;
	background: url("images/background.jpg") repeat scroll center top;
	border-bottom: 3px solid #616161;
}

.slide-outer {
    float: left;
    width: 100%;
	background: #FFFFFF;
}

.bottle-outer {
    float: left;
    width: 100%;
}

.top-inner {
    margin: auto;
    max-width: 1247px;
}

.product-sub-main-inner {
    float: left;
    width: 100%;
	margin-top: 30px;
}
.cat p {
    margin: 0;
}
.video{
width: 27.5%;
text-align: center;
float: left;
}
.iframe{
height: 222px;
float:right;
}
.cat-logo-box{
	max-width:800px;
	margin: 0 auto;
	}
.jThumbnailScroller .jTscroller a img {
    box-shadow: 0 0 10px 0 #FFFFFF !important;
}
#product{
margin: 0;
padding: 0;
width: 100%;
border: 0px none;
}
.inner{
max-width: 800px;
margin: 0 auto;
padding-top:30px;
}
.product-thumb-nail{
float: left;
width: 30%;
}

.product-thumb-nail img {
    box-shadow: 0 0 10px 0 #FFFFFF;
}
.product-subdesc {
    float: left;
    width: 70%;
}
.slider-inner{
	margin: auto;
    max-width: 1100px;
}
.slide {
   width: 100%;
   float: left;
   border:6px solid;
   background: #000;
}

#scroller {
    float: none;
	position: relative;
}
.video h1 {
    color: #ffffff;
    font-size: 13px;
    text-align: center;
}
.slide img{
width : 100%;
height: 350px !important;
}
.social{
	float: left;
    margin-bottom: 22px;
    padding: 0;
    width: 100%;
}
.social li {
    display: inline;
    list-style: none;
}
.social img {
    width: 137px;
	height: auto !important;
}
table { 
		width: 100%; 
		border-collapse: collapse; 
	}
	/* Zebra striping */
	tr:nth-of-type(odd) { 
		background: #eee; 
	}
	th { 
		background: #333; 
		color: white; 
		font-weight: bold; 
	}
	td, th { 
		padding: 6px; 
		border: 1px solid #ccc; 
		text-align: left; 
	}
	
	
table strong {
    color: #FFFFFF;
}
td a {
    color: #000000;
}

.rstable-outer{
    margin: auto;
    max-width: 1100px;
}
.rstable{
width: 100%;
float: left;
}
.rs1 {
    float: left;
    width: 50%;
}
.rs2 {
    width: 50%;
}
.MsoNormalTable{
border :1px solid #9A2625;
width : 100%;
}


	
	
	
	/* iPads (portrait and landscape) ----------- */
	@media only screen and (min-device-width: 768px) and (max-device-width: 980px) {
		.responsive body { 
			width: 495px; 
		}
		.slide{
	border: 0 none;
}
	}
	
#menu, #menu ul {
		margin:0; padding:0; list-style:none; margin-top:10px
	}
	
	#menu {
		
	}
	
	#menu:before,
	#menu:after {
		content: "";
		display: table;
	}
	
	#menu:after {
		clear: both;
	}
	
	#menu {
		zoom:1;
	}
	
	#menu li {
		float:left; margin:0 16px; 
	}
	
	#menu a {
		text-decoration:none; color:#3b3022; font-size:19px; font-family: 'comic'; line-height:51px; display:block; padding:0 12px; cursor: pointer; 
	}
	
	#menu li:hover > a {
		color:#3b3022; background:url(images/menu-back.png) repeat-x center; border-radius:5px; 
	}
	
	*html #menu li a:hover { /* IE6 only */
		color: #fafafa;
	}
	
	#menu ul {
		margin: 20px 0 0 0;
		_margin: 0; /*IE6 only*/
		opacity: 0;
		visibility: hidden;
		position: absolute;
		z-index: 1;    
		background: #fff;
		-moz-box-shadow: 0 6px 6px #CCCCCC;
		-webkit-box-shadow: 0 6px 6px #CCCCCC;
		box-shadow: 0 6px 6px #CCCCCC;	
		-moz-border-radius: 0 0 4px 4px;
		-webkit-border-radius: 0 0 4px 4px;
		border-radius: 0 0 4px 4px;
		-webkit-transition: all .2s ease-in-out;
		-moz-transition: all .2s ease-in-out;
		-ms-transition: all .2s ease-in-out;
		-o-transition: all .2s ease-in-out;
		transition: all .2s ease-in-out;  
		width: 310px;
		padding: 7px 0;
	}

	#menu li:hover > ul {
		opacity: 0.98;
		visibility: visible;
		margin: 0;
	}
	
	#menu ul ul {
		left: 270px;
		_margin: 0; /*IE6 only*/	
	}
	
	#menu ul li {
		float: none;
		display: block;
		border: 0;
		_line-height: 0; /*IE6 only*/
	}
	
	#menu ul li:last-child {   
		-moz-box-shadow: none;
		-webkit-box-shadow: none;
		box-shadow: none;    
	}
	
	#menu ul a {    
		width: 130px;
		_height: 10px; /*IE6 only*/
		display: block;
		white-space: nowrap;
		float: none;
		text-transform: none;
	}
	
	#menu ul a:hover {
		color : #AA0000;
	}
	
	#menu ul li:first-child > a {
		-moz-border-radius: 3px 3px 0 0;
		-webkit-border-radius: 3px 3px 0 0;
		border-radius: 3px 3px 0 0;
	}
	
	#menu ul li:first-child > a:after {
		content: '';
		position: absolute;
		left: 40px;
		top: -6px;
		border-left: 6px solid transparent;
		border-right: 6px solid transparent;
		border-bottom: 6px solid #fff;
	}
	
	#menu ul ul li:first-child a:after {
		left: -6px;
		margin-top: 7px;
		border-left: 0;	
		border-bottom: 6px solid transparent;
		border-top: 6px solid transparent;
		border-right: 6px solid #3b3b3b;
	}
	
	#menu ul li:first-child a:hover:after {
		border-bottom-color: #fff; 
	}
	
	#menu ul ul li:first-child a:hover:after {
		border-right-color: #0299d3; 
		border-bottom-color: transparent; 	
	}
	
	#menu ul li:last-child > a {
		-moz-border-radius: 0 0 3px 3px;
		-webkit-border-radius: 0 0 3px 3px;
		border-radius: 0 0 3px 3px;
	}
	
	/* Mobile */
	#menu-trigger {
		display: none;
	}

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

		/* nav-wrap */
		#menu-wrap {
			position: relative;
			 z-index: 99999;
		}

		#menu-wrap * {
			-moz-box-sizing: border-box;
			-webkit-box-sizing: border-box;
			box-sizing: border-box;
		}

		/* menu icon */
		#menu-trigger {
			display: block; /* show menu icon */
			height: 40px;
			line-height: 40px;
			cursor: pointer;		
			padding: 0 0 0 35px;
			border: 1px solid #222;
			color: #fafafa;
			font-weight: bold;
			background-color: #111;
			background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -moz-linear-gradient(#444, #111); 
			background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -webkit-linear-gradient(#444, #111);	
			background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -o-linear-gradient(#444, #111);
			background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, -ms-linear-gradient(#444, #111);
			background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAMAAADeWG8gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyBpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNSBXaW5kb3dzIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjE2QjAxNjRDOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjE2QjAxNjREOUNEOTExRTE4RTNFRkI1RDQ2MUYxOTQ3Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTZCMDE2NEE5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTZCMDE2NEI5Q0Q5MTFFMThFM0VGQjVENDYxRjE5NDciLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz42AEtnAAAABlBMVEX///////9VfPVsAAAAAnRSTlP/AOW3MEoAAAAWSURBVHjaYmAgFzBiACKFho6NAAEGAD07AG1pn932AAAAAElFTkSuQmCC) no-repeat 10px center, linear-gradient(#444, #111);
			-moz-border-radius: 6px;
			-webkit-border-radius: 6px;
			border-radius: 6px;
			-moz-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
			-webkit-box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
			box-shadow: 0 1px 1px #777, 0 1px 0 #666 inset;
		}
		
		/* main nav */
		#menu {
			margin: 0; padding: 10px;
			position: absolute;
			top: 40px;
			width: 100%;
			z-index: 1;
			background-color: #444;
			display: none;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;		
		}

		#menu:after {
			content: '';
			position: absolute;
			left: 25px;
			top: -8px;
			border-left: 8px solid transparent;
			border-right: 8px solid transparent;
			border-bottom: 8px solid #444;
		}	

		#menu ul {
			position: static;
			visibility: visible;
			opacity: 1;
			margin: 0;
			background: none;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;				
		}
		#menu li:hover a{
		background : none!important;
		}

		#menu ul ul {
			margin: 0 0 0 20px !important;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;		
		}

		#menu li {
			position: static;
			display: block;
			float: none;
			border: 0;
			margin: 5px;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;			
		}

		#menu ul li{
			margin-left: 20px;
			-moz-box-shadow: none;
			-webkit-box-shadow: none;
			box-shadow: none;		
		}

		#menu a{
			display: block;
			float: none;
			padding: 0;
			color: #999;
		}

		#menu a:hover{
			color: #fafafa;
		}	

		#menu ul a{
			padding: 0;
			width: auto;		
		}

		#menu ul a:hover{
			background: none;	
		}

		#menu ul li:first-child a:after,
		#menu ul ul li:first-child a:after {
			border: 0;
		}

.cat a:before {
    content: "-";
}
.subcat a:before {
    content: "-";
}
.subcat1 a:before {
    content: "-";
}	

#menu li a {
    font-size: 15px !important;
    line-height: 25px;
}	
.slide{
	border: 0 none;
}
	}
	@media screen and (min-width: 900px) {
		#menu {
			display: block !important;
			
		}
		
	}
		

	/* iPad */
	.no-transition {
		-webkit-transition: none;
		-moz-transition: none;
		-ms-transition: none;
		-o-transition: none;
		transition: none;
		opacity: 1;
		visibility: visible;
		display: none;  		
	}

	#menu li:hover > .no-transition {
		display: block;
	}
	
#menu {
    float: right;
    margin-bottom: 10px;
    margin-right: 107px;
}

#menu .cat p a {
    line-height: 30px;
}
#menu .subcat1 a {
    line-height: 30px;
}
.cat li a{
background : none!important;
}
.subcat {
    margin-top: -17px !important;
}
.subcat1 {
    margin-top: -17px !important;
}
.subcat li a{
background : none!important;
}
#subcat1 li a{
background : none!important;
padding: 0 5px;
}
#menu ul li a{
line-height: 27px;
}
.menu-outer {
    margin: auto;
    max-width: 1257px;
}
.list1 {
    line-height: 27px;
}

@media 
	only screen and (max-width: 760px),
	(min-device-width: 768px) and (max-device-width: 1024px)  {
	
		/* Force table to not be like tables anymore */
		.responsive thead{ 
			display: block; 
		}
		.responsive body{ 
			display: block; 
		}
		.responsive th{ 
			display: block; 
		}
		.responsive td{ 
			display: block; 
		}
		.responsive tr { 
			display: block; 
		}
		
		/* Hide table headers (but not display: none;, for accessibility) */
		.responsive thead tr { 
			position: absolute;
			top: -9999px;
			left: -9999px;
		}
		
		.responsive tr { border: 1px solid #ccc; }
		
		.responsive td { 
			/* Behave  like a "row" */
			border: none;
			border-bottom: 1px solid #eee; 
			position: relative;
			padding-left: 50%; 
		}
		
		.responsive td:before { 
			/* Now like a table header */
			position: absolute;
			/* Top/left values mimic padding */
			top: 6px;
			left: 6px;
			width: 45%; 
			padding-right: 10px; 
			white-space: nowrap;
		}
		#bottles ul{
padding: 0 !important;
}
#bottles ul li {
	padding: 8px 20px 8px 0  !important;
}
		
		/*
		Label the data
		*/
		.responsive td:nth-of-type(1):before { content: "Type of Keg";}
		.responsive td:nth-of-type(2):before { content: "Picture";}
		.responsive td:nth-of-type(3):before { content: "Ounces";}
		.responsive td:nth-of-type(4):before { content: "Cases of Beer(Approximate)";}
		.responsive td:nth-of-type(5):before { content: "Servings(per 12oz. cups)";}
		.responsive td:nth-of-type(6):before { content: " Keg Size";}
		.responsive td:nth-of-type(7):before { content: "Weight of Keg";}
	}
@media only screen 
and (max-width : 768px) {
/* Styles */
#content {
	width:100%;
	}
.logo {
	position:relative;
	text-align: center;
    width: 100%;
	}
.main {
	width:100%;
	}
	
#menu ul {
		padding:0;
		margin:0;
	}
	
#menu li {
		width:100%;
	}	
#slider	{
	width:100%!important;
	clear:both;
	margin:0;
	}
#slider div.sliderInner {
	width:100%;
	position:relative;
	}
#slider div.sliderInner .mcSlc img{
	width:100%;
	position:relative;
	}
/*#bottlecarousel {
	width:100%;
	}*/
#slider img{
	width:auto!important;
	height:auto;
	}
#slider, #slider div.sliderInner {
		width:100%!important;
	}
/*#bottles ul {
		padding:0;
		width:100%;
		left:0!important;
	}*/
#product_thumb {
	width:100%!important;
	text-align: center;
	}	
	
#brand-logo img {
    width: auto;
}
.product-thumb-nail img {
    width: auto;
}
.main_backc	 {
	width:100%;
	margin:0;
	padding:0;
	}
	#tS2.jThumbnailScroller {
    margin: 30px auto;
    max-width: 587px;
}
table, form {
	width:100%;
	margin:0;
	padding:0;
}
.product, .form {
	width:100%;
	margin:0;
	padding:0;
	}
.jThumbnailScroller, .jTscrollerContainer {
	width:100%!important;
	}
	.product-thumb-nail {
    float: left;
    text-align: center;
    width: 100%!important;
}

.product-subdesc {
    float: left;
    text-align: center;
    width: 100%!important;
}
.slide{
	border: 0 none;
}
}

@media only screen 
and (max-width : 640px) {
.rs1{
width: 100%!important;
}
.rs2{
width : 100%!important;
}
#bottles ul{
padding: 0 !important;
}
#bottles ul li {
	padding: 8px 20px 8px 26px  !important;
}
}

/* Smartphones (portrait and landscape) ----------- */
	@media only screen
	and (min-device-width : 320px)
	and (max-device-width : 480px) {
		.responsive body { 
			padding: 0; 
			margin: 0; 
			width: 320px; }
		}

/* Smartphones (portrait and landscape) ----------- */
@media only screen 
and (max-width : 480px) {
/* Styles */
#banner-fade,
#banner-slide{
 max-height: 184px;
}
.slide img {
    max-height: 184px;
}
#bottles ul li a.bottle{
width: 302px!important;
}
#bottles ul{
padding: 0 !important;
}
#bottles ul li {
    width: 144px !important;
	padding: 8px 20px 8px 5px  !important;
}
#bottles ul li a.bottle span.more1{
background: url("../images/over1.png") no-repeat scroll 97px 0 rgba(0, 0, 0, 0)!important;
}
}

@media only screen 
and (max-width : 360px) {
.product h3 {
    margin: 0!important;
    padding: 5px;
}
.product p {
    padding: 0 5px!important;
}
#banner-fade,
#banner-slide{
 max-height: 147px!important;
}
.slide img {
    max-height: 147px!important;
}
#bottles ul li a.bottle{
width: 327px!important;
}
#bottles ul li a.bottle span.more1{
background: url("../images/over1.png") no-repeat scroll 106px 0 rgba(0, 0, 0, 0)!important;
}
#bottles ul{
padding: 0 0 0 12px !important;
}
#bottles ul li {
    width: 186px !important;
	padding: 5px 0  !important;
}
.tbl1 {
    height: 395px;
    overflow-x: scroll;
    overflow-y: hidden;
    width: 100%;
}
}
@media only screen 
and (max-width : 320px) {
#bottles ul li a.bottle{
width: 300px!important;
}
#bottles ul li a.bottle span.more1{
background: url("../images/over1.png") no-repeat scroll 95px 0 rgba(0, 0, 0, 0)!important;
}
}
.des{
background: #920110; color: white; padding: 2px; border: 1px solid #777;
}
.des1{
padding: 2px; border: 1px solid #777;
}
.product-sub-desc a {
    color: #920110;
}