@charset "utf-8";

/* resets all styles */
@import url("./reset.css");

/*

-------------------------------------
----------------SUMMARY--------------
-------------------------------------

- MAIN ELEMENTS

- HEADER

	- MENU

	- SLIDER

- MAIN CONTENT

	- SIDEBAR

	- COMMENTS

	- TOP INFO

	- BLOG
	
	- PORTFOLIO
	
	- PAGINATION
	
- FOOTER

- COPYRIGHT

- FORMS 



*/

body {
	
	background: #ffffff;
	color: #3e3e3e;
	font: 12px/22px Arial, Helvetica, sans-serif;
	
}

p { line-height: 1.5em; }


/*---------------------------------
--------------------- MAIN ELEMENTS
---------------------------------*/

a {
	
	color: #1590b3;
	
}

a:hover {
	
	color: #3db0d1;
	text-decoration: underline;
	
}

em {
	
	font-family: Georgia, "Times New Roman", Times, serif;
	
}

blockquote {
	
	background: #f9f9f9;
	border: 1px solid #e0e0e0;
	font-style: italic;
	margin: 0 0 30px 0;
	padding: 20px;
	
}

.wrapper {
	
	margin: 0 auto;
	width: 960px;
	
}

.x1, .x2, .x3, .x3_2, .x4, .x4_3, .x5, .x5_2, .x5_3, .x5_4, .x6 {
	
	float: left;
	margin: 0 30px 0 0;
	
}

.x1 {
	
	width: 960px;
	
}

.x2 {
	
	width: 465px;
	
}

.x3 {
	
	width: 300px;
	
}

.x3_2 {
	
	width: 630px;
	
}

.x4 {
	
	width: 217px;
	
}

.x4_3 {
	
	width: 712px;
	
}

.x5 {
	
	width: 168px;
	
}

.x5_2 {
	
	width: 366px;
	
}

.x5_3 {
	
	width: 564px;
	
}

.x5_4 {
	
	width: 762px;
	
}

.x6 {
	
	width: 135px;
	
}

.last {
	
	margin-right: 0;
	
}

h1.subtitle, h2.subtitle, h3.subtitle, h4.subtitle, h5.subtitle, h6.subtitle {
	
	margin-bottom: .2em !important;
	
}

.block {
	
	float: left;
	margin: 0 0 30px 0;
	width: 100%;
	
}




  /*---------------------------------
  ---------------------------- HEADER
  ---------------------------------*/

#header, #header_index {
	
	background: #100e16 url(./images/header_bg.jpg) no-repeat top center;
	border-bottom: 5px solid #d2d2d2;
	float: left;
	margin: 0 0 30px 0;
	padding: 35px 0 70px 0;
	width: 100%;
	
}

