/*
Theme Name: Boys and Girls Club

*/


@charset "UTF-8";
/* CSS Document */

* {
margin:0px;
padding:0px;
}

a:focus, :active {
outline: 0;
border: 0;

}


body {
	background-image: url(images/BG.jpg);
	font-family: "Trebuchet MS",Verdana, Arial, Helvetica, sans-serif;
	font-size:14px;
	color:#515151;
}

a,.date {
color: #0d9daa;
}


h1 {
font-size:30px;
font-weight:normal;
margin-bottom:20px;
color:#272727;
}

h2 {font-size:24px;
font-weight:normal;
margin:10px 0px 20px 0px ;}

p {margin-bottom:6px;}

h3, h3 a  {
text-decoration:none;
color:#0e0e0d;
margin-bottom:6px;
}

#wrap {
	width:960px;
	margin-left:auto;
	margin-right:auto;
	background-image: url(images/top_BG.jpg);
	background-repeat: no-repeat;
	background-position: right top;
	overflow: auto;
} 

#header {
margin:20px 0px 20px 0px;
overflow:auto;
}

.logo {
	background-image: url(images/logo.gif);
	height: 56px;
	width: 227px;
	text-indent: -9999px;
	display: block;
	float:left;
}

.utility {float:right; margin-top:10px;}
ul.utility li {float:left; list-style-type:none;}
ul.utility li a {color:#333333; text-decoration:none; padding:5px;}

#nav {
	clear:both;
	background-image: url(images/nav_BG.jpg);
	height: 45px;
	margin-bottom: 1px;
}

#nav ul {margin-left:5px;}
#nav ul li {float:left; list-style-type:none; display:block; position:relative;}

#nav ul li a {
display:block;
padding:6px 10px 6px 10px;
text-decoration:none;
color:#FFFFFF;
margin:8px 8px 0px 8px;
}

#nav ul li a:hover ,#nav ul li a:active , #nav ul li:hover a  {
 -moz-border-radius: 4px;
-webkit-border-radius: 4px;
background-color:#790003;
}


#nav ul ul {display:none; position:absolute; top:32px; left:8px; margin:0px; padding:0px; min-width:180px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
z-index: 99999;
}
#nav ul li:hover ul { display:block; background-color:#790003;padding-bottom:10px; z-index: 99999;}
#nav ul li:hover ul li {clear: left; min-width:180px;}
#nav ul li:hover ul li a:hover{ 
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
background-color:red;}

#illustration a img { border:none;}

#mission {
	background-image: url(images/mission_statement.jpg);
	height: 107px;
	margin-bottom:20px;
	
	clear:both;
}

#mission p {float:left; width:570px; padding:30px 20px 20px 20px;}
#mission ul {float:right; margin:45px 45px 0px 0px ;}

#mission ul li {float:left; list-style-type:none;}
#mission ul li a {color:#333333; text-decoration:none; padding:5px;}




.involved {
width: 310px;
float:left;
margin:0px 20px 0px 0px;
font-size:12px;
}

.social { width:150px; float:left; }

.twitter {
	background-image: url(images/twitter.gif);
    font-weight:bold;
	display: block;
	height: 34px;
	width: 150px;
	background-repeat: no-repeat;
	margin:0px 6px 0px 0px;
	text-decoration:none;
	padding:14px 0px 0px 48px;
}
.facebook {
	background-image: url(images/facebook.gif);
	font-weight:bold;
	display: block;
	height: 34px;
	width: 38px;
	width: 150px;
	margin:0px 6px 0px 0px;
	background-repeat: no-repeat;
	text-decoration:none;
	font-weight:bold;
    padding:14px 0px 0px 48px;
}

.events {
width: 380px;
float:left;
font-size:12px;
margin:0px 10px 0px 0px;}


.events li {clear:both; list-style-type:none; margin-bottom:30px;}

.events img {float:left;margin:0px 20px 20px 0px;border: 5px solid #c1beb2;	}
.events img:hover {border: 5px solid #0d9daa;}



.news {
width: 220px;
float:left;
margin:0px 0px 0px 0px;
font-size:12px;
}

.news ul {background-color:#f4f2e5; padding:10px;}
.news li {clear:both; list-style-type:none; margin-bottom:30px;}

#page {
	background-color: #FFFFFF;     
	overflow:auto;
	padding:10px; 
}

#sideOne {
width:140px;
float:left;
}

.box {background-color:#f4f2e5; padding:10px;}

#contentArea {
width:540px;
float:left;
min-height:800px;
margin:0px 10px 0px 20px;
overflow:auto;
}


#SideTwo {
width:230px;
float:left;
overflow:auto;
margin:0px;
padding:0px;
}

#SideTwo li {
list-style-type:none;
}

#quote {
padding:10px;
font-size:14px;
}

.NewsBox {background-color:#f4f2e5; overflow:auto;}
.NewsBox ul {overflow:hidden; width:230px;}
.NewsBox li {list-style-type:none; margin:0px 0px 0px 0px;display:block; padding:10px; }
.NewsBox li:hover {background-color: #D9D8CC; display:block;}
.NewsBox li p {font-size:12px; margin:0px 0px 0px 0px; }


#sideOne li {list-style-type:none;}
#sideOne img {margin:0px 0px 10px 0px; border: 5px solid #c1beb2;}
#sideOne img:hover {border: 5px solid #0d9daa;
}

#footer {
 background-color:#34342d;
 margin:0px 0px 40px 0px ;
 clear:both;
 color:#f9f8ef;
 overflow:auto;
 font-size:12px;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
}

#footer a { color:#FFFFFF;text-decoration:none;}

#footer ul {
background-color:#0e0e0d;
padding:15px 24px 15px 24px;
overflow:auto;
}

#footer ul li {
float:left;
display:block;
}

#footer ul li a {
display:block;
padding:5px 24px 5px 24px;
}

#footer p {
padding:15px 24px 15px 24px;
}

.FooterInfo {float:left; width:500px;}
.credit {float:right;  }


.buy { padding:20px; border: 1px solid #c1beb2; margin:10px;}
