/*****************************/
/* basic layout              */
/* sized for 800x600 screens */
/*   780x500 internal        */
/*                           


   440  inner container height
   ---
    65  header    (60/5/0/0)
   355  left      (353/0/0/2)   
    20  footer    (23/0/0/2) 

   440  inner container height
   ---
    65  header    (60/5/0/0)
    25  righttop tabbed (50/-25/0/0)
   330  rightbody tabbed (288/0/40/2)     
    20  footer (23/0/0/2) 

   440  inner container height
   ---
    65  header      (45/30/0/0)
     0  righttop 
   355  rightbody   (333/0/20/2)
    20  footer      (23/0/0/2) 

   710  inner container width
   ---
   131  left        (130/0/0/1)
   570  right       (550/20/0/0)
   
   550  right width
   ---
   550  right/rightbody  (528/0/20/2)

(size/margin/padding/border)

*/
/*****************************/

div#maincontainer {
    width: 780px;
    height:500px;
    margin: 0px auto;
    padding:0px;
    background-image:url(background.jpg);
    background-repeat: no-repeat;
    background-position: top left;
    overflow:hidden;
}

div#innercontainer {
    width: 710px;
    height:440px;
    margin: 35px;
    margin-bottom: 25px;
    padding: 0px;
    overflow:hidden;
    position:relative;   /** set a new position context for later absolute positioning **/
}

#left {
    width:130px;
    height:353px;
    float:left;
    margin:0px;
    padding:0px;
    border-top:1px solid #CCCCCC;
    border-right:1px solid #CCCCCC;
    border-bottom: 1px solid #CCCCCC;
}

#right {
    float:left;
    width:550px;
    overflow:hidden;
    padding:0px;
    margin:0px;
    margin-left:20px;
}


/*****************************/
/* top header                */
/*****************************/

div#innercontainer div#header {
    padding: 0px;
    margin: 0px;
    height:60px; 
    margin-bottom:5px;
    overflow:hidden;    
    position:relative;  /** fix position context for later absolute positioning **/

}

div#rightheader{
    float:right;
    margin-right:5px;
}

div#time {
    text-align:right;
}

div#username {
    text-align:right;
}

div#logo {
    float:left;
}

#logo #line1 {
    color:red;
    font-weight:bold;
    font-size:18pt;
    margin-top:3px;
}

#logo #line2 {
    color:red;
    font-weight:normal;
    font-size:9pt;
    margin-top:2px;
}

#logo img {
    margin:0px;
    margin-left:0px;
    padding:0px;
    position:relative;
    top:2px;
}

div#score {
    float:left;
    text-align:center;
    border:1px red solid;
    width:100px;
    height:45px;
    margin-left:60px;
    margin-top:5px;
    font-size:8pt;
}



/*****************************/
/* left buttons             */
/*****************************/

.menugroup {
    height:351px;
    width: 130px;
}

.menugroup#simmenugroup {
    height:314px;
}

#bottommenuitem {
    margin-top:25px;
}

#bottommenuitem A {color: #666666; font-size:9pt;}

.menugroup h2 {
    font-style: normal;
    font-weight: bold;
    font-size: 12pt;
    font-family: "Helvetica", "Arial", "Verdana", "sans-serif";
    color:red;
    font-variant:small-caps;
    padding:0px;
    margin:0px;
    margin-bottom:2px;
    margin-top:10px;
}

.menugroup .menuitem {
    margin:0px;
    padding:0px;
    font-size: 12pt;
    font-weight: bold;
    color:#666666;
    width:100%;
}

.menugroup .menuitem#selectedmenuitem {
/** border-bottom:1px red solid;**/
    color:red;
}

