/* Used for containers that are always 980px in width */  /* (960px width) + (10px left padding) + (10px right padding) = 980px */ 
.width {position: relative; z-index: 2; margin: 0 auto; width: 960px; padding: 0 10px; text-align: left;}
/* Used to set minimum width so tiling backgrounds always fill entire screen width */
#topBar, #logoBar, #loginBar, #footer { min-width: 980px;}
/* #topBar: Holds site message or copyright (brown header bar)*/
#topBar {position: relative; z-index: 2;min-height: 2em;font-size: 0.9em;color: #AB9A81;background: #755323 url(/images/topBar.gif) repeat-x top left;}
#topBar p {position: absolute; top: 0.1em; right: 19px; margin: 0; padding: 0;}
#topBar a {color: #CFC2AF;}
#topBar a:hover {color: #FFF;}
/*#logoBar: holds search form and site logo (light green header bar)*/
#logoBar {position: relative; z-index: 2; min-height: 105px; background: #D1EC80 url(/images/logoBar.gif) repeat-x top left;}
#logoBar img { position: absolute;top: 15px; right: 19px; border: 0;}
/* For SEO and text only agents */
#logoBar .seo { position: absolute; top: -1000px;left: -1000px;}
/* Plain text headers */
#logoBar h1, #logoBar h2 {position: relative;margin: 0; padding: 0 10px 0 0; text-align: right;}
#logoBar h1 {top: -15px; font-size: 3.5em;}
#logoBar h2 {top: -25px; font-size: 1.5em;}
/* Search field */
#searchForm {width: 21.7em;background: #755323 url(/images/searchForm.gif) repeat-x bottom left;} 
#searchForm div {height: 32px; background:  url(/images/searchForm_corner.gif) no-repeat bottom right;}
#searchForm span.fields {position: absolute;top: -1.4em;left: 3.2em;}
#searchForm input {vertical-align: middle;margin: 0 10px 0 3px;}
#googleTopAdd {width: 21.7em;} 
#googleTopAdd span.fields {position: absolute;top: 1.4em;left: 27.2em;}
/* #loginBar: holds account admin info (dark green header bar)*/
#loginBar {position: relative;z-index: 2;min-height: 2em;color: #FFF;background: #9EC91C url(/images/loginBar.gif) repeat-x bottom left;  height: 2em !important;}
#loginBar a {text-decoration: none;color: #F8F4B6;}
#loginBar a:hover {color: #FFF;}
/* Links use a span to give the underline so the icon isn't underlined */
#loginBar a span {text-decoration: underline;}
#loginBar a img {vertical-align: middle !important;vertical-align: bottom;border: 0;text-decoration: none;}
#loginBar #menuTop {position: absolute;z-index: 3;top: -38px;left: 15px;  
  /* Give it height to grow if the green #loginBar increases in height */
  height: 6em; width: 267px; background: url(/images/menu_top.gif) no-repeat top left;}
#loginBar ul { position: absolute;top: 0.2em !important;top: 0.3em;right: 22px;margin: 0;padding: 0;list-style: none;}
#loginBar ul li {display: inline;margin: 0;padding: 0 0 0 10px;}
/* #page: holds all page content*/
#page {position: relative; z-index: 2;float: left;clear: both;width: 100%;padding-bottom: 10em;
 /* Define here for IE and Netscape so that the vertical menubar always extends full height of content */
  background: url(/images/menuBar.gif) repeat-y 22px 0px;}
/* #menuBar: main menu and news column*/
#menuBar {position: relative;z-index: 2;top: -40px;float: left;width: 290px;}  
#menuBar #menuCorners {position: absolute; z-index: 4;  /* Buggy top/left for Netscape only */
  top: -9px; left: 17px;height: 9px; width: 266px;background: url(/images/menu_corners.gif) no-repeat top left;}