#header_index {
	
	padding: 35px 0 !important;
	
}

	#logo {
		
		float: left;
		
	}
	
	
		
	/*---------------------------------
	------------------------------ MENU
	---------------------------------*/
	
	#menu {
		
		float: right;
		position: relative;
		z-index: 10 !important;
		
	}
	
		#menu ul {
			
			background: url(./images/menu_bg_left.png) no-repeat top left;
			float: right;
			list-style: none;
			padding: 0 0 0 4px;
			
		}
		
			#menu ul li {
				
				float: left;
				margin: 0;
				position: relative;
				
			}
			
			#menu ul li.border {
				
				background: url(./images/menu_separator.gif) no-repeat top left;
				float: left;
				margin: 0;
				height: 34px;
				width: 2px;
				
			}
			
				#menu ul li ul {
					
					background: #2c2c2c;
					display: none;
					left: 0;
					padding: 0 0 7px 0;
					position: absolute;
					top: 34px;
					width: 132px;
					
					-moz-border-radius: 6px;
					-webkit-border-radius: 6px;
					border-radius: 6px;
					
					-moz-border-radius-topleft: 0;
					-webkit-border-top-left-radius: 0;
					-moz-border-radius-topright: 0;
					-webkit-border-top-right-radius: 0;

				}
				
					#menu ul li ul li {
						
						display: block;
						float: left;
						padding: 0 20px;
						width: 92px;
						
					}
				
						#menu ul li ul li a {
							
							border-bottom: 1px solid #1f1f1f;
							border-top: 1px solid #383838;
							display: block;
							float: none;
							padding: 8px 0;
							
						}
						
						#menu ul li ul li a:hover,
						#menu ul li ul li a.hovered {
							
							background: none;
							text-decoration: underline !important;
							
						}
						
				#menu ul li ul li ul {
					
					background: #2c2c2c;
					left: 131px;
					padding: 0; 
					top: 0;
					
					-moz-border-radius: 6px;
					-webkit-border-radius: 6px;
					border-radius: 6px;
					
				}
			
			#menu ul li a {
				
				color: #b0b0b0;
				float: left;
				font-weight: bold;
				padding: 6px 20px 7px 20px;
				text-decoration: none !important;
				
			}
			
			#menu ul li a.current {
				
				color: #ffffff;
				
			}
			
			#menu ul li a:hover,
			#menu ul li a.hovered{
				
				background: url(./images/menu_hover.gif) repeat-x top left;
				
			}
			
		#menu #right_bg {
			
			background: url(./images/menu_bg_right.png) no-repeat top right;
			float: right;
			height: 40px;
			width: 5px;
			
		}
		
		
			
	/*---------------------------------
	---------------------------- SLIDER
	---------------------------------*/
	
	#slider_wrapper {
		
		float: left;
		margin: 15px 0 0 0;
		width: 100%;
		
	}
	
		#slider_top {
			
			background: url(./images/slider_top.png) no-repeat top left;
			float: left;
			height: 10px;
			overflow: hidden;
			width: 100%;
			
		}
		
		#slider_bottom {
			
			background: url(./images/slider_bottom.png) no-repeat top left;
			float: left;
			height: 10px;
			overflow: hidden;
			width: 100%;
			
		}
		
		#slider {
			
			background: url(./images/slider_bg.png) repeat-y top left;
			float: left;
			height: 285px;
			overflow: hidden;
			padding: 0 10px;
			position: relative;
			width: 940px;
			
		}
		
		#slider_3D {
			
			background: url(./images/slider_bg.png) repeat-y top left;
			float: left;
			height: 285px;
			padding: 0 10px;
			position: relative;
			width: 940px;
			
		}
		
			#slider ul li.current {
		
				display: block;
				z-index: 3 !important;
				
			}
			
			#slider ul li.next {
				
				display: block;
				z-index: 2 !important;
				
			}
		
			#slider_images {
				
				list-style: none;
				margin: 0;
				padding: 0;
				
			}
			
				#slider_images li {
					
					display: none;
					margin: 0;
					padding: 0;
					position: absolute;
					z-index: 1;
					
				}
				
		#slider_info {
			
			background: url(./images/slider_info_bg.png);
			bottom: 0;
			float: left;
			padding: 15px;
			position: absolute;
			width: 910px;
			z-index: 5;
			
		}
		
			#slider_info .left ul {
				
				list-style: none;
				float: left;
				margin: 6px 0 0 0;
				
			}
			
				#slider_info .left ul li {
					
					cursor: pointer;
					float: left;
					margin: 0;
					
				}
				
				#left_arrow {
					
					background: url(./images/slider_left.png) no-repeat top left;
					height: 17px;
					margin: 0 8px 0 0 !important;
					width: 18px;
					
				}
				
				#right_arrow {
					
					background: url(./images/slider_right.png) no-repeat top left;
					height: 17px;
					width: 18px;
					
				}
				
			#slider_selector li.current {
				
				background: url(./images/slider_info_selector_current.png) no-repeat top left;
				height: 11px;
				width: 11px;
				
			}
				
			#slider_selector li {
				
				background: url(./images/slider_info_selector.png) no-repeat top left;
				height: 11px;
				margin: 3px 0 0 10px !important;
				width: 11px;
				
			}
		
		#slider_caption {
			
			background: url(./images/slider_caption_left.png) no-repeat top left;
			color: #797979;
			float: left;
			font: italic 12px/22px Georgia, "Times New Roman", Times, serif;
			padding: 3px 5px 3px 10px;
			
			text-shadow: 1px 1px 1px #ffffff;
			
		}
		
		#slider_caption_right {
			
			background: url(./images/slider_caption_right.png) no-repeat top left;
			float: left;
			height: 28px;
			margin: 0 5px 0 0;
			overflow: hidden;
			width: 5px;
			
		}
		
		.button {
			
			background: url(./images/slider_learn_more.png) no-repeat top left;
			float: left;
			font: bold 12px/22px Arial, Helvetica, sans-serif;
			
			text-shadow: 1px 1px 0px #ffdb7c;
			
		}
		
			.button a {
				
				color: #805d16;
				float: left;
				padding: 3px 15px 5px 20px;
				
			}
		
		.button_right {
			
			background: url(./images/slider_learn_more_right.png) no-repeat top left;
			float: left;
			height: 30px;
			margin: 0 5px 0 0;
			overflow: hidden;
			width: 5px;
			
		}
		
		
		
		
/*---------------------------------
---------------------- MAIN CONTENT
---------------------------------*/