.menugroup h2 A { text-decoration: none; color: #666666; display: block; clear: right;}
.menugroup h2 A:visited { color: #666666;}
.menugroup h2 A:hover {color: #666666;}

.menugroup .menuitem A { text-decoration: none; color: #999999; display: block; clear: right;}
.menugroup .menuitem A:visited { color: #999999;}
.menugroup .menuitem A:hover {color: red;}

.menugroup .menuitem#selectedmenuitem A { text-decoration: none; color: red; display: block; clear: right;}
.menugroup .menuitem#selectedmenuitem A:visited { color: red;}

.menugroup .selectedicon {
    width:5px;
    height:20px;
    margin:0 3px 0 0;
    padding:0px;
    margin-right:3px;
    float:left;
    /*display: inline;*/
    background:white;
}

.menugroup #selectedmenuitem .selectedicon {
    background:red;
}


/*****************************/
/* top tabs                  */
/*****************************/

/** show/hide tabs as appropriate **/

#righttop {
    display:none;
}

.tabbed #righttop {
    display:block;
}


/** need to use a negative margin since if the height is 47 the boxes don't line up properly **/
#righttop {
    float:left;
    position: relative;
    width: 100%;
    height:50px;
    width: 550px;
    margin-top:-25px;
}

#righttop ul#primary {
    margin: 0px;
    padding: 0px;
    position:absolute;
    bottom:-1px;
}

#righttop ul#primary li  {
    display: inline;
    list-style: none;
}

#righttop ul#primary a,#righttop ul#primary span,#righttop ul#primary a.current {
    width: 10em;
    display: block;
    float: right;
    padding: 4px 0px;
    margin: 1px 0px 0px 2px;
    text-align: center;
    font-family: tahoma, verdana, sans-serif;
    font-size: 85%;
    text-decoration: none;
    color: #333;
    
}

#righttop ul#primary span,#righttop ul#primary a.current,#righttop ul#primary a.current:hover {
    border: 1px solid #CCCCCC;
    border-bottom: none;
    background: #FFF3B3;
    padding-bottom: 6px;
    margin-top: 0;
}


#righttop ul#primary a {
    background: #FFFAE1;
    border: 1px solid #AAA;
    border-bottom: none;
    font-weight:normal;
}

#righttop ul#primary a:hover {
    margin-top: 0;
    border-color: #666;
    background: #FFF7CD;
    padding-bottom: 5px;
}



/*****************************/
/* main body                 */
/*****************************/

#rightbody {
    border: 1px solid #CCCCCC;
    clear: both;
    background: #FFFDF3;
    padding:0px;    
}

#body {
    padding: 10px;
    background: #FFFDF3;
    height: 333px;
    overflow:hidden;
    position:relative;   /** set a new position context for later absolute positioning **/
}

#bodyscroll {
    padding: 10px;
    background: #FFFDF3;
    height: 333px;
    overflow:scroll;
    position:relative;   /** set a new position context for later absolute positioning **/
}


.semitabbed #body {
    height: 308px;
}


.tabbed #rightbody {
    display:block;
    background: #FFF3B3;
    padding:0px;
    padding-top: 0px;
}

.tabbed #body {
    padding: 10px;
    background: #FFFDF3;
    height: 283px;
}


#body h1 {
    padding-top:0px;
    margin-top:0px;
    margin-bottom:0px;
}

#body p {
    margin-top:5px;
    margin-bottom:7px;
}

#body li {
    margin-top:1px;
    margin-bottom:10px;

}

#leanoverviewlink {
    font-weight:bold;
    color:#666666;
    font-size:11pt;
    text-align:right;
    height:19px;
    padding:0px;
    padding-top:3px;
    padding-bottom:3px;
    padding-right:10px;
}

#leanoverviewlink A {color:#666666;}
#leanoverviewlink A:visited { color: #666666;}
#leanoverviewlink A:hover {color: #666666;}

.semitabbed #leanoverviewlink {
    background:#EEEEEE;
}

/*****************************/
/* help layer                 */
/*****************************/

div.overlay {
    position:absolute;
    top:55px;
    left:25px;
    width:650px;
    height:350px;
    background-color:#F7F3AC;
    border: 2px solid #666666;
    visibility:hidden;
    overflow:hidden;
}

