﻿html, body, form, fieldset, h4, h5, h6, img, pre, blockquote, ol, dl {margin: 0; padding: 0; border: none;}
h1 {color:#09c; margin: 0px 0px 15px 0px;}
h2 {color:#666; margin: 0px 0px 15px 0px;}
h3 {color:#666; margin: 0px 0px 5px 0px;}
p {color:#666; border: none; margin:0px 0px 10px 0px;}
ul {color:#666; border: none; margin:0px 0px 10px 0px;}
li {color:#666; border: none; margin:0px 0px 5px 0px;}
a:link, a:active, a:visited {color:#09c;}
a:hover {color:#09c; text-decoration:underline}
html {font-size: 100%;}
body {text-align: center; font: .75em verdana, "trebuchet ms", arial, helvetica, sans-serif; background: #fff url(/assets/images/template/bg_body.gif) repeat; }
#container {width: 960px; margin: 0 auto; overflow: hidden; text-align: left;}
#masthead {width: 960px; height: 150px; overflow: hidden;}
#content {clear: both; min-height: 1000px; }
#contentPrimary {display: inline; width: 520px; float: left;  background: transparent url(/assets/images/template/bg_content_primary.png) repeat; padding: 40px;}
#contentPrimary ul { padding: .9em; margin: .9em;  }
#contentPrimary ol { padding: .9em; margin: .9em;  }
#contentSecondary {display: inline; width: 300px; float: right; overflow: hidden; padding: 10px;}

/* MENU - Should be able to stand as-is, with the exception of 4 "TODO" notes below */
#menu {width: 741px; height: 64px; position: relative; top: 20px; left: 100px; background: transparent url(/assets/images/template/bg_menu_primary.png) top left no-repeat;} /* TODO: Change left and top values to position main menu as desired */
#menu ul {display: none;}
#menu li.active ul {display: block; width: 575px; position: absolute; top: 103px; left: -90px;} /* TODO: Change top and left values to position tab bar as desired */
#menu li {display: block; float: left; height: 64px; line-height: 64px; list-style-type: none; background: transparent url(/assets/images/template/menu_primary_separator.gif) center left no-repeat;}
#menu li.first {background-image: none;}
#menu li li, #menu li li.first {height: 27px; margin-right: 10px; line-height: 27px; background: transparent url(/assets/images/template/bg_tab_right.png) top right no-repeat;}
#menu a {display: block; padding: 0 20px; font-size: 1.1em; color: #666; text-decoration:none;}
#menu li li a {margin-right: 5px; background: transparent url(/assets/images/template/bg_tab_left.png) top left no-repeat;}
#menu li li.active {background-position: right -27px;}
#menu li li.active a {background-position: left -27px; text-decoration:underline;}
#menu li.active a {color: #09c;}	/* TODO: Change this color to desired hover state color */
#menu li.active li a {color: #666; text-decoration:none;}
#menu li a:focus, #menu li a:hover, #menu li a:active {color: #09c; text-decoration:underline;}	/* TODO: Change this color to desired hover state color */
#menu li.active li a:focus, #menu li.active li a:hover, #menu li.active li a:active {color: #09c; text-decoration:underline;}
#menu li li.current a:focus, #menu li li.current a:hover, #menu li li.current a:active {color: #09c; cursor: default; text-decoration:underline;}

/* EXAMPLE: When no sidebar Template Variables (boxes, buckets, etc.) are enabled for a page, body element gets a noSidebar class */
.noSidebar #contentPrimary {width: 900px;}
.noSidebar #contentSecondary {display: none;}
.noSidebar #menu li.active ul {width: 900px;}

.imgleft {padding: 10px 0px 10px 0px; float: left; text-align: center;}
.imgright {padding: 10px 0px 10px 0px; float: right; text-align: center;}
