body {
	margin:0;
	padding:0;
	height:100%;
	font: 12px Arial, sans-serif;
	background: #000000 url(../images/bg-gradient.jpg) repeat-y top left;
}

a:link, a:hover, a:active, a:visited {
	color:#FFFFFF;
	text-decoration: none;
}

/*HEADER*/
#header {
	position:relative;
	background: url(../images/header-bg.png) repeat-x top left;
	width:1024px;
	height:101px;
	z-index:5;
}
#cfanLogo {
	position:absolute;
	top:10px;
	left:20px;
}
#socialMediaIcons {
	position:absolute;
	right:15px;
}
#mainLinks {
	position:absolute;
	right:0px;
	top:32px;
}

/*TOP MENU*/
ul#topNav {
	list-style-type: none;
	text-indent:-3000px;
	width:300px;
}
ul#topNav li {
	float:left;
	padding-left:4px;
}
ul#topNav li#Home {
	background: url(../images/btn-home.png) no-repeat top;
	width:56px;
	height:24px;
	cursor: pointer;
}
ul#topNav li#CrusadeList {
	background: url(../images/btn-crusadelist.png) no-repeat top;
	width:110px;
	height:24px;
	cursor: pointer;
}
ul#topNav li#Donate {
	background: url(../images/btn-donatenow.png) no-repeat top;
	width:102px;
	height:24px;
	cursor: pointer;
}
ul#topNav li#Home:hover, ul#topNav li#CrusadeList:hover, ul#topNav li#Donate:hover {
	background-position: bottom;
}


/*CRUSADE DROPDOWN MENU*/
#crusadeListDropdown {
	position:absolute;
	left:790px;
	top:85px;
	background:#a03d20 url(../images/crusadeListBG.png) no-repeat top right;
	-webkit-border-bottom-left-radius:10px;
	-webkit-border-bottom-right-radius:10px;
	-webkit-box-shadow: 0px 0px 5px #000;
	-moz-border-radius-bottomleft: 10px;
	-moz-border-radius-bottomright: 10px;
	-moz-box-shadow: 0px 0px 5px #000;
	color:#FFFFFF;
	width:150px;
	height:330px;
	z-index:3;
	display:none;
}
ul#crusadeList {
	position:absolute;
	left:0px;
	top:15px;
	list-style:none;
	margin:0px;
	padding:0px;
	width:140px;
}
ul#crusadeList li.crusade:hover {
	background-color:#782e18;
	width:100%;
}
ul#crusadeList li.title {
	padding-left:10px;
	font:11px Arial, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	padding-bottom:3px;
}
ul#crusadeList li.crusade {
	padding-left:10px;
	font:11px Arial, sans-serif;
	font-style: italic;
	width:110px;
}
ul#crusadeList a:link,
ul#crusadeList a:hover,
ul#crusadeList a:active,
ul#crusadeList a:visited {
	color:#FFFFFF;
	text-decoration:none;
}


/*SPLASH CONTENT SECTION*/
#splashContent {
	position:relative;
	width:1024px;
	height:725px;
}
#splashContent #title {
	position:absolute;
	left:20px;
	top:30px;
	background: url(../images/title.png) no-repeat top left;
	width:633px;
	height:171px;
	z-index:1;
}
#splashContent #bgImages {
	position:absolute;
	right:0;
	background: url(../images/bg-photos.png) no-repeat top left;
	width:454px;
	height:360px;
	z-index:0;
}
#splashContent #crusadesTitle {
	position:absolute;
	top: 350px;
	left:20px;
	background: url(../images/crusades-title.png) no-repeat top left;
	width:279px;
	height:70px;
}
#splashContent #donateSection {
	position:absolute;
	top:315px;
	right:25px;
}
#splashContent #donateSection #eoyCountdown {
	text-align:right;
	padding-right:25px;
}
#splashContent #crusadeSelectionBg {
	position:relative;
	top:425px;
	left:20px;
	background: url(../images/crusades-selection-bg.png) no-repeat top left;
	width:982px;
	height:167px;
}
#splashContent #crusadeSelectionBg ul#crusades li {
	float:left;
	width:165px;
	height:150px;
}
#splashContent #crusadeSelectionBg ul#crusades li .image {
	background: url(../images/crusades-selection-photo-bg.png) no-repeat top left;
	width:134px;
	height:85px;
	padding:3px 0 0 4px;
	cursor:pointer;
}
#splashContent #crusadeSelectionBg ul#crusades li .text {
	width:134px;
	font: 11px Arial, sans-serif;
	line-height:12px;
	color:#FFFFFF;
	text-align:center;
}
#splashContent #eoyLogo {
	position:absolute;
	right:20px;
	bottom:35px;
}


