@charset "utf-8";
/* CSS Document */

eatml, body											
{
	font-family:Arial, Helvetica, sans-serif;
	height:100%;
	
	color:#fff;
	font-size:10px; 
}
body	
{
	background:#2f599f;	
}
body.ai1ec-calendar,
body.single-ai1ec_event
{
	background:none;	
}

html,body,div,ul,ol,li,h1,h2,h3,h4,h5,p,fieldset,form,img,label,input,textarea,select,legend,table,th,td,tr						
{
	margin:0;
	padding:0;
	border:none;
	font-weight:100; 
}


/***
*	BASIC LAYOUT
***/
div#wrapper
{
	min-height:100%; 
	height:auto;		/*Not using height:auto!important;height:100%; for ie6 (see separate sheet) - this allows ie7/ie8 to resize when chrome pulled down vertically*/
	
	  
}

div#wrapper,div#footer
{
	background:#212121;
	width:980px;
	position:relative;
	clear:both;
}



div.lost page-x
{
	background:none!important;
	
}

div#footer
{
	height:60px;
	margin: -60px 0 0 0;
	z-index:10;	/* mask vertical links*/
	overflow:hidden;position:relative;
}

div.container 			
{
	position:static;
	overflow:hidden;
	padding-bottom:60px;
	width:100%;
	clear:both;  
}

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
content:"";
height:100%;
float:left;
width:0;
margin-top:-32767px;/* thank you Erik J - negate effect of float */
}


div.page,.faux-spine,div.navigation ul li div 
{
	position:static;		/*z-index trick: Static positioning to allow abs pos nav to lie over the top, whilst rel pos div.page.content allows content through*/
	padding-top:133px;		/*114px clears header, +19px clear shadow [+ 7px for right col top banner] */
	overflow:hidden;
	width:20px;
	float:left;
}
.faux-spine
{
	height:1%; 				/*Ie6 fix - stretch content spine colours downwards when viewport smaller than container*/
	 
}
div.page-x .faux-spine
{
	display:none;
}


div.navigation li.on,
div.on
{
	width:860px; 		/*	1 div/li including 20px nav plus 6 links @ 20px = 980px	*/
}

div.page-x
{
	width:840px;		/*	7 * 20px sliding links plus 840px = 980px	*/	
	background:#526670; 
}

.content
{
	position:relative;
	
	width:840px;
	padding:0 0 0 0px;	/*	840px + page on state padding left 20px = 860px	*/
	display:none;
	float:left; 
	overflow:hidden;   
	
}
div.page-x .content
{
	/*width:820px;*/
}

div.page-x .content,	/*	div.page-x .content does not need 20px padding because it's faux-spine provides that 	*/
.content .content
{
	padding-left:0;
}
div.on .content
{
	display:inline; 
}


.content .left-col
{
	position:relative; 
	width:697px;
	padding:0 0 0 0;
	overflow:hidden;
	min-height:1px;
	float:left; 
	display:inline;
}

.content .left-col div.copy-text
{
	width:657px;
	padding:20px;
	padding-bottom:15px;
	overflow:hidden;  
}



.video-border
{
	height:1px;
	width:100%;
	overflow:hidden;
	clear:both;
	background: transparent url(/z-assets/z-images/video-bg.png);
}

.content .left-col div.copy-text div.column
{
	width:500px;
	float:left;
	overflow:hidden;
	padding-top:10px;
}

.content .left-col div.copy-text div.first-col
{
	width:284px;
	padding:20px;
	float:left;
	overflow:hidden;
	background: transparent url(/z-assets/z-images/video-bg.png);
	margin-top:10px;
}

.content .left-col div.copy-text div.second-col
{
	width:304px;
	float:right;
	overflow:hidden;
	padding:10px;
	/*padding-top:0;*/
}

.content .left-col div.copy-text div.double-col
{
	width:100%;
	float:left;
	overflow:hidden;
	padding-top:10px;
	clear:left;
}

