/* ------------------------------------------------------------- Metro Shoes, Common Style Sheet (for all browsers) - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - .autor www.bcwebwise.com .version 1.0 .url www.metroshoes.net ------------------------------------------------------------- */ /* ------------------------------------------------------------- Metro Shoes, Table of Contents - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - 1. Import CSS 2. wrapper 1. Main Content & container 3. General Properties 1. Footer 2. Navigation 3. Content Div 4. Quick Sitemap & Newsletter 5. Breadcrumbs */ /* ------------------------------------------------------------- 1. IMPORT RESET CSS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ @import url(reset.css); /*body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0; padding:0;}*/ body{background:#000; font-family:Verdana, Arial, Helvetica, sans-serif;} img{border:0;} /*h1,h2,h3,h4,h5,h6 {font-weight:normal;}*/ q:before,q:after {content:'';} h3 {font-size:12px; text-transform:uppercase;color:#000000; font-weight:bold; } h4 { color: #660000; font-size: 16px; margin: 20px 0 20px 0; display: inline; } h5 { font-size: 12px;} .mail { color: #CF0E15; text-decoration: underline; } /* ------------------------------------------------------------- 2. WRAPPER - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #wrapper{margin:0 auto; width:964px; position:relative;} #wrapper #mainContent{float:left; width:936px; background:#cccccc url(../Graphics/contentbotbg.gif) bottom no-repeat;} /* Container ------------------ */ #wrapper #mainContent #container{width:936px; float:left; padding-bottom:14px;} /* ------------------------------------------------------------- 3.1. FOOTER - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #footer{ float:left; height:44px; color:#fff; padding-top:16px; font-size:10px; clear:left; } #footer .fLink{ float:left; padding-left:11px;} #footer .fLink .footerlink {color:#ffffff; text-decoration:underline;} #footer .fLink .footerlink a{color:#ffffff; text-decoration:underline;} #footer .fLink .footerlink a:hover{text-decoration:none;} #footer .bcwebwise{float:right; padding-top:14px; } #footer .bcwebwise img{float:right; } /* Logo Section ------------------ */ .logo{float:left; width:188px; height:96px;} /* Global Navigation ------------------ */ .globalLink{font-size:11px; text-transform:uppercase; font-weight:bold; text-align:right; } .globalLink a {color:#FFFFFF; padding:0 8px; line-height:32px; background:#000; display:inline;} .globalLink a:hover{color:#FFFFFF;background:#9b0a0f;line-height:32px; padding:8px; text-decoration:none;} .globalLink a.active{color:#FFFFFF;background:#9b0a0f;line-height:32px; padding:8px; text-decoration:none;} /* Login Div ------------------ */ .loginBox{font-size:11px; text-align:right; padding:0px 5px 10px 0px; color:#FFF;} .loginBox a{color:#fff; font-weight:bold; padding:0 2px;} /* Shop Function Navigation ------------------ */ .shopNav{float:left; width:550px;text-align:right; color:#ff3333; font-size:11px;} .shopNav a {color:#cccccc;font-size:11px;padding:0 4px; } .shopNav a:hover {color:#fff;} .input{border:0px; width:154px;font-size:11px; color:#666666; } .input input{border:0px; width:135px; font-size:11px; color:#666666; padding:5px 0 5px 8px;} .logSpacer{padding:3px;} /* ------------------------------------------------------------- 3.3. MAIN NAVIGATION - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #nav {position:relative;z-index:500; width:944px; float:left; height:30px; background:#e4141c; text-align:center;padding:0 15px 0 5px; border:0px;} #nav .select {margin:0; padding:0; list-style:none; white-space:nowrap;} #nav li {float:left; padding-right:15px; background:url(../Graphics/Images/Menu/main-bt-bg.gif) right no-repeat;} #nav .select a {float:left;text-decoration:none; white-space:nowrap;height: 30px;display:block;overflow: hidden;} #nav .select li:hover a {cursor:pointer; color:#fff;} #nav .sub {display:none; margin:0; padding:0 0 0 32px;list-style:none; background:#cf0e15;} #nav .sub li {background:transparent; padding: 0 15px; background:url(../Graphics/subbg.gif) right no-repeat;} #nav .select li:hover .sub {height:30px; display:block; position:absolute; float:left; top:30px; left:0; text-align:center;} #nav .select li:hover .sub li a {display:block;height:22px; line-height:16px; float:left; margin:0; white-space:nowrap;border:0px; color:#f3c2c3;font-size:11px; font-weight:bold; padding-top:8px} #nav .select li:hover .sub li a:hover {color:#fff; line-height:16px;} #nav .sub li.last{background:none;} #nav .subMen {padding:0 0 0 32px; width:932px;} #nav .subWomen {padding:0 0 0 155px; width:809px;} #nav .subKids {padding:0 0 0 288px; width:676px;} #nav .subAccessories {padding:0 0 0 266px; width:688px;} #nav .subfoot {padding:0 0 0 555px; width:409px;} #nav .select a.mens {width:96px; background: transparent url('../Graphics/Images/Menu/bt-mens.gif') no-repeat top left;} #nav .select a.womens {width:127px; background: transparent url('../Graphics/Images/Menu/bt-womens.gif') no-repeat top left;} #nav .select a.kids {width:85px; background: transparent url('../Graphics/Images/Menu/bt-kids.gif') no-repeat top left;} #nav .select a.accessories {width:145px; background: transparent url('../Graphics/Images/Menu/bt-accessories.gif') no-repeat top left;} #nav .select a.footcare {width:108px; background: transparent url('../Graphics/Images/Menu/bt-brands.gif') no-repeat top left;} #nav .select a.shopping {width:150px; background: transparent url('../Graphics/Images/Menu/bt-dialshop.gif') no-repeat top left;} #nav .select a.club {width:119px; background: transparent url('../Graphics/Images/Menu/bt-club-metro.gif') no-repeat top left;} #nav .select a.e-shopping {width:146px; background: transparent url('../Graphics/Images/Menu/bt-eshopping.gif') no-repeat top left;} #nav .select li:hover a {background-position: bottom right;} #nav .select .mActive a {background-position: bottom right;} #nav li.last {background:none;} #nav li a b{display: none;} /* Dropdown CSS ------------------ */ #nav .dropdown {display:none; width:125px; margin:0 0 0 430px;list-style:none; background:#860b10; text-align:center;} #nav .dropdown li {padding:0 0 0 15px; width:125px; background:none;border-bottom:#aa0c12 1px solid;text-align:center;} #nav .sub li:hover .dropdown {display:inline; position:absolute; float:left; top:30px; left:0; text-align:center; width:140px;} #nav .sub li:hover .dropdown a {line-height:16px; margin:0; display:inline; white-space:nowrap; color:#f3c2c3;font-size:11px; border:none;} #nav .sub li:hover .dropdown a:hover {color:#fff; line-height:16px;} #nav .dropdown li.last{border-bottom:none;} /* ------------------------------------------------------------- 3.5. QUICK SITEMAP & NEWSLETTER - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #qSitemap{background:#fff; } /* Newsletter ------------------ */ #qSitemap .newsletter{width:278px; font-size:11px; padding:0 0 0 15px} #qSitemap .newsSearch {background:#990000 url(../Graphics/newsbg.gif) no-repeat; width:256px; height:27px;} #qSitemap .newsSearch .input{border:0px; width:160px; font-size:11px; color:#ffdbc9; background:#990000; padding-left:6px;} #qSitemap .spacer1{padding:5px;} /* Footer Main Link ------------------ */ #qSitemap .set01{float:left; border-left:#6b6b6b 1px solid; padding:0 28px 0 16px; font-size:11px; color:#000; width:145px; line-height:24px;} #qSitemap .set01 a{padding-left:16px;background:url(../Graphics/Icons/sitemap-arrow.gif) left no-repeat;color:#000; text-decoration:underline;} #qSitemap .set01 a:hover{ text-decoration:none;} /* ------------------------------------------------------------- 3.6. BREADCRUMBS - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ #wrapper .breadcrumbs{ width:874px; float:left; background:#cf0e15; color:#f3c2c3; font: bold 11px Arial, Helvetica, sans-serif; } #wrapper .breadcrumbs a {color:#f3c2c3; font-weight:bold; text-decoration:underline;} #wrapper .breadcrumbs a:hover {color:#fff; text-decoration:none;} #wrapper .breadcrumbs span{padding:0 5px; font-size:11px;} form h2 { font: bold 12px Verdana, Arial, Helvetica, sans-serif; background:#D00E16; color: #FFFFFF; padding: 9px 20px; } a.viewDetails, a.viewDetails:visited { font-weight:bold; color:#d31c22; text-decoration:underline; } a.viewDetails:hover { font-weight:bold; color:#000; text-decoration:none; }