/*
	 CSS-Tricks Example
	 by Chris Coyier
	 http://css-tricks.com
*/

body {	
	margin: 50px auto 0 auto;
}

body.bpt {
	background: #d1e0ee;	
}

body.clc {
	background: #e0e7cd;
}

body.fth {
	background: #f9ecd6;	
}

body.hp {
	background: #dad6dd;	
}

img, img {
	border: 0;
}

p, h1, h2, h3, h4, h5, ul, li, dl, dd, dt, img, form {
	margin: 0;
	padding: 0;
}

#page-wrap { 
	width: 1024px; 
	margin: 0 auto 50px; 
	position: relative; 
	border: 15px solid #fff;
}


/* ------ Top Links ----- */

#topLinks {
	padding: 8px 20px 0 20px;
	height: 38px;
	width: 1024px;
	margin: 0 auto;
}

#topLinks a {
	font: bold 12px/36px tahoma, verdana, helvetica, arial, sans-serif;
	color: #878787;
	text-decoration: none;
}

.rightLink {
	float: right;
}


#selectQuestion {
	float: left;
	width: 375px;
}

#selectQuestionMenu {
	height: 56px;
	display: inline;
	list-style: none;
	float: left;
	margin: -15px 0 0 17px
}

#selectQuestionMenu li {
	height: 56px;
	display: inline;
	list-style: none;
	float: left;
}

#selectQuestionMenu .wheat a {
	background: url(../images/shared/wheat.png) no-repeat 0 -56px;
	height: 56px;
	width: 71px;
	display: block;
}

#selectQuestionMenu .wheat a:hover {
	background: url(../images/shared/wheat.png) no-repeat 0 -56px;
}

#selectQuestionMenu .rocks a {
	background: url(../images/shared/rocks.png) no-repeat 0 -56px;
	height: 56px;
	width: 65px;
	display: block;
}

#selectQuestionMenu .rocks a:hover {
	background: url(../images/shared/rocks.png) no-repeat 0 -56px;
}

#selectQuestionMenu .flower a {
	background: url(../images/shared/flower.png) no-repeat 0 -56px;
	height: 56px;
	width: 70px;
	display: block;
}

#selectQuestionMenu .flower a:hover {
	background: url(../images/shared/flower.png) no-repeat 0 -56px;
}

.selectQuestionLink {
	float: left;
}


.bpt #topLinks a {
	color: #0051a2;
}

.clc #topLinks a {
	color: #7f992c;
}

.fth #topLinks a {
	color: #e0961b;
}


/*
    For Specific Slides
*/

/* ----- Shared DIVs ----- */

#sidebarLink {
	background: url(../images/bring-people-together/sidebarLink.png) no-repeat;
	position: absolute !important;
	top: 200px;
	left: 1100px;
}

.feedTheHungry,
.createLastingChange,
.bringPeopleTogether {
	height: 100%;
	width: 100%;
}

.leftCol {
	width: 403px;
	height: 267px;
	margin-left: 107px;
	float: left;
	display: inline;
}

.rightCol {
	width: 380px;
	height: 267px;	
	margin-left: 0;
	float: left;
	display: inline;
}

#footer {
	height: 52px;
	width: 1024px;
	display: block;
	float: left;
	clear: both;
}

#footer a.iliffLink {
	height: 52px;
	width: 107px;
	display: block;
}

#footer .whatsIliff {
	float: right; 
	width: 102px;
	height: 22px;
	display: block;
	margin: 30px 12px 0 0;
}

#footerStrip {
	height: 52px;
	width: 1024px;	
	display: block;	
	float: left;	
	clear: both;	
}


/* ----- Shared Typography ----- */

.hiddenText {
	display: none;
	height: 0;
	overflow: hidden;
}

.wrapper h3 {
	font: bold 24px/24px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
}

.wrapper .introText {
	font: bold 14px/16px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
}


/* ----- Intro Panel ----- */

#intro .leftCol {
	height: 100px !important;
	width: 440px !important;
}

#intro .rightCol {
	width: 380px;
	height: 333px;	
	margin: -120px 0 0 76px;
}

#intro .leftCol p {
	font: bold 12px/17px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
}

#intro .leftCol a {
	font: bold 12px/17px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
	padding-right: 20px;
}

#intro .leftCol a:hover {
	text-decoration: none;
}

/* ----- Video Panel ----- */

#video .introText {
	margin-top: 25px;
}

#video .rightCol {
	margin-left: 45px;
}

#video .videoContainer {
	float: left;
	display: inline;
	width: 160px;
	margin: 50px 55px 0 0;
}

#video .last {
	margin-right: 0 !important;
}

