/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 98%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
body{font-family: Arial, Helvetica, sans-serif; font-size: 1em; color: #FFF; background-color: #000;}
hr{border: 0px; padding: 0px; margin:0px; height:1px}
a{text-decoration: none; color: #FFF;}
a:hover{text-decoration: underline;}
label{float: left; width: 150px; text-align: right; margin: 5px 5px 0 0 ;}
label span{color: #777; font-size: 12px; padding: 5px; float: right;}
label.long{width: 250px; margin-bottom: 5px;}
label.error{color:#FF0000; float:left; margin:0 0 20px 20px !important; width:90%;}
textarea, select, input{padding: 5px; color: #333; font-size: 14px; margin: 0px 0px 20px 0px;}
fieldset{width: 380px; float: left;}
button{border: 0;}
#content{margin: 0px auto; width: 900px;}
#header{float: left; width: 100%; height: 158px; background: #222 url('../images/header-bg.gif') repeat-x;}
#logo{position: relative; left: 72px; top: 74px; width: 165px; height: 165px; float: left; z-index: 50;}
#logo a{display: block; width: 165px; height: 165px; float: left; background: transparent url('../images/goretex-logo-trans.png') no-repeat;}
#logo h1{display: block; text-indent: -9000px; }
#donations{width: 265px; height: 55px; position: relative; float: right; margin: 43px 10px 0 0;}
#donations h2{float: left; background: transparent url('../images/donate-head-trans.png') no-repeat;
height: 20px; width: 220px; text-indent: -9000px;}
#donations h4{float: right; margin-top: 3px; font-weight: normal;}
#donation-bar{height:10px; width: 265px; float: left;}
#dbar-left{float: left; background: transparent url('../images/dbar-left-trans.png') no-repeat; width: 10px; height: 10px;}
#dbar-right{float: left; background: transparent url('../images/dbar-right-trans.png') no-repeat; width: 10px; height: 10px;}
#dbar{float: left; background: transparent url('../images/dbar-bg-blk.png') repeat-x; width: 245px;}
span#dbar-active{float: left; background: transparent url('../images/dbar-bg.png') repeat-x;}
#nav{float: right; height: 40px; width: 540px; position: relative; margin-top: 20px;}
#nav ul{float: left; width: 540px; height: 40px; position: absolute;}
#nav ul li{display: inline; float: left; text-indent: -9000px; position: relative;}
#nav ul li a{display: block; height: 40px; background-image: url('/images/navigation-trans.png'); }
#nav-home a{background-position: 0px 0px; width: 61px;}
#nav-home a:hover{background-position: -0px -40px;}
#nav-shop a{background-position: -61px 0px; width:63px;}
#nav-shop.over, #nav-shop a:hover{background-position: -61px -40px;}
#nav-donate a{background-position: -124px 0px; width:171px;}
#nav-donate a:hover{background-position: -124px -40px;}
#nav-enter a{background-position: -295px 0px; width:110px;}
#nav-enter a:hover{background-position: -295px -40px;}
#nav-promo a{background-position: -405px 0px; width:130px;}
#nav-promo a:hover{background-position: -405px -40px;}
#nav li.over ul, #nav li:hover ul, #nav-shop a:hover ul{display: block; z-index: 5000;}
ul.subnav{display: none; width: 100px !important; float: left; opacity: 0.8;}
ul.subnav li{display: block; list-style-image: url('../images/arrow.gif');}
ul.subnav li a{display: block; width: 100px !important; background-color: #333; height: 20px !important;
background-image: none !important; font-size: 12px; text-indent: 10px; padding-top: 10px;}
#abstract{float: left; width: 100%; height: 235px; background-color: #3e3e3e; border-bottom: 1px solid #909090; overflow: hidden;}
#overlay{color: #111; float:right; margin:100px 30px 0 0; width:315px; z-index: 500; position: relative;
letter-spacing:0.08em; line-height:20px; font-size:18px; font-weight:bold;}
#controls{float:right; height:0; position:relative; right:0; text-indent:-9000px; top:-25px; width:70px; z-index:50;}
#prev{float: left; width: 19px; height: 21px; background: transparent url('../images/prev-trans.png') no-repeat;}
#pause{float: left; width: 14px; height: 21px; background: transparent url('../images/pause-trans.png') no-repeat; }
#play{float: left; width: 14px; height: 21px; background: transparent url('../images/play-trans.png') no-repeat; }
#next{float: left; width: 19px; height: 21px; background: transparent url('../images/next-trans.png') no-repeat; }
#category-head{float: left; width: 100%; height: 155px; background-color: #3e3e3e; border-bottom: 1px solid #4799df; position: relative;}
#cat-overlay{float: left; bottom: 0px; height: 18px; padding: 10px; opacity: 0.9; width: 880px; position: absolute;}
.tealy{background-color: #3cd9e1;}
.rusty{background-color: #dd5501;}
#cat-overlay h3{color: #FFF; font-size: 20px; font-weight: bold; text-transform: uppercase;}
#main{float: left; width: 860px; background-color: #FFF; padding: 20px; color: #444;}
#main p{color: #000; font-size: 11px; line-height: 1.2em; margin-bottom: 5px;}
#main a{color: #4799df;}
#main hr{width: 100%; background-color: #909090; float: left; }
#cat-content-top{float: left; width: 860px; background: #FFF url('../images/cat-content-top.jpg') no-repeat; height: 10px;}
#cat-content-bot{float: left; width: 860px; background: #FFF url('../images/cat-content-bot.jpg') no-repeat; height: 15px;}
#cat-content{float: left; background: #FFF url('../images/cat-content-bg.jpg') repeat-y; padding: 10px 30px 30px 40px; width: 800px;}
#main h2, #main h3, #cat-content h3{width: 100%; font-size: 23px !important; margin: 20px auto; float: left; color: #dd5501 !important;}
.iteration{float: left; width: 258px; height: 120px; padding-top: 20px; border-left: 0px; border-top: 0px; border-right: 1px solid #CCC; border-bottom: 1px solid #CCC;}
.last{border-right: 0px;}
.bot{border-bottom: 0px;}
.iteration img.thumb{float: left; width: 135px; height: 100px;}
.style-desc{float: left; width: 95px; padding-top: 10px;}
.style-desc h5{color: #cf7315; font-size: 14px; margin-bottom: 5px;}
.style-desc a{color: #000 !important;}
#style-left{float: left; width: 235px;}
#style-left img.thumb{width: 135px; height: 105px; float: left; margin-left: 30px; }
#style-left a.back-button{float: left; width: 146px; height: 33px; margin: 20px 40px;}
#style-right{float: left; width:600px; margin-left: 20px; }
#style-right h2{color: #cf7315; font-size: 20px; margin-bottom: 3px; font-weight: bold;}
#style-right h3{color: #909090; font-size: 16px; font-weight: bold; margin-bottom: 3px;}
#style-right h4{color: #909090; font-size: 14px; font-weight: normal; margin-bottom: 5px;}
h5#desc-tab{border-top: 1px solid #CCC; border-left: 1px solid #CCC; border-right: 1px solid #CCC; border-bottom: 0px;
padding: 15px 20px; font-size: 12px; font-weight: bold; color: #000; width: 75px; margin:-63px 0 0 -21px !important; background-color: #FFF !important; z-index: 3 !important;}
#style-desc{float: left; border: 1px solid #CCC; padding: 20px; z-index: -1; margin-top: 45px; background-color: #FFF;}
#style-desc h5{font-size: 12px; font-weight: bold; color: #000; padding-top: 20px; border-top: 1px #999 solid;}
#style-desc h5 span{font-weight: normal; color: #000;}
#style-desc p{color: #000; margin-top: 5px; font-size: 12px;}
.donate li{list-style: disc; margin-left: 20px; margin-bottom: 10px;}
.donate h3{width: 600px !important;}
.shop h3{margin-top: 0px !important;}
.shop p{font-size: 15px !important;}
h2.brand{float: left; margin-bottom: 5px; color: #999 !important; font-size: 28px;}
.promo h3{font-size: 24px; margin: 20px auto !important; float: left; color: #dd5501 !important;}
.promo #cat-content{padding-top: 10px !important;}
.promo h3 a{color: #dd5501 !important;}
.promo a:hover{text-decoration: none !important;}
ul#states{float: left; font-weight: bold; width: 750px; margin: 20px auto; border-bottom: 1px solid #909090; padding-bottom: 20px;}
ul#states li{display: inline; padding: 5px; float: left; font-size: 14px; border-left: 1px solid #000;}
ul#states li.first{border-left: 0px;}
.retailer{float: left; width: 780px; border: 1px solid #CCC; padding: 10px; margin-bottom: 20px;}
.retailer h4{margin-bottom: 5px;}
.retailer a{}
.spots{float: left; width: 520px;}
.spot{float: left; width: 240px; margin: 0 20px 10px 0;}
a.topper{float: right; width: 100%;}
#retailers{margin: 10px 0; width: 100%;}
#retailers li{padding: 5px;}
#retailers li a{color: #cf7315; font-size: 12px; line-height: 1.2em;}
#calls{float: left; width: 100%; text-align: center; background-color: #3e3e3e; padding-bottom: 5px;}
#slogan{width: 900px; float: left;}
#slogan h2{ height: 60px; width: 880px; margin: 10px; background: transparent url('../images/how-far-trans.png') no-repeat; text-indent: -9000px;}
#buttons{width: 900px; margin: 0px auto 10px auto; text-align: left;}
.button{float: left; width: 270px; height: 100px;
position: relative; margin: 0 0 10px 23px;}
.button p{font-size: 12px; line-height: 1.2em;}
.button:hover p{text-decoration: underline;}
#shop-but{background: transparent url('../images/call-shop.jpg') no-repeat;}
#shop-but #shoe{position: relative; width: 223px; height: 171px; left: -12px; top: -10px; overflow: hidden;}
#shop-but #gender{float: left; position: relative; width:55px; height: 45px; left: 200px; top: -120px;}
#gender ul{float: left; height: 45px;}
#gender ul li{display: inline; float: left; text-indent: -9000px;}
#gender ul li a{display: block; height: 40px; background-image: url('../images/people-trans.png');}
#gender ul li#men a{background-position: 0px 0px; width: 27px;}
#gender ul li#men a:hover{background-position: 0px -45px;}
#gender ul li#women a{background-position: -28px 0px; width: 28px;}
#gender ul li#women a:hover{background-position: -28px -45px;}
#donate-but{background: transparent url('../images/call-donate.jpg') no-repeat;}
#donate-but p{position: relative; left: 25px; top: 65px; width: 100px; color: #000;}
#donate a{color: #000 !important;}
#enter-but{background: transparent url('../images/call-enter.jpg') no-repeat;}
#enter-but p{position: relative; left: 45px; top: 55px; width: 135px; color: #FFF;}
#enter-but #child{position: relative; width: 110px; height: 135px; left: 165px; top: -25px;
background: transparent url('../images/call-enter-child-trans.png') no-repeat;}
#footer{float: left; width: 100%; margin: 0px auto; height: 85px; color: #aeaeae; text-align: center; padding-top: 10px;}
#footer ul{font-weight: bold; width: 500px; margin: 0 auto;}
#footer ul li{display: inline; padding: 5px; float: left; font-size: 12px;
border-left: 1px solid #FFF;}
#footer ul li.first{border-left: 0px;}
#footer a{color: #aeaeae; text-decoration: none;}
#footer a:hover{color: #FFF; text-decoration: underline;}
#footer p{float: left; width: 100%; font-size: 12px; font-weight: normal; margin-top: 10px; line-height: 1.3em; color: #333;}
.clearfix:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
.clearfix {
display: inline-block;
}
html[xmlns] .clearfix {
display: block;
}
* html .clearfix {
height: 1%;
}