@import url("forms.css");

body {margin: 0; padding: 10px 0; font: 76%/1.4em Arial, Helvetica, sans-serif; background-color: #FFFFFF; color: #4A5C68; text-align: center;}

a {color: #4A5C68; text-decoration: underline;}
a:hover {text-decoration: none;}

h1 {font-size: 32px; line-height: 1.2em; margin: 0 0 20px 0; padding: 0; color: #99042E;}
h2 {font-size: 1.2em; margin: 10px 0 0 0; padding: 0; color: #99042E;}
h2 a {font-size: 12px; color: #99042E; padding: 0 0 0 9px; background: url(../images/bullet-red.png) no-repeat 0 2px; text-decoration: none;}
*+html h2 a {float: left; width: 342px;}
h2 a:hover {text-decoration: underline;}
.related h2 {margin-bottom: 11px; font-size: 18px; font-weight: normal; text-transform: lowercase;}
h3, h4, h5 {font-size: 1.1em; font-weight: bold; margin: 10px 0 0 0; padding: 0;}
img {border: none;}

hr {}

#header ul, #footer ul, .featured ul, .printEmailBook ul, .intro ul, .nav ul {margin: 0; padding: 0; list-style: none;}
#header li, #footer li, .printEmailBook li, .featureBox li, .addComment .link li, .add li, .directory li, .nav li {display: inline;}

#container {width: 980px; margin: 0 auto; text-align: left;}

#header {float: left; width: 978px; margin: 0; border: 1px solid #4A5C68; border-bottom-width: 0;}
#header .left, #header .right {float: left; width: 489px;}
#header .right {float: right;}

.logo {float: left; width: 235px; padding: 19px 0 0 38px;}
.logo a {float: left; width: 235px; height: 92px; text-indent: -3000px; background: url(../images/shopworks-logo.gif) no-repeat 0 0;}

.popup {background-color: #FFF; width: 100%;}
.popup h1 {font-size: 1.6em; margin: 0;}
.popupContent, #popupHeader, #popupFooter {float: left; width: 380px; overflow: hidden; text-align: left;}
#popupHeader img {margin-left: 20px;}
.popupContent, #popupFooter {width: 340px; padding: 0 20px;}

.search {float: right; width: 264px; padding: 11px 35px 0 0; margin: 0; text-align: right;}

.mainNav {float: left; width: 940px; margin: 20px 0 0 38px; padding-bottom: 13px; text-transform: lowercase;}
* html .mainNav {float: none; display: block;}
.mainNav a {padding: 0 2.10em; color: #4A5C68; font-weight: bold; font-size: 14px; text-decoration: none;}
.mainNav a:hover {color: #99042E;}
.mainNav .current a {color: #99042E;}
.mainNav .first a {padding-left: 0;}

.nav {float: left; width: 940px; padding: 10px 0 5px 38px; margin-bottom: 21px; font-size: 12px; font-weight: bold; background-color: #99042E; /* text-transform: lowercase; */}
.nav li {padding: 0 0 0 9px; background: url(../images/bullet-white.png) no-repeat 0 0;}
.nav a {margin: 0 56px 0 0; color: #FFF; text-decoration: none;}
.nav a:hover, .nav .current a {text-decoration: underline;}
.nav .last a {margin: 0;}

.banner {float: right; width: 169px; padding: 44px 58px 0 0; text-align: right;}

.wrapperHome, .wrapper {float: left; width: 978px; margin: 0; padding: 0; border: 1px solid #4A5C68; border-top-width: 0;}
.wrapper {border-top-width: 1px; background: url(../images/blue-bg.gif) repeat-y top right;}
.wrapperHome .content {margin: 0; padding: 0;}

.heading {float: left; width: 100%; margin-bottom: 10px; font-weight: bold;}
.title {float: left; width: 100%; margin-bottom: 3px; font-weight: bold;}

.intro {float: left; width: 978px; background-color: #4A5C68; color: #FFF; font-size: 12px; font-weight: bold; }
.intro .left {float: left; width: 797px;}
.intro .right {float: right; width: 144px; padding: 36px 0 0 36px;}
.intro li {float: left; width: 135px; padding: 0 0 0 9px; margin: 0 0 12px 0; background: url(../images/bullet-white.png) no-repeat 0 0;}
.intro a {color: #FFF; text-decoration: none;}
.intro a:hover, .intro .current a {text-decoration: underline;}
.intro .heading {width: 65px; height: 20px; margin-bottom: 12px; text-indent: -3000px; background: url(../images/offices.gif) no-repeat 0 0;}

.homeBase {float: left; width: 978px; font-weight: bold;}
.homeBase .left {float: left; width: 570px; padding: 0 0 22px 38px;}
.homeBase .right {float: left; width: 370px; padding-top: 0;}
.column {float: left; width: 170px; padding-right: 20px;}
.column .text a {text-decoration: none;}
.column .text a:hover {text-decoration: underline;}
.homeBase .heading {height: 20px; margin-bottom: 12px; text-indent: -3000px; background: url(../images/whats-new.gif) no-repeat 0 0;}

.link {float: left; width: 100%;}
.link a {color: #99042E; font-weight: bold; background: url(../images/arrows.gif) no-repeat top right; padding-right: 18px; text-decoration: none;}
.link a:hover {text-decoration: underline;}

.outer {width: 371px; margin-left: 232px; position: relative;}
.inner {float: left; width: 371px;}
.center {float: right; width: 371px;}
.content {float: left; width: 351px; padding: 27px 20px 0 0;}
.wrapper .content {padding-top: 30px;}
.contentWide {}
.contentWide .outer {width: 603px; margin-left: 0; position: relative;}
.contentWide .inner {float: left; width: 603px;}
.contentWide .center {float: right; width: 603px;}
.contentWide .content {float: left; width: 545px; padding: 27px 20px 0 38px;}
.fullWidth {float: left; width: 978px; background-color: #FFF;}
.fullWidth .content {float: left; width: 920px; padding: 27px 20px 0 38px;}

.center .content p {font-size: 12px; margin: 0 0 17px 0;}
.center .content ul, .center .content ol{float: left; width: 100%; padding: 0; margin: 0; list-style: none;display:inline;}
.center .content li {padding-left: 9px; background: url(../images/bullet-blue.png) no-repeat 0 2px;}

#left {float: left; width: 232px; margin: 0 0 0 -232px; position: relative; overflow: hidden;}
#left .content {float: left; width: 232px; padding: 0;}
#left .banner {float: left; width: 232px; margin: 0; padding: 0; text-align: left;}
#left .nav {width: 183px; padding: 32px 0 0 29px; margin: 0; background-color: #FFF;}
#left .nav li {display: block; padding: 0 0 0 9px; background: url(../images/bullet-red.png) no-repeat 0 2px;}
* html #left .nav li {height: 1px;}
#left .nav a {display: block; margin: 0 0 11px 0; color: #99042E; text-decoration: none;}
#left .nav a:hover, .nav .current a {text-decoration: underline;}
#left .nav .last a {margin: 0;}

#right {float: left; width: 375px; margin: 0 -375px 0 0; overflow: hidden;}
#right .content {float: left; width: 375px; padding: 0; margin: 0;}
#right .banner {float: left; width: 375px; padding: 0;}

.cta {float: left; width: 315px; margin: 10px 0; padding: 0 30px; color: #FFF; font-weight: bold;}
*+ html .cta {padding-bottom: 10px;}
.back {float: left; width: 100%; margin: 9px 0 5px 0;}
.back a {padding-left: 19px; background: url(../images/back-arrow.gif) no-repeat 0 5px; color: #99042E; text-decoration: none; font-size: 13px; font-weight: bold;}

.related {float: left; width: 100%;}
.related a {color: #4A5C68; text-decoration: none;}
.related a:hover {text-decoration: underline;}
.center .content .related ul {margin: 0 0 15px 0;}

.printEmailBook {float: left; width: 100%; margin: 15px 0;}
* html .printEmailBook ul {position: relative;}
.printEmailBook .print {margin-right: 10px;}
.printEmailBook .email {margin-right: 10px;}
.printEmailBook .book {margin-right: 10px;}
.printEmailBook a {color: #4A5C68; text-decoration: none;}
.printEmailBook a:hover {text-decoration: underline;}

.listingBlock, .listing {float: left; width: 100%;}
.fullWidth .listingBlock {margin-top: 20px;}
* html .fullWidth .listingBlock {overflow: hidden;}
.listing {margin: 0 0 10px 0;}
.listing .text {float: left; width: 100%;}
.listing .image {float: left; width: 150px; margin-right: 10px;}
.listing .title {float: left; width: 385px;}

.authorDate, .contactTel {float: left; width: 100%; font-size: 0.9em; margin: 0;}
.contactTel {font-weight: bold;}
.date, .tel {}
.author, .contact {padding-right: 5px; margin-right: 3px; background: url(../images/divider.gif) no-repeat top right;}

.paginate {float: left; width: 100%; margin: 5px 0; padding: 10px 0;}
.center .content .paginate ul {float: none; width: auto; margin: 0; padding: 0; list-style: none; display: inline;}
.center .content .paginate li {display: inline; padding: 0; background: none;}
.paginate a {text-decoration: none; /*background: url(../images/divider.gif) no-repeat 0 0; padding-left: 4px; margin-right: 2px*/}
.paginate a:hover {text-decoration: underline;}
.paginate .current a {font-weight: bold; text-decoration: none;}
.paginate .end a, .paginate .next a, .paginate .previous a, .paginate .start a {background-image: none!important; padding-left: 0; margin-right: 0;}
.paginate img {margin-bottom: -5px; position: relative;}
.paginate .first a {background-image: none;}
.paginate .last {background-image: none; margin-right: 3px;}

.featured {float: left; width: 280px; margin: 0 26px 40px 0;}
*+html .featured {padding-bottom: 40px; margin-bottom: 0;}
.featured .image {float: left; width: 100%; margin: 0 0 5px 0;}
.featured .text {float: left; width: 100%;}
.featured .text img {}
.featured .floatRight {margin-right: 0;}

.box {float: right; width: 351px; padding: 10px 0;}
.box .image {float: left; width: 100px; margin-right: 10px;}
.box .text {float: left; width: 241px;}

.searchResults {float: left; width: 100%;}
.searchResult, .searchText, .items {float: left; width: 100%;}
.searchResult {font-weight: bold; font-size: 1.1em;}
.searchText {margin-bottom: 15px;}
.items {margin-bottom: 10px;}

#footer {float: left; width: 969px; margin: 10px 0 10px 9px; font-size: 11px;}
#footer p {margin: 0;}
#footer a {color: #4A5C68; margin-right: 5px;}
#footer ul a {text-transform: lowercase;}

.clear {clear: both;}
.level1 {margin: 0; padding: 0; list-style: none;}
.floatRight {float: right;}

.styleGuideContent {float: left; width: 100%; padding: 2% 0;}

/* WSB STYLES */
.wsb {font-size: 0.9em; color: #666666;}
.wsb a {color: #666666; text-decoration: none;}
.works {color: #006699; font-weight: bold;}
.sitebuilder {color: #FF6600; font-weight: bold;}

/*styles for editor - add to format.css*/
.introText {float: left; width: 100%; margin: 8px 0; font-size: 18px; line-height: 1.4em; color: #7D8D98;}