@import url('reset.css');
@import url('typography.css');
@import url('forms.css');

body {
	margin: 0px;
	padding: 0px;
	background-color: rgb(255,255,255);
	background: url('../media/image/bottom_background.jpg') bottom right fixed no-repeat;
}

div.map {
	margin-bottom:10px;
}

div#wrapper {
	position: relative;
	max-width: 1000px;
	padding:0 1% 0 5%;
	min-width:805px;
	z-index: 2;
}
div#content p {
	padding-right:12px;
}
div#header {
	position:relative;
	height: 140px;
	background: url('../media/image/header_background.jpg') no-repeat top left;
	background-color: #8da771;
	padding-left:5%;
	min-width:813px;
}
p#logo {
	display:none;
}

ul#main-navigation {
	position:relative;
	top:97px;
	width:733px;
	height:43px;
	margin: 0px;
	padding: 0px;
	list-style-type:none;
	z-index:10;
}

ul#main-navigation li {
	display:inline;
	position: relative;
	float: left;
}

ul#main-navigation li a {
	position:absolute;
	display:block;
	height:43px;
	text-indent: -10000px;
}

li#menu-about a {
	width:102px;
	left:1px;
	background: url('../media/image/menu_about_up.gif') bottom left no-repeat;
}

li#menu-about,
li#menu-about a:hover {
	background: url('../media/image/menu_about_ov.gif') bottom left no-repeat;
}

li#menu-clients a {
	left:102px;
	width:191px;
	background: url('../media/image/menu_examples_up.gif') bottom left no-repeat;
}


li#menu-clients,
li#menu-clients a:hover {
	background: url('../media/image/menu_examples_ov.gif') bottom left no-repeat;
}

li#menu-services a {
	left:293px;
	width:244px;
	background: url('../media/image/menu_digital_up.gif') bottom left no-repeat;
}

li#menu-services,
li#menu-services a:hover {
	background: url('../media/image/menu_digital_ov.gif') bottom left no-repeat;
}

li#menu-contact a {
	left:536px;
	width:108px;
	background: url('../media/image/menu_contact_up.gif') bottom left no-repeat;
}


li#menu-contact,
li#menu-contact a:hover {
	background: url('../media/image/menu_contact_ov.gif') bottom left no-repeat;
}

ul#main-navigation li#menu-jargon a {
	left: 820px;
	top: -60px;
	width:65px;
	height:65px;
	background: url('../media/image/menu_jargon.gif') bottom left no-repeat;
}

/* Menu selection */
#page-timeline li#menu-about a,
#page-team-digi li#menu-about a,
#page-team-mark li#menu-about a,
#page-team-james li#menu-about a,
#page-team-graham li#menu-about a,
#page-team-patrick li#menu-about a,
#page-team-roy li#menu-about a,
#page-team li#menu-about a,
#page-our-speciality li#menu-about a,
#page-why-different li#menu-about a,
#page-index li#menu-about a {
	background: url('../media/image/menu_about_sel.gif') bottom left no-repeat;
}

#page-our-clients li#menu-clients a,
#page-testimonials li#menu-clients a,
#page-clients li#menu-clients a {
	background: url('../media/image/menu_examples_sel.gif') bottom left no-repeat;
}

#page-services-how-we-work li#menu-services a, 
#page-services-creating-your-site li#menu-services a, 
#page-services-building-your-site li#menu-services a, 
#page-services-getting-traffic li#menu-services a, 
#page-services-marketing-offline li#menu-services a, 
#page-services-customer-relationships li#menu-services a, 
#page-services-keep-fresh li#menu-services a, 
#page-services-measuring-results li#menu-services a, 
#page-services-training li#menu-services a, 
#page-services li#menu-services a {
	background: url('../media/image/menu_digital_sel.gif') bottom left no-repeat;
}

#page-contact-online li#menu-contact a,
#page-contact li#menu-contact a {
	background: url('../media/image/menu_contact_sel.gif') bottom left no-repeat;
}

/* Sub menu selection */
#page-contact li#local-contact {
	font-weight: bold;
}

#page-contact-online li#local-email {
	font-weight: bold;
}

#page-our-speciality li#local-speciality {
	font-weight: bold;
}

#page-team li#local-team {
	font-weight: bold;
}

#page-team li#local-team li {
	font-weight: normal;
}

#page-team-digi li#digi-link {
	font-weight: bold;
}

#page-team-mark li#mark-link {
	font-weight: bold;
}

#page-team-patrick li#patrick-link {
	font-weight: bold;
}

#page-team-james li#james-link {
	font-weight: bold;
}

#page-team-roy li#roy-link {
	font-weight: bold;
}

#page-team-graham li#graham-link {
	font-weight: bold;
}

#page-why-different li#local-different {
	font-weight: bold;
}