ul.sub-nav
{
	width:658px;
	padding:0 20px 0 18px;
}
.content .banner-ads
{
	position:relative;
	width:125px;			/*	811px with 9px spare inside content	*/
	padding:0 9px 0 0;
	float:right;
	overflow:hidden; 
	display:inline; 
	top:0;
	height:800px;
}

.content .banner-ads br
{
	display:none;		/* remove ad-rotate breaks	*/
}
.content .banner-ads .banner br
{
	display:block;		/* restore breaks inside advert block	*/
}

.content .banner-ads .banner
{
	position:relative;
	width:125px;
	height:125px;
	padding:0 0 0 0;
	margin:0 0 7px 0;
	overflow:hidden; 
}


/***
*	VERTICAL NAVS LAYOUT
***/

div.navigation ul 					
{
	width:10000px;					/* page containers require extra room for sliding floated els*/
}

div.navigation 					
{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%; 
	overflow:hidden; 
	background:#526670;				/*Provides the background for page-x*/
}

div.lost div.navigation 
{
	background:#526670 url(/z-assets/z-images/lost-body.jpg) no-repeat 159px 114px;
	/*background:red!important;*/
	
}


div.navigation ul,div.navigation ul li.page,div.navigation ul li div, div.navigation ul li div a					
{
	position:relative;
	padding:0;
	margin:0;
	float:left;	/*Fix for ie8 height:100% problem on floated elements - float the container*/
	list-style:none;
 	height:100%;
	display:inline; 
}
div.navigation ul li div a
{
	width:100%;	
}
div.page
{
	background-repeat:repeat;		 
	background-position:0 0;
}
div.navigation ul li div  
{
	background-repeat:repeat-y;
	background-position:0 0;
}
div.navigation ul li a					
{
	background-repeat:no-repeat;
	background-position:0 135px;
	text-indent:-5000px;
	outline:none;
}

.page-1
{
	background-image:url(/z-assets/z-images/nav/spine07.jpg); 	
	
}

li.page-1 div a 
{
	background-image:url(/z-assets/z-images/nav/title07.jpg);	
}

.page-2
{
	background-image:url(/z-assets/z-images/nav/spine06.jpg); 
}

li.page-2 div a
{
	background-image:url(/z-assets/z-images/nav/title06.jpg);	
}

.page-3
{
	background-image:url(/z-assets/z-images/nav/spine05.jpg);	 
}

li.page-3 div a
{
	background-image:url(/z-assets/z-images/nav/title05.jpg);	
}

.page-4
{
	background-image:url(/z-assets/z-images/nav/spine04.jpg); 
}

li.page-4 div a
{
	background-image:url(/z-assets/z-images/nav/title04.jpg);	 
}



.page-5
{
	background-image:url(/z-assets/z-images/nav/spine03.jpg);
}

li.page-5 div a
{
	background-image:url(/z-assets/z-images/nav/title03.jpg);	
}

.page-6
{
	background-image:url(/z-assets/z-images/nav/spine02.jpg);
}

li.page-6 div a
{
	background-image:url(/z-assets/z-images/nav/title02.jpg);	
}

.page-7
{
	background-image:url(/z-assets/z-images/nav/spine01.jpg);	 
}

li.page-7 div a
{
	background-image:url(/z-assets/z-images/nav/title01.jpg);	
}



/***
*	TOP LAYOUT
***/

div#header	/* Special instance of div.container */											
{	
	position:absolute;
	height:114px;
	background:url(/z-assets/z-images/whiteheaderbackground.jpg) repeat-x 0 0; /*#d1dd25 */
	z-index:10;	/* mask vertical links*/
	width:100%;
	overflow:visible; 
}

.lost div#header
{
	background:url(/z-assets/z-images/lost-header.jpg) repeat-x 0 0; 
}

div#header-logo
{
	position:absolute;
	top:0;
	left:0;
	width:268px;
	/*316px for birthday width is 268px usually*/
	height:114px;
	background:url(/z-assets/z-images/logos/logo.jpg) repeat-x 0 0;
	z-index:10;	
	
}

