/**
 * Owner: www.asos.com
 * Theme: layout.css
 * Description: Sets general layout and defaults for of the main site
 * Author: ASOS UI developers
 * Media: Screen
 */

/* Reset */
html {color:#000; background:#fff;}body,div,dl,dt,dd,ul,ol,li,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0; padding:0;}table{border-collapse:collapse; border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal; font-weight:normal;}li{list-style:none;}caption,th{text-align:left;}h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym{border:0;font-variant:normal;}sup{vertical-align:text-top;}sub{vertical-align:text-bottom;}input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}input,textarea,select{*font-size:100%;}legend{color:#000;}del,ins{text-decoration:none;}

/* Remove Firefox dotted outline on anchor and button elements */
a, :focus {outline:none;}
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
select::-moz-focus-inner {border:none;}

/* Elements */
html, iframe {background:#fff;}
body
{
    color: #333;
    font-family: Arial, Tahoma, sans-serif;
    font-size: 60%;
}
img {border:0;}
h2, h3, h4, h5, h6 {font-weight:bold;}
h2 {font-size:1.2em; margin:1em 0;}
h3 {margin:1em 0;}
cite {font-style:normal; font-weight:bold;}
strong {font-weight:bold;}
em {font-style:italic;}
ol li {list-style:decimal outside;}
p {margin:0 0 0;}

html {
	min-height: 100%;
	_height:100%;
}
body {
	margin: 0;
	padding: 0;
	min-height: 100%;
	_height:100%;
}


/* Common  */
div.clear {clear:both;}
div.clear-left {clear:left;}
div.clear-right {clear:right;}
span.attention, p.attention, strong.attention {color:#f00;}

div.content-panel .top-link {text-align:right; margin:0 0 20px;}
div.content-panel .top-link a {color:#aaa;}
div.content-panel .top-link a:hover {color:#666;}

span.new-feature {color:#f00; font-family:Tahoma; font-size:0.9em; font-weight:bold; text-transform:uppercase;}

/* Skeleton */        
div.site-wrapper {margin:0 auto; width:974px;}
div.site-content {font-size:1em; position:absolute; top:127px; width:974px; background-color:#fff;}
div.site-content a {color:#666; font-weight:normal; text-decoration:none;}
div.site-content a:hover {text-decoration:underline;}
div.site-body {position:absolute;}

/* Layout variations */
div.content-panel {overflow:hidden; padding:5px 0; color:#666;}
div.content-panel.indent {margin:0 66px 0 124px;}
div.content-panel.gutter {padding-bottom:50px;}
div.padded-content-panel {padding:17px;}
div.creative-panel {padding:0; position:relative;}

/* For image replacement */
.replace {display:block; position:relative; margin:0; padding:0; /* hide overflow:hidden from IE5/Mac */ /* \*/ overflow:hidden; /* */}
.replace span {display:block; position:absolute; top:0; left:0; z-index:1; /*for Opera 5 and 6*/}

/* Global lightbox styles */
div.lightbox {left:0; position:absolute; top:0; z-index:9999;}
div.lightbox .popup {position:relative;}
div.lightbox .content {background:#fff;}
#lightBoxOverlay {background-color:#000; height:100%; left:0px; position:fixed; top:0px; width:100%; z-index:9998;}

/* Information messages */
div.alert {background:#fff7f7 url(../Themes/ecomm5/images/core/alert.gif) no-repeat right -20px; border:1px solid #fcc; color:#c33; margin:0 0 2em; padding:5px;}
div.alert a {color:#c33;}
div.alert a:hover {color:#933;}

/*Rounded corners*/
.bottom {bottom:-1px;}.corner {background:url(../Themes/ecomm5/images/core/corner.gif);} /*IE6 specific styles*/	
.corner {position:absolute; height:14px; width:14px; z-index:100;}
.site-content > .corner {background:url(../Themes/ecomm5/images/core/corner.png);}
.site-content > .bottom {bottom:0;}
.top {top:-28px;}
.right {right:0px;padding-right:5px;}
.left {left:0;padding-left:5px;}
.top.left, div.tl {background-position:left top;}
.top.right, div.tr {background-position:right top;}
.bottom.left, div.bl {background-position:left bottom;}
.bottom.right, div.br {background-position:right bottom;}

/* Site navigation */
div.site-nav {font-size:1.1em; height:38px; left:0; position:absolute; top:80px; width:930px; z-index:98;}
div.site-nav ul {list-style-type:none;}
div.site-nav li {list-style-type:none;}
div.site-nav a {text-decoration:none;}

/* Navigation tooltips */
div.marketplace-tooltip,
div.fashionfinder-tooltip {background:#fff; border:1px solid #919191; color:#333; font-family:Tahoma; font-size:1.15em; height:26px; line-height:1.2em; padding:6px 10px 7px 8px; position:absolute; outline:none; text-align:left; top:30px; white-space:nowrap; z-index:99;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
}
div.marketplace-tooltip span,
div.fashionfinder-tooltip span {background:url(../Themes/ecomm5/images/core/tooltip-arrow.png) no-repeat 0 100%; display:block; height:7px; position:absolute; top:38px; width:8px;}
div.marketplace-tooltip {left:177px; width:177px;}
div.fashionfinder-tooltip {left:360px; width:145px;}
div.marketplace-tooltip span {right:120px;}
div.fashionfinder-tooltip span {right:110px;}

/* Side (left) navigation */
div#side-nav {color:#000; float:left; font-family:Georgia; font-size:1.15em; padding:10px 0 0; position:relative; width:180px;}
div#side-nav h1 {border-bottom:1px solid #000; font-family:Tahoma; font-size:1em; font-weight:bold; line-height:1em; margin:0 0 10px; padding:0 0 10px; text-transform:uppercase;}
div#side-nav p.precis {font-family:Tahoma; line-height:1.2em; margin:0 0 10px;}
div#side-nav p.precis a {color:#000; text-decoration:none;}
div#side-nav p.precis a:hover {color:#003366;}
div#side-nav p.cat-title {border-top:1px solid #000; font-weight:bold; padding:10px 0 0; margin:0 0 10px;}
div#side-nav ul {padding-bottom:15px;}
div#side-nav ul li {display:block; min-height:17px; position:relative; z-index:89;}
div#side-nav ul li a {color:#000; height:auto; line-height:1.8em;}
div#side-nav ul li a:hover {color:#003366; text-decoration:none;}
div#side-nav ul li a.red {color:#b0171f;}
div#side-nav ul li a.red:hover {color:#c48189;}

/* Menu links */
div.site-nav ul.floors li {float:left; top:0;}
div.site-nav ul.floors li a {color:#0c4080; display:block; height:31px; line-height:31px; font-size:1.5em; padding:0 18px; position:relative; text-align:left; z-index:1;}
* html div.site-nav ul.floors li a{display:inline-block;}
div.site-nav ul.floors li a.last {background:none;}
div.site-nav ul.floors li a.selected span {border-bottom:1px solid #004380;}

div.site-nav ul.floors li a:hover,
div.site-nav ul.floors li a.active {background:url(../Themes/ecomm5/images/nav/nav-bg.png) repeat-x 0 0; color:#fff; left:-1px; position:relative; z-index:91;}

div.site-nav ul.floors li a:hover span,
div.site-nav ul.floors li a span:hover,
div.site-nav ul.floors li a.active span,
div.site-nav ul.floors li a.selected:hover span {}

div.site-nav ul.floors li.home a {background:none; padding:0; height:31px; width:28px;}
div.site-nav ul.floors li.home a span {background:url(../Themes/ecomm5/images/nav/nav-bg.png) no-repeat 0 -115px; height:31px; width:28px;}
div.site-nav ul.floors li.home a.selected span {background-position:0 -31px;}
div.site-nav ul.floors li.home a:hover,
div.site-nav ul.floors li.home a.active {cursor:pointer; left:0;}
div.site-nav ul.floors li.home a:hover span {background-position:0 -93px;}

div.site-nav ul.floors li.Hotline 
{
	padding:0; 
	height:31px; 
	float:right;
	display: block;
	width: 126px;
	height: 37px;
	background: url(../Themes/ecomm5/images/phone_18.png) no-repeat 0 0;
	font-size: 16px;
	color: #C31919;
}
div.site-nav ul.floors li.Hotline span {background:none; height:31px; float:right; text-align:right;display: block; line-height:31px;margin: 0 0 0 0;}

div.site-nav ul.floors li:hover div.sub-floor-menus dl dd ul.items {margin:0 0 0 1px; width:144px;}

/* Sub menus */
div.site-nav .menu ul li div.sub-floor-menus {border:3px solid #ebebeb;position:absolute; top:30px; left:-9999px; padding:0; margin:0 0 0 -1px; overflow:hidden;z-index:101;*z-index:101;}

/* iPad fix - hide the menu first */
div.sub-floor-menus {display:none;}
div.site-nav .css-menu ul :hover div.sub-floor-menus {position:absolute; left:auto; padding:0; display:inline;}
div.site-nav .menu ul :hover div.sub-floor-menus {position:absolute; left:auto; padding:0; display:inline;} /*This is needed for the ipad hover of the main navigation as the class 'css-menu' gets removed when the JS renders the navigation*/
div.site-nav .menu div.sub-menu-wrapper-top {}
div.site-nav .menu div.sub-menu-wrapper {overflow:hidden; background:#fff;}

/* IE7 only hack */
*:first-child+html div.site-nav .menu ul :hover div.sub-floor-menus {display:none;} 

/* IE6 and below version of the navigation */
div.site-nav div.sub-floor-menus {background:#fff; border-right:1px solid #999; border-bottom:1px solid #999;}

/* Reset IE6 version */
div.site-nav li > div.sub-floor-menus {background:none; border:none;}
div.site-nav li > div.sub-floor-menus {border-right:1px solid transparent;} /*Only IE7 needs this line*/

/* Version for all other browsers */
div.site-nav li > div.sub-floor-menus div.sub-menu-wrapper-right {}
div.site-nav li > div.sub-floor-menus div.sub-menu-wrapper-bottom {}

/* Exceptional case for first menu item */
div.sub-floor-menus div.menu:first-child {margin-left:0;}
div.sub-floor-menus div.menu:first-child div.sub-menu-wrapper-left {background:none; margin:0;}
div.sub-floor-menus div.menu:first-child div.sub-menu-wrapper-right {padding:0 14px 0 0;}
div.sub-floor-menus div.menu:first-child div.sub-menu-wrapper {padding:0 0 0 10px;}

/* Menu Section */
div.sub-floor-menus dl {border-left:1px solid #999; float:left; display:inline;}
div.sub-floor-menus dl:first-child {border:none;} /* IE6 can't see this */
div.sub-floor-menus dl dt {font-family:Tahoma,Georgia; border-bottom:1px solid #cacaca; font-size:1.05em; font-weight:bold; line-height:2em; width:auto; padding-left:10px; padding-right:0; color:#202020; letter-spacing:0.5px;} 
div.sub-floor-menus dl ul.items {width:145px; display:inline; float:left; padding:6px 8px 10px 8px;}
div.sub-floor-menus dl ul.items li {display:block; float:none; min-height:20px; line-height:2em; list-style-position:outside;}

/* Featured Section */
div.sub-floor-menus dl.featured dt {border:none;}
div.sub-floor-menus dl.featured ul.items {padding:0;}
div.sub-floor-menus dl.featured ul.items li {border-top:1px solid #cacaca; padding:6px;}	

/* Sub Menu Links */
div.site-nav ul.floors li div.sub-floor-menus a {color:#666; background:none; border:none; display:block; font-family:Tahoma; font-size:1em; font-weight:normal; height:2em; width:145px; line-height:2em; padding:0; text-transform:none; white-space:nowrap;}
div.site-nav ul.floors li div.sub-floor-menus a:hover {background:#073566; color:#fff; margin:0 0 0 -1px; padding:0 1px; text-decoration:none;}
div.site-nav ul.floors li div.sub-floor-menus a span {display:none;}

div.site-nav div.sub-floor-menus dl ul.items li a.sale {color:#b0171f;}
div.site-nav div.sub-floor-menus dl ul.items li a.sale:hover {background:#b0171f; color:#fff;}
div.site-nav div.sub-floor-menus dl ul.items li a.clearance {color:#36f;}
div.site-nav div.sub-floor-menus dl ul.items li a.clearance:hover {background:#36f; color:#fff;}
div.site-nav div.sub-floor-menus dl ul.items li a.new {color:#d6b500;}
div.site-nav div.sub-floor-menus dl ul.items li a.new:hover {background:#d6b500; color:#fff;}
div.site-nav div.sub-floor-menus dl ul.items li a.branddirectory {color:#000; font-weight:bold;}
div.site-nav div.sub-floor-menus dl ul.items li a.branddirectory:hover {background:#000; color:#fff;}
div.site-nav div.sub-floor-menus dl ul.items li a.red {color:#b0171f;}
div.site-nav div.sub-floor-menus dl ul.items li a.red:hover {background:#b0171f; color:#fff;}
div.site-nav div.sub-floor-menus dl ul.items li a.blue {color:#36f;}
div.site-nav div.sub-floor-menus dl ul.items li a.blue:hover {background:#36f; color:#fff;}
div.site-nav div.sub-floor-menus dl ul.items li a.black {color:#000;}
div.site-nav div.sub-floor-menus dl ul.items li a.black:hover {background:#000; color:#fff;}
div.site-nav div.sub-floor-menus dl ul.items li a.pink {color:#c48189;}
div.site-nav div.sub-floor-menus dl ul.items li a.pink:hover {background:#c48189; color:#fff;}
div.site-nav div.sub-floor-menus dl ul.items li a.yellow {color:#fdd017;}
div.site-nav div.sub-floor-menus dl ul.items li a.yellow:hover {background:#fdd017; color:#fff;}

/* Social link sharing - Creative pgehtml */
div.creative-panel div#socialSharing {display:none;}
div.creative-panel div#socialSharing div.facebook-buttons .fb_iframe_widget span iframe {background-color:transparent;}

/* Apply 'display:none' to an element */
.hide {display:none;}

/* Apply 'display:none' to a mvt testing element */
.mvt-hide {display:none;}

/*Online category page*/
div.top_snell .section {
    font-size: 90%;
}
/* Menu links */
div.top_snell ul.floors li {float:left; top:0;}
div.top_snell ul.floors li a {display:block; position:relative; text-align:left; z-index:1;}
* html div.top_snell ul.floors li a{display:inline-block;}
div.top_snell ul.floors li a.last {background:none;}
div.top_snell ul.floors li a.selected span {border-bottom:1px solid #004380;}

div.top_snell ul.floors li a:hover,
div.top_snell ul.floors li a.active {color:#fff;position:relative; z-index:91;}

div.top_snell ul.floors li a:hover span,
div.top_snell ul.floors li a span:hover,
div.top_snell ul.floors li a.active span,
div.top_snell ul.floors li a.selected:hover span {}

div.top_snell ul.floors li.home a {background:none; padding:0; height:31px; width:28px;}
div.top_snell ul.floors li.home a span {background:url(../Themes/ecomm5/images/nav/nav-bg.png) no-repeat 0 -115px; height:31px; width:28px;}
div.top_snell ul.floors li.home a.selected span {background-position:0 -31px;}
div.top_snell ul.floors li.home a:hover,
div.top_snell ul.floors li.home a.active {cursor:pointer; left:0;}
div.top_snell ul.floors li.home a:hover span {background-position:0 -93px;}

div.top_snell ul.floors li.Hotline 
{
	padding:0; 
	height:31px; 
	float:right;
	display: block;
	width: 126px;
	height: 37px;
	background: url(../Themes/ecomm5/images/phone_18.png) no-repeat 0 0;
	font-size: 16px;
	color: #C31919;
}
div.top_snell ul.floors li.Hotline span {background:none; height:31px; float:right; text-align:right;display: block; line-height:31px;margin: 0 0 0 0;}

div.top_snell ul.floors li:hover div.sub-floor-menus dl dd ul.items {margin:0 0 0 1px; width:144px;}

/* Sub menus */
div.top_snell .menu ul li div.sub-floor-menus {border:3px solid #ebebeb;position:absolute; top:24px; left:-9999px; padding:0; margin:0 0 0 -1px; overflow:hidden;z-index:101;*z-index:101;}

/* iPad fix - hide the menu first */
div.top_snell .css-menu ul :hover div.sub-floor-menus {position:absolute; left:auto; padding:0; display:inline;}
div.top_snell .menu ul :hover div.sub-floor-menus {position:absolute; left:auto; padding:0; display:inline;} /*This is needed for the ipad hover of the main navigation as the class 'css-menu' gets removed when the JS renders the navigation*/
div.top_snell .menu div.sub-menu-wrapper-top {}
div.top_snell .menu div.sub-menu-wrapper {overflow:hidden; background:#fff;}

/* IE7 only hack */
*:first-child+html div.top_snell .menu ul :hover div.sub-floor-menus {display:none;} 

/* IE6 and below version of the navigation */
div.top_snell div.sub-floor-menus {background:#fff; border-right:1px solid #999; border-bottom:1px solid #999;}

/* Reset IE6 version */
div.top_snell li > div.sub-floor-menus {background:none; border:none;}
div.top_snell li > div.sub-floor-menus {border-right:1px solid transparent;} /*Only IE7 needs this line*/

/* Version for all other browsers */
div.top_snell li > div.sub-floor-menus div.sub-menu-wrapper-right {}
div.top_snell li > div.sub-floor-menus div.sub-menu-wrapper-bottom {}

/* Sub Menu Links */
div.top_snell ul.floors li div.sub-floor-menus a {color:#666; background:none; border:none; display:block; font-family:Tahoma; font-size:1em; font-weight:normal; height:2em; width:145px; line-height:2em; padding:0; text-transform:none; white-space:nowrap;}
div.top_snell ul.floors li div.sub-floor-menus a:hover {background:#073566; color:#fff; margin:0 0 0 -1px; padding:0 1px; text-decoration:none;}
div.top_snell ul.floors li div.sub-floor-menus a span {display:none;}

div.top_snell div.sub-floor-menus dl ul.items li a.sale {color:#b0171f;}
div.top_snell div.sub-floor-menus dl ul.items li a.sale:hover {background:#b0171f; color:#fff;}
div.top_snell div.sub-floor-menus dl ul.items li a.clearance {color:#36f;}
div.top_snell div.sub-floor-menus dl ul.items li a.clearance:hover {background:#36f; color:#fff;}
div.top_snell div.sub-floor-menus dl ul.items li a.new {color:#d6b500;}
div.top_snell div.sub-floor-menus dl ul.items li a.new:hover {background:#d6b500; color:#fff;}
div.top_snell div.sub-floor-menus dl ul.items li a.branddirectory {color:#000; font-weight:bold;}
div.top_snell div.sub-floor-menus dl ul.items li a.branddirectory:hover {background:#000; color:#fff;}
div.top_snell div.sub-floor-menus dl ul.items li a.red {color:#b0171f;}
div.top_snell div.sub-floor-menus dl ul.items li a.red:hover {background:#b0171f; color:#fff;}
div.top_snell div.sub-floor-menus dl ul.items li a.blue {color:#36f;}
div.top_snell div.sub-floor-menus dl ul.items li a.blue:hover {background:#36f; color:#fff;}
div.top_snell div.sub-floor-menus dl ul.items li a.black {color:#000;}
div.top_snell div.sub-floor-menus dl ul.items li a.black:hover {background:#000; color:#fff;}
div.top_snell div.sub-floor-menus dl ul.items li a.pink {color:#c48189;}
div.top_snell div.sub-floor-menus dl ul.items li a.pink:hover {background:#c48189; color:#fff;}
div.top_snell div.sub-floor-menus dl ul.items li a.yellow {color:#fdd017;}
div.top_snell div.sub-floor-menus dl ul.items li a.yellow:hover {background:#fdd017; color:#fff;}