@charset "utf-8";
/* CSS Document */
html, body {
	margin:0px;
	padding:0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#0f1e25;
}

html {height:100%;}
body {height:100%; margin:0; padding:0;}
#wrap.home {background:#fff url(../images/bg_home.gif) repeat-x 0px 0px;}
#bg {position:fixed; top:0; left:0; width:100%; height:100%; z-index:-10;}
#wrap {z-index:1; background:transparent url(../images/bg_page.gif) repeat-x 0px 0px;}
	
/* #wrap {margin:0px auto; padding:0px 20px;  width:1000px; background-color:#fff; filter:alpha(opacity=70);-moz-opacity:.70;opacity:.70;}}
#wrap {margin:0px auto; padding:20px;  width:1000px; filter:alpha(opacity=80);-moz-opacity:.80;opacity:.80;} */


img{border:0}
.clear {clear:both; padding:0px; float:none; margin:0px; height:0px; line-height:0px; overflow: hidden;}
a:link, a:visited, a:active {color:#ec008c; text-decoration:none;}
a:hover {color:#fff; background-color:#ec008c;}

/* S: Font Styling */
h1, #homeservices li, ul.column h2, ul.homecolumn h2, #navigation li a, #navigation #topnav .navon,
#content h1, #content h3, #content .subContent a.title
{margin:0px; padding:0px; line-height:0em; text-transform:lowercase; letter-spacing:-0.07em;}


	#homeservices li {padding-bottom:4px;}
	h1 {font-size:6.5em;}
	#content h1 {font-size:5em;}
	#homeservices li {font-size:2.5em; line-height:1.2em}
	ul.column h2, ul.homecolumn h2 {font-size:2.4em;}
	#content h3, #subheader, #content .subContent a.title {font-size:2.4em;}
	/*#content h2 {font-size:2.4em; line-height:1.2em;}*/
	#content h2 {font-size:2.3em; line-height:1em; margin:10px 0px 30px 0px; color:#ec008c; font-family:Georgia, "Times New Roman", Times, serif; font-weight:lighter; font-style:italic;}
	

#hometitle span, ul.column h2 span, ul.homecolumn h2 span, #content h1 span, #content h3 span, #content .subContent a.title span,
strong.zutmedia-com span
{color:#ec008c;}
#homeservices li a span
{color:#fff;}

/* E: Font Styling */


/* S: Link Colours */
	#homeservices li a, #homeservices li a:link, #homeservices li a:active, #homeservices li a:visited
	{color:#fff; background-color:#ec008c; padding-right:2px; padding-bottom:3px;}
	
	#homeservices li a:hover
	{color:#fff; background-color:#0f1e25; padding-right:2px; padding-bottom:3px;}
	
	ul.column li a, ul.column li a:link, ul.column li a:active, ul.column li a:visited,
	ul.homecolumn li a, ul.homecolumn li a:link, ul.homecolumn li a:active, ul.homecolumn li a:visited,
	#footernav li a, #footernav li a:link, #footernav li a:active, #footernav li a:visited,
	ul.sitemap a, ul.sitemap a:link, ul.sitemap a:active, ul.sitemap a:visited
	{color:#0f1e25; padding-right:2px; padding-bottom:2px;}
	
	
	ul.column li a:hover,
	ul.homecolumn li a:hover,
	#footernav li a:hover,
	ul.sitemap a:hover,
	.linkbox a, .linkbox a:link, .linkbox a:visited, .linkbox a:active
	{color:#fff; background-color:#ec008c; padding-right:2px; padding-bottom:2px;}
	
	.linkbox a:hover {background-color:#0f1e25;}
	.linkbox a, .linkbox a:link, .linkbox a:visited, .linkbox a:active{padding:2px 4px; font-size:12px; letter-spacing:1px; margin:0px; font-weight:bold; text-transform:uppercase;}

	#navigation li a, #navigation li a:link, #navigation li a:active, #navigation li a:visited
	{color:#0f1e25;}
	.onpage {color:#fff; background-color:#ec008c;}

	#content h2 span a, #content h2 span a:link, #content h2 span a:active, #content h2 span a:visited
	{color:#fff;} 
	#content h2 span a:hover
	{color:#0f1e25;} 

/* E: Link Colours */	


div#container {	
	margin:0px auto;
	padding:0px 10px 20px 10px;
	width:980px;	
}

	#hometitle {float:left; width:980px; padding-top:20px; font-size:11px; font-weight:bold; letter-spacing:1px;}
	#toptitle {float:left; margin:0px; padding:0px;}
	#topcontact {float:right; margin:0px; padding:0px;}
	#homeshowcase {
		float:left;
		background:#fff; 
		overflow:hidden;
		width:980px; 
		height:280px; 
		margin:10px 0px 10px 0px;
		}
	
	#homeservices ul {margin:0px; padding:0px; list-style:none;}
	#others {float:left; width:980px; margin:30px 0px 0px 0px; padding:10px 0; border-top:13px solid #0f1e25;}


/* S: Inner Page */
#header {width:980px; height:65px; margin:0px; margin-bottom:20px; padding:0px;}
	#header div#logo_zutmedia {float:left; background:transparent url(../images/logo_zutmedia.gif) no-repeat 0px 10px;}
	#header div#logo_zutmedia, #header div#logo_zutmedia a {width:194px; height:65px; margin:0px;}
	#header div#logo_zutmedia a:hover { background:transparent url(../images/logo_zutmedia.gif) no-repeat 0px 10px;}
	#header div#logo_zutmedia a
	{
	display:block; 
	text-indent:-9999px;	
	text-decoration:none;
	overflow:hidden;
	}
	#navigation {
		float:right; 
		margin:0px;
		padding:0px;
		height:65px;
		width:764px; 
		white-space:nowrap;
	}
	#navigation ul {float:right; list-style:none; margin:0px;padding:0px;}
	#navigation li {float:left; width:auto; height:65px; margin:0px; padding:0px;text-align:center; margin-left:1px;}
	#navigation li a {
		font-size:1.7em;
		display:block;
		padding:30px 10px 3px 10px;
		height:27px;
		text-decoration:none;
		}
	#navigation li a:hover, #navigation li a:focus, #navigation li a:active {background-position:-150px 0;}
	#navigation li a:hover, #navigation #topnav .navon {color:#fff;}
	#navigation #topnav a {background:url(../images/navigation.gif) repeat 0px 0px; color:#fff}
	#navigation #topnav .navon {
		font-size:1.7em;
		display:block;
		padding:30px 10px 3px 10px;
		height:27px;
		text-decoration:none;
		background:url(../images/navigation.gif) repeat 0px 62px; 
		margin-left:1px;
		}
		
		#content {width:980px; margin:0px; margin-bottom:20px; padding:0px; font-size:14px;}
		#content .colleft {float:left; width:310px; margin:30px 40px 0px 0px; padding:0px;}
		#content .colright {float:left; width:630px; margin:30px 0px 0px 0px; padding:0px;}
		#content .col_00 {float:left; width:615px; margin:0px; padding:0px;}
		#content .col_00a {float:left; width:315px; margin:0px 0px 0px 50px; padding:0px;}
		#content .col_clients00 {float:left; width:590px; margin:0px; padding:0px;}
		#content .col_clients01 {float:left; width:300px; margin:0px 0px 0px 50px; padding:0px;}
		#content .colcontactleft {float:left; width:265px; margin:30px 40px 0px 0px; padding:0px;}
		#content .colcontactright {float:left; width:310px; margin:30px 0px 0px 0px; padding:0px;} 
		#content .col_ourwork00 {float:left; width:550px; margin:0px; padding:0px;}
		#content .col_ourwork01 {float:left; width:380px; margin:0px 0px 0px 50px; padding:0px;}
		#content .col_casestudies00 {float:left; width:306px; margin:0px; padding:0px;}
		#content .col_casestudies01 {float:left; width:307px; margin:0px 0px 0px 30px; padding:0px;}

		
		#content p {margin:5px 0px 20px 0px;}
		#content .notebox {padding:15px; margin:0px; border:1px dotted #ec008c;}
		.alan42 { height:136px; background:#fff url(../images/bg_alan42.jpg) no-repeat 15px 15px;}
		.alan42 p {padding-left:140px; display:block;}

/*
		#content .casestudies p.textbox {display:block; height:120px;}
		#content p.textbox strong {display:block; margin:0px; margin-bottom:10px; border-bottom:1px dotted #ec008c;}
		#content p.textbox strong span{font-size:14px; background-color:#ec008c; color:#fff; padding:1px 3px;}
		#content p.textbox {font-size:12px;}
		#content p.textbox a, #content p.textbox a:link, #content p.textbox a:visited, #content p.textbox a:active 
		{color:#0f1e25; display:block;}
		#content p.textbox a:hover 
		{color:#4e4e4e; background-color:#fff; display:block;}
		#content p.textbox a:hover strong span {background-color:#0f1e25;}
		#content p.textbox a:hover strong {border-bottom:1px dotted #0f1e25;}
*/

		ul.textbox {margin:0px; padding:0px; list-style:none; font-size:12px;}
		ul.textbox li {width:100%; display:block; float:left; margin-bottom:15px;}
		ul.textbox strong {display:block; margin:0px; margin-bottom:10px; border-bottom:1px dotted #ec008c;}
		ul.textbox strong span{font-size:14px; background-color:#ec008c; color:#fff; padding:1px 3px;}
		ul.textbox li a, ul.textbox li a:link, ul.textbox li a:visited, ul.textbox li a:active 
			{color:#0f1e25; display:block;}
		ul.textbox li a:hover 
			{color:#4e4e4e; background-color:#fff; display:block;}
		ul.textbox li a:hover strong span {background-color:#0f1e25;}
		ul.textbox li a:hover strong {border-bottom:1px dotted #0f1e25;}
		
		.work_brazen { background:#fff url(../images/bg_clients.jpg) no-repeat 0px 0px; z-index:-99; width:100%}
 	

	ul.clientslogo {display:block; overflow:hidden; margin:100px 0px 0px 50px; padding:0px; list-style:none; font-size: 13px;}
	ul.clientslogo li {display:block; float:right; width:102px; height:102px; margin:0px 0px 10px 10px; padding:0px;}


	ul.sitemap {margin:7px 0px; padding:0px; list-style:none; text-transform:lowercase; font-size:14px;}
	ul.sitemap li {height:auto; margin:0px; padding:0px 10px 5px 10px;  background:transparent url(../images/divider.gif) no-repeat 0px 5px; font-weight:bold;}
	ul.sitemap ul {margin:7px 0px; padding:0px; list-style:none;}
	ul.sitemap li ul li{float:left; height:auto; margin:0px; padding:0px 10px 5px 10px;  background:transparent url(../images/divider.gif) no-repeat 0px 5px; font-weight:normal;}


/* E: Inner Page */

/* S: Form Element */
form {padding:5px 0px; margin:0px;}
label {margin-top:2px; float:left; width:80px; font-weight:bold; text-transform:lowercase;}
input,textarea,select,option {color:#0f1e25; padding:0 2px; border:0px; border-bottom:#ec008c 1px dotted; background-color:#fff;}
.submitbutton {margin-left:80px; font-size:12px; font-weight:bold; border:none; margin-top:5px; background-color:#ec008c; color:#fff;}
textarea {
	border:#ec008c 1px dotted;
	overflow:auto; 
	font-size:14px;  
	font-family:Arial, Verdana, Helvetica, sans-serif;
	scrollbar-face-color: #fff;
	scrollbar-arrow-color: #ec008c;
	scrollbar-base-color: #ec008c;
	scrollbar-shadow-color: #fff;
	scrollbar-darkshadow-color: #fff;
	scrollbar-highlight-color: #fff;
	scrollbar-3dlight-color: #fff;
	scrollbar-track-color: #fff;
}

/* E: Form Element */

/* S: Columns Hack */

ul.column{width:100%; padding:0px; margin: 10px 0px 0px 0px; list-style: none;}
ul.column li {
	float: left;
	width: 230px;
	padding: 0px;
	margin: 0px;
	display: inline;
}
.block {
	height: 180px;
	font-size: 13px;
	letter-spacing: 0.03em;
	margin-right: 20px;
	padding:0px 5px 0px 0px;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
}
.block h2 {font-size: 1.8em;}
.block img {
	width: 89%;
	padding: 5%;
	margin: 0 auto;
	background:#fff;
	-ms-interpolation-mode: bicubic;
	display: block;
	-moz-border-radius: 3px;
	-khtml-border-radius: 3px;
	-webkit-border-radius: 3px;
}

	ul.column li ul { width:207px; margin:7px 0px; padding:0px;}
	ul.column li ul li {float:left; width:187px; height:auto; margin:0px; padding:0px 10px 5px 10px; background:transparent url(../images/divider.gif) no-repeat 0px 5px;}


ul.column li p {margin:10px 0px;}
ul.column li p span {margin:0px 7px 0px 0px; padding:0px;}

/* E: Columns Hack */

/* S: Home Columns */
	ul.homecolumn li p {margin:10px 0px;}
	ul.homecolumn li p span {margin:0px 7px 0px 0px; padding:0px;}
	ul.homecolumn {display:block; overflow:hidden; margin:0px; padding: 0px; list-style:none; font-size:13px;}
	ul.homecolumn li {display:block; float:left; width:220px; height:180px; margin:0px; margin-right:16px; padding:5px 10px 5px 0px;}
	ul.homecolumn li ul { width:220px; margin:10px 0px; padding:0px;}
	ul.homecolumn li ul li {float:left; width:200px; height:auto; margin:0px; padding:0px 10px 5px 10px; background:transparent url(../images/divider.gif) no-repeat 0px 5px;}

/* E: Home Columns */

/* S: Breadcrumbs */
	#youarein {
		display:block; 
		width:980px; 
		height:10px; 
		margin:0px; 
		margin-bottom:5px; 
		padding:0px;
		font-size:9px;
		text-transform:uppercase;
		letter-spacing:1px;
		}

		#indicate {padding:0px; margin:0px;}
		#indicate ul {padding:0px; margin:0px;}
		#indicate li {float:left; margin:0; padding:0px; list-style-type:none;}
		#indicate li span {margin:0px 7px; padding:0px; background: url(../images/divider.gif) no-repeat 0px 0px;}

/* E: Breadcrumbs */
	
	#footer {float:left; width:980px; margin:10px 0px 0px 0px; padding:10px 0; border-top:13px solid #0f1e25;}
		#footernav {padding:0px; margin:0px; font-size:10px; letter-spacing:1px;}
		#footernav ul {padding:0px; margin:0px;}
		#footernav li {float:left; margin:0; padding:0px; list-style-type:none; text-transform:lowercase;}
		#footernav li span {margin:0px 7px; padding:0px; background: url(../images/divider.gif) no-repeat 0px 2px;}
		
/* S: Box Hack */
	.boxgrid{ 
		width: 185px; 
		height: 120px; 
		margin:0px 11px 11px 0px; 
		float:left; 
		background:#000; 
		border: 0; 
		overflow: hidden; 
		position: relative; 
	}
		.boxgrid img{ 
			position: absolute; 
			top: 0; 
			left: 0; 
			border: 0; 
		}
		.boxgrid p{ 
			padding: 0 10px; 
			color:#fff; 
			font-weight:bold;
			font-size:10px; 
		}
	
	.boxcaption h4 {margin: 10px 10px 0 10px; color:#fff; font-size:15px; letter-spacing:-1px; font-weight: bold;}
	.boxcaption a:link, .boxcaption a:visited, .boxcaption a:active {color:#fff; background-color:#ec008c; text-decoration:none;}
	.boxcaption a:hover {color:#fff; background-color:#ec008c;}		
		
	.boxcaption { 
		float: left; 
		position: absolute; 
		background: #000; 
		height: 75px; 
		width: 100%; 
		opacity: .7; 
		/* For IE 5-7 */
		filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=60);
		/* For IE 8 */
		-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
		text-transform:uppercase;
		top:50px;
		}
/* E: Box Hack */


/* S: Detailed Content Show using Accordion */

.subContent a.title{
	display:block;
	width:100%;
	margin:0px;
	padding:0px;
}

.subContent p {
	margin-bottom : 10px;
	border: none;
	text-decoration: none;
	margin: 0px;
	padding: 0px 0px 10px 0px;
}
.subContent a {
	cursor:pointer;
	display:block;
	padding:5px;
	margin-top: 0;
	text-decoration: none;	
	background: transparent url("../images/expand.gif") no-repeat right top;
}
.subContent a:hover {
	color:#0f1e25;
}
.subContent a.selected {
	color:#0f1e25;
	background: transparent url("../images/collapse.gif") no-repeat right top;
}

#wizard {
	width: 200px;
	border: 1px solid black;
}
#wizard .title {
	background-color:#DDDDDD;
}

@media print {
	.subContent div{
		display: block!important;
		height: auto!important
	}
}


/* Easy Slider */
#content{position:relative;}			
#slider {border:1px dotted #e3e3e3;}
	#prevBtn, #nextBtn, #slider1prev, #slider1next{
		margin:0;
		padding:0;
		display:block;
		overflow:hidden;
		text-indent:-8000px;
		}

	#slider ul, #slider li,
	#slider2 ul, #slider2 li{
		margin:0;
		padding:0;
		list-style:none;
		}
	#slider2{margin-top:1em;}
	#slider li, #slider2 li{ 
		/* 
			define width and height of list item (slide)
			entire slider area will adjust according to the parameters provided here
		*/ 
		width:613px;
		height:383px;
		overflow:hidden; 
		}	
	#prevBtn, #nextBtn,
	#slider1next, #slider1prev{ 
		display:block;
		width:30px;
		height:77px;
		position:absolute;
		left:0px;
		top:390px;
		z-index:1000;
		}	
	#nextBtn, #slider1next{ 
		left:585px;
		}														
	#prevBtn a, #nextBtn a,
	#slider1next a, #slider1prev a{  
		display:block;
		position:relative;
		width:30px;
		height:77px;
		background:url(../images/btn_prev.gif) no-repeat 0 0;	
		}	
	#nextBtn a, #slider1next a{ 
		background:url(../images/btn_next.gif) no-repeat 0 0;	
		}	
		
	/* numeric controls */	

	ol#controls{
		margin:1em 0;
		padding:0;
		height:18px;	
		}
	ol#controls li{
		margin:0 10px 0 0; 
		padding:0;
		float:left;
		list-style:none;
		height:18px;
		line-height:28px;
		font-size:10px;
		}
	ol#controls li a{
		float:left;
		height:18px;
		line-height:18px;
		border:1px solid #ec008c;
		background:#fff;
		color:#ec008c;
		padding:0 10px;
		text-decoration:none;
		}
	ol#controls li.current a{
		background:#ec008c;
		color:#fff;
		}
	ol#controls li a:focus, #prevBtn a:focus, #nextBtn a:focus{outline:none;}
	
/* // Easy Slider */