/* --------------------------------------------------------------------
  xLayout																	 
 -------------------------------------------------------------------- */
html {
    height: 102%;
}
 
 
body {
		font-family: museo-sans, sans-serif;
		color: #535353;
		line-height: 1.6;
	}
 



#wrapper {
	margin: 0 auto;
	overflow:visible;
	text-align:left;
	width:960px;
	background-color: #fff;
	}
	
	
#content {

	width: 960px;
	height: auto;
	float: left;
	position: relative;

}

#indexbox {
	margin-left: 80px;
	margin-top: 40px;
}


.galleryindex {

	padding-bottom: 40px;
	border-bottom-color: #666666;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
	width: 960px;
	height: auto;
	float: left;
	position: relative;
	margin-bottom: 50px;

}





	/* Project Page */

#projectbox {
	padding-top: 30px;
	padding-bottom: 40px;
	border-bottom-color: #666666;
	border-bottom-style: dotted;
	border-bottom-width: 1px;
	width: 960px;
	height: auto;
	float: left;
	position: relative;
	margin-bottom: 50px;
	
	}

#imagecontrol {
	float: right;
	width: 280px;
	position: relative;
	
	}


#imageviewer {
	float: left;
	width: 600px;
	margin-left: 28px;

}
		
#skinnav {top:15px; position: absolute;

	font-size: 12px;


}
.gallery-count {left: 35px; top: 425px; position: absolute;}


#previous-image {
	left: 0px;
	top: 185px;
	position: absolute;
}

#next-image {
	left: 633px;
	top: 185px;
	position: absolute;
	z-index: 5000;

}

		
	div#wrapper div#content div.project div#images {
						position:relative;
						float:left;
	
						display:inline;
						overflow:hidden;
					}
				
				
	div#wrapper div#content div.project div#image-wrapper { 
							overflow: hidden; 
							width: 600px; 
							height: 400px;
						}
						
	div#wrapper div#content div.project div#image-wrapper div#image-holder { 
								width: 100000000px;
								float: left;
							}
							
	div#wrapper div#content div.project div#image-wrapper div#image-holder div.image { 
									float: left; 
								}
				
					

		
		
		
#footer {
	float: left;
	font-size: 12px;
	width: 960px;


}


div.ctext{
float:left;
margin:10px 20px 30px 0;
padding:0;
width:300px;
color: #3b3b3b;
position: relative;
font-size: 15px;
}

div.ctext2{
float:left;
margin:10px 20px 30px 0;
padding:0;
width:500px;
color: #3b3b3b;
position: relative;
font-size: 15px;
}








/* --------------------------------------------------------------------
  GRID 960 - custom																 
 -------------------------------------------------------------------- */


.one {width: 300px;position: relative;float: left; margin-right: 10px;}
.two {width: 470px;position: relative;float: left;margin-left: 20px; margin-right: 20px;}
.three {width: 480px;position: relative;float: left;}





/* ----------- NEW GALLERY ------------------------*/

ul.gallery {
	width: 960px; /*--Adjust width according to your scenario--*/
	list-style: none;
}
ul.gallery li {
	float: left;
	margin: 10px; padding: 0;
	text-align: center;
	display: inline; /*--Gimp Fix aka IE6 Fix - Fixes double margin bug--*/
	width: 220px;
	height: 220px;
	overflow: hidden;
}
ul.gallery li a.thumb {
	width: 200px; /*--Width of image--*/
	height: 134px; /*--Height of image--*/
	cursor: pointer;
	margin: 10px;
	
	border: 1px solid #ccc;
	-moz-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	-khtml-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	-webkit-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	
}
ul.gallery li span { /*--Used to crop image--*/
	width: 200px;
	height: 134px;
	overflow: hidden;
	display: block;
}
ul.gallery li a.thumb:hover {
	background: #333; /*--Hover effect for browser with js turned off--*/
}
ul.gallery li h2 {
	font-size: 1em;
	font-weight: normal;
	text-transform: uppercase;
	margin: 0;
	border-top: 1px solid #fff; /*--Subtle bevel effect--*/
}
ul.gallery li a {text-decoration: none; color: #777; display: block;}

ul.gallery li h6 {
	font-size: 10px;
	color: #888;

}




	
/* --------------------------------------------------------------------
 Typography General		
	strong {
			font-weight: 800;
	}
	
	em {
			font-style: italic;
	}
	
	blockquote {
			margin: 0 40px;
			font-style: italic;
	}
	
	a,h3 {
		font-size: 1.1em;
		color: #3b3b3b;
		text-transform:uppercase;
		border-top: 1px solid #222;
	}
	
	h2 a:link,h2 a:visited, 
	h3 a:link,h3 a:visited {
		color: #3b3b3b;
		text-decoration:none;
	}
	
	h2 a:hover, h2 a:active, 
	h3 a:hover, h3 a:active {
		color: #dadada;
	}
	
	
	a img {
		border: none;
	}
	
	a{
		text-decoration: none; 
		color: #666666;
	}
	
	a:active{
		text-decoration: none;
		color: #666666;
	}
	
	a:visited{
		text-decoration: none;
		color: #666666;
	}
	
	a:hover{
		text-decoration: none; 
		color: #dadada;
	}
																 
 -------------------------------------------------------------------- */
 
#icantext {
	width: 475px;
	text-align: justify;
	font-size: 15px;
	color: #535353;
}

.center {
	margin-left: 70px;
	margin-top: 40px;
}



