/**
 * Magento
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License (AFL 3.0)
 * that is bundled with this package in the file LICENSE_AFL.txt.
 * It is also available through the world-wide-web at this URL:
 * http://opensource.org/licenses/afl-3.0.php
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@magentocommerce.com so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade Magento to newer
 * versions in the future. If you wish to customize Magento for your
 * needs please refer to http://www.magentocommerce.com for more information.
 *
 * @category    design
 * @package     default_blank
 * @copyright   Copyright (c) 2010 Magento Inc. (http://www.magentocommerce.com)
 * @license     http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)
 */
 .nav-container {width:990px;display:table;/* background:transparent url(../images/nav-off-state.png) repeat-x 0px 0px; */ z-index: 1;position:relative;background-color:#fff}
/*  #meganav > li > a span { } */
#meganav {font-family: 'Gafata', sans-serif;}
.nav-container:after { content:""; display:block; height:0; clear:both; }
.corners-left { display:none;width:2px; height:30px; position:absolute; z-index: 10; top:0; left:0; background:transparent url(../images/bg_main_menu_corners.png) no-repeat 0px 0px; }
.corners-right { display:none;width:2px; height:30px; position:absolute; z-index: 10; top:0; right:0; background:transparent url(../images/bg_main_menu_corners.png) no-repeat 100% 0px; }
.col-right .nav-container { position:static; z-index: 0; }

/* Desktop / Tablet Default */
@media all and (min-width:400px),screen and (orientation: portrait) and (min-width:400px){
#meganav > li {float:left}
#meganav > li.nav-6,#meganav > li.nav-5 {float:right}
#meganav { max-width:990px; font-size:1.2em; position:relative; z-index: 0; display:block;}
.col-right #meganav { position:static; }
#meganav li span.at{display:none!important}
#meganav   li{ text-align:center; position:relative; z-index: 0; }
#meganav  li >div >div ul li {text-align:left} 
#meganav li a { display:block; text-decoration:none}
#meganav li.level0 > a { text-transform:UPPERCASE;border-right:1px solid #000;padding:0 1em}
#meganav li.level0.nav-cat1308 > a{border-right: 0;padding-right:0}
#meganav li a:hover { text-decoration:none; }
#meganav li a span { display:block; white-space:nowrap; cursor:pointer; }
#meganav li ul a span { white-space:normal; }

/* Home Link */


#meganav li.home {}
#meganav li.home a { background: transparent url(http://cdn.skintwo.co.uk/shop/skin/frontend/hnrltd/skintwo_responsive/images/bg_home_link.png) no-repeat 50% 50%;}
#meganav li.home a:hover { background: url(http://cdn.skintwo.co.uk/shop/skin/frontend/hnrltd/skintwo_responsive/images/bg_home_link.png) no-repeat 50% 50%; }






/* 1st Level */
/* #meganav li { float:left; } */
#meganav li a {color:#000; /* border-right:1px solid #fff;  */}
#meganav li:hover a,
#meganav li.active a,
#meganav > li.nav-1 > a:hover,
#meganav > li.nav-cat654 > a:hover,
#meganav > li.nav-cat654.active > a,
#meganav > li.nav-cat1343 > a:hover,
#meganav > li.nav-cat1343.active > a,
#meganav > li.nav-cat1272.active > a,
#meganav > li.nav-cat1346.active > a,
#meganav > li.nav-13 > a:hover
{ }

#meganav > li:hover > a{
    text-decoration:underline
}

#meganav ul { list-style:none; }
#meganav div.level0 {
	position:absolute; /*--Important--*/
	overflow: hidden;
	top:0; 
	left:-9999px;
	z-index:900;
	background:#fff;
	/* border:1px solid #0d0d0d; */
	padding:12px 18px 10px;
	float:left;
	display:none; /*--Hidden for those with js turned off--*/
	width:500px;
    	line-height:18px;
}
#meganav li.parent:hover div.level0 a { }
/* #meganav li.parent:hover div.level0 .extra-menu-custom  a {height:inherit} */
#meganav div.level0 a { 
	background:none; 
	border:none; 
    float: none;
    padding: 0;
    white-space: nowrap;
}
#meganav .nav-cat1308 li.level1.parent {width:inherit}
#meganav li.level1.parent {border-right: 1px solid #D4D4D4;width:148px}
#meganav div.level0 a:hover { text-decoration:underline; }
#meganav div.level0 a.st:hover { text-decoration:none; }
#meganav div.level0 a.st{ font-size: 14px!important;font-weight:bold!important }
#meganav ul.level1 { list-style: none; }
#meganav li.level1 { float:left; padding: 0 60px 0 16px;}
#meganav .extra-menu-custom  li.level1 { float:left; padding: 0 12px 0 16px;}
#meganav li.level1.like-menu { float:left; padding-left: 15px; }
#meganav li.level1.first { padding-left:0; }
#meganav li.level1 a { color:#0d0d0d; /*padding-bottom:5px;*/}