/* Hide from Netscape to feed correct top/left for all browsers */
#menuBar div/*COMMENT HACK*/#menuCorners {top: 31px;left: 7px;}
#menuBar ul#menu {position: relative;z-index: 4;margin: 0 52px 0 40px;padding: 0;list-style: none;}
#menuBar ul#menu li {margin: 0;padding: 0;display: inline;}
#menuBar ul#menu li a {display: block; padding: 5px 0;font: small-caps 1.5em georgia, serif;letter-spacing: -0.00em;text-decoration: none;color: #B9A68B;border-bottom: 1px solid #D8CBBA;}
#menuBar ul#menu li a:hover, #menuBar ul#menu li.here a {font: small-caps 1.5em georgia, serif;letter-spacing: -0.00em;color: #795625;border-bottom: 1px solid #CBBEAC;}
#menuBar ul#menu li a:hover, #menuBar ul#menu li.inhere a {font: small-caps 1.2em georgia, serif;color: #795625;}
/* Make sure that even if not enough content, the vertical menubar will always extend the full height of the screen */
#menuBarBg {position: absolute;z-index: 1;top: 0;left: 0;height: 100%;width: 100%;}  
/* Fix Opera's nested box bug */
/*@media all and (min-width: 0px){#menuBarBg {height: inherit;}}*/
#menuBarBg span {display: block;position: relative;z-index: 1;height: 100%;width: 980px;margin: 0 auto;background: url(/images/menuBar.gif) repeat-y 32px 0px;}
/* News Posts*/
#news {position: relative;z-index: 2;margin: 2.5em 41px 2.5em 32px;background: #F3EDE4 url(/images/rounded_brown_top.gif) no-repeat top left;}
#news .bottom {display: block;height: 10px;width: 217px;background: url(/images/rounded_brown_bottom.gif) no-repeat bottom left;}
#news h1 {margin: 0;padding: 10px 10px 0 10px;border: 0;}
#news ul {margin: 0; padding: 0;list-style: none;}
#news ul li {display: inline; margin: 0; padding: 0;}
#news ul li a {display: block;padding: 15px 10px;text-decoration: none;color: #A1988B;}
#news ul li a span.title {text-decoration: underline;color: #93BB17;}
#news ul li a span.meta {display: block;margin-bottom: 10px;}  
#news ul li a:hover {color: #837B6E;background-color: #FFF;}
#news ul li a:hover span.title {color: #627F07;}
/* Center column for design thumbnails - can be 1/3 or 2/3 of design width, depending on if yellow sidebar is present*/
#center33 {float: left; width: 609px; color:#000000;}
#center66 { float: left; width: 664px;}
#center22 {float: left; width: 424px; color:#000000;}
/* Design Thumbnails*/
ul.thumbnails {margin: 1em 0;padding: 0; list-style: none;}
ul.thumbnails li {margin: 1em 0;padding: 0;clear: both;}
ul.thumbnails li a.thumbnail {position: relative; float: left;
  /* Set to the height of the thumbnail - needed by FF to prevent whitespace at the bottom */
  margin: 0 1em 2em 0; border: 4px solid #5F5950;}
ul.thumbnails li a:hover.thumbnail { border: 4px solid #000;}
/* Tooltips for design info <ins> is needed to validate XHTML */
ul.thumbnails li a.thumbnail ins {text-decoration: none;}
ul.thumbnails li a.thumbnail dl { display: none;}
ul.thumbnails li a:hover.thumbnail dl {display: block;position: absolute; z-index: 5; top: -55px; left: -80px; width: 20em;padding: 1em;font-size: 0.8em;line-height: 120%;text-decoration: none;color: #A1988B;background-color: #FCF9CB;border-bottom: 1px solid #FFD925;border-right: 1px solid #FFD925;}
ul.thumbnails li a:hover.thumbnail dl dt {float: left;width: 6em;margin: 0;padding: 3px 0;text-transform: uppercase;color: #8A6736;}
ul.thumbnails li a:hover.thumbnail dl dd {float: left;clear: right;width: 14em;margin: 0;padding: 3px 0;}
ul.thumbnails li a {text-decoration: none;}
ul.thumbnails li a span {text-decoration: underline;}
ul.thumbnails li a img {border: 0;vertical-align: middle;}
ul.thumbnails li ul {float: left;width: 11em;margin: 0;padding: 0;list-style: none;}
ul.thumbnails li ul li { margin: 5px 0 7px 0; padding: 0;}  
/* #yellowBar: used for top designs, forum posts, blog rolletc.*/
#yellowBar {float: right; width: 185px;margin: 10px 10px 10px 0;padding: 0 8px;background: #FCF9CB url(/images/rounded_yellow_top.gif) no-repeat top left;}
#yellowBar .bottom {display: block;position: relative; /* compensate for #yellowBar's margin */left: -10px; height: 14px; background: url(/images/rounded_yellow_bottom.gif) no-repeat bottom left;}
#yellowBar h1 {margin: 0;padding: 0.6em 0 0 2px;border: 0;}
#yellowBar h2 {margin: 0; padding: 0 0 5px 2px;}
#yellowBar h2 a.active {padding: 0 2px; color: #374607; background-color: #FBFAE6;}
/* Rounded yellow containers in the yellow sidebar */
#yellowBar .rounded { margin-bottom: 1em; background: #FBFAE6 url(/images/rounded_light_yellow_top.gif) no-repeat top left;}
#yellowBar .last {margin-bottom: 0;}
#yellowBar .rounded .bottom {display: block; position: static; width: 185px; height: 14px; background: #FBFAE6 url(/images/rounded_light_yellow_bottom.gif) no-repeat bottom left;}
/* Big links in the yellow sidebar */
#yellowBar .rounded ul, #yellowBar .rounded ol {margin: 0; padding: 10px 0 0 0;list-style: none;}
#yellowBar .rounded li {margin: 0;padding: 0;display: inline;}
#yellowBar .rounded li a {display: block;padding: 5px 10px;text-decoration: none;color: #A1988B;}
#yellowBar .rounded li a:hover {color: #837B6E; background-color: #FFF;}
#yellowBar .rounded li a:hover span.title {color: #627F07;}
#yellowBar .rounded li a span.title {text-decoration: underline;color: #94BC18;}
#yellowBar .rounded li a span.meta {display: block;}
#yellowBar .rounded li span.snip {display: block;margin-top: 10px;}
/* Different icons for big link lists */
#yellowBar .rounded .comments li a, #yellowBar .rounded .rank li a, #yellowBar .rounded li a.archive {padding-left: 30px; background-repeat: no-repeat; background-position: 6px 6px;}
/* Archive icon */
li a.archive {margin-top: 10px; padding-left: 35px;background-image: url(../img/icon/archive.png);background-repeat: no-repeat;background-position: 10px 6px;}
#news ul li a.archive {margin-top: 0; padding: 6px 0 6px 35px;}
/* Comment icon */
#yellowBar .rounded .comments li a { background-image: url(../img/icon/comments.png);}
/* Uses images for numerical rank so text size change doesn't destroy list */
#yellowBar .rounded .rank li a.one { background-image: url(../img/icon/rank_one.png);}
#yellowBar .rounded .rank li a.two { background-image: url(../img/icon/rank_two.png);}
#yellowBar .rounded .rank li a.three {background-image: url(../img/icon/rank_three.png);}
#yellowBar .rounded .rank li a.four {background-image: url(../img/icon/rank_four.png);}
#yellowBar .rounded .rank li a.five {background-image: url(../img/icon/rank_five.png);}
/*Alignment classes*/
.floatLeft {float: left;}
.floatRight {float: right;}
.alignLeft {text-align: left;}
.alignRight {text-align: right;}
.alignCenter {text-align: center;}
/* Generic display classes*/
.clear { clear: both;}
.block { display: block;}
/* Profile Page*/
dl#about_author dt {float: left;width: 10em;margin: 0;padding: 3px 0;text-transform: uppercase;color: #8A6736;}
dl#about_author dd {float: left; clear: right;width: 20em; margin: 0;padding: 3px 0;}
/* Site Map*/
#sitemap, #sitemap li {margin: 0;padding: 0;list-style: none;}
#sitemap li {padding: 0 0 20px 0;}
#sitemap li a, #sitemap li span {font-weight: bold; }
#sitemap li ul a, #sitemap li ul span {font-weight: normal; }
#sitemap li ul {padding: 0 0 0 20px;margin: 0;}
#sitemap li ul li {margin: 0;padding: 0; }
/* Blog Stuff*/
.postmetadata {font-size: smaller;text-align: right; }
/* Content*/
#content {float:left;height:auto !important;height:100%;min-height:100%;position:relative;width:100%;}
/*Pagination**/
.navwrap {background:#f3ede4;border-bottom:1px #795625 solid;border-top:1px #795625 solid;clear:both;font:1.25em/1.8em Georgia, "Times New Roman", Times, serif;height:1.8em;margin:10px 0 0;width:662px;}
.navwrap ul.pagination {list-style:none;margin:0 auto;text-align:center;}
.navwrap ul.pagination li {float:left;padding:0 10px;}
.navwrap ul.pagination li a {display:block;text-decoration:none;}
/*Footer*/
#footer {background:#e7ddcf url('/images/footer.gif') repeat-x;background-position:left top;clear:both;float:left;height:8em;margin:-8em 0 0;position:relative;width:100%;z-index:3;}
#footerCorners {background:url('/images/footer_corners.gif') no-repeat;	background-position:left top;height:66px;left:23px;position:absolute;top:-7px;width:255px;z-index:2;}
#footerMenu {background:url('/images/footer_menu.gif') no-repeat;background-position:left top;position:absolute;right:0;top:0;}
#footerMenu ul {background:url('/images/footer_menu_corner.gif') no-repeat;background-position:right top;list-style:none;margin:0;padding:15px 20px;}
#footerMenu ul li {display:inline;	margin:0;padding:0;}
#footerMenu ul li a {border-right:1px solid #e1ddd6;color:#ab9a81;padding:0 8px;text-decoration:none;}
#footerMenu ul li.last a {border:0;}
#footerMenu ul li a:hover {color:#6d5f4a;}
#footer #copyright {color:#ab9a81;font-size:.8em;position:absolute;right:5px;top:6em;}
#footer #copyright a {color:#86765e;text-decoration:none;}
#footer #copyright a:hover {color:#4e402a;}
/** Login Page **/
/*FORM TABLE NEW CLASSES */
.formtable{BORDER: #7c8187 1px dotted; PADDING-RIGHT: 8px; PADDING-LEFT: 8px; BACKGROUND: #fbfbfb; MARGIN-BOTTOM: 15px; PADDING-BOTTOM: 8px; margin-top: 12px; PADDING-TOP: 8px; TEXT-ALIGN: left; font-size: 11px;}
.formtable2{PADDING-RIGHT: 8px; PADDING-LEFT: 8px; MARGIN-BOTTOM: 15px; PADDING-BOTTOM: 8px; margin-top: 12px; PADDING-TOP: 8px; TEXT-ALIGN: left; font-size: 11px;}
.formtable-brd{font-size: 12px}
.greyheaderbg{background: #E9E9E9; height:15px; font-size: 12px; color: #000000; font-weight: bold; margin-bottom: 10px;}
.comboboxauto {font-size: 12px; font-family: Arial, Helvetica, sans-serif; color: #000000; height: 20px; width: auto; border: 1px solid #7F9DB9}
.combobox240 {font-size: 12px; font-family: Arial, Helvetica, sans-serif; color: #000000; height: 20px; width: 240px; border: 1px solid #7F9DB9}
.textfield {width: 150px; color: #000000; font-size: 12px; height: 20px; border: 1px solid #7F9DB9}
.textfield300 {width: 260px; color: #000000; font-size: 12px; height: 20px; border: 1px solid #7F9DB9}
.textarea {width: 240px; font-family: Arial, Helvetica, sans-serif; color: #000000; font-size: 11px; height: 80px; border: 1px solid #7F9DB9}
.textarea500 {width: 500px; font-family: Arial, Helvetica, sans-serif; color: #000000; font-size: 11px; height: 120px; border: 1px solid #7F9DB9}
.browse {font: 12px Arial, Geneva, sans-serif; height: 20px; color: #000000; border: 1px solid #7F9DB9}
.buttonauto {font: 12px bold Arial, Geneva, sans-serif; color: #ffffff; width: auto; height: 22px; background: #7C8187; border: 1px solid #cccccc}
.error{COLOR: #f00; FONT-STYLE: italic}