/*CRUSADE CONTENT SECTION*/
#contentWrapper {
	position:relative;
	width:1024px;
}
#content {
	background:transparent url(../images/content-bg.png) repeat-y top;
	width:914px;
	height:1045px;
	position:absolute;
	left:60px;
	top:-100px;
}
#content #crusadeHeader {
	position:relative;
	width:820px;
	height:70px;
	left:50px;
	top:100px;
	border-bottom:1px solid #b3634c;
	-webkit-box-shadow: 0px 1px 0px #612513;
	-moz-box-shadow: 0px 1px 0px #612513;
}
#content #crusadeHeader .title {
	float:left;
}
#content #crusadeHeader .title h1 {
	font: 26px Arial, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	letter-spacing: -1px;
	color: #FFFFFF;
	text-shadow: #000000 0px -1px 0px;
	margin-bottom: -2px;
}
#content #crusadeHeader .title .subtitle {
	font:12px Arial, sans-serif;
	color:#ca8b79;
	text-transform: uppercase;
}
#content #crusadeHeader .subtitle .finalCount {
	font:12px Arial, sans-serif;
	color:#FFFFFF;
	text-transform: uppercase;
	text-shadow: 0px -1px 0px #000000;
	font-weight: bold;
	font-style: italic;
}
#content #crusadeHeader #shareThis {
	position:relative;
	top:40px;
	float:right;
}
#content #flashGallery {
	position:relative;
	width:810px;
	height:184px;
	left:55px;
	top:110px;
	-webkit-box-shadow: 0px 0px 5px #000000;
	-moz-box-shadow: 0px 0px 5px #000000;
	z-index:0;
}
#content #missionJournalSection {
	position:relative;
	width:820px;
	left:55px;
	top:110px;
}
.daySection {
	width:547px;
	height:350px;
	margin-top:20px;
}
.daySection .title {
	font:36px Arial, sans-serif;
	font-weight:bolder;
	letter-spacing:-1px;
	color:#FFFFFF;
	text-shadow:#000000 0px -1px 0px;
	margin-bottom:-7px;
	text-transform: uppercase;
}
.daySection .subtitle {
	font:24px Arial, sans-serif;
	font-weight:bolder;
	letter-spacing:-1px;
	opacity:.5;
	filter:alpha(opacity=50);
	color:#ffffff;
	text-shadow:#000000 0px -1px 0px;
	text-transform: uppercase;
}
.daySection .text {
	font:12px Arial, sans-serif;
	line-height:16px;
	color:#FFFFFF;
}
.dayBtns {
	width:537px;
	height:34px;
	margin-bottom:10px;
	padding-bottom:20px;
	border-bottom:1px solid #b3634c;
	-webkit-box-shadow: 0px 1px 0px #612513;
	-moz-box-shadow: 0px 1px 0px #612513;
}
.dayBtns .prevDay {
	float:left;
}
.dayBtns .nextDay {
	float:right;
}
.scrollPane {
	padding-right:20px;
	width:535px;
	height:275px;
	overflow:auto;
}
#content #donateSection {
	background:transparent url(../images/donate-bg.png) no-repeat 0px 70px;
	position:absolute;
	left:570px;
	top:0px;
	border-left:1px solid #612513;
	-webkit-box-shadow: -1px 0px 0px #b3634c;
	-moz-box-shadow: -1px 0px 0px #b3634c;
	padding-left:15px;
}
#content #donateSection .title {
	font:36px Arial, sans-serif;
	font-weight:bolder;
	letter-spacing:-1px;
	color:#FFFFFF;
	text-shadow:#000000 0px -1px 0px;
	margin-bottom:-7px;
}
#content #donateSection .subtitle {
	font:24px Arial, sans-serif;
	font-weight:bolder;
	letter-spacing:-1px;
	color:#ffffff;
	opacity:.5;
	filter:alpha(opacity=50);
	text-shadow:#000000 0px -1px 0px;
	margin-left:35px;
}
#content #donateSection .text {
	font:12px Arial, sans-serif;
	line-height:16px;
	color:#FFFFFF;
}
#content #donateSection .donateForm {
	font:10px Arial, sans-serif;
	color:#FFFFFF;
}
ul#stepForm {
	list-style: none;
	padding-left: 0px;
}
#content #donateSection .donateForm div.row {
	clear: both;
	width: 210px;
	height:25px;
}
#content #donateSection .donateForm div input.text {
	float:right;
	width:125px;
	height:17px;
	border:1px solid #d3d3d3;
	padding:0px 3px;
	font:10px Arial, sans-serif;
	font-weight:bold;
	color:#9b9b9b;
}
#content #donateSection .donateForm div select {
	float:right;
	width: 125px;
	height:17px;
	padding:0px 3px;
}
#content #donateSection .donateForm fieldset {
	border: 0;
	padding:0;
	margin:0;
}
#content #donateSection .donateForm fieldset legend {
	padding:0px 0px 10px 0px;
	margin:0px;
	font: 12px Arial, sans-serif;
	font-weight: bold;
	color:#FFFFFF;
	text-transform: uppercase;
	text-shadow: 0px -1px #000000;
}
#content #resourcesSection {
	position:absolute;
	width:547px;
	left:0px;
}
#content #resourcesSection .title {
	font:36px Arial, sans-serif;
	font-weight:bolder;
	letter-spacing:-1px;
	color:#FFFFFF;
	text-shadow:#000000 0px -1px 0px;
	margin-bottom:-7px;
}
#content #resourcesSection .subtitle {
	font:24px Arial, sans-serif;
	font-weight:bolder;
	letter-spacing:-1px;
	color:#ffffff;
	opacity:.5;
	filter:alpha(opacity=50);
	text-shadow:#000000 0px -1px 0px;
	margin-left:65px;
}
#content #resourcesSection #resources {
	width:547px;
	margin-top:15px;
}
#content #resourcesSection #resources .video {
	width:128px;
	height:68px;
	float:left;
	margin-right:15px;
	-webkit-box-shadow:0px 0px 5px #000000;
	-moz-box-shadow:0px 0px 5px #000000;
}
#content #resourcesSection #resources .pdf {
	width:222px;
	height:68px;
	float:left;
	margin-right:15px;
	-webkit-box-shadow:0px 0px 5px #000000;
	-moz-box-shadow:0px 0px 5px #000000;
}
#content #resourcesSection #resources .text {
	color: #FFFFFF;
	width:300px;
	height:20px;
}