/* special cases */
#meganav div.level0 ul.menu-group { float: left; }
#meganav li.level1.no-children { float:none; padding-left:0; }
#meganav li.level1.no-children a { font-size:13px; padding:0; font-weight:normal; }
#meganav li.level1.space-after.no-children { margin-bottom:10px; }
#meganav li.level1.artificial-title { float:none; /*padding-bottom: 5px;*/ }

#meganav li.level1.artificial-title a,
#meganav li.level1 .menu-title,
#meganav li.level1 a.level-top span,
.level1.parent.parent-title > a > span,
#meganav li.level1 >span{ font-size:14px; /* font-weight:bold; */text-transform:UPPERCASE;text-decoration:underline;display:block!important}
#meganav li .extra-menu-custom .level1 a > span{font-size:14px;text-transform:UPPERCASE;text-decoration:underline;}
#meganav li .extra-menu-custom .level1 .level1 a > span{text-transform:none;text-decoration:none;}

#meganav div.level1{margin:15px 0;overflow:auto}
#meganav .artificial-title{margin-bottom:15px}
#meganav li.like-menu li.menu-title{margin:15px 0}
#meganav li.like-menu ul.first li.menu-title{margin-top:0}
#meganav li.level1.first { padding-left:0; }
#meganav li.level1.last {  /* padding-right:0; */ border-right:none }
#meganav .extra-menu-custom li.level1.last { padding-right:0;width:245px}
#meganav .extra-menu-custom li.level1.middle {width:245px}
/* special cases */

#meganav li.level2 { float:none;overflow:hidden }
#meganav li.level2 a { font-size:13px; padding:0; font-weight:normal; }
#meganav li.level2.space-after { margin-bottom:10px; }

#meganav li.like-menu { line-height:18px; border-left: 1px solid #D4D4D4;  }
#meganav li.like-menu li.menu-title {/*  font-weight:bold; */ /*padding-bottom:5px; margin-bottom:2px; margin-top:5px; padding-top:5px;*/ }
/* #meganav li.like-menu ul {    margin-left: 5px; } */
#meganav li.like-menu a { font-size:13px; padding:0; font-weight:normal; }
#meganav li.like-menu li { float:none;padding-left: 17px; }

/* Standard Magento Navigation */
#nav { font-size:14px; height:30px; line-height:30px; margin:0 0 0 -3px; }

/* All Levels */
#nav li { text-align:left; position:relative; }
#nav li.over { z-index:998; }
#nav li.parent {}
#nav li a { display:block; text-decoration:none; background:transparent url(../images/bg_main_menu.png) repeat-x 0px 0px; }
#nav li a:hover { text-decoration:none; }
#nav li a span { display:block; white-space:nowrap; cursor:pointer; }
#nav li ul a span { white-space:normal; }

/* Home Link */
#nav li.home { width:36px; }
#nav li.home a,
#nav li.home a:hover { background: transparent url(../images/bg_home_link.png) no-repeat 0px 0px; width:11px; }

/* 1st Level */
#nav li { float:left; }
#nav li a { 
	float:left; 
	padding:0 12px; 
	color:#fff; 
	border-right:1px solid #fff;
}
#nav li a:hover { background:#7a7d80; }
#nav li.over a,
#nav li.active a { background:#7a7d80; }

/* 2nd Level */
#nav ul,
#nav div { position:absolute; width:15em; top:25px; left:-10000px; border:1px solid #ddd; background:#fafafa; }
#nav div ul { position:static; width:auto; border:none; }

/* 3rd+ leven */
#nav ul ul,
#nav ul div { top:7px; }

#nav ul li { float:none; border-bottom:1px solid #ddd; }
#nav ul li.last { border-bottom:0; }
#nav ul li a { float:none; padding:3px 9px; font-weight:normal; color:#888 !important; }
#nav ul li a:hover { color:#000 !important; }
#nav ul li.active > a,
#nav ul li.over > a { color:#000 !important; }