#content {

	float: left;
	position: relative;
	width: 100%;
	
}

	#main_content {
		
		margin-bottom: 20px;
		
	}


	
	
	
	/*---------------------------------
	--------------------------- SIDEBAR
	---------------------------------*/
	
	.sidebar_item {
		
		background: url(./images/sidebar_item_bg.gif) repeat-y top left;
		float: left;
		width: 100%;
		
	}
		
		.sidebar_item_content {
			
			padding: 10px 20px 5px 20px;
			
		}
		
			.sidebar_item_content ul {
				
				list-style: none;
				margin: 0;
				
			}
			
			.sidebar_item_content ul li {
				
				background: url(./images/li_bg.gif) repeat-x bottom left;
				margin: 0;
				padding: 14px 0 14px 0;
				
			}
	
		.sidebar_bg_top {
			
			background: url(./images/sidebar_item_top.gif) no-repeat top left;
			height: 9px;
			float: left;
			overflow: hidden;
			width: 100%;
			
		}
	
		.sidebar_bg_bottom {
			
			background: url(./images/sidebar_item_bottom.gif) no-repeat top left;
			height: 9px;
			float: left;
			overflow: hidden;
			width: 100%;
			
		}
		
	.icon_imac {
		
		background: url(./assets/imac_icon.png) no-repeat center left;
		
	}
		
	.icon_pencil_ruler {
		
		background: url(./assets/pencil_ruler_icon.png) no-repeat center left;
		
	}
		
	.icon_itunes {
		
		background: url(./assets/itunes_icon.png) no-repeat center left;
		
	}
		
	.icon_file {
		
		background: url(./assets/file_icon.png) no-repeat center left;
		
	}
	
	.icon_imac, .icon_pencil_ruler, .icon_itunes, .icon_file {
		
		color: #707070;
		font: bold 14px/22px Arial, Helvetica, sans-serif;
		padding: 8px 0 8px 42px;
		margin: 0;
		
		text-shadow: 1px 1px 1px #ffffff;
		
	}
	
	#from_the_blog a {
		
		font: bold 14px/22px Arial, Helvetica, sans-serif;
		
	}


.title a {
	
	color: #414141;
	
}

img.alignleft, img.border_img {
	
	border: 6px solid #d5cfcf;
	
}

.ticks {
	
	float: left;
	margin: 20px 0 0 0;
	width: 100%;
	
}

.tick {
	
	background: url(./images/tick.gif) no-repeat top left;
	padding: 0 0 0 33px;
	
}

.divider {
	
	background: url(./images/divider.gif) no-repeat top center;
	float: left;
	height: 17px;
	margin: 0 0 20px 0;
	width: 100%;
	
}

.who_we_are, .usability {
	
	background: url(./assets/who_we_are_icon.gif) no-repeat center left;
	padding: 6px 0 6px 35px;
	
}

.what_we_do, .wordpress_coding {
	
	background: url(./assets/what_we_do.gif) no-repeat center left;
	padding: 5px 0 6px 40px;
	
}

.photography {
	
	background: url(./assets/photography_icon.png) no-repeat center left;
	padding: 5px 0 6px 42px;
	
}

.online_gaming {
	
	background: url(./assets/online_gaming_icon.png) no-repeat center left;
	padding: 5px 0 6px 42px;
	
}

.publishing {
	
	background: url(./assets/publishing_icon.png) no-repeat center left;
	padding: 5px 0 6px 45px;
	
}

