/*
	Designed and written by Nick Harris, http://www.pixelenvy.co.uk
*/

/* *****************************************************************************
	Global
**************************************************************************** \*/

	* {
		margin: 0;
		padding: 0;
		font-family: Lucida Grande, Arial;
	}
	
	.clear:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}
	
	* html .clear {
		height: 1%;
	}

	/* *************************************************************************
		Typography
	************************************************************************ \*/
	
		h1, h2, h3, h4, h5 {
			font-weight: normal;
			color: #369;
		}
		
		h1 {
			letter-spacing: .1em;
			font-size: 140%;
		}
		
		h2 {
			font-size: 110%;
		}
		
		p {
			color: #333;
			line-height: 150%;
			margin: 0 0 1em 0;
		}
		
		ol,
		ul {
			margin: 0 0 1em 2em;
		}
		
		li {
			line-height: 150%;
			margin: 0 0 .5em 0;
		}
		
		a {
			text-decoration: none;
		}
	
		a:link {
			color: #6C6;
		}
		
		a:visited {
			color: #393;
		}
		
		a:hover,
		a:focus {
			color: #9F9;
		}

/* *****************************************************************************
	Containers
**************************************************************************** \*/

	body {
		background: #E5E5E5 url(/images/bg.gif) center top repeat-y;
		text-align: center;
		font-size: .8em;
	}
	
	*html body {
		padding-left: 1px;
	}
	
	div#wrapper {
		width: 752px;
		padding: 166px 15px 0 211px;
		border: solid #000;
		border-width: 0 1px;
		margin: 0 auto;
		text-align: left;
		position: relative;
		background: #e0f0ff url(/images/wrapper_bg.gif) 0 151px repeat-x;
	}
	
	* html div#wrapper {
		width: 980px;
	}
	
	* html div#content {
		height: 1%;
	}

/* *****************************************************************************
	Masthead
**************************************************************************** \*/

	div#masthead {
		position: absolute;
		top: 0;
		left: 0;
		width: 978px;
		height: 151px;
		background: #333 url(/images/masthead_bg.gif) 0 0 repeat-x;
	}
	
	div#masthead img#logo {
		position: absolute;
		top: 15px;
		left: 15px;
		border: none;
	}
	
	body div#masthead p {
		font-size: 22px;
		color: #E5E5E5;
		margin: 110px 0 0 150px;
		letter-spacing: .1em;
	}
	
	div#masthead strong {
		font-weight: normal;
	}
	
	div#masthead a {
		color: #9F9;
		font-size: 18px;
		letter-spacing: 0em;
	}
	
	div#masthead p#corporates {
		width: 402px;
		height: 48px;
		background: transparent url(/images/corporates.gif) 0 0 no-repeat;
		position: absolute;
		top: 50px;
		left: 150px;
		margin: 0;
		font-size: 1px;
		text-indent: -5000px;
		overflow: hidden;
	}

/* *****************************************************************************
	Footer
**************************************************************************** \*/

	div#footer {
		border-top: 1px solid #69C;
		position: relative;
		clear: left;
	}
	
	body div#footer p {
		margin: 0 165px 0 0;
		font-size: 80%;
		color: #999;
	}
	
	div#footer p#footer_payment {
		width: 265px;
		height: 28px;
		margin: 0;
		overflow: hidden;
		background: transparent url(/images/cards.gif) 0 0 no-repeat;
	}
	
	p#footer_payment a {
		display: block;
		padding: 35px 0 0 0;
	}
	
	div#footer p#pixelenvy {
		position: absolute;
		top: 5px;
		right: 0;
		width: 35px;
		height: 35px;
		margin: 0;
		overflow: hidden;
	}
	
	p#pixelenvy a {
		display: block;
		padding-top: 40px;
	}
	
	p#pixelenvy a:link,
	p#pixelenvy a:visited {
		background: transparent url(http://www.pixelenvy.co.uk/images/site_design_light.gif) 0 0 no-repeat;
	}
	
	p#pixelenvy a:hover,
	p#pixelenvy a:focus {
		background: transparent url(http://www.pixelenvy.co.uk/images/site_design_dark.gif) 0 0 no-repeat;
	}