/* Show menu */
#nav li ul.shown-sub,
#nav li div.shown-sub { left:0; z-index:999; }
#nav li .shown-sub ul.shown-sub,
#nav li .shown-sub li div.shown-sub { left:100px; }

/* Custom Hover States for each top level menu item */

#meganav > li.nav-cat649 > a:hover,#meganav > li.nav-cat649:hover > a {
		background: none repeat scroll 0 0 #952956 !important;
		box-shadow: 0 3px 5px 0 #3E1124 inset;
}


#meganav > li.nav-cat651 > a:hover,#meganav > li.nav-cat651:hover > a{
	background: none repeat scroll 0 0 #2F2F2F !important;
 }
 
#meganav li.nav-cat654 > a,#meganav li.nav-cat1343 > a {border-left:1px solid #fff;border-right:1px solid #fff;}
#meganav li.nav-cat654 > a,#meganav li.nav-cat1343 > a  {color:#C24549}
#meganav li.nav-cat1272 > a {background: none repeat scroll 0 0 #d71257;}
#meganav li.nav-cat1346 > a {background: none repeat scroll 0 0 #8f1312;}



/*Lights out div */
#dim{position:absolute;top:0;left:0;z-index:9999;background:url('../images/dim.png');display:none;text-align:left;}

/* Menu image styling */
#meganav li.level2 a img {margin-bottom:15px}
.featured_pic01 {width: 170px; height: 90px; border: #FFF 0px solid; background: url("http://www.skintwo.co.uk/wp-content/themes/skintwo/images/featured01.jpg") no-repeat; position: relative; display: inline-block;}
.featured_pic02 {width: 170px; height: 90px; border: #FFF 0px solid; background: url("http://www.skintwo.co.uk/wp-content/themes/skintwo/images/featured02.jpg") no-repeat; position: relative; display: inline-block;}
.latest_pic {width: 80px; height: 120px; border: #FFF 0px solid; background: transparent; position: relative; display: inline-block; margin-top: 5px;}
.featured_title {margin-left: 0px;}
.featured_pic_div {margin-bottom: 20px;}

}


/* LEVEL 2 MENU */
@media screen and (max-width:399px) and (orientation: portrait), screen and (max-aspect-ratio: 13/9) and (max-width:399px){
body .sb-slidebar{background-color:#fff;border-right:1px solid black}
.menu-active > ul.level0, .nav-primary li.level0 li.sub-menu-active > ul{
    display: block;
}
#meganav br {display:none}
#meganav .level0.level-top.menu-active > div > div.level0,
#meganav .level0.level-top.menu-active > div,
#meganav .level0.menu-active li.level1.sub-menu-active div,
#meganav .level0.level-top.menu-active div div.extra-menu-custom,
#meganav .level0.level-top.menu-active div div.extra-menu-custom .sub-menu-active
{display:block}

#meganav{text-align:left;font-size:1.2em;text-transform:UPPERCASE;padding:0 10px}
#meganav .level0 .level1{font-size:0.95em;padding-left:0.2em}
#meganav {background-color:#fff}
#meganav a,#meganav{color:#000}
#meganav a{display:block}
#meganav .level0.level-top div{display:none}
#meganav li.has-children span{position:relative;display:inline-block;width:85%;line-height:1em;vertical-align:middle}
#meganav li.has-children span.at{ 
    display: inline-block;
    height: 100%;
    width: 15%;
	background:transparent url('../images/responsive/icon_menu_closed.png');
	background-repeat:no-repeat;
	background-size:60%;
	background-position:center;	
	/* position:absolute; */
	
/* 	width: 0; 
	height: 0; 
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-top: 7px solid #CCCCCC;
	font-size: 0;
	line-height: 0;
	position:absolute;
	right:0;
	top:50% */
}
/* #meganav li.has-children .extra-menu-custom span.at{height:inherit} */
#meganav li.level0.has-children span.at{/* right:8% */}
#meganav li.level1.has-children span.at{right:0}



#meganav li.level0.has-children.menu-active a.level-top > span.at{background:#eeeeee url('../images/responsive/icon_menu_open.png');background-repeat:no-repeat;background-size:32%;background-position:center;	}
#meganav li.has-children.menu-active .sub-menu-active a span.at,
#meganav li.has-children.menu-active div div.level0 div.extra-menu-custom ul.menu-group li.level1.parent a.sub-menu-active span.at
{background:#e4e4e4 url('../images/responsive/icon_menu_open.png');background-repeat:no-repeat;background-size:32%;	background-position:center;	}




#meganav li.level0.has-children div.level0  li.no-children{padding:0.3em 0}
#meganav li.level0 div div.level0 li.level1.no-children.artificial-title{display:none}
#meganav li a{position:relative}
#meganav .level0.level-top.menu-active > div > div.level0, 
#meganav .level0.level-top.menu-active > div, 
#meganav li.level0.menu-active li.level1.sub-menu-active div{
background-color:#EEEEEE;
}
#meganav .level0 .level0 ul.menu-group li.level1.sub-menu-active div,
#meganav li.has-children.menu-active div div.level0 div.extra-menu-custom ul.menu-group li.level1.parent div.sub-menu-active 
{background-color:#E4E4E4}

#meganav li a span.at{line-height:2em}
#meganav li.nav-2{border-bottom:1px solid #000;padding-bottom:10px}
#meganav li.nav-1{padding-top:10px}
#meganav li.home{display:none}

/* Like Menu */
#meganav li .level1.like-menu ul.first{display:block;}
#meganav li .level1.like-menu ul.first li.menu-title{color:#A28363!important;border:1px solid #A28363;border-left:none;border-right:none;border-top:none}
#meganav li .level1.like-menu ul{display:none;}

}

/**** LEVEL 3 MENU ****/
@media screen and (min-width:400px) and  (max-width:767px){
.nav-container{width:100%}
#meganav{font-size:0.7em;line-height:3em;height:3em}
#meganav li.parent:hover div.level0 a { height:auto }
#meganav li.level1.artificial-title a,
#meganav li.level1 .menu-title,
#meganav li.level1 a.level-top span,
.level1.parent.parent-title > a > span,
#meganav li.like-menu a,
#meganav li.level1 >span,
#meganav li.level1.no-children a
{ font-size:1em;}
#meganav li .extra-menu-custom .level1 a > span{font-size:1em;}
#meganav li.level2 a {font-size:0.9em}
#meganav div.level1{margin:2px 0;}
}

/* LEVEL 3 < 640px */
@media screen and (min-width:400px) and (max-width:640px){
#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent{width:82px;padding: 0 6px 0 6px}
#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent.middle{width:113px}
#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent.last{width:113px;padding-right:0}

ul#meganav li.level0.has-children.level-top div div.level0 div.extra-menu-custom ul.menu-group li.level1.parent div.level1 ul.menu-group{float:none}


#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent img {max-width:100%}
#meganav li.level1{ padding: 0 8px 0 16px;}
#meganav li.level1.parent{width:100px}

}
/* LEVEL 3 < 480px */
@media screen and (min-width:400px) and  (max-width:480px){
#meganav{font-size:0.5em;line-height:3em;height:3em}
#meganav li .extra-menu-custom .level1 a > span,#meganav li ul a span{font-size:1em;line-height:2em}
#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent{width:66px;padding: 0 6px 0 6px}
#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent.last{width:90px;padding-right:0}
#meganav li.level1.parent{width:78px}
#meganav li.like-menu a{line-height:2em}
#meganav li.like-menu li.menu-title{margin:0}
#meganav li.level1.artificial-title{margin-bottom:5px}
#meganav li.level2 a {font-size:1em}
}
/* LEVEL 4 MENU - TABLET*/
@media screen and (min-width:768px) and  (max-width:989px){
#meganav li.level1.artificial-title a,
#meganav li.level1 .menu-title,
#meganav li.level1 a.level-top span,
.level1.parent.parent-title > a > span,
#meganav li.like-menu a,
#meganav li.level1 >span,
#meganav li.level1.no-children a
{ font-size:1.1em;}
#meganav li .extra-menu-custom .level1 a > span{font-size:1.1em;}
#meganav li.level2 a {font-size:1em}
#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent{width:126px;padding: 0 6px 0 6px}
#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent.last{width:140px;padding-right:0}

ul#meganav li.level0.has-children.level-top div div.level0 div.extra-menu-custom ul.menu-group li.level1.parent div.level1 ul.menu-group{float:none}


#meganav li.level0.has-children .extra-menu-custom ul.menu-group li.level1.parent img {max-width:100%}
#meganav li.level1{ padding: 0 20px 0 16px;}
#meganav li.level1.parent{width:142px}
}

@media screen and (min-width:990px) {
    #meganav { width:990px}
.nav-container {
  border-bottom: 1px solid #000;
  margin: 0 auto 10px;
  padding-bottom: 10px;
  width: 990px;
}
}