body{
	background:#000 url(../images/background.jpg) 50% 0% no-repeat;
	text-align:center;
	font-family:sans-serif;
	line-height:1.5em;
}

#pageWrap{
background:transparent;
width:862px;
padding:10px;
margin:10px auto;
text-align:left;
}


#pageBody{
background:#e6e6e6;
width:860px;
}

#home #pageBody{
background:transparent;
width:862px;
}

.leftCol{
width:480px;
float:left;
padding:20px;
}


.rightCol{
width:300px;
border:1px solid #000;
background:#fff;
margin-left:0px;
display:inline;
float:left;
}

#home .leftCol{
width:479px;
background:#e6e6e6;
color:#444;
padding-top:0;
}

#home .leftCol h3{
color:#000;
}

#home .leftCol h2{
color:#000;
}

#home .rightCol{
float:left;
width:310px;
color:#555;
margin-top:20px;
margin-left:10px;
}

.rightCol div.sideBox{
padding:0;
margin:4px;
background:transparent;
border:none;
}

#calendar .rightCol{
width:280px;
border:1px solid #000;
background:#fff;
margin-right:14px;
display:inline;
float:right;
}

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

Styles for the header bar

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

#header{
border-bottom:1px solid #dfdfdf
}        
        
#logo{
Width:419px;
height:146px;
}     

   
#featureImage{
width:860px;
height:172px;
background:url(../images/homeFeaturePlain.jpg) no-repeat;
border:1px solid #fff;
position:relative;
}

#featureImage h1{
width:400px;
margin-top:20px;
margin-left:20px;
color:white;
}


#featureImage .apeel_img_controls{
position:absolute;
top:0px;
left:0px;
}

#featureImage .apeel_img_controls a{
background:white;
padding:3px;
}

#bigNav{
background:white;
}

#bigNavFirst{
float:left;
width:282px;
height:30px;
/*border:1px solid #fff;*/

}

#bigNavFirst a{
display:block;
width:282px;
height:30px;
background:url(../images/grandProductions.jpg) no-repeat;
}

#bigNavFirst span{
display:none;
}

#bigNavFirst a:hover{
background-position:-281px;
}

#bigNavSecond{
float:left;
width:290px;
height:30px;
/*border:1px solid #fff;*/

}

#bigNavSecond span{
display:none;
}

#bigNavSecond a{
display:block;
width:290px;
height:30px;
background:url(../images/operaEducation.jpg) no-repeat;
}

#bigNavSecond a:hover{
background-position:-289px;
}

#bigNavThird{
float:left;
width:290px;
height:30px;
/*border:1px solid #fff;*/
}

#bigNavThird span{
display:none;
}

#bigNavThird a{
display:block;
width:290px;
height:30px;
background:url(../images/operaCommunity.jpg) no-repeat;
}

#bigNavThird a:hover{
background-position:-289px;
}

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

Styles for the top menu

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

#menu{ 
background:#000;
margin-top:10px;
width:860px;
border:1px solid #fff;
margin-bottom:3em; 
}

#home #menu{
margin-bottom:10px;;
}
        #menu ul{
        list-style:none;
        margin:0px;
        padding:0px;
        margin-left:10px;
        }

        #menu ul li{
        float:left;
        padding:0px;
	margin:0px;
        }

	
        #menu li a{
        font-variant:small-caps;
        text-decoration:none;
        display:block;
        margin:2px 12px;
        padding:5px;
        color:#fff;
        }

	#menu li.current a{
		color:red;
	}

        #menu li a:hover{
        color:red;
        }


#secondaryMenu{
background:#000;
margin:0px;
width:860px;
margin-bottom:1em; 
}

#home #secondaryMenu{
display:none;
}

        #secondaryMenu ul{
        list-style:none;
        margin:0px;
        padding:0px;
        }

        #secondaryMenu ul li{
        float:left;
        padding:0px;
	margin:0px;
        }

	
        #secondaryMenu li a{
        font-variant:small-caps;
        text-decoration:none;
        display:block;
        margin:2px 15px;
        padding:5px;
        color:#fff;
        }

	#secondaryMenu li.current a{
		color:red;
	}

        #secondaryMenu li a:hover{
        color:red;
        }

