html, body
{
    height: 100%;
}
body
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 100%;
    min-width: 950px;
    background-image: url('/images/FoggyTreeBackground3.jpg');
    /*background-image: url('images/TreeOnHill.jpg');*/
    background-position: center top;
    background-repeat: no-repeat;
    background-color: #000507;
}
#MainContent
{
    height:100%;
    min-height:100%;
    width: 950px;
    margin: 0 auto;
    font-size: 0.8em;
}

/* Layout */
#Header
{
    height: 150px;
    padding: 0px 0px 5px 0px;
}
#HeaderLogo
{
    margin-top: 0px;
    float: left;
}
#HeaderNav
{
    margin-top: 0px;
    float: right;
    text-align: right;
    font-size: 1.3em;
    color: #AAB5B7;
}
#HeaderTitle
{
    padding: 0px 0px 0px 0px;
}
#HeaderNav a, a.SubNav
{
    color: #8CC63E;
    text-decoration: none;
}
#HeaderNav a:hover, a.SubNav:hover
{
    color: #F69D28;
    text-decoration: none;
}
#HeaderNav a.NotALink
{
    color: #F69D28;
    text-decoration: none;
}
#SubNavigation a.NotALink
{
    color: #F69D28;
    text-decoration: none;
}
#BodyContent
{
    background-color: transparent;
    border-left: 1px #000507 solid;
    border-right: 1px #000507 solid;
    border-top: 1px #000507 solid;
    border-bottom: 1px #000507 solid;
    text-align:justify;
}
#BodyLeftColumn
{
    background: transparent;
    float: left;
    width: 215px;
    text-align: center;
    height: 100%;
    padding: 10px 20px 0px 10px;
    border-right: 1px #BBAFBE solid;
}
#BodyRightColumn
{
    background: transparent;
    float: right;
    width: 655px;
    padding: 10px 10px 0px 10px;
}
#Footer
{
    clear: both;
    text-align: center;
    padding-top: 20px;
    margin: 0 auto;
}
#SubNavigation
{
    text-align: left;
    margin: 0 0;
    font-size: 1.1em;
    font-weight: bold;
}
/* Elements */
img
{
    border: 0px;
}
hr
{
    width: 90%;
}
h1
{
    font-size: 1.5em;
}
h2
{
    color: #19B7EA;
}
h2, .largest
{
    font-size: 1.5em;
}
.h3
{
    font-style: italic;
}
.p
{
    padding-bottom: 10px;
}
/* General styles */
.dzf
{
    height: 84px;
    width: 186px;
    position: relative;
}
.aor
{
    font-family: "Times New Roman" , Times, serif;
    color: #000000;
    text-decoration: none;
}
.larger
{
    font-size: 1.25em;
}
.smaller
{
    font-size:0.9em;
}
.defaulttitle
{
    text-align:center;
}
.CurrentPageNav
{
    color: #F69D28;
}
.emphasis
{
    font-style: italic;
    font-weight: bold;
}
.footnote
{
    font-style: italic;
    position:relative;
    top:-10px;
}
.opaque
{
    zoom: 1;
    z-index: 10;
    opacity: 1;
    filter: apha(opacity=100);
}
.BodyLeftPanel
{
    float:left;
    text-align:center;
    width:170px;
}
.FundraisingLeftPanel
{
        float:left;
    width:454px;
}
.BodyRightPanel
{
    float:right;
    width:480px;
}
.FundraisingRightPanel
{
    float:right;
    width:196px;
    text-align:center;
}

/* Gradients */
.wrapper
{
    background-color: transparent;
}
.wrapper:after
{
    content: "";
    display: block;
    font-size: 0px;
    line-height: 0px;
    height: 0px;
    clear: both;
    visibility: hidden;
}
.mod
{
    width: 100%;
    position: relative;
    margin: 0 0 0 0;
    z-index: 0;
}
.mod .mod-content
{
    padding: 10px;
    position: relative;
    z-index: 2;
}
.mod-content
{
    background-color: #DADFEE;
    background-image: url(/images/white_gradient.png);
    background-position: 0 0;
    background-repeat: repeat-x;
    _background: #DADFEE;
    _height: 0px; /* IE6...don't really know why this works */
    opacity: .88;
    filter: alpha(opacity=88);
}
img.mod-content
{
    background-color:#000000;
}

#Gradient
{
    _padding-bottom: 6px;
    _overflow-y: hidden;
}
#Gradient .s1
{
    /*opacity layer*/
    display: block;
    background-color: #aaadaf;
    background-image: url(/images/blue_gradient.png);
    background-position: 0 100%;
    background-repeat: repeat-x;
    _background: #ffffff;
    width: 100%;
    height: 100%;
    _height: 2000px;
    position: absolute;
    _bottom: 6px;
    opacity: .70;
    filter: alpha(opacity="70");
}
#Gradient .s2
{
    /*offsets shadow by 6px*/
    display: block;
    width: 100%;
    height: 100%;
    overflow: hidden;
    position: absolute;
    top: 6px;
    left: 6px;
    _top: auto;
    _bottom: -6px;
}
#Gradient .s3
{
    display: block;
    border: 6px solid #000;
    border-top: 0;
    border-left: 0;
    width: 100%;
    height: 100%;
    _height: 2000px;
    position: relative;
    bottom: 6px;
    right: 6px;
    opacity: .30;
    filter: alpha(opacity="30");
}

/* x1 = top and left edges; 
   x1a = top right corner; 
   x2 = right and bottom edges; 
   x2a = bottom left corner */

#Gradient .x1, #Gradient .x1a, #Gradient .x2, #Gradient .x2a
{
    display: block;
    background: url(/images/glow.png) no-repeat;
    _background: transparent;
    width: 100%;
    height: 100%;
    position: absolute;
}
#Gradient .x1
{
    background-position: 0 0;
    z-index: -2;
    top: -10px;
    left: -10px;
    bottom: 0;
    padding: 0 10px 10px 0;
}
#Gradient .x1 .x1a
{
    height: 10px;
    width: 10px;
    background-position: 100% 0;
    right: -10px;
    top: 0;
}
#Gradient .x2
{
    background-position: 100% 0;
    z-index: -1;
    bottom: -10px;
    right: -10px;
    padding: 10px 0 0 10px;
}
#Gradient .x2 .x2a
{
    height: 10px;
    width: 10px;
    background-position: 0 100%;
    left: -10px;
    bottom: 0;
}
