/*******************************************************************************
* Backdrop (body)
*******************************************************************************/
#backdrop {
    background: #fff url(../images/bkd-grey-gradient.jpg) repeat-x;
    margin: 0;
}

/*******************************************************************************
* Header
*******************************************************************************/
#header {
    background: #fff url(../images/sub-top-grey-gradient.gif) repeat-x;
    width: 782px;
    height: 86px;
    margin: 0 auto;
}

#header .logo {
    float: left;
    padding: 11px 0px 0px 242px;
}

#header .nav {
    float: right;
    padding: 15px 22px;
    margin-top: 40px;
    color: #666;
    font-size: 8pt;
}

#header .nav a {
    color: #666;
}

/*******************************************************************************
* Canvas
*******************************************************************************/
#canvasOuter {
    background: url(../images/sub-bkd-middle.gif) repeat-y;
    width: 782px;
    margin: 0 auto;
}

#canvasInner {
    position: relative;
    background: url(../images/sub-bkd-top.jpg) no-repeat;
    min-height: 75px;
    height: auto !important; /* emulate min-height... */
    height: 75px;           /* ...in IE6             */
}

/*******************************************************************************
* Leftnav
*******************************************************************************/
#leftnav {
    float: left;
    display: inline; /* fix for IE6 doubling margins of floated elementes */
    background: url(../images/leftnav/leftnav-middle.gif) repeat-y;
}

#leftnavOuter {
    background: url(../images/leftnav/leftnav-top.gif) no-repeat;
}

#leftnavInner {
    background: url(../images/leftnav/leftnav-bottom.gif) no-repeat bottom left;
    padding: 26px 0 26px 25px;
    width: 166px;
}

/*******************************************************************************
* Main content
*******************************************************************************/
#main {
    float: left;
    margin: 48px 0 0 10px;
    padding-bottom: 8px;
    width: 382px;
}

#main h1 {
    padding-bottom: 18px;
    background: url(../images/yellow-swoosh.gif) no-repeat left bottom;
    margin: 0;
    color: #cb3331;
    font-weight: normal;
    font-size: 14pt;
}

#main h2 {
    font-weight: bold;
    font-size: 11pt;
    margin-bottom: 0;
}

#main h3 {
    font-weight: normal;
    font-size: 10pt;
}

/*******************************************************************************
* Spotlights
*******************************************************************************/
#spotlights {
    float: left;
    margin: 80px 0 0 32px;
    width: 167px;
}

/*******************************************************************************
* Footer
*******************************************************************************/
#footer {
    background: #fff url(../images/sub-bkd-bottom.gif) no-repeat;
    width: 542px; /* 782px - 240px padding = 542px */
    height: 57px; /* 125px - 68px padding = 57px*/
    margin: 0 auto;
    color: #666;
    font-size: 8pt;
    padding: 68px 220px 0px 20px;
}

#footer a {
    color: #666;
}

/*******************************************************************************
* General formatting
*******************************************************************************/
body {
    font-family: Tahoma, Verdana, Arial;
    font-size: 10pt;
}

a {
    color: #157251;
}

.footnote {
    font-size: 8pt;
}

/*******************************************************************************
* Styling of tabbed interfaces (used with jQuery idTabs plugin)
*******************************************************************************/
.tabRows {
    margin-bottom: 12px;
}

.tabRows .tabRow {
    width: 362px;
    height: 46px;
    margin: 0 auto;
}

.tabRows .tabRow .tab {
    display: block;
    float: left;
    width: 165px; /* 181px - 16px padding = 165px */
    height: 16px; /* 46px - 30px padding = 16px */
    padding: 15px 8px;
    background: url(../images/tab-button-bkd.gif) no-repeat;
    text-align: center;
    text-decoration: none;
    font-size: 9pt;
}

.tabRows .tabRow .tab.twoLines {
    height: 31px; /* 46px - 15px padding = 31px */
    padding: 8px 8px 7px 8px;
}

.tabRows .tabRow .tab.selected {
    background-position: -181px;
    font-weight: bold;
}

.tabContents {
    clear: both;
}

.tabContents div,
.tabContents div p {
    margin-top: 0;
    background: #fff;
}

/*******************************************************************************
* Styling of modal windows (used with jQuery jqModal plugin)
*******************************************************************************/
.jqmWindow {
    display: none;
    
    position: fixed;
    top: 17%;
    left: 50%;
    
    margin-left: -300px;
    width: 600px;
    
    background-color: #EEE;
    color: #333;
    border: 1px solid black;
    padding: 12px;
}

.jqmOverlay { background-color: #000; }

/* Fixed positioning emulation for IE6 */
* html .jqmWindow {
     position: absolute;
     top: expression((document.documentElement.scrollTop || document.body.scrollTop) + Math.round(17 * (document.documentElement.offsetHeight || document.body.clientHeight) / 100) + 'px');
}