/*-----------------------------------------------------

	CodePress.co.uk
	Professional Front-end web development

------------------------------------------------------*/
	/* Code Press Reset */
	html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	font-weight: inherit;
	font-style:inherit;
	font-family:inherit;
	font-size: 100%;
}
	input, textarea, select {margin:0; padding:0; font-family:sans-serif; font-size: 1em}
	body {line-height: 1; color: black; background: white;}
	img, a img,abbr,acronym,fieldset {border: 0;}
	ol, ul, li {list-style: none;}
	table {border-collapse: collapse; border-spacing: 0;}
	caption, td, th {text-align: left; font-weight: normal; vertical-align: top;}
	blockquote:before, blockquote:after, q:before, q:after {content: "";}
	blockquote, q {quotes: "" "";}
	sup, sub {vertical-align: text-top;}
	/*CP Default styles*/
	strong 	{font-weight:bold;}
	em 		{font-style:italic;}
	h1,h2,h3,h4,h5,h6,p,dd,dt,li {line-height:1.22em;}

/*-----------------------------------------------------
	
	CSS structure 
	
	1.0 Defaults
		1.1 Link defaults
		1.2 Type defaults
	2.0 Layout
		2.1 Homepage
	
-----------------------------------------------------*/

/*-----------------------------------------------------
	1.0 Defaults
-----------------------------------------------------*/

	body {font:62.5% Arial, Helvetica; color:#000; background:#fff url(../images/page_bottom.jpg) bottom repeat-x;}
		#skiplinks {position:absolute; left:-9999px;}
	
/*-----------------------------------------------------
	1.1 Links
-----------------------------------------------------*/
	a:link 		{
	text-decoration:none;
	color: #666;
}
	a:visited	{
	text-decoration:none;
	color: #666;
}
	a:hover		{ text-decoration:none;}
	a:active	{ text-decoration:none;}

/*-----------------------------------------------------
	1.2 Type
-----------------------------------------------------*/

	h1	{
	font-weight: normal;
}
	h2	{
	font-weight: normal;
}
	h3	{}
	p	{}
	li	{}
	
/*-----------------------------------------------------
	2.0 Layout
-----------------------------------------------------*/

/*-----------------------------------------------------
	2.1 Homepage (name of page/group)
-----------------------------------------------------*/
	/* 	
		Styles in here are either customised modules (extra bits to the header or added modules.) 
		or unique page-specific/group specific styles
	*/

/* 
	Debug styles:
	
	a[href="#"] {background: lime;}
	a[href="404"] {background: lime;}
	a[href=""] {background: fuchsia;}
	
	*[align], *[valign], *[border], table[cellspacing], table[cellpadding], *[width], *[height], a[href^=”javascript:”], *[onload], *[onunload], *[onchange], *[onsubmit], *[onreset], *[onselect], *[onblur], *[onfocus], *[onkeydown], *[onkeypress], *[onkeyup], *[onclick], *[ondblclick], *[onmousedown], *[onmousemove], *[onmouseover], *[onmouseout], *[onmouseup]
	{outline:5px solid yellow;}

	img[width], img[height] {outline:0;}

	img {outline: 5px solid red;}
	img[alt][title] {outline-width: 0;}
	img[alt] {outline-color: fuchsia;}
	img[alt], img[title] {outline-style: double;}
	img[alt=""][title], img[alt][title=""] {outline-width: 3px;}
	img[alt=""][title=""] {outline-style: dotted;}
	
	Sometimes a client will have our banners on their site. Here is the HTML and CSS to include;

	HTML:
	<a href="http://codepress.co.uk" title="Expertly Code Pressed" rel="external" id="cp_84bannerc">
		<span>Code Press - Professional front-end development</span>
	</a>
	
	CSS:
	#cp_84bannerc 			{width:84px; height:20px; display:block; background: url('../images/cp/cp-84x20-combo.png') no-repeat 0 0}
	a:hover#cp_84bannerc 	{background-position:0 -20px}
	#cp_84bannerc span 		{position:absolute; left:-9999px}	
*/



#header{ width:100%; height:43px; background:#000; min-width:980px;}
.header_inside{ width:980px; margin:0 auto; overflow:hidden;}
	h1{ float:left; display:inline; margin:14px 0 0 9px; width:187px; font-size:24px;}
	h1 img{ display:block;}
	
	.contact_info{ float:left; width:206px; margin:29px 0 0 11px;}
	.contact_info .contact_tel{ float:left; margin-right:7px;}
	.contact_info .contact_email{ float:left; width:107px; height:11px; text-indent:-9999px; overflow:hidden; background:url(../images/txt_mail.gif) 0 0 no-repeat;}
	.contact_info .contact_email:hover{ background-position:0 -11px;}
	
	#navigation{ float:left; width:245px; height:10px; margin:26px 0 0 186px;}
		#navigation li{ float:left; height:10px; margin-right:22px;}
		#navigation li a{ float:left; height:10px; text-indent:-9999px; overflow:hidden; text-decoration:none;}
		#navigation li#nav1 a{ width:56px; background:url(../images/nav_choose_us.gif) 0 0 no-repeat;}
		#navigation li#nav2 a{ width:47px; background:url(../images/nav_services.gif) 0 0 no-repeat;}
		#navigation li#nav3 a{ width:69px; background:url(../images/nav_get_in_touch.gif) 0 0 no-repeat;}
		
		#navigation li#nav1 a:hover,
		#navigation li#nav1.on a{ background:url(../images/nav_choose_us.gif) 0 -10px no-repeat;}
		#navigation li#nav2 a:hover,
		#navigation li#nav2.on a{ background:url(../images/nav_services.gif) 0 -10px no-repeat;}
		#navigation li#nav3 a:hover,
		#navigation li#nav3.on a{ background:url(../images/nav_get_in_touch.gif) 0 -10px no-repeat;}
	
	.btn_blog{ float:left; width:41px; height:17px; display:inline; margin:22px 8px 0 70px; text-indent:-9999px; overflow:hidden;
				 background:url(../images/btn_blog.gif) 0 0 no-repeat;}
	.btn_blog:hover{ background-position:0 -17px;}



.slide_holder{ width:100%; background:#212120 url(../images/slide_bg.gif) top repeat-x; min-width:980px;}
.slide_holder_inside{ width:980px; margin:0 auto; position:relative;}
	.switch_button{ position:absolute; width:33px; height:34px; overflow:hidden; display:none; left:845px; bottom:-15px; z-index:3;}
	.switch_button a{ float:left; width:33px; height:34px; text-indent:-9999px; overflow:hidden; background:url(../images/switch.png) 0 2px no-repeat;}
	.switch_button a:hover{ background-position:0 -31px;}
	.switch_button a.close{ background-position:0 -64px;}
	.switch_button a.close:hover{ background-position:0 -97px;}

	
	.flow_arrow_left,
	.flow_arrow_right{ position:absolute; left:0; top:257px; width:31px; height:31px;}
	
	.flow_arrow_left a,
	.flow_arrow_right a{ display:block; width:100%; height:100%; text-indent:-9999px; overflow:hidden;}
	
	.flow_arrow_left a{ background:url(../images/ico_arrows.gif) -62px 0 no-repeat;}
	.flow_arrow_left a:hover{ background:url(../images/ico_arrows.gif) -93px 0 no-repeat;}
	.flow_arrow_right a{ background:url(../images/ico_arrows.gif) 0px 0 no-repeat;}
	.flow_arrow_right a:hover{ background:url(../images/ico_arrows.gif) -31px 0 no-repeat;}
	
	#flow_arrow1{ left:682px;}
	#flow_arrow2{ left:108px;}
	#flow_arrow3{ left:732px;}
	#flow_arrow4{ left:37px;}
	
	.slide{ width:980px; height:560px; margin:0 auto; overflow:hidden; position:relative; z-index:2; height:0;}
	.slide ul{ width:3940px; overflow:hidden;}
	.slide ul li{ float:left; width:980px; height:560px; position:relative;}
	.slide ul li .btn_close{ right:100px; bottom:0px; width:36px; height:16px; background:url(../images/btn_close.gif) 0 0 no-repeat;}
	.slide ul li .btn_close:hover{ background-position:0 -16px;}
	
	.slide ul li.slide1{ background:#000 url(../images/slide1.jpg) no-repeat;}
		.slide1 .sli_title1{ position:absolute; width:270px; left:194px; top:83px;}
		.slide1 .sli_txt{ position:absolute; width:320px; left:170px; top:247px; font-size:12px; font-weight:bold; color:#797979; text-align:center; line-height:124%;}
		.slide1 .sli_txt p{ margin-bottom:16px;}
		.slide1 .btn_see_services{ width:107px; left:271px; top:426px; background:url(../images/btn_see_our_services.gif) 0 0 no-repeat;}
		.slide1 .btn_see_services:hover{ background-position:0 -17px;}	
		
		.sli_brain{ position:absolute; width:197px; height:146px; left:750px; top:208px;}
		
								 
	.slide ul li.slide2{ background:#000 url(../images/slide2.jpg) no-repeat;}
		.slide2 .sli_title1{ position:absolute; width:225px; left:329px; top:122px;}
		.slide2 .sli_txt{ position:absolute; width:310px; left:282px; top:266px; font-size:12px; font-weight:bold; color:#797979; text-align:center; line-height:124%;}
		.slide2 .btn_get_in_touch{ position:absolute; width:86px; height:17px; left:394px; top:417px; text-indent:-9999px; overflow:hidden;
									 background:url(../images/btn_get_in_touch.gif) 0 0 no-repeat;}
		.slide2 .btn_get_in_touch:hover{ background-position:0 -17px;}	
		.sli_mouse1{ position:absolute; width:132px; height:79px; left:660px; top:90px;}
		.sli_mouse2{ position:absolute; width:143px; height:102px; left:792px; top:240px;}
		.sli_mouse3{ position:absolute; width:97px; height:67px; left:612px; top:390px;}



	.slide ul li.slide3{ background:#000 url(../images/slide3.jpg) no-repeat;}
		.sli_star{ position:absolute; width:146px; height:146px; left:108px; top:24px;}
		.sli_tel{ position:absolute; width:276px; height:178px; left:654px; top:39px;}
		
		.btn_close,
		.btn_see_services,
		.btn_get_in_touch,
		.btn_map,
		.btn_mail,
		.btn_send,.btn_send,
		.btn_reset{ position:absolute; height:17px; text-indent:-9999px; overflow:hidden;}
		
		.btn_map{ width:40px; left:212px; top:198px; background:url(../images/btn_map.gif) 0 0 no-repeat;}
		.btn_map:hover{ background-position:0 -17px;}
		.btn_mail{ width:155px; left:60px; top:373px; background:url(../images/btn_mail.gif) 0 0 no-repeat;}
		.btn_mail:hover{ background-position:0 -17px;}	
		
		.touch_form{ position:absolute; width:316px; left:314px; top:57px;}
			.form_title{ margin-bottom:23px; font-size:20px;}
			
			.touch_form input.input_txt,
			.touch_form textarea{ color:#444444; font-style:italic; padding:1px 3px; margin:0 0 14px 3px; font-family:Arial; background:#000; border:1px #fff solid;}
			.touch_form input.input_txt{ width:296px; font-size:11px;}
			.touch_form input.ErrorField{ border:1px #FFFF00 solid;}
			.touch_form textarea{ width:296px; height:166px; font-size:11px;}
			.btn_send,.btn_sendd{ position:static; display:block; width:42px; height:19px; overflow:hidden; cursor:pointer; margin:0 0 0 130px; border:1px #0d0d0d solid;
						 background:url(../images/btn_send.gif) 0 0 no-repeat;}
			.btn_send:hover,.btn_sendd:hover{ background-position:0 -17px;}
			
		
		.sent_holder{ position:absolute; width:316px; left:314px; top:228px; display:none;}
			.sent_title{ margin-bottom:14px;}
			.btn_reset{ display:block; width:40px; margin:0 0 0 130px; border:4px #0d0d0d solid; background:url(../images/btn_reset.gif) 0 0 no-repeat;}
			.btn_reset:hover{ background-position:0 -17px;}
			
			

.map_holder{ position:absolute; z-index:4; top:43px; width:100%; height:560px; display:none;}
	.map_content{ width:980px; height:560px; margin:0 auto; overflow:hidden; position:relative; z-index:3;}
	.map_content .btn_close{ position:absolute; width:40px; height:17px; left:212px; top:198px; text-indent:-9999px; overflow:hidden;
				 			 background:url(../images/btn_close2.gif) 0 -17px no-repeat;}

	.map_content .line{ display:block; position:absolute; left:229px; top:215px; width:2px; height:19px; background:#fff; text-indent:-9999px; overflow:hidden;}
	.map_content .map{ position:absolute; left:21px; top:232px; width:396px; height:296px; border:2px #fff solid; z-index:1;}

	.map_bg{ position:absolute; width:100%; height:1560px; background:#000; opacity:0.5; left:0; top:-43px; z-index:1;}
	






#content{ width:100%; background:url(../images/body_bg.jpg) center bottom repeat; min-width:980px;}
.content_shadow{ width:100%; background:url(../images/head_shadow.gif) top repeat-x;}
.content_inside{ width:980px; overflow:hidden; margin:0 auto;}

	.work_holder{
	width:100%;
	margin-top:32px;
	padding-bottom:40px;
}
	.single_work{ width:100%; overflow:hidden; margin-bottom:30px;}
		.work_flash{ float:left; width:677px; display:inline; margin-left:10px;}
		
		.work_intro{ float:left; width:285px; font-family:Georgia, "Times New Roman", Times, serif; margin:58px 0 0 6px;}
			/*.work_intro .work_title{ font-size:26px; line-height:100%; font-weight:bold;}*/
			.work_intro .work_title{ font-size:36px; letter-spacing:-1px; line-height:100%; margin-bottom:6px;}
			.work_intro .work_tag{ font-size:12px; font-weight:bold; color:#000; margin-bottom:6px; line-height:130%; text-indent:3px;}
			.work_intro .work_desc{ margin-bottom:8px; padding-left:3px;}

			.work_intro .work_desc p{ color:#666; font-size:11px; width:230px; line-height:130%;}
			.work_intro .work_comment{
	width:100%;
	overflow:hidden;
	font-size:16px;
	font-weight:bold;
	color:#fff;
	clear: left;
}
			.work_intro .work_comment span{
	background:#000;
	margin-bottom:2px;
	padding-top: 2px;
	padding-right: 2px;
	padding-bottom: 3px;
	padding-left: 2px;
	clear: left;
	float: left;
}
			
			.work_operation{ width:100%; margin-top:42px;}
			.work_operation li{ float:left; background:url(../images/dot_line.gif) right top repeat-y;}
			.work_operation li a{ float:left; width:58px; font-size:10px; color:#1c1c1c; padding-top:48px; text-align:center; line-height:110%;}
			
			.work_operation li.oper_website{ padding:0 3px 0 3px;}
			.work_operation li.oper_talk{ padding:0 12px 0 8px;}
			.work_operation li.oper_tell{ padding:0 10px 0 10px; background:none;}
			.work_operation li.oper_website a{ background:url(../images/ico_website.gif) center 5px no-repeat;}
			.work_operation li.oper_talk a{ background:url(../images/ico_talk_to.gif) center 5px no-repeat;}
			.work_operation li.oper_tell a{ background:url(../images/ico_tell_friend.gif) center 7px no-repeat;}
			
			.work_operation li.oper_website a:hover{ background-position:center -76px;}
			.work_operation li.oper_talk a:hover{ background-position:center -76px;}
			.work_operation li.oper_tell a:hover{ background-position:center -78px;}
			
	.pop_box{ position:absolute; width:214px; height:220px; background:url(../images/pop_box.gif) no-repeat; left:0; top:0; display:none;}
		.send_box{ width:100%;}
			.tell_title{ text-align:center; margin:15px 0 25px;}
			.talk_title{ text-align:center; margin:15px 0 13px;}
			.mail{ color:#6f6f6f; font-size:11px; font-style:italic; text-align:center; margin-bottom:25px;}
			.mail a{ color:#6f6f6f; text-decoration:underline;}
			.pop_form{ width:130px; margin:0 auto; position:relative;}
			.pop_form input.input_txt{ width:118px; padding:1px 2px; border:1px #fff solid; color:#666; text-align:center; font-style:italic;
							 font-size:11px; font-family:Arial; background:#0f0f0f; margin-bottom:9px;}
			.pop_form .btn_send,.pop_form .btn_sendd{ margin-left:40px; margin-top:-5px;}
			
			
			.pop_form input.ErrorField{ border:1px #FFFF00 solid;}
			.ValidationErrors{ color:#ffff00; position:relative; top:-5px; left:4px; font-size:12px;}
			.required{ position:absolute; right:-25px; bottom:-10px; color:#FFFF00; font-size:9px; font-family:Arial, Helvetica, sans-serif;}
			.touch_form .required{ right:-10px;}
		
		.sent{ width:100%; display:none;}
		.sent .sent_title{ margin:57px 0 32px; text-align:center;}
		
		.pop_box .btn_close{ position:static; display:block; margin:0 auto; width:40px; height:17px; background:url(../images/btn_close2.gif) 0 0 no-repeat;}
		.pop_box .btn_close:hover{ background-position:0 -17px;}
		
		
		
		
/*blog page*/
.blog_page{ width:100%; background:#000; padding-bottom:200px;}

.blog_page #header{ background:#fff;}
.blog_page .header_inside{ width:980px; overflow:hidden;}
	.blog_page .contact_info .contact_email{ background:url(../images/txt_mail2.gif) 0 0 no-repeat;}
	.blog_page .contact_info .contact_email:hover{ background-position:0 -11px;}
	.head_txt_blog{ float:left;}
	
	.btn_view{ float:left; width:79px; height:10px; text-indent:-9999px; overflow:hidden; margin:26px 0 0 389px; background:url(../images/btn_view.gif) 0 0 no-repeat;}
	.btn_view:hover{ background-position:0 -10px;}

.blog_page #content{ width:100%; overflow:hidden; background:none; font-size:0px;}
.blog_page .content_inside{ width:100%;}
	.single_blog{ display:inline; position:relative;}

		.blog_image{ display:inline;}
		.blog_info{ font-size:12px; color:#fff; display:none;}
		.blog_info h2{ padding:14px 14px 8px 14px; line-height:170%;}
		.blog_info h2 a{ font-size:18px; color:#fff; text-transform:uppercase; text-decoration:underline;}
		.blog_info h2 a:hover{ color:#ccc;}
		.blog_info .post_date{ padding-left:14px;}
		.blog_info .blog_cate{ padding-left:14px;}
		.blog_info .blog_detail{ display:none;}
		.blog_bg{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:1; display:block; text-indent:-9999px; overflow:hidden;}
	
	#hover_layer{ position:absolute; background:#d31300; opacity:0.9; z-index:1; color:#fff; font-size:12px;}
	#hover_layer h2{ padding:14px 14px 8px 14px; line-height:170%;}
	#hover_layer h2 a{ font-size:18px; color:#fff; text-transform:uppercase; text-decoration:underline;}
	#hover_layer .post_date{ padding-left:14px;}
	#hover_layer .blog_cate{ padding-left:14px;}
	.blog_detail{ display:none;}
	
/*lightbox*/
#lightbox{ background:#b71403; border:2px #fff solid;}
#lightboxDetails{ font-size:12px; padding:20px 0;}	
#lightboxCaption{ padding:0 16px; color:#fff;}
#lightboxCaption h2{ font-size:18px; text-transform:uppercase;}
#keyboardMsg{ position:absolute; right:6px; top:12px;}
#keyboardMsg a{ float:left; width:20px; height:22px; text-indent:-9999px; overflow:hidden; background:url(../images/ico_close.png) 0 -22px no-repeat;}
#keyboardMsg a:hover{ background-position:0 0;}

#lightbox img{ display:block; border-bottom:2px #fff solid;} 
#overlay{ background:#000;}
#overlay img{border: none; }
			
		



#footer{
	width:100%;
	height:750px;
	color:#FFF;
	min-width:980px;
	background-color: #000;
	background-image: url(../images/footer_bg.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}
.footer_inside{ width:980px; margin:0 auto; overflow:hidden;}
	.foot_title{ float:left; display:inline; width:383px; height:92px; margin:396px 0 0 531px; background:#000;}
	.foot_contact{ float:left; display:inline; width:150px; height:150px; margin:61px 0 0 531px; background:#000;}
		.foot_logo{ margin-bottom:3px;}
		.foot_adress{ margin-bottom:8px; font-size:10px;}
		.foot_tel{ font-size:11px; margin-bottom:12px;}
		.foot_mail{ font-size:11px; color:#7d7d7d;}
		.foot_mail a{ color:#7d7d7d; text-decoration:none;}
		.foot_mail a:hover{ color:#fff;}


.deepcontent_intro{
	float:left;
	width:900px;
	font-family:Georgia, "Times New Roman", Times, serif;
	margin:58px 0 0 6px;
}
			/*.work_intro .work_title{ font-size:26px; line-height:100%; font-weight:bold;}*/
			.deepcontent_intro .work_title{ font-size:36px; letter-spacing:-1px; line-height:100%; margin-bottom:6px;}
			.deepcontent_intro .work_tag{ font-size:12px; font-weight:bold; color:#000; margin-bottom:6px; line-height:130%; text-indent:3px;}
			.deepcontent_intro .work_desc{ margin-bottom:8px; padding-left:3px;}
			.deepcontent_intro .work_desc p{
	color:#666;
	font-size:11px;
	line-height:130%;
}
			.deepcontent_intro .work_comment{ width:100%; overflow:hidden; font-size:16px; font-weight:bold; color:#fff;}
			.deepcontent_intro .work_comment span{ float:left; background:#000; padding:2px 2px 3px 2px; margin-bottom:2px;}
.footer_base_links {
	margin-top: 50px;
	background-color: #000;
	padding-top: 2px;
	padding-bottom: 2px;
	width: 100%;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	color: #7d7d7d;
	text-align: center;
	font-size: 9px;
}
.footer_base_links a{
	color:#7d7d7d;
	text-decoration:none;
	margin-right: 0px;
	margin-left: 0px;
}
.footer_base_links a:hover{ color:#fff;}
.badge {
	float: right;
}
#paging {
	margin-left: 30px;
	margin-top: -20px;
	color: #000;
}
#paging p  {
	margin-left: 10px;
}
#paging p a:link {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #000;
	font-weight: bold;
}
#paging p a:hover {
	text-decoration: none;
}
#paging p a:visited {
	color: #000;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
}
#paging ul {
	margin-top: 10px;
}
#paging ul li {
	float: left;
	margin-left: 10px;
}
#paging a:link {
	color: #000;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
}
#paging a:hover {
	text-decoration: underline;
}
#paging a:visited {
	color: #000;
	font-weight: bold;
	font-family: Arial, Helvetica, sans-serif;
}