#page-timeline li#local-timeline {
	font-weight: bold;
}

#page-job-enquiries li#local-job-enquiries {
	font-weight: bold;
}


#page-clients li#local-clients{
	font-weight: bold;
}

#page-our-clients li#local-our-clients {
	font-weight: bold;
}

#page-testimonials li#local-testimonials {
	font-weight: bold;
}


#page-services-how-we-work li#local-how-we-work {
	font-weight: bold;
}

#page-services-creating-your-site li#local-creating-your-site {
	font-weight: bold;
}

#page-services-building-your-site li#local-building-your-site {
	font-weight: bold;
}

#page-services-getting-traffic li#local-getting-traffic {
	font-weight: bold;
}

#page-services-marketing-offline li#local-marketing-offline {
	font-weight: bold;
}

#page-services-customer-relationships li#local-customer-relationships {
	font-weight: bold;
}

#page-services-keep-fresh li#local-keep-fresh {
	font-weight: bold;
}

#page-services-measuring-results li#local-measuring-results {
	font-weight: bold;
}

#page-services-training li#local-training {
	font-weight: bold;
}

div#content {

	background: url('../media/image/white_mask.png');
	padding: 12px 0 12px 12px;
	width:74%;
	min-height: 400px;
	_height: 400px;
}

div#content p {
}

div#flash {
	width:537px;
	height:265px;
	background: url('../media/image/flash_background.jpg') top right no-repeat;
}
body#page-index h1 {
	text-indent: -10000px;
	width:169px;
	height:51px;
	background: url('../media/image/great_move.gif') top right no-repeat;
	z-index:2;
}
body#page-index div#content p.first {
	text-indent: 50px;
	position:relative;
	top:-1em;
	z-index:1;
}

ul#local-navigation {
	position:absolute;
	top:10px;
	right:0px;
	width:205px;
	min-height: 150px;
	_height: 150px;
	margin: 0px;
	padding: 4px 0px 0px 0px;
	border-left: solid 1px #a3a35b;
	background: url('../media/image/white_mask.png');
	list-style-type:none;
	z-index:10;	
}

ul#local-navigation li {
	display:block;
	padding: 6px 16px;
}

ul#local-navigation li a {
	display:block;
	color: #a3a35b;
	text-decoration: none;
	text-transform: lower-case;
	position:relative;
}

ul#local-navigation li a:hover {
	text-decoration: underline;
}

ul#local-navigation ul {
	padding: 0px;
	margin: 0px;
	padding-left: 0.5em;
	list-style-type:none;
}

ul#local-navigation ul li {
	padding: 2px 16px;
}

div#footer {
	margin-left: 5%;
	padding: 12px;
}

div#footer p {
	margin: 0px;
}


p#usp {
	display:none;
}

/* Examples */
div.portfolio {
	display: table;
}

div.portfolio dl {
	position: relative;
	float: left;
	width: 200px;
	height: 25em;
	margin: 0px;
	padding-right: 3%;
}

div.portfolio dl dt,
div.portfolio dl dd {
	margin: 0px;
	padding: 0px;
}

div.portfolio dl dt {
	color: rgb(60,60,60);
	font-size: 1.2em;
	font-weight: normal;
	padding: 4px 0px;
}

div.portfolio dl img {
	display: block;
	width: 200px;
	height: 200px;
	padding: 2px;
	border: solid 1px rgb(225,225,225);
}

div.portfolio dl dd.link {
	font-size: 80%;
	overflow: hidden;
	margin-top: 4px;
}

/* Contact page */
div#contact {
	display: table;
	width: 611px;
}

#page-contact div.contact {
	display: inline;
	float: left;
	width: 285px;
	margin: 10px 0px;
	padding: 0px 10px;
}

#page-contact div#contact-london {
	border-right: solid 1px rgb(220,220,220);
}

/* Timeline */
dl.timeline {
	display: table;
	width: 600px;
	margin: 0px;
	padding: 0px;
}

dl.timeline dt {
	float: left;
	clear: both;
	margin: 0.2em 0px;
	padding: 0px;
	width: 3em;
	font-size: 200%;
	font-weight: normal;	
	color: rgb(160,160,160);
}

dl.timeline dd {
	float: right;
	width: 500px;
	margin: 0.5em 0px;
}

/* Team page */
div.team {
	display: table;
	margin: 10px 30px;
}
	
div.team dl {
	position: relative;
	display: inline;
	float: left;
	width: 210px;
	height: 130px;
	padding-left: 100px;
}

div.team dl dd.photo {
	position: absolute;
	left: 0px;
	top: 0px;
}

div.team dl dd.photo img {
	border: solid 1px rgb(40,40,40);
}

div.team dl dd {
	margin: 0px;
	padding: 0px;
}