.conference {
	
	background: url(./assets/conference_icon.png) no-repeat center left;
	padding: 5px 0 6px 45px;
	
}
.conferenceCopiar {
	padding: 5px 0 6px 45px;
	background-image: url(./assets/bla.png);
	background-repeat: no-repeat;
	background-position: left center;
}




		
		
		
		
	/*---------------------------------
	-------------------------- COMMENTS
	---------------------------------*/
	
	#comments h3 {
		
		margin-bottom: 35px;
		
	}
	
	#comments ol {
	
		list-style: none;
		margin: 0;
	
	}

	#comments ol li {
		
		margin: 0 0 40px 10px;
		position: relative;
		
	}
	
	#comments ol li p.content {
		
		background: #f6f6f6;
		border: 1px solid #c7c7c7;
		padding: 15px 15px 15px 85px;
		margin: 0;
		
	}
	
	.comment_image {
		
		border: none !important;
		left: -15px;
		padding: 0;
		position: absolute;
		top: -15px;
		
	}
	
	#comments .author {
		
		background: url(./images/author_icon.gif) no-repeat center left;
		font-size: 10px;
		font-weight: bold;
		margin: 0 20px 0 0;
		padding: 0 0 0 15px;
		
	}
	
	#comments .date {
		
		background: url(./images/comment_date.gif) no-repeat center left;
		font-size: 10px;
		margin: 0 20px 0 0;
		padding: 0 0 0 15px;
		
	}
	
	#comments .reply {
		
		background: url(./images/comment_reply.gif) no-repeat center left;
		font-size: 10px;
		font-weight: bold;
		padding: 0 0 0 15px;
		position: absolute;
		right: 15px;
		text-transform: uppercase;
		
	}
	
	#comments .time {
		
		background: url(./images/comment_time.gif) no-repeat center left;
		font-size: 10px;
		padding: 0 0 0 15px;
		
	}
	
		#comments ol li ol {
			
			border: 1px dashed #c7c7c7;
			border-top: none;
			padding: 30px;
			
		}
	
	#comments ol li ol li {
		
		float: none;
		margin: 0 0 0 10px;
		position: relative;
		
	}




	/*---------------------------------
	-------------------------- TOP INFO
	---------------------------------*/
	
	#top_info {
		
		background: url(./images/top_info_bg.png) no-repeat top left;
		float: left;
		height: 17px;
		margin: -68px 0 0 0;
		padding: 8px 20px;
		width: 920px;
		
	}
	
	#top_info, #top_info a {
		
		color: #818181;
		font: bold 12px/22px Georgia, "Times New Roman", Times, serif;
		text-shadow: 1px 1px 0px #ffffff;
		
	}
	
	
	
	
	/*---------------------------------
	------------------------------ BLOG
	---------------------------------*/
	
	.blog_item {
		
		margin-bottom: 30px;
		
	}
	
	.blog_item_content {
		
		float: left;
		width: 100%;
		
	}
	
	.blog_info {
		
		background: url(./images/blog_info_left.gif) repeat-y top left;
		float: left;
		margin: 0 0 25px 0;
		padding: 5px 9px 7px 15px;
		
	}
	
	.blog_info, .blog_info a {
		
		color: #727272;
		font: normal 14px/22px Georgia, "Times New Roman", Times, serif;
		
		text-shadow: 1px 1px 0px #ffffff;
		
	}
	
	.blog_info_right {
		
		background: url(./images/blog_info_right.gif) repeat-y top left;
		height: 34px;
		float: left;
		width: 6px;
		
	}
	
	.about_author {
		
		background: #f6f6f6;
		border: 1px solid #c3c3c3;
		float: left;
		padding: 20px;
		width: 588px;
		
	}	
	
	
	
	
	/*---------------------------------
	------------------------- PORTFOLIO
	---------------------------------*/
	
	#portfolio_cats {
		
		background: url(./images/portfolio_cats_bg_left.png) repeat-y top left;
		float: left;
		margin: 0 0 10px 0;
		
	}
	
		#portfolio_cats ul {
			
			background: url(./images/portfolio_cats_bg_right.png) repeat-y top right;
			float: left;
			list-style: none;
			margin: 0;
			
		}
		
			#portfolio_cats ul li {
				
				float: left;
				margin: 0;
				padding: 0;
				
			}
			
			#portfolio_cats ul li a {
				
				color: #707070;
				float: left;
				font: bold 14px/22px Arial, Helvetica, sans-serif;
				margin: 0 0 6px 0;
				outline: none;
				padding: 12px 18px;
				text-shadow: 1px 1px 0px #ffffff;
				
			}
			
			#portfolio_cats ul li a.current {
				
				color: #1590b3;
				
			}
			
	#portfolio_content ul {
		
		list-style: none;
		margin: 0;
		
	}
	
		#portfolio_content ul li {
			
			float: left;
			margin: 0 19px 14px 0;
			position: relative;
			
		}
		
			#portfolio_content ul li img {
				
				border: 4px solid #d5cfcf;
				margin: 0;
				
			}
			
			#portfolio_content ul li a {
				
				background: url(./images/portfolio_zoom.png) no-repeat center center;
				display: none;
				float: left;
				height: 1px;
				position: absolute;
				width: 1px;
				
			}
	
	
	
	
	/*---------------------------------
	-------------------------PAGINATION
	---------------------------------*/
	
	#pagination {
		
		float: left;
		width: 100%;
		margin: 10px 0 30px 0;
		
	}
	
	#pagination ul {
		
		list-style: none;
		float: left;
		
	}
	
		#pagination ul li {
			
			float: left;
			margin: 0 5px 0 0;
			
		}
		
			#pagination ul li a {
				
				background: url(./images/pagination_bg.png) repeat-x top left;
				color: #e1e1e1;
				font: bold 11px Arial, Helvetica, sans-serif;
				text-decoration: none !important;
				text-transform: uppercase;
				padding: 4px 20px 5px 20px;
				
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
				border-radius: 5px;
				
				-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
				-moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
				box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.5);
	
				
			}
		
			#pagination ul li.selected a,
			#pagination ul li a:hover {
				
				background: url(./images/pagination_bg_hover.png) repeat-x top left;
				
			}



		