div.small_overlay {
    position:absolute;
    top:105px;
    left:25px;
    width:650px;
    height:250px;
    background-color:#F7F3AC;
    border: 2px solid #666666;
    visibility:hidden;
    overflow:hidden;
}

div.overlaybody {
    margin:10px;
    height:216px;
    padding:2px;
}

div.overlaybody p {
    margin-top:2px;
    margin-bottom:8px;
    font-size:11pt;
}

div.overlaybody ul {
    margin-top:2px;
    margin-bottom:8px;
    font-size:11pt;
}

div.overlaybody h1 {
    margin-top:0px;
    margin-bottom:8px;
    border-bottom:1px #CCCCCC solid;
    font-size:11pt;
}

div.overlaybody ol {
    margin-top:8px;
    margin-bottom:8px;
}

div.overlaybody ol li {
    margin-bottom:3px;
}

div.small_overlay div.overlayclose {
    position:absolute;
    top:200px;
    left:560px;
    padding:0px;
    height:30px;
}

div.overlay div.overlayclose {
    position:absolute;
    top:5px;
    left:560px;
    padding:0px;
    height:30px;
}


div#lean div.overlaybody p {
    margin-top:2px;
    margin-bottom:8px;
    font-size:10pt;
}

div#lean div.overlaybody ul {
    margin-top:2px;
    margin-bottom:8px;
    font-size:10pt;
}

div#lean div.overlaybody li {
    margin-top:10px;
}



/*****************************/
/* result pane                  */
/*****************************/

div#graph h1 {
    margin-bottom:20px;

}

ul#legends {
    margin: 0;
    margin-top:5px;
    padding: 0;
}

ul#legends li {
    font-weight:bold;
    font-size:8pt;
    list-style: none;
}


.summary {
    float:left;
    width: 240px;
    margin:0px;
    margin-top:5px; 
    padding-top:2px;

}

#summarycolumn1 {
    margin-right:20px;
}

#summarycolumn2 {
}

#summarycolumn3 {
    margin-right:20px;
}

#summarycolumn4 {
    
}

#summarywidecolumn {
    clear:both;
    width:300px;
    margin:0px;
    margin-top:15px;    
    padding-top:2px;
}

#distribution #summarywidecolumn {
    width:440px;
}

#production #summarywidecolumn {
    width:440px;
}


.summaryrowgroup {
    clear:both;
}


.summary .marketheader {
    clear:both;
    padding:0px;
    margin:0px;
    margin-top:0px;
    margin-left:160px;
    font-weight:bold;
}

.summary .row {
    clear:both;
    padding:0px;
    margin:0px;
    margin-top:3px;
    margin-bottom:2px;
    height:20px;
    font-weight:normal;
    font-size:9pt;
}

.summary .rowlabel {
    clear:both;
    padding:0px;
    margin:0px;
    height:25px;
    font-weight:bold;
    font-size:9pt;
    border-top:1px solid #CCCCCC;

}

.summary .rowlabelshort {
    clear:both;
    padding:0px;
    margin:0px;
    height:25px;
    font-weight:bold;
    font-size:9pt;
    border-top:1px solid #CCCCCC;
    width:220px;
}

.summary .row .label {
  float: left;
  text-align: left;
}

.summary .row .value {
  float: right;
  text-align: right;
  width:50px;
}

.summary .row .labeltotal {
  float: left;
  text-align: left;
  border-top:1px solid #666666;
}


.summary .row .valuetotal {
  float: right;
  text-align: right;
  width:50px;
  border-top:1px solid #666666;
}



.summary .row .action {
  width:20px;
  float: right;
  text-align:right;
}


.summary .rowlabelshort .label {
  float: left;
  text-align: left;

}

.summary .rowlabelshort .value {
  float: right;
  text-align: right;
  width:50px;

}

#summarywidecolumn .row .value {
    margin:0px;
    width:80px;
}

#summarywidecolumn .rowlabel .value {
    margin:0px;
    float:right;
    text-align:right;
    width:80px;
}
#summarywidecolumn .rowlabel .label {
  float: left;
  text-align: left;
}