div#header-awards
{
	position:absolute;
	top:42px;
	right:130px;
	width:210px;
	height:197px;
	overflow:hidden;
	z-index:11;
	background: url(/z-assets/z-images/logos/hertsbusawards.png) no-repeat -526px 0;
}


div#header-banner-ad
{
	position:absolute;
	top:38px;
	left:493px;
	width:468px;
	height:60px;
	/*background:url(/z-assets/z-images/example-top-banner.gif) no-repeat 0 0;*/
	z-index:12;	
	overflow:hidden;
}

div#header-social-buts
{
	position:absolute;
	top:38px;
	left:343px;
	width:150px;
	height:60px;
	/*background:url(/z-assets/z-images/example-top-banner.gif) no-repeat 0 0;*/
	z-index:11;	
	
}

div#header-banner-ad p
{
	position:relative;
	margin:0;
	padding:0;
	width:100%;
	height:100%;
	overflow:hidden;
}
div#header-banner-ad br
{
	display:none;
}

div#header-logo div.header-loader
{
	position:absolute;
	top:0;
	left:139px;
	/*151px birthday loader left is 139px usually*/
	width:90px;
	height:114px;
	display:none;
	overflow:hidden;
}

div#header-logo a
{
	display:block;
	width:100%;
	height:100%;
	text-indent:-2000px;
	
}

div#header ul.top-navigation
{
	
	float:right;	display:inline; 
	
	list-style:none;
 	height:23px;
	color:#fff;	
	padding:0 0 0 83px;
	margin:0 0 0 0;
	background:#000 url(/z-assets/z-images/nav/top-nav/topmenu-curve.jpg) no-repeat 0 0;
	overflow:hidden;
	font-size:1.2em;
}

div#header ul.top-navigation li
{
	text-decoration:none;
	color:#fff;	
	
	line-height:2.0;
	text-transform:uppercase;
	height:100%;
	float:left;
	background:url(/z-assets/z-images/nav/top-nav/topmenu-off.jpg) repeat-x 0 0;
	line-height:23px;
}

div#header ul.top-navigation li.on,
div#header ul.top-navigation li:hover
{
	background:url(/z-assets/z-images/nav/top-nav/topmenu-on.jpg) repeat-x 0 0;
}

div#header ul.top-navigation a
{
	text-decoration:none;
	color:#fff;	
	display:block;
	float:left;	/*IE fix*/
	height:100%;
	padding:0 20px 0 20px;
	background:url(/z-assets/z-images/nav/top-nav/topmenu-divider.jpg) no-repeat 0 0;
}




div#header-shadow
{
	position:absolute;
	top:114px;
	left:0;
	width:100%;
	height:21px;
	background:url(/z-assets/z-images/whiteheadershadow.png) repeat-x 0 0;
	z-index:10;	/* mask vertical links*/
}

/***
*	SUB NAVS LAYOUT
***/

ul.sub-nav
{
	/* see width / padding declaration above */
	height:27px;
	background:url(/z-assets/z-images/nav/subnav/subbut-background.png) repeat-x 0 0;
	overflow:hidden;
	margin:0 0 0 0;
	font-size:1.2em;
}

ul.sub-nav li,ul.sub-nav li a
{
	width:80px;
	height:27px;
	overflow:hidden;
	float:left;
	display:inline;
	margin:0 0 0 2px;
	padding:0;
	font-size:1em;
	/*font-weight:bold; */
}

ul.sub-nav li a
{
	background:url(/z-assets/z-images/nav/subnav/subbut-off.png) repeat-x 0 0;
	text-align:center;
	line-height:27px;
	text-decoration:none;
	margin:0;
	
}

ul.sub-nav li.on,
ul.sub-nav li.current_page_item a,
ul.sub-nav li a:hover
{
	background:url(/z-assets/z-images/nav/subnav/subbut-on.png) repeat-x 0 0;
	
}


