/*** GENERAL STYLES ***/

body {background: #e9e9e9; text-align: center; margin: 0; padding: 0;}
body, th, td, h1, h2, h3, h4, h5, h6, select, input, textarea {font-family: arial, helvetica, sans-serif; font-size: 14px; color: #777;}
body, th, td, h1, h2, h3, h4, h5, h6 {line-height: 20px;}
form, h1, h2, h3, h4, h5, h6 {margin: 0; padding: 0;}

img, table, fieldset {border: 0;}
ul, ul li {list-style: none; margin: 0; padding: 0;}
p {margin: 0 0 1.5em 0;}
a {color: #14609c;}
a:hover {color: #df598f;}
.backlink {position: absolute; right: 15px; top: 5px; font-size: 11px;}

.hide {display: none;}
.alert {color: #c00;}
.small {font-size: 11px; line-height: 14px;}
.nowrap {white-space: nowrap;}

.floatleft {float: left;}
.floatright {float: right;}
.imgleft {float: left; margin: 0 15px 15px 0;}
.imgright {float: right; margin: 0 0 15px 15px;}
.textcenter {text-align: center;}
.textright {text-align: right;}

.spacer {float: none; clear: both; height: 1px; overflow: hidden;}
.hr {float: none; clear: both; height: 1px; overflow: hidden; background: #ccc; margin: 2em 0;}
.clear {float: none; clear: both;}

.half {width: 47%;}
.third {width: 33%;}
.twothird {width: 60%;}
.quarter {width: 25%;}
.threequarter {width: 70%;}

.ir {display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
a .ir {cursor: pointer;}


/*** STRUCTURAL STYLES ***/

#top {position: relative; width: 988px; height: 87px; background: url(../images/top.gif) left bottom no-repeat; margin: 0 auto; text-align: left;}
#printlogo {position: absolute; left: 0; top: 23px; display: none;}
#logo {position: absolute; width: 200px; height: 55px; left: 0; top: 23px; color: #777; line-height: 55px; font-size: 45px; font-weight: normal; text-align: center; text-decoration: none; overflow: hidden;}
#logo .ir {background: url(../images/logo.gif) no-repeat;}

#socialnav {position: absolute; right: 9px; bottom: 15px;}
#socialnav li {float: left; padding-left: 5px;}

#outer {position: relative; width: 988px; margin: 0 auto; text-align: left; background: #fff url(../images/outer.gif);}
#nav {margin: 0 9px 5px; background: #444; height: 35px; line-height: 35px;}
#nav li {position: relative; float: left; z-index: 10;}
#nav a {display: block; width: 10px; white-space: nowrap; color: #fff; text-decoration: none; padding: 0 14px; font-size: 17px;}
	html>body #nav a {width: auto;}
#nav li.on a {background: #777;}
#nav a:hover, #nav li:hover a, #nav li.roll a {background: #999;}

#nav li:hover ul, #nav li.roll ul {display: block;}
#nav ul {display: none; position: absolute; left: 0; top: 35px; z-index: 10; background: #999; height: auto; line-height: 30px;}
#nav ul li {float: none;}
#nav ul li a, #nav li.roll ul a {width: 175px; font-size: 14px; background: none;}
#nav ul li a:hover, #nav li.roll ul a:hover {background: #777;}

#main {position: relative; min-height: 208px; background: #fff url(../images/main.gif) left top repeat-x; margin: 0 9px; z-index: 1; zoom: 1;}
#main.catalog {background-position: 0 33px;}
#thephoto {float: left; width: 500px; height: 500px; border-right: 5px solid #fff;}
#content {float: right; width: 385px; min-height: 300px; padding: 40px;}
#content.wide {float: none; width: auto; padding: 40px;}
#main.catalog #content {float: right; width: 650px; padding: 0 50px 40px; background: #fff;}
#sidebar {float: left; width: 220px; font-size: 17px; line-height: 25px;}

#content h1 {font-size: 29px; font-weight: normal; line-height: 30px; margin-bottom: 20px;}
#content h2 {font-size: 19px; font-weight: normal; line-height: 20px; margin: .5em 0 10px;}
#content h3 {margin: 1.5em 0 10px;}
#content ul {margin: 0 0 1.5em 0;}
#content ul li {padding-left: 15px; margin-bottom: 5px; background: url(../images/bullet.gif) 4px 9px no-repeat;}

table {border-collapse: collapse; width: 100%; margin: 0 0 1.5em 0;}
td {border: solid #ddd; border-width: 1px 0; padding: 4px 10px;}
thead td {font-weight: bold;}

#content ul.newslist {border-bottom: 1px solid #ddd;}
#content ul.newslist li {border-top: 1px solid #ddd; clear: both; padding: 0; margin-bottom: 0; background: none;}
#content ul.newslist li div {padding: 4px 10px;}
#content ul.newslist .floatleft {width: 80px;}
#content ul.newslist .floatright {width: 265px;}
body.events #content ul.newslist .floatleft {width: 125px;}
body.events #content ul.newslist .floatright {width: 220px;}
#content.wide ul.newslist .floatright {width: 770px;}
body.events #content.wide ul.newslist .floatright {width: 725px;}

.storesgrid {float: left; width: 180px; padding: 30px 40px 0 0; margin: 0;}
#chooseform {position: absolute; right: 40px; top: 49px;}
#chooseform select {vertical-align: middle;}

#flash {position: relative; margin: -40px; width: 970px; height: 500px; overflow: hidden;}
#flashdiv {position: absolute; top: 0; white-space: nowrap;}
#flashdiv img {border-right: 5px solid #fff; z-index: 1;}
#arrowleft, #arrowright {position: absolute; left: 0; top: 225px; width: 25px; height: 50px; z-index: 10; cursor: pointer; cursor: hand;}
#arrowleft {background: url(../images/arrow-left.gif);}
#arrowright {left: 945px; background: url(../images/arrow-right.gif);}

#contactform div {padding-top: 4px; clear: both;}
#contactform label {position: relative; float: left; width: 80px; padding-right: 10px;}
#contactform label .req {position: absolute; right: 5px; top: 0; color: #d00; font-size: 30px; line-height: 30px;}
#contactform .text input, #contactform textarea {width: 250px;}
#contactform textarea {height: 100px;}
#contactform .button input {margin-left: 90px; border: 1px solid #ddd; background: #777; color: #fff; font-weight: bold;}

#content #catalognav {background: #eee; height: 30px; line-height: 30px; margin: 0 -50px 40px -47px;}
#content #catalognav li {float: left; font-size: 32px; color: #ddd; text-transform: uppercase; letter-spacing: -1px; padding: 0; background: 0; margin: 0;}
#content #catalognav li.floatright {float: right;}
#catalognav strong {font-weight: normal; padding: 0 5px;}
#catalognav li a {display: block; width: 10px; white-space: nowrap; font-size: 17px; color: #aaa; text-transform: lowercase; text-decoration: none; padding: 0 10px; letter-spacing: 0;}
	html>body #catalognav li a {width: auto;}
#catalognav li.on a {color: #444;}
#catalognav li a:hover {background: #aaa; color: #fff;}

body.catalog #content h1 {font-size: 22px;}
#seasonnote {float: right; position: absolute; right: 20px; top: 40px; font-size: 11px; font-weight: normal;}
.lifestylephoto {float: left; border-bottom: 2px solid #eee; margin: 0 8px 6px 0;}
.lifestylephoto div {border: 1px solid #ddd; padding: 5px;}
.lifestylephoto img {width: 300px; height: 300px;}
.cataloggrid {position: relative; float: left; border-bottom: 2px solid #eee; margin: 0 8px 6px 0;}
.cataloggrid a {display: block; width: 150px; height: 150px; border: 1px solid #ddd; text-decoration: none; text-align: center;}
.cataloggrid img {width: 150px; height: 150px;}

.unpopped {z-index: 1;}
.unpopped .popup {display: none;}
.popped {z-index: 10;}
.popped .popup {display: block;}

.popup {position: absolute; right: -70px; top: -123px; border: 1px solid #ddd; background: #eee url(../images/popup.gif) right bottom no-repeat; padding: 6px; text-align: center; cursor: pointer; cursor: hand; z-index: 10;}
.popup img {border: 1px solid #ddd; width: 300px; height: 300px; margin-bottom: 5px;}
.popupright {position: absolute; right: -11px; bottom: -11px; width: 10px; height: 366px; background: url(../images/popupright.png);}
.popupbottom {position: absolute; right: -1px; bottom: -11px; width: 314px; height: 11px; background: url(../images/popupbottom.png);}

body.style #content.wide {padding: 0;}
body.style #content h4 {float: left; width: 460px; height: 35px; line-height: 35px; background: #aaa; color: #fff; border-right: 5px solid #fff; font-size: 18px; font-weight: normal; text-align: center; overflow: hidden;}
img#thestylephoto {float: right; border: solid #fff; border-width: 0 0 0 5px;}
img.stylegrid {float: left; width: 150px; height: 150px; border: solid #fff; border-width: 5px 5px 0 0;}

#sidebar h2 {background: #aaa; color: #fff; height: 30px; line-height: 30px; font-size: 20px; font-weight: normal; text-transform: lowercase; padding: 0 15px;}
#sidebar ul {padding: 20px 0;}
#sidebar a {display: block; width: 190px; padding: 0 15px; text-decoration: none; color: #aaa;}
#sidebar li.on a {color: #444;}
#sidebar li a:hover {background: #aaa; color: #fff;}

#catalogin {font-size: 12px;}
#catalogin h3 {border-bottom: 1px solid #ddd; padding-bottom: 5px;}
#catalogin div {clear: both; padding-top: 3px;}
#catalogin label {float: left; width: 80px; line-height: 22px;}
#catalogin .text input {width: 200px; border: 1px solid #ddd;}
#catalogin .button input {margin-left: 80px; border: 1px solid #ddd; background: #777; color: #fff; font-weight: bold;}

#footer {position: relative; width: 988px; background: url(../images/footer.gif) left top no-repeat; margin: 0 auto; text-align: left; font-size: 11px;}
#footer p {padding: 10px;}