.summary #summarywidecolumn .row {
    width:250px;
    }
    
.summary h2 {
    border-bottom:1px solid #CCCCCC;
    padding:0px;
    margin:0px;
    margin-top:0px;
}


/*****************************/
/* misc content              */
/*****************************/

#blockdiagram
{
    margin-top:0px;
    position:relative;
    left:50px;
    top:-5px;
    }
    
    
#intropar1 {
    border:2px solid #660000;
    padding:5px;
    width:310px;
    font-weight:bold;
}


/*****************************/
/* decisions                 */
/*****************************/

.decisioncolumn1 {
    float:left;
    width: 250px;
    margin:0px;
    margin-right:20px;
}

.decisioncolumn2 {
    margin:0px;
    float:left;
    width: 250px;
}


.decisiongroup {
    
    border:0px; 
    border-left:1px dashed #999999;
    border-right:1px dashed #999999;
    border-bottom:1px dashed #999999;
    
    padding:0px;
    padding-left:10px;
    padding-right:10px;

    margin:0px;
    margin-bottom:10px;
    
    height:280px;
}

.decisiongroup#production {
    height:255px;
}


.decisiongroupname {
    font-size:10pt;
    font-weight:bold;
    margin-top:0px;
    padding:2px;
    color:#FFFFFF;
    height:20px;
    background-color:#999999;
    border:0px;
    border-left: 1px solid #999999;
    border-right: 1px solid #999999;
}


#Decisions div.contexthelp {
    font-weight:normal;
    padding:0px;
    margin:0px;
    width:20px;
    height:20px;
    float:right;
    background-image:url(question.gif);
    background-repeat: no-repeat;
}

div.contexthelp A { text-decoration: none; }

#advancedecisions {
    text-align:center;
    margin-top:0px;
    margin-left:2px;
    padding:0px;
}

#creditmessage {
    font-weight:bold;
    display:none;
    font-size:9pt;
    color:red;
    }

#advancedecisions p {
    font-weight:bold;
}

#advancedecisions input {
    font-size:10pt;
    font-weight:bold;
    text-align:center;
    width: 220px;
}


#Decisions {
    padding:0px;
    margin:0px;
}
    
    
#Decisions .row {
    clear:both;
    padding:0px;
    margin:0px;
    margin-top:5px;
    margin-bottom:2px;
    height:45px;
}

#production .row {
    clear:both;
    height:20px;
    margin-top:0px;
    margin-bottom:0px;
}

#production .row input {
    height:13px;
    text-align:right;
    }

#production .headerrow {
    clear:both;
    padding:0px;
    margin:0px;
    margin-top:5px;
    margin-bottom:2px;
    height:14px;
    font-weight:bold;           
    font-size:8pt;
}


#production .item{
    width:95px;
    font-size:9pt;
}

#production .value {
    width:50px; 
    font-size:9pt;
}

#production .input {    
    float:right;
    padding:0px;
    margin:0px;
    font-size:9pt;
    text-align:right;
    padding-right:5px;
}

#production .input input {
    width:50px;
    font-size:9pt;
    margin:0px;
}




#Decisions  div.item {
    font-weight:bold;
    font-size:9pt;
    float:left;
    padding:0px;
    margin:0px;
}


#Decisions div.select {
    clear:both;
    padding:0px;
    margin:0px;
}

#Decisions div.value {
    float:left;
    padding:0px;
    margin:0px;
    margin-right:15px;
    text-align:left;
}    

#Decisions div.value input {
    width:50px;
    text-align:right;
}   

#Decisions div.label {
    padding:0px;
    margin:0px;
    float:left;
    font-size:8pt;
    padding-top:3px;
}    


#capitalrow {
    clear:both;
    padding:0px;
    margin:0px;
    font-weight:bold;
    border-top:1px solid #CCCCCC;
}

/*****************************/
/* post score page             */
/*****************************/



#PostScore .row {
    clear:both;
    padding:0px;
    margin:0px;
    margin-top:5px;
    margin-bottom:2px;
}