/*FOOTER*/
#footer {
	position:fixed;
	bottom:0px;
	left:0px;
	background: url(../images/footer-bg.png) repeat-x;
	width:1024px;
	height:32px;
	z-index: 999;
}
#footer #copyright {
	position:absolute;
	right:22px;
	top:13px;
	font: 11px Arial, sans-serif;
}


/* FORM VALIDATION */
div.error {
	width:230px;
	display: none;
	background-color: #990000;
}
div.error ul {
	padding: 5px 5px 5px 15px;
	margin-left: 7px;
	font-weight: bold;
}
div.error label.error {
	padding:0px 4px;
	color:#FFFFFF;
	font-weight: bold;
	font:12px Arial, sans-serif;
}


/* JSCROLL PANE */
.jScrollPaneContainer {
	position: relative;
	overflow: hidden;
	z-index: 10;
}

.jScrollPaneTrack {
	position: absolute;
	cursor: pointer;
	right: 0;
	top: 0;
	height: 100%;
	background: #FFFFFF;
	opacity:.1;
	filter:alpha(opacity=10);
}
.jScrollPaneDrag {
	position: absolute;
	background: #000;
	cursor: pointer;
	overflow: hidden;
}
.jScrollPaneDragTop {
	position: absolute;
	top: 0;
	left: 0;
	overflow: hidden;
}
a.jScrollArrowUp {
	display: block;
	position: absolute;
	z-index: 1;
	top: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	background:transparent url(../images/arrow-up.png) no-repeat;
	height: 10px;
	width:10px;
}
a.jScrollArrowUp:hover {
/*	background-color: #f60;*/
}

a.jScrollArrowDown {
	display: block;
	position: absolute;
	z-index: 1;
	bottom: 0;
	right: 0;
	text-indent: -2000px;
	overflow: hidden;
	background:transparent url(../images/arrow-down.png) no-repeat;
	height: 10px;
	width:10px;
}
a.jScrollArrowDown:hover {
/*	background-color: #f60;*/
}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
/*	background-color: #f00;*/
}