/*
Theme Name: Libre (Freedom for Youth)
Theme URI: http://webspecdesign.com/
Description: A custom theme designed and programmed by <a href="http://webspecdesign.com/">Webspec Design, LLC.</a> for Freedom for Youth Ministries.
Version: 1.0
Author: Cass Blaede
Author URI: http://webspecdesign.com/
Tags: custom, webspec

	Libre (Freesom for Youth) 1.0
	 http://webspecdesign.com/

	This theme was designed and built by Webspec Design, LLC.,
	whose website you will find at http://webspecdesign.com/

	The CSS, XHTML and design is copyright Freedom for Youth Ministries.

*/

/* Created by Webspec Design, LLC. */

*{
	margin:0;
	padding:0;
	font-family:sans-serif, sans;
	font-size:13px;
}

/* All kinds of random afer-thought stying */

a{
	color:black;
	text-decoration:underline;
}

a:active{
	color:black;
}

a:hover{
	color:black;
}

a:visited{
	color:black;
}

a img{
	border:none;
}

h1:after{
	content:" ///";
}

a.back-link{
	color:#FFFFFF;
	display:block;
	float:right;
	font-style:italic;
	font-weight:bold;
	padding-right:5px;
	padding-top:8px;
	text-decoration:none;
}

a.to-top-link{
	color:#656565;
	display:block;
	float:right;
	font-style:italic;
	font-weight:normal;
	padding-right:5px;
	text-decoration:none;
}

p{
	margin-top:1em;
}

#zoom{
	z-index:300;
}

.hidden{
	display:none;
	opacity:0;
	visibility:hidden;
	height:0;
	width:0;
}

#zoom_content p{
	margin-top:0;
	margin-bottom:1em;
}

.button:hover{
	opacity:0.8;
}

ul,ol{
	padding-left: 3em;
	padding-top:1em;
}

li ul, li ol{
	padding-top:0;
}

.alignleft{
	float:left;
	margin:0 15px 15px 0;
}

.alignright{
	float:right;
	margin:0 15px 15px 0;
}

/* END all kinds of random afer-thought stying */

body{
	background:#002D4B url(images/background-fade.png) no-repeat bottom center fixed;
}

div#wrapper{
	width:1000px;
	position:relative;
	margin:86px auto auto;
}

header.main{
	width:280px;
	height:240px;
	background:transparent url(images/emblem.png);
	position:absolute;
	top:-69px;
	left:-41px;
	z-index:200;
}

nav.main{
	margin-top:86px;
	padding-right:19px;
	height:53px;
	background-color:black;
	border-bottom:8px solid #002238;
	padding-left:195px;
	z-index:1000;
}

a#video-button{
	display:block;
	width:182px;
	height:46px;
	background-image:url(images/watch-video.png);
	position:absolute;
	right:10px;
	top:-65px;
}

div#facebook-link{
	display:block;
	height:20px;
	position:absolute;
	right:202px;
	top:-54px;
	width:85px;
	background-image:url(images/like.png);
	overflow:hidden;
}

/* Multilevel Dropdown */

#nav, #nav ul{
	margin:0;
	padding:0;
	list-style-type:none;
	list-style-position:outside;
	position:relative;
	line-height:2em; 
	z-index:200;
}

#nav ul{
	box-shadow: 10px 10px 5px #888;
	-webkit-box-shadow: 12px 0 20px black;
	/*-moz-box-shadow: 12px 0 20px black;*/
}

#nav a{
	display:block;
	padding:0;/* 0 5px *//* 0 */
	border:none;/* 1px solid #333 *//* none */
	color:#fff;
	text-decoration:none;
	background-color:black;
	height:53px;/* every first-level menu item */
}

#nav a:hover{
	background-color:#006db5;/* #fff */
	color:#fff;/* #333 */
}

#nav a.primary:hover{
	background-color:#000;
}

#nav li{
	float:left;
	position:relative;
}

#nav ul {
	position:absolute;
	display:none;
	width:12em;
	top:53px;/* How far down the second level appears */
}

#nav li ul a{
	width:12em;
	height:auto;
	float:left;
	border:1px solid #333;
	padding-left:10px;
}

#nav ul ul{
	top:auto;
}	