#PostScore .row .label {
    font-weight:bold;
}

#PostScore .row .item {
    width:60px;
    font-size:9pt;
}

#congratulations
{
    font-style:italic;
    font-weight:bold;
}

#pleaseshare
{
    padding-top:3px;
    padding-bottom:10px;
    margin-top:10px;
    margin-bottom:10px;
}

#pleaseshare textarea
{
    width:95%;
    margin-top:10px;
}


/*****************************/
/* high score list           */
/*****************************/

#scorelist {
    width:96%;
    margin:0px;
    margin-top:10px;
}

table#scorelist td {
    padding:3px;
    height:30px;
    vertical-align:top;
}

table#scorelist tr.odd td {
    background-color:#CCCCCC;
}

table#scorelist tr.even td {
    background-color:#eeeeee;
}


#navigate {
    margin:0px;
    margin-top:10px;
}

/*****************************/
/* overview page             */
/*****************************/

.column {
    float:left;
}

#overviewcolumn1 {
    width:400px;
}
#overviewcolumn2 {
}


#overviewcolumn1 .row {
    clear:both;
    padding:0px;
    margin:0px;
    margin-top:3px;
    margin-bottom:2px;
    height:20px;
    font-weight:normal;
    font-size:9pt;
    width:350px;
}

#overviewcolumn1 .rowlabel {
    clear:both;
    padding:0px;
    margin:0px;
    height:15px;
    border-top:1px #CCCCCC solid;
    margin-top:15px;
    font-weight:bold;
    font-size:9pt;
    width:330px;
}

#overviewcolumn1 .rowlabel .label {
  float: left;
  text-align: left;
}

#overviewcolumn1 .rowlabel .value {
  float: right;
  text-align: right;
  width:70px;
}

#overviewcolumn1 .row .label {
  float: left;
  text-align: left;
}

#overviewcolumn1 .row .value {
  float: right;
  text-align: right;
  width:70px;
}

#overviewcolumn1 .row .action {
  width:20px;
  float: right;
  text-align:right;
}

#messagebox {
    height:50px;
    width:350px;
    margin:0px;
    margin-top:10px;
    padding:5px;
    background-color: #EEEEEE;
    border: 1px solid #666666;

}

#urgent #messagebox {
    background-color: #F7F3AC; 
    border: 2px dashed red;
}



/*****************************/
/* big navlink               */
/*****************************/

div#navbox {
    position:absolute;
    top:325px;
    left:10px;
    padding:0px;    
    margin:0px;
    font-size:12pt;
    font-weight:bold;
    color:red;
    width:400px;
}

#navbox a {
    padding:0px;
    margin:0px;
}

#rightarrow {
    margin:0px;
    display:inline;
    padding-left:5px;
}

#rightnavlabel {
    margin:0px;
    display:inline;
}

#navbox A { text-decoration: none; color: red;}
#navbox A:visited { color: red;}
#navbox A:hover {color: red;}



/*****************************/
/* registration pane         */
/*****************************/

#registration {
    margin:0px;
    padding:0px;
}

#registration p {
    margin:0px;
    margin-bottom: 5px;
}

#registration h1 {
    margin:0px;
    margin-bottom:5px;
}

#registration #leftsplit {
    float:left;
    width:280px;
    margin:0px;
    padding:0px;
    overflow:hidden;
}
#registration #rightsplit {
    float:left;
    margin:0px;
    padding:0px;
    width:220px;
    overflow:hidden;
}

#registration #rightsplit select {
    width:205px;
}

#registration #rightsplit input {
    width:180px;
}

#registration .row {
    clear:both;
    padding-top:10px;
    padding-bottom:5px;
    margin:0px;
    overflow:hidden;
    height:35px;
}

#registration .row .col {
    margin:0px;
    padding:0px;
    float:left;
    overflow:hidden;
}


div#first input { width:95px; }

div#last input { width:95px; }

div#address input { width:230px; }
div#address .input#address2 { margin-top:2px; }

div#company input { width:210px; }

div#city { width:120px; }
div#city input { width:80px; }

