/*
Theme Name: Vivid
Theme URI: http://www.viv-id.co.uk/
Description: Custom WP theme for Viv-id Manchester.
Version: 1.0
Author: Matt Heyes
Author URI: http://www.iamroot.co.uk/
*/


body {
	margin:0;
	padding:0;
	background:#1a1a1a;
	color:#f5f5f5;
	text-align:center;
	font-family:'Century Gothic',Futura,'URW Gothic L',sans-serif;
	font-size:12px;
}

p { margin:0 0 7px 0; padding:0 0 7px 0; }
a:active { outline: none; }
a { color:#ec008c; text-decoration:underline; outline: none; }
a:hover { text-decoration:none }

@font-face {  
	font-family: 'ChunkFiveRegular';
	src: url('font/Chunkfive.eot');
	src: local('ChunkFive Regular'), local('ChunkFive'), url('font/Chunkfive.ttf') format('truetype'); 
}

h2.title {margin:0;padding:0 0 20px 0;color:#acacac;font-size:24px;text-transform:uppercase; font-family:ChunkFiveRegular, serif; font-weight:normal; letter-spacing:1px; }

#wrapper {
	width:100%;
	margin:0 auto;
	text-align:left;
	position:relative;
	min-height:100px;
}

#menu_wrap { height:63px; position:fixed; top:38px; z-index:20; width:100%; background:url(images/bg-menu-x.png) repeat-x bottom left; }
#menu_wrap_static { height:63px; position:absolute; top:38px; left:0; z-index:20; width:100%; background:url(images/bg-menu-x.png) repeat-x bottom left; }

#menu_bar {
	width:1000px;
	/* below line was commented out coz pngFix does not work on css background images */
	/*background:url(images/bg-menu.png) top left no-repeat;*/
	height:63px;
	margin:0 auto;
	position: relative;	
	top:0;
	left:47px;
}

#menu {
	position: absolute;
	top: 0px;
	left: 0px;
	z-index:-1 ;
}

/* IE 6 specific styling */
* html #menu {
  position: absolute;
	top: 38px;
	left: 130px;
	height: 63px;
	/**/
}

* html #menu_bar ul {
	/*\*/position: relative;
	top: -25px;
	/**/
}

* html #menu_bar {
	/*\*/position: absolute;
	top: -38px;
	height: 63px;
	/**/
}

* html #menu_wrap {
	/*\*/position: absolute;
	top: 38px;
	left: 0px;
	z-index: 0;
	/**/
}



/* For scrolling the menu-bar in IE lt 7 */

* html #menu_wrap {
	/*\*/position: absolute;
	top: expression((48+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop: document.body.scrollTop))+'px');
	right: expression((0+(ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft: document.body.scrollLeft)) + 'px');
	/**/
}

/* /IE 6 specific styling */

/* IE 7 specific styling */
*+ html #menu_wrap {
		position: absolute;
		left: 0px;

}

*+ html #menu {
	position: absolute;
	top: 0px;
}

*+ html #menu_wrap {
		position: absolute;
		top: expression((38+(ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop: document.body.scrollTop))+'px');
		right: expression((0+(ignoreMe2 = document.documentElement.scrollLeft ? document.documentElement.scrollLeft: document.body.scrollLeft)) + 'px');

}

/* /IE 7 specific styling */

#menu_bar .home_link {
	display:block;
	float:left;
	height:63px;
	width:165px;
	position:relative;
	left:48px;
	text-indent:-9999px;
}

ul.main_menu { list-style:none; margin:0; padding:0; float:right; padding-right:30px; }
ul.main_menu li { list-style:none; margin:0; padding:0; float:left; font-size:12px; }
ul.main_menu li a { display:block; float:left; margin:23px 12px 5px 12px; padding:5px 5px; color:#f5f5f5; text-decoration:none; font-style:normal }
ul.main_menu li a:hover, ul.main_menu li a:focus { border-bottom:3px solid #f5f5f5; text-decoration:none; }

ul.main_menu li a.selected {
	border-bottom: 3px solid #f5f5f5;
	text-decoration: none;
}

#home {
	width:1000px;
	min-height:15px;
	background:url(images/bg-panel-home.gif) top left no-repeat;
	padding-top:510px;
	margin:0 auto;
	}
	
#news_updates {
	width:250px;
	border-right:2px solid #7e7e7e;
	float:left;
	padding-left:48px;
	padding-right:10px;
	min-height:430px;
}

a.read_more { display:block; height:21px; width:95px; padding:2px 0 0 5px; background:url(images/pink-arrow.gif) top right no-repeat; color:#f5f5f5; text-decoration:none; font-style:normal; }
a.read_more:hover { text-decoration:underline; }
.post_date { font-size:16px; }

#twitter {
	width:250px;	
	border-right:2px solid #7e7e7e;	
	border-right:2px solid #7e7e7e;
	float:left;
	height:360px;
	padding:0 10px;	
	min-height:430px;	
}

ul.tweets { list-style:none; margin:0; padding:0; }
ul.tweets li { list-style:none; margin:0; padding:0 0 20px 0; }

