/*
TABLE OF CONTENTS
:: DESKTOP
:: MOBILE
*/


/* DESKTOP //////////////////////////////////////////*/
body {
	behavior: url("/global/nav/csshover.htc"); /* WinIE behaviour call */ 
}

div#nav {
	position:absolute;
	top:-4px; 
	left:0px;
	position:relative;
	z-index:2;
	width:100%;
	height:48px;
	margin:0px;
	margin-bottom:0px;
	padding:0px;
	text-align:left;
	background-color:;
	background-image:url("/img/bg-nav.gif");
	background-position:top left;
	background-repeat:repeat-x;
	border:0px solid black;
}

@media only screen and (max-width: 1018px) {
	div#nav {
		display:none;
	}
}

div#nav ul {
	width:100%;
	height:48px;
	margin:0px;
	padding:0px;
	text-indent:0px;
	text-decoration:none;
	list-style:none;
	list-style-image:none;
	background-image:url("/img/nav-curve-left.gif");
	background-position:top left;
	background-repeat:no-repeat;
	border:0px solid #fff;
}

img#right_curve {
	position:absolute;
	top:0px;
	right:0px;
}

@media only screen and (max-width: 1018px) {
	img#right_curve {
		display:none;
	}	
}

#nav li.submenu a, #nav li.submenu  a:visited {
	margin-top:0px;
	color:white;
	text-decoration:none;
	font-size:12px;
	font-weight:bold;
}

#nav a{
	display:block;
	height:48px;
	border:0px solid black;
	text-decoration:none;
	padding:0px;
	margin:0px;
	border:0px solid #fff;
}

#nav span {margin-left:-2000px;}

#products, #retail, #about, #affiliates, #cart {
	float:left;
	position:relative;
	height:48px;
	border:0px solid #fff;
	margin:0px;
	padding:0px;
}

#products {width:114px;}
#products > a, #products > a:visited {background:url("/img/btn-products.gif") top left no-repeat;}

#retail {width:174px;}
#retail > a, #retail > a:visited {background:url("/img/btn-retail.gif") top left no-repeat;}

#about {width:89px;}
#about > a, #about > a:visited {background:url("/img/btn-about.gif") top left no-repeat;}

#affiliates {width:118px;}
#affiliates > a, #affiliates > a:visited {background:url("/img/btn-affiliates.gif") top left no-repeat;}

#cart {width:115px;}
#cart > a, #cart > a:visited {background:url("/img/btn-cart.gif") top left no-repeat;}

div#nav ul li#products ul li a,div#nav ul li#retail ul li a,div#nav ul li#about ul li a,div#nav ul li#affiliates ul li a,div#nav ul li#cart ul li a { 
	background-image:none;
	} /* IE FIX to keep main name images from displaying on drop downs*/

div#nav ul li {
	z-index:22;
}

div#nav ul li#wines ul.level2, div#nav ul li#wines ul.level3 {border-top: 0px solid #6f7072;}

div#nav ul ul {
	position: absolute; 
	width:170px ; 
	display: none; 
	z-index: 23;	
	list-style:none;
	list-style-image:none;
	
}

div#nav ul ul li { 
	background-image:none;
	background-repeat:no-repeat;
	border-bottom: 0px solid #6f7072;
	border-left:0px solid #6f7072;
	border-right: 0px solid #6f7072;
}

div#nav li.submenu li.submenu {
	width:170px;
	padding:0px;
	margin:0;
}

div#nav ul.level1 li.submenu:hover ul.level2, div#nav ul.level2 li.submenu:hover ul.level3 {
	display: block;
}

div#nav #products ul.level2 {
	left:3px;
}

div#nav ul.level2 li.submenu:hover {
	background-color: #005e20; /*changes dropdown hover bg color*/
	
}

div#nav li ul.level2 li:hover {
	background: #3e3431; /*changes dropdown hover bg color*/
}


div#nav ul.level2 {	
	top: 48px; 
	left: 1px; 
	width:173px; 
	border: 0px solid blue;
}

div#nav ul.level2 li {
	position:relative;
	width:172px; 
	height:27px;
	background-color:#98ba28;
}

#nav ul.level2 a, #nav ul.level2 a:visited{
	color:#3e3431;
	font:bold 12px arial, Verdana sans-serif;
	padding:7px 12px 0px 17px; 
	height:27px;
	width: 162px !important;
	margin:0;
	width:172px;
	background-image:none;
	border: 0px solid blue;
}

#nav ul.level2 a.bold, #nav ul.level2 a:visited.bold {
	font-weight:bold;
}


