/* Custom CSS code by Savvy Web Design www.savvywebdesign.net */
/* NOTE: In general, padding should be kept at 0 to overcome differences in rendering between IE and other browsers */

* { padding:0; margin:0;}

body {
	font-family: Arial,Tahoma,Verdana,Helvetica,sans-serif;
	background-color: #ffffff;
	background-image:url(images/backline.gif);
	text-align:center;
}
/* 	text-align:center is a hack to make the website centre in older browsers. In newer browsers, the auto L&R margins in the wrapper section handle this. */

img {border:0;margin:0;}
.rightimage {float:right;margin:0 0 0 20px;clear:both;}
p 	{line-height: 150%; margin:0 0 1em 0;}
h1, h2 {font-weight: normal; color: #000000; text-align:left;}
h1 {letter-spacing: -1px; font-size: 2.4em; padding:10px;}
h2 {font-size: 1.7em; margin-bottom:30px; color:#7f8e99;}
h3 {font-size: 1.3em; margin-bottom: 25px; font-weight: bold;color:#333333;}
a {color:#000000;text-decoration:none;}
a:hover {color:#000000;text-decoration:underline;}

ul li {	line-height:160%;list-style-type:square;margin-left:30px;}
ol li {line-height:200%;list-style-type:decimal;margin-left:30px;}


#wrapper {
	margin: 0 auto;
	width: 1000px;
	text-align:justify;
	position:relative;
	overflow: hidden;
	background-color:#FFFFFF;
		font-size: 75%;
	color:#666666;}
/* Position:relative is necessary to allow inner elements to use position:absolute if required later. Overflow:hidden is a cheat for clearing floats in Firefox et al to allow the wrapper's background-image to appear. */

/* PHOTO section*/

#photo {margin: 0;
	width: 450px;
	text-align:left;
	background-image:url(images/mainpic.jpg);
	background-repeat: no-repeat;
	background-position: left top;
	background-color: #d4dae0;
}

/* MAIN section */

#main {
 width: 499px;
	height:570px;
	margin: 0;
 float:right;}

#text {width: 90%;
	height:560px;
	padding: 0 20px 0 0px;
	margin:30px 20px 0 0;
	overflow:auto;
	border-bottom:1px solid #d4dae0;
	border-right:1px solid #d4dae0;
}


#menu {
	width: 90%;
	margin:0;
	position:relative;
	z-index:2;
	background-image:url(images/menuline.gif);
	background-repeat: repeat-x;
	background-position: bottom;
	overflow:hidden;
	}

#menu p {color:#7f8e99;line-height:120%; margin:20px 0 3px 0; font-weight:bold;}
/*Bottom margin (above) must equal bottom padding of all anchor elements (below).*/
#menu p a {color:#7f8e99;text-decoration:none;padding:3px 7px 3px 7px;margin-right:5px;border:1px solid #7f8e99; background-color:#d4dae0;}
/*Margin-right (above) controls space between tabs. */
#menu p a:hover {color:#7f8e99;background-color:#FFFFFF;/*border-bottom:1px dashed #cccccc;*/}
#menu p a.current {color:#000000;background-color:#FFFFFF;padding:7px 7px 3px 7px;/*border-bottom:1px solid #ffffff;*/}
#menu p a:hover.current {color:#000000;/*border-bottom:1px solid #ffffff;*/background-color:#FFFFFF;padding:7px 7px 3px 7px;}



.examplenav {margin-top:-23px;margin-bottom:35px;color:#7f8e99;font-size:.9em;}
.examplenav a {color:#7f8e99;}

#buttons {
	margin:0 0 20px 0;
	overflow:hidden;
	float:right;
	clear:both;
	}

#buttons p {color:#7f8e99;line-height:120%; margin:30px 0 4px 0; font-weight:bold;}
/*Bottom margin (above) must equal bottom padding of all anchor elements (below).*/
#buttons p a {color:#7f8e99;text-decoration:none;padding:3px 7px 1px 7px;border:1px solid #7f8e99; background-color:#d4dae0;margin-left:5px;}
#buttons .null {color:#e0e0e0;text-decoration:none;padding:3px 7px 1px 7px;border:1px solid #7f8e99; background-color:#ffffff;margin-left:5px;}
/*Margin-left (above) controls space between tabs. Null is a style for the inoperative buttons on first and final pages. */
#buttons p a:hover {color:#7f8e99;background-color:#FFFFFF;}



.mobi {position:absolute; left:15px; top:15px; font-size:.75em; font-family: Tahoma,Verdana,Arial,Helvetica,sans-serif;}
.mobi a {color:#7f8e99;border:none;}
.mobi a:hover {color:#000000;text-decoration:none;}

.homebutton {position:absolute; left:115px; top:300px;}
/* This places a transparent image over the business name */


/* FOOTER section */

#footer {
	width: 450px;
	margin: 0;
	background-color: #d4dae0;
	text-align:center;
	border-top:1px solid #cad4dd;
}

#footer p {	margin: 10px 0 0 0; padding:0; font-size: .85em; color:#999999;}
#footer a {	color:#999999;}

#mobilewrapper {
	margin: 0 auto;
	width: 100%;
	text-align:justify;
	position:relative;
	background-color:#ffffff;}
	
#mobilemain {background-color: #ffffff;width:90%;margin:1em auto;}

#mobilemain p {line-height: 120%; margin:0 0 1em 0; font-size:100%; color:#000000;}
#mobilemain a {color:#0000ff;text-decoration:underline;}
#mobilemain a:hover {color:#FF0000;text-decoration:underline;}
#mobilemain h2 {font-size:1.5em; margin-top:1em;margin-bottom:1em;}
#mobilemain h3 {font-size:1.2em; margin-top:0;}
#mobilemain img {margin-bottom:1em;}

#vodafone {
	position:absolute;
	left:240px;
	top:40px;
	z-index:6;
	width:150px;
	overflow:auto;
	background:#FFFFFF;
	border: 3px dashed #FF0000;
	padding:7px;
	font-size:.85em; font-family: Tahoma,Verdana,Arial,Helvetica,sans-serif;text-align:center;}