/* -------------------- colors ----------------------------------------

basic yellow   #fb2
basic orange   #f71
*/

/* -------------------- body & all ---------------------------------------- */

* {margin: 0; padding: 0; border: 0;}

html, body {height: 100%;}

body {color: #333;
  background: #fff;
  font: 100.1% Arial, sans-serif;}

#container {min-height: 100%;
  position: relative;}

div {margin: auto;}

ul {list-style: none;}

img {display: block;}


/* -------------------- basic structure ---------------------------------------- */

#content {padding: 10px;
  padding-bottom: 37px;
  border-bottom: 90px solid white;} /* footer height */

.limitWidth {width: 932px;}

#top {height: 90px;
  background: #fff url(img/winner.gif) no-repeat top right;
  border-top: 2px solid #fb2;}

#logo {height: 60px;
  font-size: 140%;
  font-weight: bold;}

#logo a {display: block;
  float: left;
  padding-top: 3px;}
    
#winner {position: absolute;
  top: 2px; right: 2px;}

#winner img {width: 80px;
  height: 55px;}

#navDiv {font-size: 11pt;
  padding-top: 0;
  margin-left: -1px;}

#color {height: 146px;
  color: #fff;
  background: #fb2 url(img/color.gif) repeat-x;
  /*background: #fb2 url(img/color_9may.png) repeat-x center;*/
  border-bottom: 5px solid #ddd;}

#leftColumn {width: 191px;
  float: left;
  padding-top: 19px;}

.tab {width: 151px;
  background: url(img/tab.gif) no-repeat bottom right;
  line-height: 120%;
  padding: 0 20px 3px;
  border-bottom: 1px solid #ccc;}

.tab h2 {height: 29px;
  color: #fff;
  background: #fb2 url(img/tabHeader.gif) repeat-x top left;
  font: 120% Arial, sans-serif;
  padding-top: 5px;
  padding-left: 20px;
  margin: 0 -20px 6px;}

#localNav ul {margin-bottom: 12px;}

#localNav li {border-bottom: 1px solid #ddd;}

#localNav li a {color: #333;
  text-decoration: none;
  display: block;
  padding: 7px 0 10px;}

#localNav li a:hover {color: #f71;}

#localNav li.active {color: #999;
  padding: 7px 0 10px;}

#text {width: 685px;
  float: right;
  padding-top: 13px;}

#finish {clear: both;}

#footer {width: 100%;
  height: 90px;
  position: absolute;
  bottom: 0;
  color: #777;
  background: #ddd;}
  
#footerInside {width: 685px;
  float: right;
  padding-top: 15px;}


/* -------------------- nav ---------------------------------------- */

#nav a {color: #777;
  background: url(img/navItem.gif) no-repeat left center;
  padding: 4px 7px 6px 7px;} /* p1 p2 p3 p4 */

#nav a.first {background: transparent;
  padding-left: 0;}

#nav a:hover {color: #333;}

#nav ul a {color: #555;
    background: transparent;}
  
#nav ul {width: 180px; /* w */
  background: #fff; /* #fb2 */
  border: 1px solid #fb2; /*#ff8b16*/}

#nav ul li:hover, #nav ul li.sfhover {background: #eee;}

#nav ul a {width: 166px;} /* w - (p2 + p4) */

#nav li ul ul {margin: -25px 0 0 170px;}

#nav a.group {background: url(img/bulletNav.gif) center right no-repeat;}


/* -------------------- text ---------------------------------------- */

p, #text ul, #text ol, table {margin-bottom: 12px;}

#content {line-height: 170%;}

h1, h2 {font-family: Calibri, Arial, sans-serif;
  font-weight: normal;}

h2 {color: #333;
  font-size: 180%;
  margin: 19px 0 4px;}
    
h2.first {margin-top: 0;}

h3 {font-size: 120%;
  font-weight: normal;}

h3.foldingHeader {background: url(img/dashed.gif) repeat-x bottom left;
  font-size: 100%;
  display: inline;
  cursor: pointer;}
    