#nav li ul ul {
	left:12em;
	padding-left:10px;
	/*margin:0px 0 0 10px;*/
}

#nav li.students ul ul {
	left:auto;
	right:13.5em;
	padding-left:10px;
}

#nav li:hover ul ul, #nav li:hover ul ul ul, #nav li:hover ul ul ul ul{
	display:none;
}
#nav li:hover ul, #nav li li:hover ul, #nav li li li:hover ul, #nav li li li li:hover ul{
	display:block;
}

/* End Multilevel Dropdown */
/* Nav Links */

nav.main a{
	display:block;
	height:53px;
}

nav.main a.home{
	width:133px;
	background-image:url(images/nav-home.png);
}

nav.main a.about{
	width:136px;
	background-image:url(images/nav-about.png);
}

nav.main a.donate{
	width:150px;
	background-image:url(images/nav-donate.png);
}

nav.main a.volunteer{
	width:194px;
	background-image:url(images/nav-volunteer.png);
}

nav.main a.students{
	width:173px;
	background-image:url(images/nav-students.png);
}


nav.main a:hover{
	background-position:bottom;
}

/* End Nav Links */

div.home,div.page{
	position:relative;
}

div#content{
	display:block;
	background:white url(images/content-background.png) no-repeat;
	width:982px;/* 1000-padding */
	min-height:718px; /* 736-padding */
	padding:9px;
}

div.shadow{
	background-image:url(images/shadow.png);
	width:79px;
	height:319px;
	position:absolute;
	top:62px;
}

div#left-shadow{
	left:-12px;
}

div#right-shadow{
	right:-12px;
}

div#rotator.home{
	width:607px;/* 617-padding */
	height:296px;/* 307-padding */
	padding-top:11px;
	padding-left:10px;
	background-color:#001F35;
	overflow:hidden;
}

div#slideshow-content p{
	margin:0;
	padding:0;
}

div#slideshow-content p img{
	width:607px;
	height:285px;
	overflow:hidden;
}

div#donate-box-content{
	padding:10px;
	border:1px solid #a4cbe8;
	position:relative;
	top:10px;
	height:330px;
}

div#donate-box-content h2{
	font-size:100%;
	text-transform:uppercase;
	font-weight:bold;
	color:#a4cbe8;
}

div#donate-box-content a#donate-button{
	display:block;
	width:129px;
	height:46px;
	background-image:url(images/donate.png);
	position:absolute;
	bottom:10px;
	left:80px;
}

/* Interior Page */

div#interior{
	z-index:100;
}

div#interior.page{
	width:577px;/* 609-padding */
	min-height:400px;
	padding-top:95px;
	padding-right:9px;
	padding-bottom:30px;
	padding-left:23px;
	background-color:white;
}

div#interior.page h1{
	width:582px;/* 592-padding */
	height:27px;/* 33-padding */
	margin-bottom:15px;
	margin-left:-14px;
	padding-top:6px;
	padding-left:10px;
	background-image:url(images/h1-background.png);
	background-repeat:repeat-x;
	color:white;
	font-size:150%;
	text-transform:uppercase;
}

div#interior.page h2{
	width:574px;/* 578-padding */
	height:17px;/* 19-padding */
	margin-top:1em;
	padding-top:2px;
	padding-left:4px;
	background-color:#e6e6e6;
	font-style:italic;
	font-size:14px;
	color:#656565;
	clear:both;
}

div#interior.page p{
	padding-right:90px;
	padding-left:6px;
}

div#interior.page #top-image{
	position:absolute;
	top:10px;/* 80 */
	left:192px;/* 201 */
	height:77px;
	width:409px;
	overflow:hidden;
	z-index:100;
}

/* End Interior Page */
/* Sidebar (both Home and Page) */

div#sidebar{
	position:absolute;
	top:70px;
	right:9px;
	width:348px;/* 366-padding */
	padding-top:25px;
	padding-right:9px;
	padding-left:9px;
	background:#001F35 url(images/news-background-whole.png) no-repeat;
	overflow:hidden;
	color:#ffce89;
	z-index:100;
}

div#sidebar a{
	color:#a4cbe8;
	font-weight:bold;
	text-decoration:none;
}

div#sidebar.page{
	min-height:698px;/* 723-padding */
}

