/*
This is the pallete I'd like to switch over to
when I remove the cloud image and replace with something
more cartoony and graphic.

Dark Blue   Hex: #244574
Medium Blue Hex: #52A7DF
Light Blue  Hex: #C0D8F0
Whitish     Hex: #F0F0F0
Dark Red    Hex: #A90532 

*/

body{
        background: transparent url(../images/background.jpg) repeat scroll center center;
        margin: 0;
        padding: 0;
        font-family: Verdana,Tahoma,Arial,sans-serif;
}

#wrap{
        width: 800px;
        margin: 0 auto;
        height: 900px;
        background: #f0f0f0;
        -moz-border-radius: 3ex;
        -webkit-border-radius: 3ex;
}

#header{
        width: 800px;
        margin: 0 auto;
        background: #244574;
        -moz-border-radius: 3ex;
        -webkit-border-radius: 3ex;
}

.logo{
        float: left;
        background: #A90532;
        -moz-border-radius: 3ex;
        -webkit-border-radius: 3ex;
}

.logo img{
    margin: 20px 10px 10px 10px;
}

#navbar{
    float: right;
}

.menu ul{
        padding: .2em .3em 0 0;
        list-style: none;
}

.menu li{
        display: inline;
        font-size: 1.2em;
        padding: 0em .3em 0em 0em;
}

.menu a, .menu a visited{
        color: #C0D8F0;
        text-decoration: none;
}

.menu li a:hover, .menu li a.selected{
        color: #000;
        background: #C0D8F0;
}

#content{
        margin: -1em 5em 5em 5em;
}

#content img{
        margin: 1em;
}

#content a, #content a visited{
        color: #A90532;
}

#content h1{
        margin: -1000em 0 0 0;
        float: left;
}

#content h1, #content h2, #content h3{
        padding: 1em 0em 0em 0em;
        color: #244574;
 }

#content .photowrap{
        background: transparent url(../images/gradient_fill.png) no-repeat scroll left top;
        -moz-border-radius: 3ex;
        -webkit-border-radius: 3ex;
}

#content .leftcolumn{
        float: left;
        width: 45%;
}

#content .rightcolumn{
        float: right;
        width: 45%;
}

#footer{
        width: 800px;
        margin: 0 auto;
        background: #f0f0f0;
        text-align: center;
        font-size: .5em;
        -moz-border-radius: 6ex;
        -webkit-border-radius: 6ex;
}

/* ERROR PAGE STYLES */

div.errorpage {
    text-align: center;
    margin: 0 auto;
}

div.errorpage h2 {
    margin-top: 20px;
    font-size: 36px;
    font-weight: bold;
    line-height: 40px;
}
    

/* for clearing floats  http://positioniseverything.net/easyclearing.html */
.clearfix:after {
        content: "."; 
        display: block; 
        height: 0; 
        clear: both; 
        visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */