/* ---------------------------------------
	master styles
--------------------------------------- */

	@import "/includes/css/forms.css";
	@import "/includes/css/type.css";

	html
	{
		background: #E0E6E6 url(/media/images/backgrounds/main.gif) repeat-x;
	}
	
	body
	{
		background: url(/media/images/backgrounds/clouds.jpg) no-repeat top center;
	}
	
	body,
	html
	{
		width: 100%;
	}

	#header,
	#navigation,
	#content,
	#footer
	{
		width: 930px;
		margin: 0 auto;
	}


/*
	global styles
	----------------------------------- */

	#content:after,
	.section:after,
	.copy:after
	{
		content: "."; 
		display: block; 
		height: 0; 
		clear: both; 
		visibility: hidden;
	}

	#logo,
	#navigation a span,
	#billboard span
	{
		display: block;
	
		text-indent: -10000px;
		outline: none;
	}
	
	img
	{
		border-width: 0;
	}
	
	img.outdent,
	span.boxout
	{
		margin: 20px -20px;
	}
	
	#footer
	{
		padding: 30px 0 50px;
	}

/*
	main styles
	----------------------------------- */

	#logo
	{
		background: url(/media/images/logomain.gif);
		width: 215px;
		height: 99px;
	}
	
	#billboard
	{
		float: left;
		width: 625px;
		height: 254px;
		background-repeat: no-repeat;
		background-color: #A9DDF2;
		border-right: 2px solid #FFF;
	}
	
	.home #billboard						{ background-image: url(/media/images/home-mainimage.jpg); }
	.strategy #billboard					{ background-image: url(/media/images/companystrategy-main.jpg); }
	.white-label-solutions #billboard		{ background-image: url(/media/images/whitelabels.gif); }
	.benefits #billboard					{ background-image: url(/media/images/businessdev.jpg); }
	.media-centre #billboard				{ background-image: url(/media/images/mediacentre/media.jpg); }
	.envirostudents #billboard				{ background-image: url(/media/images/envirostudents/student-images.jpg); }
	.envirocharities #billboard				{ background-image: url(/media/images/envirocharities.jpg); }
	.management #billboard					{ background-image: url(/media/images/management-main.jpg); }
	.testimonials #billboard				{ background-image: url(/media/images/testimonials.jpg); }
	.envirofone #billboard					{ background-image: url(/media/images/brands-enviro-main.jpg); }
	.foneaid #billboard						{ background-image: url(/media/images/brands-foneaid-main.jpg); }
	.fones4schools #billboard				{ background-image: url(/media/images/brands-f4s-main.jpg); }
	.refurbishment #billboard				{ background-image: url(/media/images/refurb-main.jpg); }
	.contact #billboard						{ background-image: url(/media/images/contact-mainimage.jpg); }
	.weetech #billboard						{ background-image: url(/media/images/weetech.jpg); }
	.sales #billboard						{ background-image: url(/media/images/sales-mainimage.jpg); }
	.commitments #billboard,				
	.why-eazyfone #billboard				{ background-image: url(/media/images/commitments-mainimage.jpg); }
	.employees	#billboard					{ background-image: url(/media/images/employees-mainimage.jpg); }
	.sustainability #billboard				{ background-image: url(/media/images/sustainability-mainimage.jpg); }
	.environment #billboard					{ background-image: url(/media/images/environment-mainimage.jpg); }
	.community #billboard					{ background-image: url(/media/images/community-mainimage.jpg); }

	span.boxout
	{
		background-color: #CECAC8;
		padding: 20px;
		border-right: 2px solid #FFF;
	}

	.section
	{
		width: 930px;
	}

	.additional
	{
		float: left;
		width: 263px;
		height: 214px;
		padding: 20px;
		text-align: center;
	}
	
	.additional h2,
	.additional h3,
	.additional h4,
	.additional p
	{
		text-align: left;
	}
	
	.additional img
	{
		margin-top: 1.6em;
	}
	
	.copy
	{
		background-color: #FFF;
		padding: 20px 20px 30px;
		width: 587px;
		float: left;
	}
	
	.left
	{
		float: left;
	}
	
	.right
	{
		float: right;
	}
	
	.clear
	{
		clear: both;
		display: block;
	}

	.copy span.left,
	.copy span.right,
	.copy p.left,
	.copy p.right
	{
		float: left;
		width: 285px;
	}

	.copy .left
	{
		padding-right: 7px;
	}
	
	.copy .right
	{
		padding-left: 8px;
	}

	.intro .additional
	{
		background: url(/media/images/home-rightcolumnbg.gif) no-repeat;
	}
	
	.main .additional
	{
		background-color: #DBD7CC;
		height: auto;
	}

	.main
	{
		background: url(/media/images/backgrounds/content.gif) repeat-y;
	}

	#footer
	{
		clear: both;
		background: url(/media/images/home-shadowlower.gif) no-repeat top left;
	}
	
	.news-index a
	{
		color: #3565BB;
	}


/*
	navigation styles
	----------------------------------- */
	
	#navigation
	{
		width: 930px;
		height: 39px;
		border-bottom: 30px solid #FFF;
	}
	
	#navigation li
	{
		float: left;
	}
	
	#navigation li,
	#navigation a,
	#navigation span
	{
		height: 39px;
		line-height: 28px;
		display: block;
	}
	
	#navigation ul li,
	#navigation ul a
	{
		width: auto !important;
		background: none;
		float: left;
	}
	
	#navigation a
	{
		background-image: url(/media/images/navigation/navigation.gif);
	}
	
	#navigation ul
	{
		position: absolute;
		display: none;
	}
	
	#navigation ul li
	{
		margin-right: 20px;
	}
	
	#navigation li:hover ul,
	#navigation li.active ul
	{
		display: block;
	}
										
	#navigation li.home a				{ width: 99px; }
	#navigation li.vision a				{ background-position: -99px 0; width: 119px; }
	#navigation li.commitments a		{ background-position: -218px 0; width: 158px; }
	#navigation li.partners a			{ background-position: -376px 0; width: 111px; }
	#navigation li.sales a				{ background-position: -487px 0; width: 90px; }
	#navigation li.brands a				{ background-position: -577px 0; width: 104px; }
	#navigation li.solutions a			{ background-position: -681px 0; width: 114px; }
	#navigation li.contact a			{ background-position: -795px 0; width: 135px; }

	#navigation li.home a:hover,
	#navigation li.home a.active		{ background-position: 0 -39px; }
	#navigation li.vision a:hover,
	#navigation li.vision a.active		{ background-position: -99px -39px; }
	#navigation li.commitments a:hover,
	#navigation li.commitments a.active	{ background-position: -218px -39px; }	
	#navigation li.partners a:hover,
	#navigation li.partners a.active	{ background-position: -376px -39px; }	
	#navigation li.sales a:hover,
	#navigation li.sales a.active		{ background-position: -487px -39px; }
	#navigation li.brands a:hover,
	#navigation li.brands a.active		{ background-position: -577px -39px; }
	#navigation li.solutions a:hover,
	#navigation li.solutions a.active	{ background-position: -681px -39px; }
	#navigation li.contact a:hover,
	#navigation li.contact a.active		{ background-position: -795px -39px; }
	
	
	/* sub-navigation positioning */
	
	#navigation li.vision ul			{ margin-left: -85px; }
	#navigation li.commitments ul		{ margin-left: -150px; }
	#navigation li.partners ul			{ margin-left: 0; }	
	#navigation li.brands ul			{ margin-left: -150px; width: 500px; }
	#navigation li.solutions ul			{ margin-left: -80px; width: 350px; }