#homeFeaturesOuter{
background:url(../images/homeBigFeatTile.jpg) repeat-y;
width:862px;
display:block;
border-top:1px solid #fff;
border-bottom:1px solid #fff;
}

#homeFeaturesMiddle{
width:862px;
background:url(../images/homeBigFeatBottom.jpg) bottom no-repeat;
}

#homeFeaturesInner{
width:862px;
background:url(../images/homeBigFeatTop.jpg) top no-repeat;
}

#featFirst{
float:left;
width:260px;
padding:10px;
}

#featImgFirst{
float:left;
border:1px solid #fff;
margin-right:6px;
}

#featSecond{
float:left;
width:268px;
padding:10px;
display:block;
}

#featImgSecond{
float:left;
border:1px solid #fff;
margin-right:6px;
}

#featThird{
float:left;
width:268px;
padding:10px;
display:block;
}

#featImgThird{
float:left;
border:1px solid #fff;
margin-right:6px;
}

#homeLowerArea{
background:#e6e6e6;
border:1px solid #fff;
margin-top:30px;
width:860px;
}

#lowerFirst{
width:280px;
border:1px solid #fff;
}

#lowerSecond{
width:288px;
border:1px solid #fff;
}

#lowerThird{
width:288px;
border:1px solid #fff;
}

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

Styles for the footer

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


#footer{
text-align:right;
background:#242424;
border:1px solid #fff;
padding: 8px 6px;
color:#fff;
}

#footer #apeelLogo{
display:none;
}


/***********************
* Paginiation, for blogs
* and tags
************************/

.pagination{
background:#eee;
padding:10px;
border:1px solid #ccc;
border-left:0px;
border-right:0px;
text-align:center;
margin:10px 0px;
}

.pagination a{
border:1px solid #ccc;
padding:3px 8px;
margin:3px;
}

.pagination a:hover{
background:#ccc;
color:black !important;
}


/*************************
* Tag cloud
**************************/

.tag1 {font-size: 1.0em;}
.tag2 {font-size: 1.2em;}
.tag3 {font-size: 1.4em;}
.tag4 {font-size: 1.6em;}
.tag5 {font-size: 1.8em;}
.tag6 {font-size: 2.0em;}

/*********************************
*Coments
**********************************/

.comment{
border-bottom:1px solid #eee;
padding:10px 0px;
width:100%;
}

.comment .author{
float:left;
width:200px;
margin:10px;
}

.comment .author_name{
margin-bottom:10px;
}

.comment .date{
margin-top:10px;
}

.comment .content{
margin-left:220px;
}

/*****************************
* Blog layout
******************************/

#blogMainArea{

}

#blogSidebar{

}

.post{
background: transparent url(../images/shadow_line.gif) 0 100% no-repeat;
padding-bottom:30px;
margin-bottom:10px;
}

.post .grav_img{
float:left;
margin-right:10px;
margin-bottom:10px;
}

.post .body{
clear:left;
}

.postInfo h3, .postInfo h5{
border-bottom:0px;
margin:0px;
}

.postInfo .grav_img{
float:left;
margin-right:10px;
margin-bottom:10px;
}

.postBody{
clear:left;
}


.decoyEmail{
display:none;
}
/***********************
**Some general form stuff
************************/


ul.form_errors{ 
                border:1px solid red;
                background:#fdd;
                padding:10px;
                padding-left:30px;
                }

.submitted_ok{ 
                border:1px solid green;
                background:#dfd;
                padding:10px;
                padding-left:30px;  
                margin:10px;
 }

input.form_error,textarea.form_error,select.form_error{ 
                  border:2px inset red;
                  background:#fdd;
                  }

            
/*********************
*This allows fluid images
***********************/
img.full{
max-width:100%;
}

table td img.full{
width:100%;
}
            
            
    /***********************
    * Clearfix rules
    ************************/
        .clearfix {
	 display:inline-block;
	}
	.clearfix:after {
	 display:block; 
	 visibility:hidden; 
	 clear:both; 
	 height:0; 
	 content: "."; 
	}

