body {
	background: transparent url(../images/home-background.jpg) no-repeat center top;	
}

#header h1 {
	height: 58px;
	width: 256px;
	margin-left: 20px;
	background: #1b1b1a url(../images/heehaw-sprite.gif) no-repeat 0 0;
	float: left;
	text-indent: -999999px;
}

h3 {
	font-size: 1.8em; 
	font-weight: bold;
	color: #54C0E6;	
	margin-bottom: 10px;
}
	
	h3.featured-projects-header {
		height: 24px;
		width: 206px;
		margin-top: 5px;
		background: transparent url(../images/feature-projects-header.gif) no-repeat left top;
		text-indent: -9999999px;
	}
	
	h3.our-expertise-header {
		height: 24px;
		width: 162px;
		margin-top: 5px;
		background: transparent url(../images/our-expertise-header.gif) no-repeat left top;
		text-indent: -9999999px;
	}

#top-fold {
	width: 980px;
	height: 138px;
	margin: 0 auto;
	background: transparent url(../images/home-content-dividers.gif) no-repeat left top;
}

	#top-fold .intro_text {
		width: 604px;
		height: 99px;
		text-indent: -999999px;
		background: transparent url(/images/home/intro-text.gif) no-repeat left top;
		margin-top: 17px;
	}
	
	#top-fold .right-col {
		position: relative;
	}
	
	#top-fold .right-col .showreel {
		width: 295px;
		height: 95px;	
		margin-top: 20px;
		background: transparent url(../images/view-our-showreel.gif) no-repeat left top;
		text-indent: -999999px;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 100;
	}
	
		#top-fold .right-col .showreel a {
			position: absolute;
			top: 0;
			left: 0;
			width: 295px;
			height: 95px;
			overflow: hidden;
			z-index: 200;
		}

#below-fold {
	width: 980px;
	margin: 0 auto;
	margin-bottom: 12px;
	margin-top: 10px;
}
	
	#feature_image {
		width: 980px;
		height: 210px;
		margin: 0 auto;
		text-indent: -9999px;
	}
/**************************************************
 *	FEATURED PROJECTS
 ***************************************************/
#featured-projects {
	position: relative;
	float: left;
}
	#featured-projects a {
		color: #3B3B3B;
		text-decoration: none;
	}
	#featured-projects a:hover {
		color: #d13485;
		text-decoration: underline;
	}
	
	
	#featured-projects ul {
		position: relative;
		float: left;
	}
	
		#featured-projects ul li {
			float: left;
			width: 620px;
		}

	#featured-projects #prev_link,
	#featured-projects #next_link {
		height: 74px;
		width: 29px;
		position: absolute;
		top: 48px;
		text-indent: -999999px;
		cursor: pointer;
		z-index: 1000;
	}
	
	#featured-projects #prev_link {
		right: 600px;
		background: transparent url(../images/heehaw-sprite.gif) no-repeat 0 -68px;
	}
	
	#featured-projects #next_link {
		left: 600px;
		background: transparent url(../images/heehaw-sprite.gif) no-repeat -28px -68px;
	}
	#featured-projects #prev_link:hover {
		background: transparent url(../images/heehaw-sprite.gif) no-repeat -57px -68px;
	}
	
	#featured-projects #next_link:hover {
		background: transparent url(../images/heehaw-sprite.gif) no-repeat -84px -68px;
	}
	
	#featured-projects div#projects {
		width: 620px;
		height: 234px;
		overflow: hidden;
	}
	#projects_wrapper {
		overflow: hidden;
		position: relative;
		float: left;
	}
	#projects_inner {
		width: 1000%;
	}
	#projects div.project {
		width: 300px;
		height: 260px;
		overflow: hidden;
		background-color: #e0e0e0;
		color: #3b3b3b;
		float: left;
		margin-right: 20px;
		margin-bottom: 25px;
	}
	#projects div.second_project {
		margin-right: 0;
	}
	
		#projects div.edge {
			margin-right: 0px;
		}
	
		#projects div.project div.project_copy { 
			padding: 0 17px;
		}
		#projects div.case_study_thumbnail {
			width: 300px;
			height: 170px;
			background-repeat: no-repeat;
			background-position: 50% 50%;
		}
		#projects a.case_study_thumb_link {
			width: 300px;
			height: 170px;
			display: block;
			overflow: hidden;
			text-indent: -9999px;
		}
		
		#projects div.project h4 {
			font-weight: bold;
			font-size: 1.25em;
			padding: 15px 0 2px 0;
		}
		
		#projects div.project p {
			font-style: italic;
			font-size:0.9em;
			padding-bottom: 15px;
		}
		
				
/*********************************************************
 *	OUR EXPERTISE
 *********************************************************/
#our-expertise {
	font-size: 1.2em; 
	font-weight: bold;	
	margin-top: -10px;
	line-height:0.95em;
}
	
	#our-expertise li{
		padding: 10px 0 6px 0;
	}
	
		#our-expertise li a {
			border-bottom: 2px solid #5dc4e7;
			padding-bottom: 3px;
			color: #000;
			text-decoration: none;
		}
			
			#our-expertise li a:hover {
				border-bottom: 2px solid #D03987;
			}
			
			/*#our-expertise li span {
				background: transparent url(/images/bullet.gif) no-repeat left top;
				width: 9px;
				text-indent: -9999999px;
			}*/


