/* CSS Document */

#content{
	position:relative;

}	

#portfolioBlurb {
	width:330px; float:left; padding:10px;
}
#slider li h2 {margin:2px 0px 0px 10px;}
#slider li h2 strong {color:#555555; margin-left:0px;}	
#slider li h3 {margin:10px 0px 0px 10px;}
#slider li p {float:right; width:500px; margin:0px 6px 0px 0px;}
#slider li a {float:right; background-color:#333333; color:#ffffff; margin:10px; padding:2px;}

/* Web design Slider */
	#slider { 
background-color:#c6d92d;
		}
	
	#slider ul, #slider li {
		padding:0px; margin:0px;
		}
		#slider ul img, #slider li img {
			padding:0px; margin:0px;
			}
	#slider li { 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:900px;
		height:600px;
		overflow:hidden; 
		}	
	#prevBtn, #nextBtn{ 
		display:block;
		height:80px;
		width:80px;
		position:absolute;
		top:200px;
		z-index:1000;
		}	
	#nextBtn{ 
		left:820px;
		}
	#prevBtn{ 
		left:0px;
		}														
	#prevBtn a, #nextBtn a {  
		display:block;
		position:relative;
		height:80px;
		width:80px;
		}	
	#prevBtn a {background:url(../imgs/portfolio/btnleft.png) no-repeat 0 0;}
	#prevBtn a:hover {background:url(../imgs/portfolio/btnlefthover.png) no-repeat 0 0;}
	#prevBtn a:active {background:url(../imgs/portfolio/btnleftclick.png) no-repeat 0 0;}
	
	#nextBtn a {background:url(../imgs/portfolio/btnright.png) no-repeat 0 0;}
	#nextBtn a:hover {background:url(../imgs/portfolio/btnrighthover.png) no-repeat 0 0;}
	#nextBtn a:active {background:url(../imgs/portfolio/btnrightclick.png) no-repeat 0 0;}
	
	#slider .slidertitle {
		position:absolute; top:500px; left:-33px;
	}

/* Graphic design Slider */

	#graphicSlider li h2 {margin:2px 0px 0px 10px;}
	#graphicSlider li h2 strong {color:#555555; margin-left:0px;}	
	#graphicSlider li h3 {margin:10px 0px 0px 6px;}
	#graphicSlider li p {margin:10px 0px 0px 6px; font-size:10px;}

	#graphicSlider {width:500px; height:300px; float:right; margin:0px; padding:0px;background-color:#c6d92d;}
	#graphicSlider ul {
		padding:0px; margin:0px; display:block;
		}
	#graphicSlider li { 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:500px;
		height:400px;
		overflow:hidden; 
		padding:0px;
		margin:0px;
		}	
	#prevBtnGrap, #nextBtnGrap{ 
		display:block;
		height:60px;
		width:60px;
		z-index:1000;
		}
		
	#nextBtnGrap {position:absolute; right:0px; margin-top:200px;}
	#prevBtnGrap {position:absolute; left:400px; margin-top:200px;}
															
	#prevBtnGrap a, #nextBtnGrap a {  
		display:block;
		height:60px;
		width:60px;
		}	
	#prevBtnGrap a {background:url(../imgs/portfolio/btnleft-grap.png) no-repeat 0 0;}
	#prevBtnGrap a:hover {background:url(../imgs/portfolio/btnlefthover-grap.png) no-repeat 0 0;}
	#prevBtnGrap a:active {background:url(../imgs/portfolio/btnleftclick-grap.png) no-repeat 0 0;}
	#nextBtnGrap a {background:url(../imgs/portfolio/btnright-grap.png) no-repeat 0 0;}
	#nextBtnGrap a:hover {background:url(../imgs/portfolio/btnrighthover-grap.png) no-repeat 0 0;}
	#nextBtnGrap a:active {background:url(../imgs/portfolio/btnrightclick-grap.png) no-repeat 0 0;}
	
	#graphicSlider .slidertitle {
		position:absolute; top:900px; left:367px;
	}