/* *****************************************************************************
	Navigation
**************************************************************************** \*/

	div#nav {
		position: absolute;
		top: 151px;
		left: 0;
		width: 195px;
		background: #69C url(/images/nav_shadow.gif) 0 0 repeat-x;
		padding: 15px 0 0 0;
	}
	
	div#nav ul {
		list-style: none;
		margin: 0 0 15px 0;
		padding: 0 0 5px 0;
		background: transparent url(/images/nav_divider.gif) right bottom no-repeat;
	}
	
	div#nav ul#service {
		margin: 0;
		background: transparent url(/images/nav_end_divider.gif) right bottom no-repeat;
	}
	
	div#nav li {
		margin: 0 0 13px 15px;
		line-height: 100%;
	}
	
	div#nav a {
		padding: 2px 0 2px 25px;
		text-decoration: none;
	}
	
	div#nav a:link,
	div#nav a:visited {
		color: #FFF;
	}
	
	div#nav a:hover,
	div#nav a:focus {
		color: #9F9;
	}
	
	/* *************************************************************************
		icons
	************************************************************************ \*/
	
		a#nav_contact {
			background: transparent url(/images/nav_icons/contact.gif) 0 0 no-repeat;
		}
	
		a#nav_map {
			background: transparent url(/images/nav_icons/map.gif) 0 0 no-repeat;
		}
	
		a#nav_pcs {
			background: transparent url(/images/nav_icons/pcs.gif) 0 0 no-repeat;
		}
	
		a#nav_laptops {
			background: transparent url(/images/nav_icons/laptops.gif) 0 0 no-repeat;
		}
	
		a#nav_lcds {
			background: transparent url(/images/nav_icons/lcds.gif) 0 0 no-repeat;
		}
	
		a#nav_monitors {
			background: transparent url(/images/nav_icons/monitors.gif) 0 0 no-repeat;
		}
	
		a#nav_printers {
			background: transparent url(/images/nav_icons/printers.gif) 0 0 no-repeat;
		}
	
		a#nav_bargain {
			background: transparent url(/images/nav_icons/bargain.gif) 0 0 no-repeat;
		}
	
		a#nav_services {
			background: transparent url(/images/nav_icons/services.gif) 0 0 no-repeat;
		}
	
		a#nav_payment {
			background: transparent url(/images/nav_icons/payment.gif) 0 0 no-repeat;
		}
	
		a#nav_terms {
			background: transparent url(/images/nav_icons/terms.gif) 0 0 no-repeat;
		}

/* *****************************************************************************
	Main
**************************************************************************** \*/
	
	div#main {
		width: 560px;
		margin: 0 15px 0 0;
		float: left;
	}
	
	div#main h1 {
		font-size: 200%;
	}

/* *****************************************************************************
	How to order
**************************************************************************** \*/
	
	div#howtoorder {
		width: 177px;
		margin: 3.5em 0 0 0;
		float: left;
	}
	
	div#howtoorder p,
	div#howtoorder li {
		color: #666;
		font-size: 90%;
	}

/* *****************************************************************************
	Listings
**************************************************************************** \*/

	div.advert {
		margin: 0 0 15px 0;
		background: #333 url(/images/ad_bg_top.gif) 0 0 repeat-x;
		color: #e5e5e5;
		position: relative;
		z-index: 2;
	}
	
	div.advert div {
		padding: 15px 15px 15px 130px;
		position: relative;
		background: transparent url(/images/ad_bg_bottom.gif) right bottom no-repeat;
	}
	
	div.advert img {
	width: 113px!important;
	border: 1px solid #679bc7;
	position: absolute;
	top: 15px;
	left: 15px;
	}
	
	* html div.advert img {
		left: -118px;
	}
	
	div.advert p {
		color: #e5e5e5;
		margin: 0;
	}
	
	div.advert strong {
		color: #679bc7;
		font-size: 200%;
		font-weight: normal;
	}
	
	div.advert ul {
		margin: 0 0 1em 15px;
		list-style: url(/images/bullet.gif);
	}
	
	div.advert li {
		font-size: 90%;
		line-height: 170%;
		margin: 0;
	}
	
	div.advert h2 {
		color: #9F9;
	}
	
	div.advert a:link {
		color: #9F9;
	}
	
	div.advert a:visited {
		color: #393;
	}
	
	div.advert a:hover,
	div.advert a:focus {
		color: #6C6;
	}

/* *****************************************************************************
	Index
**************************************************************************** \*/

	body#index h1 {
		margin: 0 367px 0 0;
	}
	
	body#index p {
		margin: 0 367px 1em 0;
	}
	
	div#birdy {
		position: absolute;
		top: 0;
		right: 10px;
		width: 347px;
		height: 363px;
		overflow: hidden;
		background: transparent url(/images/parrot.jpg) 0 0 no-repeat;
	}
	
	div#birdy p {
		position: absolute;
		top: -5000px;
	}
	
	div#offers {
		margin: 0;
		padding: 0 0 49px 0;
		background: transparent url(/images/offers_bg.gif) left bottom no-repeat;
	}
	
	body#index div.advert {
		width: 368px;
		margin: 0;
		float: left;
	}
	
	body#index div#left {
		margin: 0 15px 0 0;
	}
	
	body#index div.advert div {
		padding: 15px 15px 0 130px;
		background: none;
	}
	
	body#index div.advert p {
		margin: 0;
	}