.left-col {
	margin: 0 10px;
	padding: 0 10px;
	width: 620px;
	float: left;
}


.left-col h3{
	position:relative;
}

div.home_social_buttons{
	float:right;
	padding-top:6px;
	font-weight: bold;
}

div.home_social_buttons a, div.home_social_buttons visited {
	color:#000;
	text-decoration: none;
	border-bottom: 1px solid #5DC4E7;
}

div.home_social_buttons a:hover {
	border-bottom: 1px solid #D03987;
}


div.home_social_buttons img{
	margin-bottom:-3px;
}

.right-col {
	margin: 0 10px 0 15px;
	padding: 0 10px 0 0;
	width: 260px;
	float: left;
}

/*********************************************************
 *	CAROUSEL
 *********************************************************/
 
.single_project {
	width: 300px;
	height: 260px;
	overflow: hidden;
	background-color: #e0e0e0;
	color: #3b3b3b;
}
.single_project div.project_copy { 
	padding: 0 17px;
}
.single_project div.case_study_thumbnail {
	width: 300px;
	height: 170px;
	background-repeat: no-repeat;
	background-position: 50% 50%;
}
.single_project a.case_study_thumb_link {
	width: 300px;
	height: 170px;
	display: block;
	overflow: hidden;
	text-indent: -9999px;
}

.single_project a {
	color: #3B3B3B;
	text-decoration: none;
}
.single_project a:hover {
	color: #d13485;
	text-decoration: underline;
}
		
.single_project h4 {
	font-weight: bold;
	font-size: 1.2em;
	padding: 15px 0 2px 0;
}
		
.single_project p {
	font-style: italic;
	font-size:0.9em;
	padding-bottom: 15px;
}

/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
    width: 300px;
    height: 234px;
}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
}

.jcarousel-prev {
    z-index: 3;
    display: none;
}

/* skin stars here */

.jcarousel-skin-tango .jcarousel-container {
    background: #F0F6F9;
    border: none;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 620px;
    padding: 0px 0px;
}

.jcarousel-skin-tango .jcarousel-container-vertical {
    width: 75px;
    height: 245px;
    padding: 40px 20px;
}

.jcarousel-skin-tango .jcarousel-clip-horizontal {
    width:  620px;
    height: 234px;
}

.jcarousel-skin-tango .jcarousel-clip-vertical {
    width:  75px;
    height: 245px;
}

.jcarousel-skin-tango .jcarousel-item {
    width: 300px;
    height: 234px;
}

.jcarousel-skin-tango .jcarousel-item-horizontal {
    margin-right: 20px;
}

.jcarousel-skin-tango .jcarousel-item-vertical {
    margin-bottom: 10px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/*#featured-projects #prev_link,
	#featured-projects #next_link {
		height: 74px;
		width: 29px;
		position: absolute;
		top: 48px;
		text-indent: -999999px;
		cursor: pointer;
		z-index: 1000;
	}
	
	#featured-projects #prev_link {
		right: 600px;
		background: transparent url(../images/heehaw-sprite.gif) no-repeat 0 -68px;
	}
	
	#featured-projects #next_link {
		left: 600px;
		background: transparent url(../images/heehaw-sprite.gif) no-repeat -28px -68px;
	}
	#featured-projects #prev_link:hover {
		background: transparent url(../images/heehaw-sprite.gif) no-repeat -57px -68px;
	}
	
	#featured-projects #next_link:hover {
		background: transparent url(../images/heehaw-sprite.gif) no-repeat -84px -68px;
	}*/

/**
 *  Horizontal Buttons
 */
.jcarousel-skin-tango .jcarousel-next-horizontal {
    position: absolute;
    top: 55px;
    right: -17px;
    height: 74px;
	width: 29px;
    cursor: pointer;
    background: transparent url(../images/heehaw-sprite.gif) no-repeat -28px -69px;
}

.jcarousel-skin-tango .jcarousel-next-horizontal:hover {
    background: transparent url(../images/heehaw-sprite.gif) no-repeat -84px -69px;
}

/*.jcarousel-skin-tango .jcarousel-next-horizontal:active {
    background-position: -64px 0;
}*/

/*.jcarousel-skin-tango .jcarousel-next-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}*/

.jcarousel-skin-tango .jcarousel-prev-horizontal {
    position: absolute;
    top: 55px;
    left: -17px;
    width: 29px;
    height: 74px;
    cursor: pointer;
    background: transparent url(../images/heehaw-sprite.gif) no-repeat 0 -69px;
}

.jcarousel-skin-tango .jcarousel-prev-horizontal:hover {
    background: transparent url(../images/heehaw-sprite.gif) no-repeat -57px -69px;
}

/*.jcarousel-skin-tango .jcarousel-prev-horizontal:active {
    background-position: -64px 0;
}*/

/*.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-horizontal:active {
    cursor: default;
    background-position: -96px 0;
}*/

/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(next-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-next-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: transparent url(prev-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}