/* 1-0 toggle layout, styling */

/* 2-0 project-container layout */

/* 3-0 project-slides */

	/* 3-1 project-slide images */

	/* 3-2 project-slide styling */

/* 4-0 project-controls */


/* ================================================== */
/* 1-0 toggle layout, styling */

div#project-toggle {
	background: url(/images/bg_project_toggle.jpg) center top no-repeat;
	margin: 0 auto;
	width: 960px;
}
div#project-toggle a {
	color: #ff0600;
	display: block;
	font-weight: bold;
	height: 35px;						/* equal to parent */
	letter-spacing: -0.03em;
	line-height: 35px;					/* vertically centers element within parent */
	text-align: center;
	text-decoration: underline;
	text-transform: uppercase;
	width: 960px;						/* equal to parent */
}
div#project-toggle a:hover {
	color: #fcb040;
}

/* ================================================== */
/* 2-0 project-container layout */

div#project-container {							/* do not apply overflow attribute, otherwise slider will not work */
	background: url(/images/bg_project_container.jpg) center top no-repeat;
	height: 265px;
	margin: 0 auto 60px;
	position:relative;					/* required for slider to work */
	width: 960px;
}

/* ================================================== */
/* 3-0 project-slides */

div#project-container div#slider ul li, 
div#project-container div#slider2 ul li { 
	height: 265px;
	overflow: hidden; 
	width: 960px;	
}

	/* ================================================== */
	/* 3-1 project-slide images */

div#project-container div#slider ul li#project1, 
div#project-container div#slider2 ul li#project1 {
	background: url(/images/bg_project1.png) center center no-repeat;
}
div#project-container div#slider ul li#project2, 
div#project-container div#slider2 ul li#project2 {
	background: url(/images/bg_project2.png) center center no-repeat;
}
div#project-container div#slider ul li#project3, 
div#project-container div#slider2 ul li#project3 {
	background: url(/images/bg_project3.png) center center no-repeat;
}
div#project-container div#slider ul li#project4, 
div#project-container div#slider2 ul li#project4 {
	background: url(/images/bg_project4.png) center center no-repeat;
}
div#project-container div#slider ul li#project5, 
div#project-container div#slider2 ul li#project5 {
	background: url(/images/bg_project5.png) center center no-repeat;
}

	/* ================================================== */
	/* 3-2 project-slide styling */

ul li.slide h2, ul li.slide h3 {
	font-weight: normal;
}
ul li.slide h2 {
	color: #0085ca;
  	font-size: 1.5em; 		/* 18px */
  	font-style: italic;
  	line-height: 1em; 		/* 18px */
}
ul li.slide h3 {
	font-size: 1.1667em; 	/* 14px */
	font-weight: bold;
  	line-height: 1.2857em; 	/* 18px */
	margin: 1.2857em 0;
}
ul li.slide p {
	font-size: 1em; 		/* 12px */
  	line-height: 1.5em; 	/* 18px */
  	margin: 1.5em 0;
}
ul li.slide h2, ul li.slide h3, ul li.slide p {
	margin-left: 20px;
	width: 300px;
}

/* ================================================== */
/* 4-0 project-controls */

p#project-controls, 
p#project-controls2 {
	background: url(/images/bg_project_controls.jpg) center center no-repeat;
	display: block;
	margin: 0;
	position: relative;
	height: 36px;
	width: 960px;
}
span#btn-prev, span#btn-next, 
span#btn-prev2, span#btn-next2 { 
	display: block;
	height: 36px;
	left: 0;
	margin: 0;
	overflow: hidden;		
	position: absolute;
	text-indent: -8000px;
	top: 0;
	width: 69px;
}	
span#btn-next, 
span#btn-next2 { 
	left: 891px;						/* width of parent (960px) minus width of element (69px) */
}														
span#btn-prev a, span#btn-next a, 
span#btn-prev2 a, span#btn-next2 a{
	background: url(/images/bg_project_leftarrow.jpg) no-repeat 0 0;
	display:block;
	height: 100px;
	width: 69px;
}	
span#btn-next a, 
span#btn-next2 a { 
	background: url(/images/bg_project_rightarrow.jpg) no-repeat 0 0;
}