div#nav ul.level2 a:hover {
	border-left-color:#fff;
	background-image:none;
	color:#fff; /*change subnav text color on hover*/
}

div#nav ul.level3 {
	z-index:99;
	top: 5px; left: 170px; 
	 
}

div#nav ul.level3 a {
	padding:5px;
	width: 172px;
}

div#nav ul.level2 li.submenu, div#nav ul.level2 li.submenu:hover {
	margin:0;
	padding:0;
	
	border:0;
	background-image:none;
}

div#nav ul.level2 li, div#nav ul.level3 li, div#nav ul.level2 li.submenu, div#nav ul.level3 li.submenu, div#nav ul.level2 li.submenu:hover, div#nav ul.level3 li.submenu:hover   {border:0px solid #fff;border-top:0px;}
div#nav ul.level3 {border-top:0px solid #fff;}

/*this was the tag that fixed the ie space issue on hover*/
div#nav li {
	position: relative; 
	list-style: none; 
	margin: 0; 
	float:left; 
} 

div#nav li#current-specials {
	height:35px;	
}

div#nav li#current-specials a {
	font-size:1.2em;	
}




/* MOBILE //////////////////////////////////////////*/
#scotch-admin-panel,
#scotch-panel, 
#mobile-nav, 
#admin-nav {
	display:none;	
}

@media only screen and (max-width: 1018px) {
	#scotch-panel,
	#scotch-admin-panel {
		display:block;	
		height:100%;
		width:100%;
	}
	
	#mobile-nav {
		display:block;
		float:left;
		width:20%;
		height:100%;
	}
		
	#mobile-nav a.toggle-panel {
		width:100%;
		display:block;
		height:127px;
		background-color:#8cc53e;
		text-align:center;
	}

	#mobile-nav a.toggle-panel:hover {
		cursor:pointer;
	}
	
	#mobile-nav a.toggle-panel img {
		margin-top:50px;
	}
	
	#mobile-nav a.toggle-panel:hover img {
		animation: roll 1s;
	}
	
	#admin-nav {
		display:block;
		float:right;
		right:0!important;
		width:20%;
		height:100%;
		height:127px;
	}
		
	#admin-nav a.toggle-admin-panel {
		width:100%;
		display:block;
		height:127px;
		color:#fff;
		font-size:14px;
		font-weight:bold;
		padding-top:52px;
		background-color:#222;
		text-align:center;
	}

	#admin-nav a.toggle-admin-panel:hover {
		cursor:pointer;
	}
	
	#scotch-admin-panel h4 a {
		font-size:16px;	
	}
	
	#scotch-admin-panel td {
		padding:5px 15px;	
	}
	
	#scotch-admin-panel .admin_nav_table  tr:first-child td:first-child {padding-top:15px;}
}

@keyframes roll {
  0% {
    -ms-transform: rotate(0); /* IE 9 */
    -webkit-transform: rotate(0); /* Chrome, Safari, Opera */
    transform: rotate(0);
  }
  100% {
    -ms-transform: rotate(180deg); /* IE 9 */
    -webkit-transform: rotate(180deg); /* Chrome, Safari, Opera */ 
    transform: rotate(180deg);
  }
}

#scotch-panel ul, 
#scotch-admin ul {
	height:auto;
	padding:0;
	margin:0;
	list-style:none;
	list-style-image:none;
	background-image:none;
}

#scotch-panel li, 
#scotch-admin li {
	line-height:normal;
	padding:0 0 0px 0;
	width:100%;
}

#scotch-panel > ul > li, 
#scotch-admin > ul > li {
	border-top:1px solid #827673;
	float:none;
	width:auto;
	height:auto;
	margin:0 20px;
	padding:15px 0;
}

#scotch-panel a, 
#scotch-admin a {
	display:block;
	width:96%;
	color:#fff;
	padding:5px 2%;
	text-decoration:none;
}

#scotch-panel a:hover,
#scotch-panel a:focus,
#scotch-admin a:hover,
#scotch-admin a:focus {
	background-color:#8cc53e;
	color:#222;
}

#scotch-panel #products,
#scotch-panel #retail, 
#scotch-panel #about, 
#scotch-panel #affiliates, 
#scotch-panel #cart,
#scotch-panel #products >a,
#scotch-panel #retail > a, 
#scotch-panel #about > a, 
#scotch-panel #affiliates > a, 
#scotch-panel #cart > a {
	float:none;
	width:auto;
	height:auto;
	background-image:none;
}	

#scotch-panel span {
	margin-left:0;
	font-weight:bold;
	font-size:18px;
}

#scotch-panel ul.level2 {
	width:100%; 
	height:auto;
	margin-top:5px;
	background-color:transparent;	
}