/*--------------

XHTML ELEMENTS

---------------*/

* {margin:0;padding:0;}

body {font: normal small verdana, arial, helvetica, sans-serif; text-align:center; color: #333;background:#ccc url('/images/gray-gradient-bg.jpg') top left repeat-x;}

a img {border: none;}

ul {list-style:none;}

a:link, a:visited {color: #ff4c4c;text-decoration: underline;}

a:hover, a:active {color: #555;text-decoration: none;}



/*-------------

LAYOUT

---------------*/

div#container {width: 760px;margin:0 auto;text-align:left;background: #fff url('/images/swirls.jpg') bottom right no-repeat;}

div#header {background: #fff;padding-right: 2px;padding-left: 4px;padding-top:2px;}

div#sidebar1 {float:left; width: 200px;}

div#mainContent {margin: 0 0 0 210px;}

div#footer {clear:both;}

br.clearfloat {clear:both;height: 0;font-size:1px;line-height: 0;}

/*-------------

HEADER

---------------*/

div#header img {border: 1px solid #ccc;}

/*-------------

TOP NAVIGATION

---------------*/

div#top-nav {padding: 4px 0;background: #ccc;}

div#top-nav ul {font: small arial, helvetica, sans-serif;}

div#top-nav ul li {display: inline;}

div#top-nav ul li a:link, div#top-nav ul li a:visited {background: #ccc;text-decoration: none;color:#fff;padding-left: 20px; padding-right: 20px;}

div#top-nav ul li a:hover, div#top-nav ul li a:active {text-decoration:none;color: #f30;}

/*-------------

SIDEBAR1

--------------*/

div#sidebar1 {border-top: 4px solid #ddd;padding-top: 4px;}

div#sidebar1 ul {border-top: 1px solid #ccc;}

div#sidebar1 ul li {border-bottom: 1px solid #bbb;letter-spacing: 1px;background: #fff url('/images/gray-tiles.jpg') top left repeat;}

div#sidebar1 ul li a:link, div#sidebar1 ul li a:visited {display:block;padding: 6px 0 6px 10px;width:190px;text-decoration:none;font: bold 0.9em helvetica, sans-serif;color: #ff6060;}

div#sidebar1 ul li a:hover, div#sidebar1 ul li a:active {color:#333;background: #fff url('/images/gray-tiles-over.jpg') top left repeat;}

div#sidebar1 h2 {margin: 4px 0; padding: 8px 0;text-align:center;text-transform: uppercase; border-top: 4px solid #ccc; border-bottom: 4px solid #ccc;font: bold .9em Georgia, "Times New Roman", Times, serif;letter-spacing: 1px;color: #999;}

/*-------------

MAIN CONTENT

---------------*/

div#mainContent {font: normal 0.8125em/1.8em verdana, arial, helvetica, sans-serif;border-left: 1px dotted #ccc;}

div#mainContent img {margin: 2px 2px 4px 2px;}

div#mainContent h1 {font: bold italic 3em Georgia, "Times New Roman", Times, serif;color: #f30;}

div#mainContent p {margin: 12px 20px 20px 20px;}

div#mainContent p#passion {font: italic 1.25em georgia, "Times New Roman", Times, serif;letter-spacing: 1px;}

div#mainContent h2 {background: #f30 url('/images/icon-side-arrow.gif') 0% 50% no-repeat;color:#fff;font: normal large georgia, serif;text-transform: uppercase;letter-spacing: 1px;padding-left: 10px;padding-top: 4px;padding-bottom:4px;margin-left: 10px;}

div#mainContent ul {margin: 0 0 10px 20px;}

div#mainContent li {padding-top: 2px;padding-bottom: 2px;}

div#mainContent ul li a:link, div#mainContent ul li a:visited {background: transparent url('/images/icon-arrow-red.gif') 4px 6px no-repeat;padding-left: 14px;}

div#mainContent ul li a:hover, div#mainContent ul li a:active {background: transparent url('/images/icon-arrow-gray.gif') 4px 6px no-repeat;}

div#mainContent ul li span {font-family: georgia, serif;color: #555;}

/*-------------

FOOTER 

--------------*/

div#footer {width: 96%;margin: 4px auto;text-align:left;padding-top: 2px;padding-bottom:8px;border-top: 3px double #ddd;color: #bbb;font: normal x-small verdana, arial, helvetica, sans-serif;}