@charset "utf-8";
/* CSS Document */

/* Whole page stuff ie page wrapper, styled tags etc */
div{margin:0px; padding:0px;}
@font-face {
    font-family: 'LiberationSansRegular';
    src: url('LiberationSans-Regular-webfont.eot');
    src: url('LiberationSans-Regular-webfont.eot?#iefix') format('eot'),
         url('LiberationSans-Regular-webfont.woff') format('woff'),
         url('LiberationSans-Regular-webfont.ttf') format('truetype'),
         url('LiberationSans-Regular-webfont.svg#webfontLfr8h6FA') format('svg');
    font-weight: normal;
    font-style: normal;
}

body{
	background-color: #d7c6db;
font-family: "Myriad Pro", Myriad, "Liberation Sans", "LiberationSansRegular", "Nimbus Sans L", "Helvetica Neue", Helvetica, Arial, sans-serif; /* pretty damn likely that one of the first 3 will work but just to be safe =) */
}

img{border:0px none;	
	margin:0px;
	
	

}
table{
text-align:center;
vertical-align:middle;	
}
td{
padding:10px;	


}
tr{

}
.clear:after{
	content:".";
	height:1px;
	clear:both;
	visibility:hidden;
	
}
.center{
margin: 0px auto;	
}

.floatright{
	float:right;
}
.floatleft{
	float:left;	
}

/* links */
a img{
	border:0px none; /* get rid of the shitty borders in IE */
}

a{
	text-decoration:none;
	color:#a706ab;
}

a:active{
}

a:link{
}

a:hover{
		color:#d700db;
}

a:visited{
}


#wrapper{
	top:0px;
	left:0px;
	position:absolute;
	width:100%;
	margin:0px;
	padding:0px;
	background-image:url(images/background-gradient.png);
	background-position:top;
	background-attachment:scroll;
	background-repeat:repeat-x;
}


/* Logo and sides */
#heading{
	height:200px;
	width:900px;
	margin:0px auto;
	padding:0px;
}


#heading img{
	margin:0px;
	padding:0px;	
	top:0px;
}

#headingleft{
	width:189px;
	height:200px;
	top:0px;
	position:absolute;
	float:left;
	margin-left:-189px;
	background-image:url(images/headingleft.jpg);
}

#headingright{
	width:189px;
	height:200px;
	top:0px;
	position:absolute;
	float:right;
	margin-left:900px;
	background-image:url(images/headingright.jpg);
}

/* Main Navigation */

#mainmenu{
	width:900px;
	height:	60px;
	background-position:right;
	margin:0px auto;
}

#mainmenu img{
	float:right;
	margin:0px;
	padding:0px;	
	
}

/* Body */

#contentwrapper{
	width:900px;
	margin-left:-189px; /* -ve margin with +ve paddingo keep content in place */
	margin-right:-189px;
	padding-left:189px;
	padding-right:189px;
	background-image:url(images/backgroundgrad.jpg);
}
#content{
	margin:10px 20px 10px 20px;
	overflow:auto;
	
}

#leftgrad{
	width:189px;
	background-image:url(images/bodyleftgrad.jpg);
	margin:-60px 0px 0px -189px; /* -ve margins to account for menuand width of page  also we're hitting almost 1.2k px wide so we want the grads to be pushed off the screen if anything on higher res screens */
	float:left;	
	height:100%;
	background-repeat:repeat-y;
}

#rightgrad{
	width:189px;
	background-image:url(images/bodyrightgrad.jpg);
	margin:-60px -189px 0px; 
	float:right;	
	height:100%;
	background-repeat:repeat-y;
	
}


/* Footer  */

#footer{
	height:100px; /* the image is 100px high in total */
	width:900px;
	margin:0px -190px 0 -190px;
	padding:0px 190px 0 190px;
	background-image:url(images/footer.jpg);
	background-repeat:no-repeat;
}

#footer p{
padding:32px; /* this is a pain but manually adjust here if the footer isn't centering after font size change - could dump it in a table to avoid this but meh*/
margin:0px;	

text-align:right;
}

/* Page specific - split "end" of default.css - split into individual files from here onwards when page grows */ 

/* About Us */

#services{
float:right;
width:200px;
margin:0px 0px 0px 0px;
background-color:#e2d4e5;
margin-left:20px;

}


#services ul{
	
	margin-left:0px;
	padding-left:20px;
	
}

#services li{
	margin-left:20px;
	padding-left:0px;
	
}
#contact p{

	margin-left:300px; 
}
#contact img{
	padding-right:20px;	
	
}

#retrobox{
	background-color:#e2d4e5;
	margin-right:40px;
	display:inline-block; 
}