div#sidebar.home{
	height:282px;/* 307-padding */
}

div#sidebar div.event{
	margin-top:25px;
}

div#sidebar div.event span.date{
	text-transform:uppercase;
	font-weight:bold;
	color:#a4cbe8;
	float:left;
}

div#sidebar div.event p{
	margin-top:0;
	margin-left:75px;
}

/* End Sidebar */
/* Bottom-Boxes (On Home Page) */

div.bottom-box-shadow{
	background-image:url(images/shadow.png);
	width:79px;
	height:319px;
	position:absolute;
	top:322px;
}

div#bottom-box-shadow-1{
	left:-7px;
}

div#bottom-box-shadow-2{
	left:262px;
}

div#bottom-box-shadow-3{
	left:594px;
}

div.bottom-box{
	float:left;
	width:295px;/* 319-padding */
	height:388px;/* 412-padding */
	margin-right:12px;
	padding:12px;
	background:#fff url(images/bottom-box-background.png) repeat-x;
	position:relative;
	display:inline;/*NEW*/
	overflow:auto;/*NEWER*/
	overflow-x:hidden;
}

div.bottom-box h1{
	width:287px;/* 297-padding */
	height:27px;/* 31-padding */
/*	margin-top:auto;
	margin-right:auto;
	margin-bottom:auto;
	margin-left:-2px;*/
	background-image:url(images/home-h1-background.png);
	background-repeat:no-repeat;
	padding-top:4px;
	padding-left:10px;
	text-transform:uppercase;
	color:white;
	font-size:150%;
}

div#bottom-box-2 h2{
	padding:1em 1em 0 .5em;
}

div#bottom-box-2 h2:before{
	content:"/// ";
}

div#bottom-box-3{
	float:right;
	margin-right:0;
	background-image:url(images/donate-back.png);
	background-color:#06131A;
	color:#A4CBE8;
}

div#bottom-box-3 h2{
	font-size:110%;
	text-transform:uppercase;
	color:#a0bce1;
	margin-bottom:-.5em;
}

div#bottom-box-3 p{
	margin-bottom:1.5em;
}

/* End Bottom-Boxes */
/* Footer */

footer.main{
	height:23px; /* 31-padding */
	margin-bottom:16px;
	padding-top:8px;
	padding-right:24px;
	padding-left:24px;
	background-color:#002238;
	color:#0d446b;
	font-size:13.5px;
}

footer.main #copyright{
	float:left;
	color:#266fa2;
}

footer.main #designed-by{
	float:right;
}

footer.main #designed-by a{
	color:#266fa2;
}

footer.main #organization-name{
	font-weight:bold;
}

footer.main #address,footer.main #phone-number{
	color:#8bf;
}

/* End Footer */
/* Calendar Plugin */

.current-day{
	border:2px solid #FBB13F;
}

.day-with-date{
    width:80px;
    height:50px;
    border:1px solid black;
    background-color:#FBB13F;
}

.calendar-month{
	text-align:center;
	font-weight:bold;
}

.calendar-next{
	text-align:right;
}

.normal-day-heading,.weekend-heading{
	text-align:center;
}

.no-events{
	background-color:#E6E6E6;
}

.event-title{
	display:none;
}

.kjo-link{
	display:none!important;
	visibility:invisible!important;
	opacity:0!important;
}

/* End Calendar Plugin */
/* YouTube Gallery */

div.youtube-gallery {
	font-size:75%;
	border:3px solid #001F35;
	color:black;
	width:555px;
	height:90px;
	padding:0;
	position:relative;
	background-color:white;
}

div.youtube-gallery:hover {
	background-color:#FBB13F;
}

div.youtube-gallery div.text {
	width:410px; /* 305+105 */
	height:90px;
	float:right;
	padding:0 10px;
	margin:0;
}

div.youtube-gallery img {
	float:left;
	padding:0;
	vertical-align:middle;
	margin:auto 0;
	position:relative;
	border-right:3px solid #001F35;
}

div.youtube-gallery h2 {
	color:#673715;
	width:405px!important;
}

div.youtube-gallery p {
	line-height:1em;
	font-family:sans-serif,sans;
}

/* End YouTube Gallery */

/* Created by Webspec Design, LLC. */
