/* @override http://elginschool-council.org/css/layoutStyles.css */

/** { 
padding: 0; 
margin: 0; 

}*/ 
body {
	font: 80% "Lucida Grande", Lucida, Verdana, sans-serif;
} 

p {
color: #7a7a7a;
/*border: 1px solid #1ffa3e;*/

}
a {
list-style: none;
text-decoration: none;

}
h1, h2, h3, h4 {
/*margin: 0 0 10px;*/
/*padding: 0 0 5px;*/
color: #7a7a7a; 
padding: 0 0 5px;
margin: 0; /*I'm not sure why this controls the padding/margin around the headers.*/
}
ul {
/*list-style-type: disc;*/
list-style-type: none;
list-style: none;
padding: 0;
/*display: block;*/
}

li {
/*list-style: none;*/
text-decoration: none;
color: #7a7a7a;
line-height: 1.2em;
padding-left: 5px;
list-style-type: none;
list-style: none;
/*list-style-type: square;
list-style-position: inside;*/
/*opacity: 1;*/
} 

/*h1 {
color:#7a7a7a;
padding-bottom: 8px;

}*/

#wrapper { 
margin: 0 auto;
/*padding: 10px;*/ 
width: 950px; 
/*The following I think fixes an ie issue that was not even present*/
min-height: 100%;
height: auto !important;
    /*height: 100%;*/
z-index: 100;
    
} 


#header { 
/*color : #333;*/ 
width: 950px; 
/*height: 294px;*/
padding: 0; 
/*margin: 0;*/ 
clear: left;
float: left;
/*background-image: url(../images/darkGreyHeaderLighter.gif);*/
background-color: #fff;
position: relative;
z-index: 200;
}
 
#header  {
/*padding: 0 0 30px;*/

background-image: url(http://elginschool-council.org/images/layoutHeader21.jpg);
/*height: 294px; actual size*/
height: 270px;
position: relative;
}
img {
padding: 0;
border: none;
border-style: none;
}
#navigation {

width: 950px; /*Play with this to try and bring in the search*/ 
height: 35px;
clear: both;
float: left;
background-color: #000;
/*height : 122px;*/ 
/*display: inline;*/
/*position: absolute;
top: 200px;*/
 /*THis could be a problem I think*/
padding-top: 10px; /*make #search the same in padding*/ 
margin-bottom: 9px;
padding-bottom: 0;
/*background-color: #5a5b5f;*/
z-index: 2000;
/*background-image: url(../images/darkGreyHeaderLighter.gif);
background-color: #6d6e72;*/
} 

/*.navigation li, a { 

list-style: none; 
text-decoration: none;
color: #0a2f57;
}*/

.navigation {
/*width: 48%;*/ 
/*width: 950px;
height: auto; */
display: block;
/*position: relative;*/
padding-left:10px;
}

.navigation ul { 

text-align: left; 
} 
.navigation li { 
padding: 0 8px 0 0; 
font-weight: bold; 
font-size: 1.2em;
letter-spacing: .1em;
/*display: inline;
position: relative;*/ 
display: inline;
position: relative;
} 
.navigation li a { 

color: #fff; 
display: inline;
position: relative;
text-decoration: none; 
/*font-size: 1em;*/ 
} 
.navigation li a:hover { 
text-decoration: underline; 
/*font-weight: bold;*/
color:#983fc6;
display: inline;
position: relative;
} 

#midDisplay {
/*width: 950px;
height: 430px; turning this on creates Float Drop.*/
width: 950px;
padding-top: 15px;
clear: both;
float: left;
z-index: 50;
}

#TwomidDisplay {
/*maybe I don't need this, it could be fine*/
padding-top: 15px;
padding-bottom: 0;
margin: 0;
width: 950px;
clear: both;
float: left;
/*width: 950px;*/
/*background-color: #5a5b5f;
z-index: 350;*/
}
.flashelement img {
padding: 0;
margin: 0;

}
#news {
clear: both;
float: left;
width: 950px;
height: auto;
min-height: 8em;
padding-bottom: 10px;
padding-top: 30px;
background-color: #ccc;
}
#logoholder {
position: absolute;
z-index: 10;
top: 0;
}

/*========================================================
Columns and their placement.
*/

#allCols {
clear: left;
float: left;
padding: 15px 0 10px;
margin:0;
width: 950px;
/*height: 200px;*/
height: auto;
/*height: 200px; not important enough to turn on the longest column will determine the total height.
font: normal 1em Georgia, "Times New Roman", Times, serif;  */
display: block;
position: relative;
z-index: 900;
}


#TwoallCols {
clear: both;
float: left;
padding: 15px 0 10px;
margin: 0;
width: 950px;
/*height: 200px;*/
height: auto;
/*height: 200px; not important enough to turn on the longest column will determine the total height.
font: normal 1em Georgia, "Times New Roman", Times, serif;  
display: block;*/
position: relative;
z-index: 450;
}

.TwoallCols p {
/*font: normal 1em Georgia, "Times New Roman", Times, serif;*/ 

}
#colLeft { 

color: #7a7a7a; 
margin: 0 15px 20px 0; 
padding: 0; 
width: 300px; 
/*clear: both;*/
float: left; 
/*display : block; 
position : relative;*/
z-index: 400;
 
}

#colMid { 
/*display : inline;*/ 
margin: 0 15px 20px 0; 
padding: 0; 
width: 300px; 
float: left; 
/*display : block; 
position : relative;*/ 
}

#colRight { 
/*display : inline;*/ 

color: #7a7a7a; 
margin: 0 15px 20px 0; 
padding: 0; 
width: 300px;
clear: none; 
float: left;
z-index: 600;

/*display : inline; 
position : relative;*/  
}

div#TwocolLeft { 
/*display : inline; 
color: #7a7a7a; */
/*margin: 0 15px 20px 0;*/ 
padding: 0 15px 20px 10px; 
width: 550px; 
/*clear: both;*/
float: left;
clear: both;
/*display : inline; 
position : relative;*/
z-index: 500;
 
 
} 
#search { 
width: 100px;
height: 25px;
/*clear: left;*/ 
float: right;
color: #fff;
/*width: 200px;
height: 25px;*/
margin: 0;
padding: 30px 0 0;
z-index: 150;
}

#input {
/*width: 200px;
height: 25px;
clear: both; 
float: right;
color: #fff;
margin-right: 10px;
padding: 0;*/
}

/*============================================
footer ============*/
 
#footer { 
width: 950px;
min-height: 100%;
height: auto !important; 
clear: both; 
float: left;
color: #000; 
/*border-bottom : 15px solid #c9c3b7;*/ 
margin : 0; 
padding : 30px 0 15px;
line-height: 2em;
/*border-top : 1px dotted #c9c3b7;*/ 
/*display: inline;
position: relative;*/

}
#leftcontent { 
clear: left;
float: left; 
text-align: left; 
width: 38%;
font-size: .9em; 
} 
#rightcontent { 
clear: right;
float: right; 
text-align: right; 
width: 58%; 
/*min-height: 100%;
    height: auto !important;*/
display: inline;
position: relative;
z-index: 18;
} 


.imgAd {
width: auto;
float: right;
clear: both;
margin: 5px;
padding: 5px 5px 5px 10px;

}
a.imgAdSmall {
padding: 0;
}
.imgAdSmall {
width: auto;
float: right;
margin: 5px;
padding: 10px 10px 35px;
}
.floatRight {
float: right;
}