@charset "utf-8";
/* CSS Document */
/*
All css codes written by CLEMENTCROWNRISE
*/
* {margin:0;
	padding:0;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	color:#666;
}
b ,strong {color:#f3af02;
}

div {position:relative;
}

body{
	background:url(../images/page_bg.jpg) repeat-x #FFF;
	word-spacing:normal;
	line-height:normal;
}

body a:focus,body a:active{outline:none;
}


#banner{width:412px;
		padding-top:3px;
		float:left;
		margin-left:30px;
}
#wrapper{width:1100px;
		margin:auto;
	
}

#nav{float:right;
	width:500px;
	height:50px;
}

#nav ul{padding:0px;
		margin:0;
		padding-top:10px;
		list-style:none;
}
#nav ul li {display:block;
			float:left;
}
#nav ul li a{color:white;
			text-decoration:none;
			margin-right:10px;
			padding-left:10px;
			padding-right:10px;
			font-size:16px;
}
#nav ul li a:hover{
				color:#FC0;
				border-bottom: solid 2px #fc0;
}
#nameholder{
			clear:left;
			float:left;
		
}
.clearfix{clear:both;
			height:2px;
}
#caption{width:951px;
		height:415px;
		background:url(../images/glow.png) no-repeat bottom ;
		float:right;
			
			}

.titleholder{margin-top:20px;
			width:300px;
			
}

.contentholder{width:500px;
				padding:10px;
				text-align:justify;
				color:#666;
				line-height:22px;
}

#portfolioholder{width:1000px;
				margin:auto;
}

portfolioholder ul{padding:0;
					margin:0;
					list-style:none;
					
					
}

#portfolioholder ul li{width:301px;
						list-style:none;
						display:block;
						float:left;
						margin-left:20px;
						margin-bottom:20px;
					
}

#portfolioholder ul li img{border:solid 2px #ffb940;
}

#portfolioholder ul li img a{border:solid 1px #666;
}
#portfolioholder ul li p{margin-top:normal;
						line-height:normal;
						word-spacing:normal;
						font-size:14px;
						color:#666;
					
}
.description{font-size:12px;
				color:#0b87a7;
}
.address{color:#0b87a7;
			font-size:12px;
}

.address a{color:#0b87a7;
			
}

/*sideer*/

#slider{
		width:951px;
		height:500px;
		overflow:hidden;
		margin:auto;
	}	
	#slider ul, #slider li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		
		overflow:hidden; 
		}	
	#prevBtn, #nextBtn{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		left:-30px;
		top:71px;
		}	
	#nextBtn{ 
		left:696px;
		}														
	#prevBtn a, #nextBtn a{  
		display:block;
		width:30px;
		height:77px;
		background:url(images/slide/btn_prev.gif) no-repeat 0 0;	
		}	
	#nextBtn a{ 
		background:url(images/slide/btn_next.gif) no-repeat 0 0;	
		}			
		
		img{border:none;}
	pre{
		display:block;
		padding:10px;
		border:1px solid #bae2f0;
		background:#e3f4f9;	
		margin:.5em 0;
		width:674px;
		}	
			
    /* image replacement */
        .graphic, #prevBtn, #nextBtn{
            margin:0;
            padding:0;
            display:block;
            overflow:hidden;
            text-indent:-8000px;
			
            }
    /* // image replacement */
	
#leftshadow{height:300px;
			width:42px;
			float:right;
			background-color:#000;
			clear:left;
			background:url(../images/leftshadow.jpg) no-repeat;
}

#rightshadow{height:300px;
			width:30px;
			float:right;
			background:url(../images/rightshadow.jpg)  no-repeat left;
}
#cap-shadow-holder{width:1030px;
					margin:auto;
					clear:left;
}

#newbanner{width:100%;
			position:static;
			height:120px;
			background:url(../images/longer_banner.png) center 100%;
}
#bottomtesting{width:100%;
				height:40px;
				background:#000;
				position:fixed;
				bottom:0;
				z-index:100;
				background:url(../images/testing_trtip.png);
				//width:100%;
				//clear:left;
			
}
#bottomtesting p{float:left;
				display:block;
				color:#f6b003;
				padding-top:8px;
				padding-left:20px;
}


#emalholder{width:128px;
			height:115px;
			position:fixed;
			bottom:0;
			z-index:1000;
			right:0px;
			
}
#formholder{float:left;
			clear:both;
			width:400px;
			margin-bottom:50px;
			padding:10px;
			color:#666;
		
}
#network-iconholder{width:100px;
					position:fixed;
					top:100px;
					height:200px;
					left:20px;
}

#network-iconholder ul{padding:0;
						margin:0;
						list-style:none;
}
#network-iconholder ul li{display:block;
							margin-bottom:20px;
}
#network-iconholder ul li a{border:0;
}
.textb{
		width:340px;
		height:30px;
		padding-top:3px;
		padding-left:10px;
		border:none;
		font-size:15px;
		color:#999;
		border: dashed #CCC 1px;
		
		}

.textb:focus{border: solid #f8bb01 ;
}

.textbb{
		width:340px;
		height:100px;
		padding-top:3px;
		padding-left:10px;
		border:none;
		font-size:15px;
		margin-bottom:14px;
		color:#999;
		border: dashed #CCC 1px;
		
		}

.textbb:focus{border: solid #f8bb01 ;
}

.button{width:120px;
		height:30px;
		border: dashed #CCC 1px;
}

.button:focus
{border:solid #f8bb01;
}
/* sliding door here */

.eff {
	
	/* the image size is 126x126, it's adjusted to fit the border as well*/
	width:136px;
	height:136px;

	/* important, allow the children object to move inside its parent obj */
	position:relative;	

	/* important, it hides the moved image */
	overflow:hidden;
	
	/* with the clear class, make it into 3 x 3 layout */
	float:left;
	
	/* IE float bug fix */
	display:inline;
	
	/* styling */
	margin:8px;
	font-size:12px;
}

.eff img {
	display:block;
	width:126px;
	height:126px;
	
	/* styling */
	text-decoration:none;
	border:4px solid #ccc;
	background:#ddd;

	/* important, it allows this obj to move by jquery */
	position:absolute;
	
	/* make sure it appears above the caption */
	z-index:500;
	
	cursor:pointer; cursor:hand;
}


.eff .caption {
	/* should be the same size with the image */
	width:126px;
	height:126px;
	
	/* styling */
	background:#333;
	border:4px solid #ccc;
	color:#eee;
	
	/* set the position to 0, 0 and appear under the image */
	position:absolute;
	top:0; left:0;
	z-index:0;
}


/* extra styling*/

.eff .caption a.header {
	margin:10px 5px 5px 5px;
	display:block;
	font-size:14px;	
	font-weight:700;
	color:#4ed7f4;
}

.eff .caption p {
	margin:5px;	
}

.clear {clear:both}

.ech{
	position:absolute;
	background-color:#000;
	color:white;
	height:100px;
	width:220px;
	top:90px;
	left: 523px;
}