.bold {
	font-weight: 100; font-style: normal; line-height:normal; font-family: museo-sans, sans-serif;
	font-size: 19px; 
}
 
 
.color {color: #4149ea;} 


p {font-size: 12px;}


/* --------------------------------------------------------------------
 Navigation															 
 -------------------------------------------------------------------- */

#headerblock { border-bottom-color: #a8a8a8; border-bottom-style: solid; border-bottom-width: 1px; width: 960px; height: 100px; margin-bottom: 10px; display: block; font-size:13px;
line-height:150%; }
	.logo {width: 199px; height: 22px; float: left; margin-left: 20px; margin-top: 40px;}
	.clear { clear: both; }
	
	div.navblock 			{ width: 380px;	height: 30px;float: right; margin-top: 15px; }
	div.navblock a 		 	{ color: rgb(32, 32, 32); text-decoration: none; padding: 2px 3px; }
	div.navblock a:hover 	{ color: rgb(38, 147, 193); }
	div.navblock a.active	{ color: rgb(38, 147, 193); }
	div.navblock1			{border-left: 1px dotted #ccc; float: left; width: 80px;  padding-left: 10px; padding-top: 15px; font-size: 13px; line-height: 150%; margin-top: 20px;}

div.navblock2
	
	{border-left: 1px dotted #ccc; float: left; width: 70px;  padding-left: 10px; padding-top: 15px; font-size: 13px; line-height: 150%; margin-top: 20px;}


	body.profile { color: rgb(38, 147, 193); }

#home .navblock2 a 		 	{ color: #ffa601; text-decoration: none; padding: 2px 3px; }
#sevice .service a 		 	{ color: #ffa601; text-decoration: none; padding: 2px 3px; }
#portfolio .portfolio a 		 	{ color: #ffa601; text-decoration: none; padding: 2px 3px; }
#profile .profile a 		 	{ color: #ffa601; text-decoration: none; padding: 2px 3px; }
#contact .contact a 		 	{ color: #ffa601; text-decoration: none; padding: 2px 3px; }


/** Service CSS  **/

#ican {
	width: 760px;
	margin: 0 auto;
	margin-top: 40px;

}

#icanimage {
		float: left;
	position: relative;



}



#findme {
	margin-left: 20px;
	float: left;
	position: relative;
	text-align: right;
	margin-top: 100px;

}


/** Profile CSS **/


#bluebox {

	width: 300px;

	}

#alsotext {margin-left: 30px; font-size: 18px; line-height: 1.2;}
#alsotext a {}
	.profiletext {padding-top: 15px; padding-bottom: 20px; padding-left: 20px; border-left-color: #c0c0c0; border-left-style: dotted; border-left-width: 1px; width: 330px; float: right; clear: right; top: 0px; right: 30px; margin-top: 15px; }

	#container { width: 960px; height: 540px; text-align: left; margin-bottom: 30px;}
	.bigblock {width: 960px; text-align: left; margin-bottom: 30px;}
	.block { text-align: justify; float: left; display: block; width: 300px; margin-right: 20px; margin-bottom: 30px; margin-top: 30px;}
	.blockimg { float: left; display: block; width: 275px; margin-right: 40px; margin-bottom: 30px;}
	.block2 {float: right; display: block; width: 620px; margin-bottom: 30px;}
	.block5 {float: right; width: 640px; height: 286px; position: absolute; bottom: 0;left: 0;}
	
	em { text-transform: uppercase; font-style: normal; font-weight: bold; font-size: 11px; letter-spacing: 1px; }
	em.italic { text-transform: none; font-style: italic; font-weight: normal; font-size: 13px; letter-spacing: 0;}
	a { color: #ffa601;text-decoration: none; }
	#header a { border: none; }
	#contactinfo { width: 200px; margin-left: 70px;}
	.block ul { margin: 0; padding: 0; }
	.block ul li { margin: 0; padding: 0; }
	




#sitemap{position: relative;float: left; margin-top:-80px;margin-bottom: 40px; width: 960px;}


.ste {margin-left:285px;display: block;list-style: none;}

.steli {list-style: none;display: inline;}

	#framebtm {
background-attachment:scroll;
background-color:#E6E6E6;
background-image: url(../images/menu-bg.gif);
background-position:center center;

font-size:9px; 
color: #3a3a3a;
bottom:0;
height:20px;
left:0;
position:fixed;
text-align:center;
width:100%;
z-index:1001;
} 





/* button basics */
		a.minibutton {
			display:inline-block; height:23px; padding:0 0 0 3px; font-size:11px;
			font-weight:bold; color:#333; text-shadow:1px 1px 0 #fff; 
			background:url(http://github.com/images/modules/buttons/minibutton_matrix.png) 0 0 no-repeat;
			white-space:nowrap; border:none; overflow:visible; cursor:pointer;
			text-decoration:none;
		}
		
		a.minibutton>span{display:block;height:23px;padding:0 10px 0 8px;line-height:23px;background:url(http://github.com/images/modules/buttons/minibutton_matrix.png) 100% 0 no-repeat;}
		a.minibutton:hover, a.minibutton:focus {color:#fff;text-decoration:none;text-shadow:-1px -1px 0 rgba(0,0,0,0.3);background-position:0 -30px;}
		a.minibutton:hover>span, a.minibutton:focus>span {background-position:100% -30px;}
		
		a.minibutton.mousedown{background-position:0 -60px; }
		a.minibutton.mousedown>span{background-position:100% -60px; }
		
		/* with icon */
		a.btn-download .icon {float:left;margin-left:-4px;width:18px;height:22px;background:url(http://github.com/images/modules/buttons/minibutton_icons.png?v20100306) 0 0 no-repeat;}
		a.btn-download .icon {background-position:-40px 0;}
		a.btn-download:hover .icon, a.btn-download:focus .icon {background-position:-40px -25px;}