/*Open Sandwich Design - www.opensandwichdesign.co.uk*/
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 100%;
	color: #ddd;
	background-color: #000;
	margin: 2.5% 0 0 0;
	padding: 0;
}
#masthead {
	color: #999999;
	background-color: #000000;
	padding: 0;
	margin: 0;
}

#masthead_title {margin: 12px 20px 5px 205px;padding:0;}
#masthead_title h1, #masthead_title p{
font-weight:normal;margin:8px 0;padding:0;font-size:2em;color:#eee;
	font-family: century gothic,Arial, Helvetica, sans-serif;
	letter-spacing: 1px;

}
#wrapper,#wrapperfront,#wrapperabout,#wrappertest {
	position: relative;
	width:80%;
	min-width:780px;
	max-width:900px;
	margin:0 auto;	
}

#wrapperfront {
background: url(../images/frontpic2.jpg) no-repeat right bottom;
}
#wrapperabout {
background: url(../images/magickiwi.jpg) no-repeat right bottom;
}

#wrappertest {
background: url(../images/flaming_wallet.jpg) no-repeat right bottom;
}
#column_wrapper {
clear:both;
	background-image: url(../images/clm05_middle.gif);
	background-repeat: no-repeat;
	/*border-right: 1px solid #000000;*/
}
.clearfloat {
	clear: both;
	height: 0;
	line-height: 0;
	font-size: 0;
}
#right {
	margin: 0px 0px 0px 180px;
min-height:450px;
}

#left {
	width: 180px;
	float: left;
}
#right .content  {
	padding: 25px 24px 0 24px;
	/*width:530px;
	margin:0 auto;
	padding:24px 0;*/
	font-size: 0.85em;
	line-height: 1.5em;
}
.content p  {
	margin: 12px 0;
}
address {font-style:normal;padding-top:12px;text-align:center;}
.addressbox {padding:0;margin:0;}
#wrapperfront #right .content p {
	margin: 12px 140px 12px 0px;
}
#wrapperabout #right .content p {
	margin: 12px 250px 12px 0px;
}
#left .content {
	padding: 20px 24px;
	font-size: 0.9em;
	line-height: 1.8em;
}

#footer .content {padding: 0px 20px 12px 20px;}
#footer {
	color: #999;
	/*margin: 0;*/
	font-size: 0.7em;
		width:80%;
	min-width:780px;
	max-width:900px;
	margin:0 auto;
}
#footer .content p {margin:0 0 10px 0;}
.menulist {
	margin: 6px 0 12px 0;
	padding: 0;
	list-style-type: none;
}
#left a:link,#left a:visited {
	color: #ccc; text-decoration:none; 
	font-weight:bold;
	
}

#left a:hover {
	color: #fff;
}
#right a:link {
	color: #ccc;
}
#right a:visited {
	color: #ccc;
}
#right a:hover {
	color: #fff;
}
.menulist a, .menulist a:visited {
	color: #ccc;
	background: url(../images/bullet.gif) no-repeat left!important;
	padding: 0 0 0 16px;
}
.menulist a:hover {
	background: url(../images/bulleton.gif) no-repeat left!important;
	color: #e9d477!important;
}
#footer a:link,#footer a:visited {color: #999;}
#footer a:hover {color: #9B7C00;}

.p7uberlink {
background: url(../images/bulleton.gif) no-repeat left!important;
color: #e9d477!important;
}

h1, h2, .subtitle, h3, h4 {
	font-size: 1.6em;
	margin: 0px 0 0 0;
	color:#eee;
	font-family: century gothic,Arial, Helvetica, sans-serif;
	letter-spacing: 1px;
}
.subtitle {
	margin: 30px 0!important;
	padding-top:25px;
	background: url(../images/horiz_rule.gif) no-repeat top;
	font-weight:bold;
}

.nomargintop {margin-top: 0!important;}
.bigtxt {
	font-size:1.2em!important;font-weight:bold;
}
.hori_rule {
	padding-bottom:24px!important;
background: url(../images/horiz_rule.gif) no-repeat center bottom;
}
.italictxt {font-style:italic;padding-bottom:24px!important;
background: url(../images/horiz_rule.gif) no-repeat center bottom;}
.boldtxt {color:#fff;}
.yellowtxt {color:#fdf5a4;}
.centretxt {padding-left:100px!important;}

/*magic circle and equity logos - links and rollovers*/
#logos{
	margin: 0;
	padding:0;
	font-size: .75em;
}

#logos li {
	list-style-type: none;
	margin: 0 0 6px 0;
	padding: 0;
}

/*this is all we need for top-level links*/
#logos a {
	display: block;
	text-decoration: none;
}


/*This is top-level only and is the rule that shifts the background image so that we now
see the bottom one. It is deployed via multiple selectors for hovering, tab key access,
and so it stays persistent when its associated sub-menu is open*/
#logos a:hover, #logos a:active, #logos a:focus
 {
	background-position: left bottom;
}

/* Top level menu width
We set width to auto because we are using top-level bg images and the width is
assigned directly via the IDs assigned to the links.*/
#logos li {
	float: left;
	width: auto;
}
/*The top-level common properties
Height matches the height of the background images. No repeating. Text indent
hides the text offscreen left but text is still Accessible.*/
#b1 {
	height: 117px!important;
	background-repeat: no-repeat;
	text-indent: -3000px;
}
#b2 {
	height: 55px!important;
	background-repeat: no-repeat;
	text-indent: -3000px;
}

/*The individual top-level IDS. We simply set width to match the width of the
associated background image and then we set the background image.
If you need to add more links, add more selectors, incrementing from #b5*/
#b1 {
	width: 130px;
	background-image: url(../images/magic_circle.gif);
}
#b2 {
	width: 130px;
	background-image: url(../images/equity.gif);
}