#latest_projects {
	width:397px;
	float:right;
	min-height:50px;
	padding:0 10px;
	position:relative;
}

a.work_icon { position:absolute; top:0; right:30px; float:right }
a.work_icon img { border:none; }

#latest_projects ul { list-style:none; margin:0; padding:0; }
#latest_projects ul li { list-style:none; margin:0; padding:0; display:inline; float:left }
#latest_projects ul a {   }
#latest_projects ul a img { border:none; display:block; float:left;border:2px solid #f5f5f5; margin:0 20px 20px 0; }

#story {
	height:90px;
	border-top:2px solid #8f8e8e;
	border-bottom:2px solid #8f8e8e;	
	background:url(images/grey-lines.gif) repeat #8f8e8e;
	clear:both;
	margin-top:25px;
}

#mantra {
	height:90px;
	border-top:2px solid #1a1a1a;
	border-bottom:2px solid #1a1a1a;	
	background:url(images/white-lines.gif) repeat #1a1a1a;
	clear:both;
}

#showcase {
	height:90px;
	border-top:2px solid #1a1a1a;
	border-bottom:2px solid #1a1a1a;	
	background:url(images/pink-lines.gif) repeat #1a1a1a;
	clear:both;
}

#separator_pink_half {
	height:45px;
	border-top:2px solid #1a1a1a;
	border-bottom:2px solid #1a1a1a;	
	background:url(images/pink-lines.gif) repeat #1a1a1a;
	clear:both;
}

#experience {
	height:90px;
	border-top:2px solid #d1d3d4;
	border-bottom:2px solid #d1d3d4;	
	background:url(images/smoke-lines.gif) repeat #d1d3d4;
	clear:both;
}

#wide_story { width:100%; background:#636466; }

#panel_story {
	width:1000px;
	background:url(images/bg-panel-story.gif) #636466 top left no-repeat;
	padding-top:315px;
	margin:0 auto;	
}

#panel_story_content {
	width:481px;
	height:511px;
	overflow:hidden;
	float:left;
	padding:100px 20px 0 80px;
	background:url(images/bg-panel-story-content.gif) no-repeat top left;
	font-size:16px;
}

#panel_story_content ul { list-style:none; margin:0; padding:0; }
#panel_story_content ul li { list-style:none; margin:0px 0; padding:5px 15px 9px 40px; font-weight:bold; text-transform:uppercase; display:block; background:url(images/pink-bullet.gif) no-repeat; background-position:0 3px; }

#panel_story_content p.base_one { text-align:center; padding:0 10px 30px 10px; margin:20px 28px 20px 20px; border-bottom:2px solid #f1f1f1; } 
#panel_story_content p.base_two { text-align:center; padding:0 60px 0 50px; } 

#featured_viral {
	width:399px;
	height:528px;
	overflow:hidden;
	float:right;
	padding:85px 0 0 20px;
}

#featured_viral img {
	display:block;
	margin:0 0 15px 0;
	padding:0;
}

#panel_mantra {
	width:1000px;
	min-height:5px;
	background:url(images/bg-panel-mantra.gif) #1a1a1a no-repeat;
	background-position:0 88px;
	padding-top:345px;
	margin:0 auto;

}

#mantra_content {
	width:428px;
	min-height:558px;
	background:url(images/bg-panel-mantra-content.gif) top left no-repeat;
	padding:0 0 10px 572px;
	position:relative;
	z-index:5;
}

#mantra_content .workcircle { position:absolute; top:110px; right:10px; float:right }
#mantra_content .workcircle img { border:none }

#mantra_content p { padding-right:50px; }

p.pink_me { padding-bottom:50px; margin-bottom:20px; background:url(images/pink-bar.gif) bottom left no-repeat; }

#wide_showcase { width:100%; background:#d1d3d4; }

#panel_showcase {
	width:1000px;
	background:url(images/bg-panel-showcase.gif) #d1d3d4 top left no-repeat;
	color:#636363;
	margin:0 auto;
}

#panel_showcase_top_content {
	padding:280px 60px	20px 60px;
	width:880px;	
	font-size:14px;
}
#panel_showcase_top_content p { padding-right:180px; }
#panel_showcase_top_content p span { font-weight:bold; }
#panel_showcase_top_content p strong { color:#ec008c; }

#panel_experience {
	width:900px;
	padding:325px 50px 50px 50px;
	background:url(images/bg-panel-experience.gif) #1a1a1a top left no-repeat;
	margin: 0 auto;
}

#experience_left { float:left; width:440px; font-size:14px; }
#experience_right { float:right; width:440px; }

p.pinkit { color:#ec008c }
p.large_text { font-size:16px; font-weight:bold; }

#experience_left ul { list-style:none; margin:0; padding:0; }
#experience_left ul li { list-style:none; margin:0px 0; padding:2px 15px 12px 40px; display:block; background:url(images/pink-black-bullet.gif) no-repeat; background-position:0 3px; }

#showcase_item_wrap { width:100%; text-align:center;background:url(images/bg-showcase-item.gif) no-repeat #d1d3d4; background-position:50% 103px; padding:103px 0 0 0; }
#showcase_item { 
	margin:0 auto;
	width:900px;
	text-align:left;
	color:#4a4949;
	padding:60px 50px 0 50px;
	min-height:480px;
}

