/* defaults */
body { background-color: #536895; color: #333333; font: normal 12px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin-top: 0; padding: 0; text-align: center; }
br { line-height: 11px;  }

/* header */
div#header { border: 0; margin: 0 auto 0 auto; max-width: 730px; padding: 0; }

/* gutter -------------------------------------------------------------------------------------------------------------- */
div#trough { background-color: #E5EBEB; line-height: 5px; height: 5px; min-height: 5px; margin: 0 auto 0 auto; padding: 0; position: absolute; top: 0; width: 730px; /* MacIE hide */ background: url("../images/gutter.png") 100% 0 repeat-x !important; /* end hide */ }
div#gutter { background-color: #536895; line-height: 5px; height: 5px; min-height: 5px; margin: 0 auto 0 auto; padding: 0; position: absolute; top: 0; width: 730px; }


/* tools --------------------------------------------------------------------------------------------------------------- */
div#tools { border-bottom: 1px dashed #E3E4C9; display: block; height: 15px; min-height: 15px; margin: 0 auto 0 auto; padding: 0; position: relative; top: 5px; width: 730px; z-index: 1; }
div[id]#tools ul { display: block; list-style: none; margin: 0 1px; padding: 0 5px 0 5px; text-align: right; /* MacIE hide */ background: url("../images/toolbar-separator.png") 100% 6px no-repeat !important; /* end hide */ }
div[id]#tools ul li { display: inline; font: normal 10px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 0 8px; /* MacIE hide */ background: url("../images/toolbar-separator.png") 0% 1px no-repeat !important; /* end hide */ }
div#tools ul { display: block; list-style: none; margin: 0 1px; padding: 2px 0 0 5px; text-align: right; /* MacIE hide */ background: url("../images/toolbar-separator.png") 100% 4px no-repeat !important; /* end hide */ }
div#tools ul li { display: inline; font: normal 10px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 0 8px; /* MacIE hide */ background: url("../images/toolbar-separator.png") 0% 2px no-repeat !important; /* end hide */ }
div#tools ul li a { color: #FFFFFF; text-decoration: none; }
div#tools ul li a:hover { color: #F4AA50; }
div#tools ul li a.selected, div#tools ul li a.selected:hover { color: #333333; background-color: #F4AA50; }

/* header-bg ----------------------------------------------------------------------------------------------------------- */
div#header-bg { background: url("../images/spotlight/header-bg.png") 100% no-repeat; background-color: #FFFFFF; display: block; height: 60px; min-height: 60px; margin: 0 auto 0 auto; padding: 0; position: relative; top: -11px; width: 730px; }
div#header-home { background: url("../images/header-bg.jpg") 100% no-repeat; background-color: #FFFFFF; display: block; height: 57px; min-height: 57px; margin: 0 auto 0 auto; padding: 0; position: relative; top: -11px; width: 730px; }
/* div#spotlight .img-1 { background: url("../images/spotlight/pencil.png") 100% no-repeat; border: 0; margin: 0; padding: 0; } */


/* stroll -------------------------------------------------------------------------------------------------------------- */
/* note: "overflow:hidden" is added in order for NS, FF, and Opera not discard overlaps... */
div#stroll { display: block; margin: 0 auto 13px; height: auto; padding: 0; text-align: left; position: relative; top: -28px; width: 730px; /* Mac IE hide */ overflow: hidden; /* end */ }

div#stroll_left { display: inline; float: left; height: auto; padding: 0; width: 524px; }
div#stroll_left p { color: #333333; font: normal 10px/14px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 2px 8px 2px 8px; padding: 0; }
div#stroll_left a { color: #444444; font: normal 10px/13px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; text-decoration: none; }
div#stroll_left a:hover { color: #FFFFFF; text-decoration: none; }

div#stroll_right { display: inline; float: left; height: auto; padding: 0; width: 206px; }
div#stroll_right p { color: #333333; font: normal 10px/13px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 2px 8px 2px 8px; padding: 0; text-align: right; }
div#stroll_right a { color: #444444; text-decoration: none; }
div#stroll_right a:hover { color: #FFFFFF; text-decoration: none; }
div#stroll_right img { border: 0; margin-top: 2px; }
div#stroll_right ul { margin: 0 1px 0 0; padding-right: 4px !important; list-style: none; text-align: right; }
div#stroll_right ul li { display: inline; font: normal 10px/13px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 2px 0 0 8px; }
div#stroll_right ul li a, div#stroll_right a { color: #333333; text-decoration: none; }
div#stroll_right ul li a:hover, div#stroll_right a:hover { color: #FFFFFF; }


/* main ---------------------------------------------------------------------------------------------------------------- */
/* note: "overflow:hidden" is added in order for NS, FF, and Opera resize small div with bigger div... */
div#main { background-color: #FFFFFF; display: block; margin: 0 auto 8px; height: auto; min-height: 280px; padding: 0; text-align: left; position: relative; top: -42px; width: 730px; /* Mac IE hide */ overflow: hidden; /* end */ }

/* spotlight ----------------------------------------------------------------------------------------------------------- */
div#spotlight { border-right: 1px solid #CDCDCD; display: inline; float: left; height: 270px; padding: 0; width: 524px; }
div#spotlight img { margin: 0; padding: 0; border: 0; float: none; }

/* menu ---------------------------------------------------------------------------------------------------------------- */
div#menu { background-color: #DDDDDD; display: inline; float: left; height: 270px; min-height: 270px; padding: 0; width: 205px; }
div#menu h1 { background-color: #F2AC31; color: #333333; font: bold 12px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 5px 5px 5px 10px; }
div[id]#menu ul { display: block; list-style: none; margin: 0 auto 0 auto; padding: 4px; text-align: left; }
div#menu ul { display: block; list-style: none; margin: 0 auto 0 auto; padding: 2px; text-align: left; }
div#menu ul li { display: block; font: bold 11px/15px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 3px 15px; text-align: left; }
div#menu ul li a { color: #444444; text-decoration: none; }
div#menu ul li a:hover, div#menu ul li.selected a { color: #F2AC31; }

div[id]#menu ul li.selected { color: #F2AC31; font: bold 11px/15px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 4px 15px; text-align: left; }
div#menu ul li.selected { color: #F2AC31; font: bold 11px/15px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 3px 15px; text-align: left; }
div#menu ul li.menu { font: normal 11px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 3px 35px; text-align: left; }
div#menu ul li.menuselected { color: #F2AC31; font: normal 11px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 3px 35px; text-align: left; }
div#menu a { color: #444444; text-decoration: none; }
div#menu a:hover { color: #F2AC31; text-decoration: none; }


/* welcome -------------------------------------------------------------------------------------------------------------- */
div#welcome { background-color: #E5EBEB; border-right: 1px solid #CDCDCD; display: inline; float: left; height: 111px; min-height: 111px; padding: 0 8px 0 8px; width: 508px; }
div#welcome h1 { color: #333333; border-bottom: 1px solid #FFFFFF; font: bold 12px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 5px 0 5px 0; }
div#welcome h2 { color: #333333; font: bold 11px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 5px 0 5px 0; }
div#welcome p { color: #444444; font: normal 11px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 5px 0 5px 0; text-align: left; }
div#welcome ul { list-style: none; list-style-image: url("../images/icon-list.png") !important; margin: 5px; padding: 0 0 0 18px; }
div[id]#welcome ul { list-style: none; list-style-image: url("../images/icon-list.png") !important; margin: 5px; padding: 0 0 0 18px; }
div#welcome ul li { color: #666666; display: block; font: normal 11px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 0 5px; text-align: left; }
div[id]#welcome ul li { color: #666666; display: block; font: normal 11px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 0 5px; text-align: left; }
div#welcome ul li a { color: #666666; text-decoration: none; }
div#welcome ul li a:hover, div#welcome ul li.selected a { color: #FF9801; }

/* feature ------------------------------------------------------------------------------------------------------------ */
div#feature { background-color: #E3E4C9; display: inline; float: left; height: 111px; min-height: 111px; padding: 0; width: 205px; }
div#feature h1 { background-color: #ABAE5D; color: #333333; font: bold 11px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 5px 5px 5px 10px; }
div#feature p { color: #444444; font: normal 11px/15px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 5px 5px 5px 5px; text-align: left; }
div#feature a { color: #444444; font: bold 11px/15px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif;; text-decoration: none; }
div#feature a:hover { color: #F2AC31; text-decoration: none; }

/* story -------------------------------------------------------------------------------------------------------------- */
div#story { background-color: #E5EBEB; border-right: 1px solid #CDCDCD; display: inline; float: left; height: 105px; min-height: 105px; padding: 0; width: 524px; }
div#story h1 { background-color: #F2AC31; color: #333333; font: bold 12px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 2px 0 2px 0; padding: 5px 10px 5px 10px; }
div[id]#story td ul { list-style: none; list-style-image: url("../images/icon-list.png") !important; margin: 5px; padding: 0 0 0 18px; }
div#story ul { list-style: none; list-style-image: url("../images/icon-list.png") !important; margin: 5px; padding: 0 0 0 18px; }
div#story ul li { color: #666666; display: block; font: normal 11px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; padding: 0 2px 0 5px; text-align: left; }
div#story ul li a { color: #666666; text-decoration: none; }
div#story ul li a:hover { color: #FF9801; }
div#story a { color: #444444; text-decoration: none; }
div#story a:hover { color: #F2AC31; text-decoration: none; }

div#story table { border-collapse: collapse; border-spacing: 0; empty-cells: show; padding: 0; margin: 0; width: 524px; }
div#story td { color: #444444; font: normal 11px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 0 8px 0 8px; vertical-align: top; }


/* feature ------------------------------------------------------------------------------------------------------------ */
div#feature2 { background-color: #E3E4C9; display: inline; float: left; height: 105px; min-height: 105px; padding: 0; width: 205px; }
div#feature2 h1 { background-color: #ABAE5D; color: #333333; font: bold 11px/15px Verdana, Arial, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 5px 5px 5px 10px; }
div#feature2 p { color: #444444; font: normal 11px/15px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; margin: 0; padding: 5px 5px 5px 5px; text-align: left; }
div#feature2 a { color: #444444; font: bold 11px/15px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif;; text-decoration: none; }
div#feature2 a:hover { color: #F2AC31; text-decoration: none; }


/* footer ------------------------------------------------------------------------------------------------------------- */
div#footer { background-color: #FFFFFF; border: 0; display: block; margin: 0 auto 0 auto; padding: 0; position: relative; top: -50px; width: 730px; }

div#footer_left { display: inline; float: left; width: 365px; height: auto; padding: 0; background-color: #EBEBEB; border-top: 1px dashed #999999; /* MacIE hide \*/ overflow: hidden; /* end hide */ }
div#footer_left p { font: normal 10px/11px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; height: auto !important; padding: 0; margin: 5px 8px 2px 8px; padding-bottom: 4px; text-align: left; width: auto; }
div#footer_left p a { color: #F4AA50; text-decoration: none; }
div#footer_left p a:hover { color: #333333; }
div#footer_left hr { color: rgb(242,172,49); height: 1px; margin-left: 8px; margin-right: 0; }

div#footer_right { display: inline; float: left; width: 365px; height: auto; padding: 0; background-color: #EBEBEB; border-top: 1px dashed #999999; /* MacIE hide \*/ overflow: hidden; /* end hide */ }
div#footer_right p { font: normal 10px/11px Arial, Verdana, "Lucida Grande", "bitstream vera sans", sans-serif; height: auto !important; padding: 0; margin: 5px 8px 2px 8px; padding-bottom: 4px; text-align: right; width: auto; }
div#footer_right p a { color: #333333; text-decoration: none; }
div#footer_right p a:hover { color: #FF9801; }
div#footer_right hr { color: rgb(242,172,49); height: 1px; margin-left: 0; margin-right: 8px; }