h3.foldingHeaderActive {margin-top: 6px;
  cursor: pointer;}
    
.foldingText {display: none;
  border-bottom: 1px solid #ccc;
  margin-bottom: 23px;}


/* -------------------- links ---------------------------------------- */

a {color: #f71;}

a:hover, a:active {text-decoration: underline;}

#top a {color: #333;
    text-decoration: none;}

#footer a {color: #777;}


/* -------------------- lists ---------------------------------------- */

#text li {margin-bottom: 12px;}

#text ul li {background: url(img/bullet.gif) no-repeat top left;
    padding-left: 20px;}

#text ul.compact li, #text ol.compact li {margin-bottom: 0;}

#text ul.links li, #text ol.links li {margin-bottom: 0;}

ol {margin-left: 31px;}


/* -------------------- tables ---------------------------------------- */

table {width: 100%;
  border-spacing: 0;
  border-collapse: collapse;}
  
h2 + table {margin-top: 12px;} /* FF & Opera only. Todo: fix IE */

td, th {border: 1px solid #ccc;
  vertical-align: top;
  padding: 0 12px 3px;}

.inv td, .inv th {border: 0;
  padding: 0;}
  
#text table.inv {margin-bottom: 0;}


/* -------------------- misc ---------------------------------------- */

img.left {float: left;
  margin: 12px 12px 12px 0;}

img.right {float: right;
  margin: 12px 0 12px 12px;}

img.button {cursor: pointer;
  margin-bottom: 12px;}

input.radio {margin-left: -2px;}

img.inline {display: inline;}

.url {text-decoration: underline;}

.indent {padding-left: 56px;}

.author {font-style: italic;}


/* -------------------- special structure ---------------------------------------- */

#search {padding: 20px 0 0;}

#search input.button {margin-top: 4px;}

#siteNews {float: right;
  margin: 15px 0 21px 21px;}

.horizontalPhoto {margin: 30px 0 4px;}

.i3 td {border: 0;
  padding: 0;}

.i3 td.space {width: 56px;}

.i3 ul {width: 191px;
  border-top: 1px solid #ddd;
  margin-top: 10px;}

#text .i3 li {background: transparent;
  padding-left: 0;
  margin-bottom: 0;
  border-bottom: 1px solid #ddd;}
  
.i3 a {background: url(img/bulletLink.gif) no-repeat top left;
  text-decoration: none;
  display: block;
  padding: 2px 0 2px 18px;}

.i3 a:hover, .i3 a:active {text-decoration: underline;}


/* -------------------- ask ---------------------------------------- */

.name1 {display: none;}
.name2 {display: inline;}
.name3 {display: none;}

input.string {width: 179px;
  padding: 2px 5px;
  border: 1px solid #ddd;}

textarea {width: 100%;
  height: 100px;
  border: 1px solid #ddd;
  margin-bottom: 12px;}
  
input, textarea {font: inherit;}
  
.questionAnswer {margin-bottom: 23px;}

.questionHeader {background: #eee;
  border-bottom: 1px solid #ccc;
  text-align: right;
  padding: 0 10px;}

.questionHeader .name {float: left;
  font-weight: bold;}
  
.answerHeader {font-weight: bold;}


/* -------------------- accessibility ---------------------------------------- */

h1 {font-size: 300%;
  line-height: 80%;
  text-align: right;
  padding-top: 34px;}


/* -------------------- nav engine ---------------------------------------- */

#nav, #nav ul {float: left;
  list-style: none;
  line-height: 1;}

#nav a {display: block;}

#nav li {float: left;}

#nav li ul {height: auto;
  position: absolute;
  left: -999em;}
  /* width is set in #nav section */

#nav li li {width: 100%;}

#nav li ul a {}
  /* width is set in #nav section */
    
#nav li ul ul {}
  /* margin is set in #nav section */

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li.sfhover ul ul, #nav li.sfhover ul ul ul {left: -999em;}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li.sfhover ul, #nav li li.sfhover ul, #nav li li li.sfhover ul {left: auto;}