#showcase_item h1, #showcase_item h2, #showcase_item h3, #showcase_item h4 { margin:0; padding:0; font-weight:normal; }
#showcase_item h1 { font-size:36px; font-family:ChunkFiveRegular, serif; }
#showcase_item h2 { font-size:52px; font-family:ChunkFiveRegular, serif; }
#showcase_item h3 { font-size:18px; text-transform:uppercase; margin:5px 0 40px 0 }
#showcase_item h4 { font-size:20px; font-family:ChunkFiveRegular, serif; text-transform:uppercase; margin:0 0 10px 0; color:#ec008c; }

#showcase_item table { width:800px; margin:0 auto; }
#showcase_item table tr,#showcase_item table td{ vertical-align:top }
#showcase_item table td { padding-right:20px; width:246px; }
#showcase_item table td:last-child { padding-right:0px; width:266px; }

#showcase_item #show_me { width:797px; height:325px; background:#acacac; border:3px solid #fff; margin:0 auto; margin-top:20px; margin-bottom:20px; overflow: hidden;}

#showcase_item #show_me ul {
	list-style: none outside none;
	margin: 0px;
	padding: 0px;
}

#showcase_item #show_me li {
	float: left;
	margin: 0px;
	padding: 0px;
}

#show_me ul {
	width: 2400px;
}

.next, .prev {
	cursor: pointer;
}

#blog_wrap {
	width:900px;
	margin:0 auto;
	text-align:left;
	padding:50px;
	clear:both;
	padding-top:153px;
	color:#e5e5e5;
}

#blog_sidebar {
	width:275px;
	padding-left:50px;
	float:right;
}

#blog_content {
	width:575px;
	float:left;
}

#blog_content h1 {
	margin:0;
	padding:15px 0 20px 0;
	font-family:ChunkFiveRegular, serif; font-weight:normal; letter-spacing:1px;	
	font-size:38px;
}

#blog_sidebar h4 {
	font-family:ChunkFiveRegular, serif; font-weight:normal; 	
	font-size:24px;	
	text-transform:uppercase;
	color:#a7a9ac;
	margin:0;
	padding:10px 0;
}

#blog_sidebar h4 span { font-size:28px; color:#ec008c; }

#blog_sidebar h5 {
	font-family:ChunkFiveRegular, serif; font-weight:normal;  	
	font-size:12px;	
	text-transform:uppercase;
	color:#a7a9ac;
	margin:0;
	padding:5px 0;
}

#blog_sidebar h3 {
	font-size:18px;
	margin:0;
	padding:0 0 10px 0;
	font-weight:normal
}

#blog_sidebar p {margin:0; padding:5px 0; }

#blog_date {
	height:43px;
	width:142px;
	background:url(images/bg-date.gif) #acacac top left no-repeat;
}

#blog_date span.day {
	display:block;
	float:left;
	height:43px;
	width:77px;
	color:#fff;
	font-size:32px;
	font-weight:bold;
	padding-left:15px;
}

#blog_date span.month_year {
	display:block;
	float:left;
	height:41px;
	width:38px;
	color:#fff;
	font-size:14px;
	padding:2px 0 0 12px;
}

#post_entry { padding-bottom:15px; margin-bottom:20px; border-bottom:2px solid #7f7f7f; }

.entry-meta {
	font-size:11px;
	color:#999;
	padding:5px 0;
	margin-bottom:10px;
	border-bottom:1px dashed #999;
	border-top:1px dashed #999;	
}

ul.showcase_thumbs { list-style:none; margin:20px 0 0 0; padding:0; width:880px; }
ul.showcase_thumbs li { list-style:none margin:0; padding:5px; display:inline-block; float:left;  }
ul.showcase_thumbs li a img { border:none; }
ul.showcase_thumbs li a img.thumb { width:270px; } 
a.read_more_grey { display:block; font-size:11px; height:20px; width:95px; padding:3px 0 0 5px; background:url(images/pink-arrow-grey.gif) top right no-repeat; color:#f5f5f5; text-decoration:none; font-style:normal; }
a.read_more_grey:hover { text-decoration:underline; }

ul.categories, ul.archive { margin-top:0; margin-bottom:5px; }

form#searchform { margin-bottom:5px; }
form#searchform input { border:1px solid #fff; background:#fff; font-family:"Courier New", Courier, monospace; padding:2px 5px; height:18px; margin:0; display:inline-block; vertical-align:top; }
form#searchform input:focus { border:1px solid #ec008c; background:#f5f5f5; }
form#searchform input#searchsubmit { border:1px solid #ccc; background:#1a1a1a; color:#f5f5f5; font-family:'Century Gothic',Futura,'URW Gothic L',sans-serif; padding:2px 5px 6px 5px; height:24px; text-align:center;  }
form#searchform input#searchsubmit:focus, form#searchform input#searchsubmit:hover { border:1px solid #ec008c; background:#1a1a1a; }