/*---------------------------------
---------------------------- FOOTER
---------------------------------*/

#footer {
	
	background: #242424 url(./images/footer_bg.gif) repeat-x top left;
	border-top: 5px solid #d2d2d2;
	color: #898989 !important;
	float: left;
	padding: 30px 0 40px 0;
	width: 100%;
	
}

	.footer_item_top_bg {
		
		background: url(./images/footer_item_top.gif) no-repeat top left;
		height: 10px;
		float: left;
		margin: 20px 0 0 0;
		overflow: hidden;
		width: 100%;				
		
	}
	
	.footer_item_content {
		
		background: url(./images/footer_item_bg.gif) repeat-y top left;
		float: left;
		padding: 10px 20px;
		width: 260px;
		
	}
	
		.footer_item_content ul {
				
				list-style: none;
				margin: 0;
				
			}
			
			.footer_item_content ul li {
				
				background: url(./images/footer_li_bg.gif) repeat-x bottom left;
				margin: 0;
				padding: 10px 0 11px 0;
				
			}
			
			.favorite_links, .recent_comments {
				
				padding: 0 20px !important;
				
			}
			
			.favorite_links a, .recent_comments a {
				
				color: #898989;
				font-weight: bold;
				
			}
			
			.favorite_links a:hover, .recent_comments a:hover {
				
				color: #3db0d1;
				
			}

	.footer_item_bottom_bg {
		
		background: url(./images/footer_item_bottom.gif) no-repeat top left;
		height: 10px;
		float: left;
		overflow: hidden;
		width: 100%;				
		
	}

	#footer h2, #footer h3, #footer h1, #footer h4, #footer h5, #footer h6 {
		
		color: #bfbfbf
		
	}
	
	.favorite_links_icon, .pencil_icon, .comments_icon {
		
		padding: 5px 0 4px 42px;
		margin: 0;
		
	}
	
	.favorite_links_icon {
		
		background: url(./assets/favorite_links_icon.png) no-repeat center left;
		
	}
	
	.pencil_icon {
		
		background: url(./assets/pencil_icon.png) no-repeat center left;
		
	}
	
	.comments_icon {
		
		background: url(./assets/comments_icon.png) no-repeat center left;
		
	}




/*---------------------------------
------------------------- COPYRIGHT
---------------------------------*/

#copyright {
	
	background: #191919 url(./images/copyright_bg.gif) repeat-x top left;
	color: #636363 !important;
	float: left;
	padding: 12px 0;
	width: 100%;
	
}

#copyright a {
	
	color: #636363;
	text-decoration: underline;
	
}

#copyright a:hover {
	
	color: #1590b3;
	
}

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

	#copyright ul li {
		
		background: url(./images/copyright_border.png) no-repeat center right;
		float: left;
		margin: 0;
		padding: 0 5px;
		
	}





/*---------------------------------
------------------------------FORMS
---------------------------------*/

label { 

	color: #686868;
	font: bold 11px/18px Arial, Helvetica, sans-serif;
	margin-bottom: 5px;
	text-transform: uppercase;

}

label em {
	
	font-size: 10px;
	
}

input, textarea, select {
	
	background: #ebebeb;
	border: 1px solid #dedede;
	color: #707070;
	display: block;
	font: italic 1em Arial, Tahoma, sans-serif;
	margin: 0px 0px 8px 0px;
	padding: 8px 5px;
	width: 98%;
	
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	
}

input:focus, textarea:focus, select:focus {
	
	border: 1px solid #8a8a8a;
	color: #5c5c5c;
	font-style: normal;
	
}

.alert {
	
	border: 2px solid #FB6064;
	
}

select {
	
	background: #ffffff;
	
}

label span { color: #f00; }

.medium { width: 50%; }

.short { width: 30%; }

input.submit, input.reset {
	
	display: block;
	float: left;
	width: 170px;
	margin: 0 20px 8px 0;
	padding: 10px 0px 10px 0px;
	font: bold 1.1em Arial, Tahoma, sans-serif;
	text-transform: uppercase;
	cursor: pointer;
	
}

input.checkbox {
	
	float: left;
	margin: 3px 4px 0 0;
	padding: 0;
	width: 20px;
	
}