#video h5 {
	font: bold 14px/16px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
}

#video h4 {
	font: italic 14px/16px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
	margin-bottom: 10px;	
}

.videoContainer {
	font: normal 11px/14px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
}

.videoContainer ul {
	list-style: none;
	display: inline;
	width: 160px;
}

.videoContainer li {
	list-style: none;
	display: inline;
	float: left !important;
	padding: 5px 19px 5px 7px !important;
}

.videoContainer a {
	font: normal 11px/14px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
	text-decoration: none;
}

.videoContainer a:hover {
	text-decoration: underline;
}


#video .introText a {
	font: bold 14px/16px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
}

#video .introText a:hover {
	text-decoration: none;
}


/* ----- Courses Panel ----- */

#courses .leftCol {
	width: 413px;
}

#courses .leftCol ul {
	list-style: none;
}

#courses .leftCol li {
	height: 25px;
	width: 413px;
	background: url(../images/bring-people-together/courseListArrow.png) no-repeat 14px 8px !important;	
}

#courses .leftCol li a {
	font: bold 14px/25px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
	text-decoration: none;
	display: block;
	width: 413px;
	height: 25px;
	padding-left: 32px;	
}

#courses .leftCol li a:hover,
#courses .leftCol li a.selected {
	background: url(../images/bring-people-together/courseHighlight.png) no-repeat !important;
}


#courses .leftCol {
	margin-left: 95px !important;
	height: 219px !important;
}

#courses .leftCol h3 {
	margin: 0 0 40px 12px;
}


#courses .rightCol h4 {
	font: bold 14px/16px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
	margin-bottom: 30px !important;
}

#courses .rightCol p {
	font: normal 12px/16px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #fff;
	margin-top: 18px;
}

#courses .rightCol {
	background: url(../images/bring-people-together/courseDescription.png) repeat-x 0 37px !important;
	height: 230px !important;
	width: 403px /*460px*/ !important;
	padding: 72px 24px 0 32px;
}

#courses .rightCol a {
	color: #fff;
}

#courses .rightCol a:hover {
	text-decoration: none;
}

#courses .show {
	display: inline;
}

#courses .hide {
	display: none;
}


/* ----- What's Iliff? Box ----- */

#fancybox-inner h3 {
	font: bold 14px/16px 'Helvetica Neue', helvetica, arial, sans-serif;
	margin: 10px 0 25px 0;
}

#fancybox-inner p {
	font: normal 12px/16px 'Helvetica Neue', helvetica, arial, sans-serif;
	color: #000;
	margin-bottom: 15px;
}

.bpt #fancybox-inner h3 {
	color: #0051a2;
}

.clc #fancybox-inner h3 {
	color: #7f992c;
}

.fth #fancybox-inner h3 {
	color: #e0961b;
}


/* ----- Home ----- */

.home {
	background: url(../images/home/background.jpg) no-repeat !important;
}

.home2 {
	background: url(../images/home/background-blue.jpg) no-repeat !important;
}


.home .introText {
	height: 102px !important;
	width: 401px !important;
	background: url(../images/home/introText.png) no-repeat -5px -5px;
	float: right;
	margin: -150px 75px 0 0;
}

.home .headerText {
	height: 128px !important;
	width: 404px !important;
	margin: 215px 0 24px 100px !important;
	background: url(../images/home/header.png) no-repeat;
}

.home #selectionMenu {
	background: url(../images/home/selectionMenu.png) no-repeat;
	width: 1024px;
	height: 167px;
	margin-bottom: 22px;
}

.home #selectionMenu ul {
	list-style: none;
}

.home #selectionMenu ul li {
	display: inline;
	float: left;
}

.home #selectionMenu .item1 {
	background: url(../images/home/feed-the-hungry.png) no-repeat 0 30px;
	height: 147px;
	width: 273px;
	margin-left: 105px;
}

.home #selectionMenu .item1 a {
	display: block;
	height: 147px;
	width: 273px;
}

.home #selectionMenu .item2 {
	background: url(../images/home/bring-people-together.png) no-repeat 0 40px;
	height: 147px;
	width: 273px;
	margin-left: 25px;	
}

.home #selectionMenu .item2 a {
	display: block;
	height: 147px;
	width: 273px;
}

.home #selectionMenu .item3 {
	background: url(../images/home/create-lasting-change.png) no-repeat 0 30px;
	height: 147px;
	width: 273px;
	margin-left: 25px;	
}

.home #selectionMenu .item3 a {
	display: block;
	height: 147px;
	width: 273px;
}


.home #footer {
	background: url(../images/home/footer.gif) no-repeat;
}

