/*
* @author: William Khoe
*/

nav.side
{
	margin:0 0 30px 0;
	background:#EEE;
	border:1px solid #DDD;
}
nav.side h3
{
	padding:15px 20px 5px 20px;
	font-size:14px; font-weight:700; text-transform:uppercase;
}

nav.side h4
{
	padding:15px 15px 5px 15px;
	font-size:13px; font-weight:700; text-transform:uppercase;
}

nav.side .prname
{
	padding:15px 20px 5px 20px;
	font-size:12px; font-weight:bold; 
}

nav.side .prtext
{
	padding:5px 20px 5px 20px;
	font-size:12px; font-weight:normal; 
}

nav.side .premail
{
	padding:15px 20px 5px 20px;
	font-size:12px; font-weight:normal; 
}

nav.side > ul > li > a
{
	display:block;
	padding:0 20px;
	font-weight:bold; color:#222;
}
nav.side > ul > li > a span
{
	display:block;
	border-bottom:1px solid #CCC; border-top:1px solid #FFF;
	padding: 15px 0;
}
nav.side > ul > li.first > a span
{
	border-top:0;
}
nav.side > ul > li.last > a span
{
	border-bottom:0;
}
nav.side > ul > li.open
{
	position:relative;
	margin:-1px 0;
	border-top:1px solid #CCC;
}
nav.side > ul > li.open > a
{
	padding:0;
	line-height: 18px;
	border-top:1px solid #EEE; border-bottom:1px solid #E1E1E1;

	background:#D4D4D4;
	background:-moz-linear-gradient(top, #DDD 0%, #CCC 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#DDD), color-stop(100%,#CCC));
	background:-webkit-linear-gradient(top, #DDD 0%,#CCC 100%);
	background:-o-linear-gradient(top, #DDD 0%,#CCC 100%);
	background:-ms-linear-gradient(top, #DDD 0%,#CCC 100%);
	background:linear-gradient(to bottom, #DDD 0%,#CCC 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#DDDDDD', endColorstr='#CCCCCC',GradientType=0 );
}
nav.side > ul > li.open > a span
{
	padding:0 20px;
	border:0; border-bottom:1px solid #AAA;
    padding-bottom: 10px;
    padding-top:10px;
}
nav.side > ul > li > ul
{
	padding:8px 0;

	background:#F7F7F7;
	background:-moz-linear-gradient(top, #F0F0F0 0%, #FFF 100%);
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#F0F0F0), color-stop(100%,#FFF));
	background:-webkit-linear-gradient(top, #F0F0F0 0%,#FFF 100%);
	background:-o-linear-gradient(top, #F0F0F0 0%,#FFF 100%);
	background:-ms-linear-gradient(top, #F0F0F0 0%,#FFF 100%);
	background:linear-gradient(to bottom, #F0F0F0 0%,#FFF 100%);
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#F0F0F0', endColorstr='#FFFFFF',GradientType=0 );

	border-bottom:1px solid #DDD; border-left:1px solid #E6E6E6; border-right:1px solid #E6E6E6;
}
nav.side > ul > li > ul > li > a
{
	display:block;
	padding: 5px 19px;
	color:#444;
}
/*nav.side > ul > li.active > a,
nav.side > ul > li > ul > li.active > a
{
	pointer-events:none;
	cursor:default;
}*/
nav.side > ul > li > a:hover,
nav.side > ul > li > ul > li > a:hover,
nav.side > ul > li > ul > li.active > a,
nav.side > ul > li.active > a
{
	color:#ED1C27;
}
nav.side wtb_prod_details{
    padding: 0 0 0 15px;

}

/* Regular Desktop */

@media only screen and (min-width:1024px) {


}

/* Tablet Portrait */

@media only screen and (min-width:768px) and (max-width:1023px)
{
	nav.side
	{
		margin-bottom:15px;
	}
}

/* Mobile Portrait & Landscape */

@media only screen and (max-width:767px)
{
	nav.side
	{
		margin-bottom:0;
	}
	nav.side h3
	{
		display:none;
	}
	nav.side > ul > li,
	nav.side > ul > li.open > a
	{
		display:none;
	}
	nav.side > ul > li.open
	{
		display:block;
		border-top:1px solid #DDD;
	}
	nav.side > ul > li > ul
	{
		padding:0;
		border:0;
	}
	nav.side > ul > li > ul > li > a
	{
		padding:0 10px;
		line-height:43px; font-weight:bold;
		border-bottom:1px solid #DDD;

		background:#F8F8F8; /* Old browsers */
		background:-moz-linear-gradient(top,  #FDFDFD 0%, #F4F4F4 100%); /* FF3.6+ */
		background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#FDFDFD), color-stop(100%,#F4F4F4)); /* Chrome,Safari4+ */
		background:-webkit-linear-gradient(top,  #FDFDFD 0%,#F4F4F4 100%); /* Chrome10+,Safari5.1+ */
		background:-o-linear-gradient(top,  #FDFDFD 0%,#F4F4F4 100%); /* Opera 11.10+ */
		background:-ms-linear-gradient(top,  #FDFDFD 0%,#F4F4F4 100%); /* IE10+ */
		background:linear-gradient(to bottom,  #FDFDFD 0%,#F4F4F4 100%); /* W3C */
		filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FDFDFD', endColorstr='#F4F4F4',GradientType=0 ); /* IE6-9 */
	}
	nav.side > ul > li > ul > li > a span
	{
		display:block;
		background:url(/img/ui/icon-sprite.png) no-repeat 100% -1491px;
	}
	nav.side > ul > li > ul > li > a:hover span,
	nav.side > ul > li > ul > li.active > a span
	{
		background-position:100% -4513px;
	}
}