div#state { width:150px; }
#registration .row #state input { width:100px; }

div#zip { width:100px; }
div#zip input { width:60px; }

#registration .row #country select { width:245px; }

#registration .row#checkbox {
    height:90px;
    font-size:8pt;
    font-weight:normal;
    text-align:left;
}

#registration .row#checkbox input {
    width:20px;
    margin-left:0px;
    margin-right:0px;
}


#registration #doublerow {
    height:60px;
}


#registration div.label {
    margin:0px;
    padding:0px;
    padding-left:15px;
    font-weight:normal;
    font-size:8pt;

}

#registration div.inputreq {
    padding-left:15px;
    background-image:url(requiredstar.gif);
    background-repeat: no-repeat;
}

#registration div.input {
    padding-left:15px;
}


#registration #navbox
{
    top:330px;
    left:325px;
}


#regtest {
    position:absolute;
    top:40px;
    left:550px;
    width:200px;
}

#regtest a
{
    font-size:8pt;
    font-weight:bold;
}


/*****************************/
/* footer                     */
/*****************************/


div#footer {

    clear: both;
    text-align:right;
    height:18px;
    padding-top:2px;
    padding-right:5px;
}


#footer #legal {
    float:left;
}

#footer #tagline {
    float:right;
    font-style: italic;
}

#footer  {
    font-size: 8pt;
}


a.info{
    position:relative; /*this is the key*/
    z-index:0;
    font-weight: normal;
    border-bottom-style: dotted;
    border-bottom-width: 1px;
    border-bottom-color: #666;
    text-decoration:none
    }

a.info:hover{z-index:25; background-color:#ff9;}

a.info span{display: none}

a.info:hover span{ /*the span will display just on :hover state*/
    display:block;
    font-size: 12px;
    position:absolute;
    top:2em; left:2em; width:19em;
    border:1px solid #666;
    background-color:#ff9; color:#000;
    text-align: left;
    font-weight: normal;
    padding: 3px 6px 3px 6px;}





a.infotop{
    position:relative; /*this is the key*/
    z-index:24;
    font-weight: normal;
    border-bottom-style: dotted;
    border-bottom-width: 1px;
    border-bottom-color: #666;
    text-decoration:none
    }

a.infotop:hover{z-index:25; background-color:#ff9;}

a.infotop span{display: none}

a.infotop:hover span{ /*the span will display just on :hover state*/
    display:block;
    font-size: 12px;
    position:absolute;
    top:-5em; left:2em; width:19em;
    border:1px solid #666;
    background-color:#ff9; color:#000;
    text-align: left;
    font-weight: normal;
    padding: 3px 6px 3px 6px;}


a.infotopbig{
    position:relative; /*this is the key*/
    z-index:24;
    font-weight: normal;
    border-bottom-style: dotted;
    border-bottom-width: 1px;
    border-bottom-color: #666;
    text-decoration:none
    }

a.infotopbig:hover{z-index:25; background-color:#ff9;}

a.infotopbig span{display: none}

a.infotopbig:hover span{ /*the span will display just on :hover state*/
    display:block;
    font-size: 12px;
    position:absolute;
    top:-10em; left:2em; width:19em;
    border:1px solid #666;
    background-color:#ff9; color:#000;
    text-align: left;
    font-weight: normal;
    padding: 3px 6px 3px 6px;}



a.infotopright{
    position:relative; /*this is the key*/
    z-index:24;
    font-weight: normal;
    border-bottom-style: dotted;
    border-bottom-width: 1px;
    border-bottom-color: #666;
    text-decoration:none
    }

a.infotopright:hover{z-index:25; background-color:#ff9;}

a.infotopright span{display: none}

a.infotopright:hover span{ /*the span will display just on :hover state*/
    display:block;
    font-size: 12px;
    position:absolute;
    top:-10em; left:2em; width:19em;
    border:1px solid #666;
    background-color:#ff9; color:#000;
    text-align: left;
    font-weight: normal;
    padding: 3px 6px 3px 6px;}