.home #footerStrip {
	background: url(../images/home/footerStrip.jpg) no-repeat;
}

.home .whatsIliff {
	background: url(../images/home/whatsIliff.gif) no-repeat;
}


/* ----- Feed the Hungry ----- */

.feedTheHungry {
	background: url(../images/feed-the-hungry/background.jpg) no-repeat !important;
}

.feedTheHungry #footer {
	background: url(../images/feed-the-hungry/footer.gif) no-repeat;
}

.feedTheHungry .whatsIliff {
	background: url(../images/feed-the-hungry/whatsIliff.gif) no-repeat;
}

.feedTheHungry #footerStrip {
	background: url(../images/feed-the-hungry/footerStrip.jpg) no-repeat;
}

.feedTheHungry .headerText {
	height: 98px !important;
	width: 548px !important;
	margin: 245px 0 0 100px !important;
	background: url(../images/feed-the-hungry/header.png) no-repeat;
}

.feedTheHungry #video .headerText,
.feedTheHungry #courses .headerText {
	margin: 162px 0 0 100px !important;
	display: block;	
}

.feedTheHungry #intro .rightCol {
	background: url(../images/feed-the-hungry/icon.png) no-repeat !important;
}

.feedTheHungry #intro .leftCol p {
	margin-top: 25px;
}

.feedTheHungry #video h3,
.feedTheHungry #courses h3 {
	margin-top: 28px !important;
}

.feedTheHungry #video .rightCol {
	padding-top: 29px;
}

.feedTheHungry .videoContainer li {
	background: #98a660 !important;
}


.feedTheHungry #courses .rightCol {
	padding-top: 66px;
}


/* ----- Create Lasting Change ----- */


.createLastingChange {
	background: url(../images/create-lasting-change/background.jpg) no-repeat !important;
}

.createLastingChange #footer {
	background: url(../images/create-lasting-change/footer.gif) no-repeat;
}

.createLastingChange .whatsIliff {
	background: url(../images/create-lasting-change/whatsIliff.gif) no-repeat;
}


.createLastingChange #footerStrip {
	background: url(../images/create-lasting-change/footerStrip.jpg) no-repeat;
}

.createLastingChange #introWrapper {
	background: url(../images/create-lasting-change/background-intro.jpg) no-repeat;
}

.createLastingChange .headerText {
	width: 448px;
	height: 44px;
	margin: 293px 0 0 107px !important;
	background: url(../images/create-lasting-change/header.png) no-repeat;
	display: block;		
}

.createLastingChange #video .headerText,
.createLastingChange #courses .headerText {
	margin: 210px 0 0 107px !important;
}

.createLastingChange #intro .leftCol {
	height: 219px !important;
}

.createLastingChange #intro .leftCol p {
	margin-top: 30px;
}

.createLastingChange #video h3,
.createLastingChange #courses h3 {
	margin-top: 35px !important;
}

.createLastingChange #video .rightCol {
	padding-top: 35px;
}

.createLastingChange .videoContainer li {
	background: #689da0 !important;
}



/* ----- Bring People Together ----- */


.bringPeopleTogether {
	background: url(../images/bring-people-together/background.jpg) no-repeat !important;
}

.bringPeopleTogether #footer {
	background: url(../images/bring-people-together/footer.gif) no-repeat;
}

.bringPeopleTogether #footerStrip {
	background: url(../images/bring-people-together/footerStrip.jpg) no-repeat;
}

.bringPeopleTogether .whatsIliff {
	background: url(../images/bring-people-together/whatsIliff.gif) no-repeat;
}

.bringPeopleTogether #introWrapper {
	background: url(../images/bring-people-together/background-intro.jpg) no-repeat;
}

.bringPeopleTogether .headerText {
	width: 448px;
	height: 44px;
	margin: 293px 0 0 107px !important;
	background: url(../images/bring-people-together/header.png) no-repeat;
	display: block;		
}

.bringPeopleTogether #video .headerText,
.bringPeopleTogether #courses .headerText {
	margin: 210px 0 0 107px !important;
}

.bringPeopleTogether #intro .leftCol p {
	margin-top: 30px;
}

.bringPeopleTogether #intro .rightCol {
	background: url(../images/bring-people-together/icon.png) no-repeat !important;
	margin: -120px 0 0 76px;
	height: 339px !important;
}

.bringPeopleTogether #video h3,
.bringPeopleTogether #courses h3 {
	margin-top: 35px !important;
}

.bringPeopleTogether #video .rightCol {
	padding-top: 35px;
}

.bringPeopleTogether .videoContainer li {
	background: #d79525 !important;
}