#footer ul
{
	
	height:60px;	
	float:right;
	overflow:hidden;
	margin:0 0 0 0;
	font-size:1.2em;
	list-style-type:none;
	/*padding-right:10px;*/
	margin-right:-1px;
}

#footer ul li
{
	float:right;
	height:60px;
	line-height:60px;
	float:right;
	padding-left:14px;
	padding-right:15px;
	display:inline;
	background:url(/z-assets/z-images/nav/divider.gif) no-repeat right center;
}

#footer ul li a
{
	color:#999;
	text-decoration:underline;
	
}

.page-7 ul.sub-nav li.on a,
.page-7 ul.sub-nav li a:hover
{
	color:#fff;
	
}




/***
*	Typography
***/

div.page .left-col,div.page .left-col a 
{
	color:#fff; 
}


.page-7 .left-col,.page-7 .left-col a 
{
	color:#000!important; 
}

.copy-text hr
{
	display:none;
}
.details a{font-weight:bold;text-decoration:underline;}
pre											{background:none;color:#000;}
.copy-text ul,
.copy-text ol,
.copy-text li,
.copy-text h1,
.copy-text h2,
.copy-text h3,
.copy-text h4,
.copy-text h5,
.copy-text p,.details p						{padding:0 0 12px 0;font-size:1.2em;line-height:1.6;}
.details p,.details p a						{color:#fff;}
.page-7 .details p, .page-7 .details p a	{color:#000;}
.copy-text h1,
.copy-text h2,
.copy-text h3,
.copy-text h4,
.copy-text h5								{padding-bottom:10px;line-height:1.2;}
.copy-text h1								{font-size:1.8em;}
.projectHeader h1							{font-size:1.8em;color:#fff;}
.page-7  h1									{color:#000;}
.copy-text h2								{font-size:1.6em;}
.copy-text h3								{font-size:1.4em;padding-bottom:5px;}
.copy-text h4								{font-size:1.4em;font-weight:bold;padding-bottom:5px;}
.copy-text h5								{font-size:1.3em;padding-bottom:5px;}



.copy-text ul 								{padding-left:15px;list-style-type:disc;}
.copy-text ol								{padding-left:32px;}

.copy-text ol ol, 
.copy-text ul ul, 
.copy-text ul ol, 
.copy-text ol ul,
.copy-text ol li,
.copy-text ul li							{font-size:1em;padding-bottom:0;}
.copy-text ol li,
.copy-text ul li							{padding:0;}
.copy-text a 								{text-decoration:underline;}


.copy-text img
{
	display:block;
}

strong
{
	font-weight:bold;	
}

.nobreak
{
	white-space:nowrap;	
}

.projectNav .closeBtn{
	background: transparent url(/z-assets/z-images/closed.png) no-repeat;
	background-position: 0 -20px;
}


.page-7 .projectNav .closeBtn{
	background: transparent url(/z-assets/z-images/closed.png) no-repeat;
	background-position: 0 0px;
}

.projectNav .closeBtn:hover{	
	background-position: 0 0;
}
.left-col .project-content
{
	padding-top:0!important;	
}
.clearfix
{
	top:0!important;		
}

.masonry
{
	width:100%;
}

 .addthis_toolbox 
{
	padding-bottom:10px;
}

.addthis_toolbox 
{
	display:none;
}

div.details .addthis_toolbox 
{
	display:block;
}


div.map-layer
{
	position:relative;
	overflow:hidden;
}

div.map-layer .map
{
	position:relative;
	width:420px;
	height:351px;
	float:left;
}

div.map-centred .map 
{
	margin:0 auto;
	float:none!important;
}


div.map-layer .map
{
	position:relative;
	width:420px;
	height:351px;
	float:left;
}
div.map-layer .map .dot-hilite
{
text-indent:-200px;	

}
div.map-layer .map .dot-hilite,
div.map-layer .map .dot-hilite a
{
	position:absolute;
	top:0;
	left:0;
	width:19px;
	height:19px;
	overflow:hidden;
	text-align:left;
	z-index:20; 
	/*text-indent:-200px;*/
}

div.map-layer .map .dot-hilite a
{
	position:static;
	/*background:none;*/
	float:left;
	display:inline;
	
	/*opacity:0;
	filter: alpha(opacity = 0);*/
}


div.map-layer .map .on /*.dot-hilite state */
{
	background:url(/z-assets/z-images/maponstate.png) no-repeat 0 0;
}


div.map-layer ul.area-links
{
	position:relative;
	width:177px;
	padding-left:55px;
	overflow:hidden;
	float:left;
}

div.map-layer ul.area-links li a
{
	color:#ffc9c5;
}

div.map-layer ul.area-links li a:hover,
div.map-layer ul.area-links li a.hilite
{
	color:#fff;
	font-weight:bold;
}

div.map-centred ul.area-links
{
	display:none;	
}

div.map-centred .map  ul.area-links
{
	display:block;	
}


div.thumb-nav-container div.thumb-navs
{
	position:relative;
	width:155px;
	float:left;
	margin: 0 14px 14px 0;
	padding:0;
	overflow:hidden;
	display:block;
	
	
}
div.thumb-nav-container
{
	padding-right:0!important; 
	padding-bottom:0!important; 
	width:676px!important; 
	
}
div.thumb-navs-first
{
	margin-left:0;
}

div.thumb-navs p
{
	width:155px;
	height:120px;
	background:#ccc;
	margin: 0;
	padding:0 0 0 0;
}

div.thumb-navs p.img
{
	
	background: url(/z-assets/z-images/nav-placeholder.jpg);

}

div.thumb-navs h3
{
	width:155px;
	height:30px;
	line-height:30px;
	margin: 0;
	padding:0 0 0 0;
	text-align:center;
	/*background:url(/z-assets/z-images/nav/subnav/subbut-background.png) repeat-x 0 0;*/
	background: transparent url(/z-assets/z-images/video-bg.png);
}

div.thumb-navs p.read-more
{
	height:20px;
	line-height:20px;
	text-align:center;
	font-size:10px;
	text-transform:uppercase;
	background:#fff; 
	opacity:0.4;
	filter:alpha(opacity=40); /* For IE8 and earlier */	
	/*
	text-align:left;
	text-indent:-2000px;
	*/
	
}

div.thumb-navs a
{
	display:block;
	width:100%;
	height:100%;
	color:#000!important;
	text-decoration:none;
}


div#ai1ec-container
{
	overflow:hidden;
	padding-bottom:100px;
	background: transparent url(/z-assets/z-images/video-bg.png);
}

div#ai1ec-container
{
	overflow:hidden;
	padding-bottom:100px;
	background: transparent url(/z-assets/z-images/video-bg.png);
}

table.ai1ec-calendar-toolbar td
{
	width:100%;
}



.ai1ec-filters-container  .ai1ec-label
{
	display:none;
}

div.left-col form
{
	width:100%;
	
}

div.left-col form p
{
	width:100%;
	overflow:hidden;
}

input[type="text"], textarea 
{
	width:90%;
	padding:10px;
}
/*
	25/10/11

*/

.project .visuals {
	float: left;
	width: 100%;
	padding: 0;
	margin-bottom: 10px;			
}


.videoContainer
{
	
	
}

.project .details {
	float: none!important;
	width: auto!important;	
	padding: 0px 0 0 0;	
	margin-bottom: 7px;
}

.thumbs .small span.play-icon a
{
	display:block;
	height:100%;
	width:100%;
}
.thumbs .small span a
{
	color:#fff!important;
}

span.play-icon
{
	position:absolute;z-index:2;
	top:7px;
	left:7px;
	/*width:86px;*/
	width:17px;
	height:18px;
	display:block;
	background: transparent url(/z-assets/z-images/clicktoplay.png) no-repeat 0 0;
}
.project.small:hover span.play-icon
{
	background: transparent url(/z-assets/z-images/clicktoplayon.png) no-repeat 0 0;
}
