body {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, Verdana, sans-serif;
	text-align: center;
	background-color: #fffedc;
}

/* accessibility links to page anchors */
.hidden {
display: none;
}

/* page wrapper */
#wrapper {
	position: relative;
	text-align: left;
	width: 735px;
	margin-right: auto;
	margin-left: auto;
	margin-top: 10px;
	background-color: transparent;
}

/* header images placed within h1 for structure; this removes default guff around them */
h1 {
margin: 0px;
padding:: 0px;
margin-bottom: 15px;
}

h2 {
text-transform: uppercase;
letter-spacing: 6px;
border-top: 1px solid #479ed2;
border-bottom: 1px solid #479ed2;
font-family:Arial, Helvetica, sans-serif;
font-size:90%;
color: #479ed2;
margin-left: 10px;
padding: 4px 0 4px 0;
}

/* min-height:52px;
  height:auto !important; fixes IE6 and 7 
  height:52px; fixes IE6 and 7 
  */

/* graphic position at top of page for birthdays */
#birthday {
	position: absolute;
	right: 119px;
	top: 0px;
	width: 83px;
	left: 534px;
}

/* global and global2 position graphic links at top of page */
#global {
position: absolute;
left: 247px;
top: 0px;
width: 157px;
}

#global2 {
position: absolute;
left: 412px;
top: 0px;
width: 112px;
}

/* horizontal 'levels' navigation */
	#nav {
	background-color: transparent;
	padding: 0;
	margin: 0;
	margin-top: 20px;
}

#nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

#nav li {
	display: inline;
	margin: 0;
	padding: 0;
}

/* body copy */
#content {
margin: 13px 185px 0px 216px;
	padding: 0px;
	min-height:300px;
  height:auto !important;
  height:300px;
}


/* content 2 is used, for example on viewvid.php - removes left hand margin */
#content2 {
margin: 13px 185px 0px 10px;
	padding: 0px;
}

#content280 {
margin: 13px 0 0 10px;
	padding: 0px;
	width: 280px
}

#content p, #content h2, #content li, #content2 p, #content2 h2, #content2 li {
	font-size: 80%;
	line-height: 130%;
	color: #666666;
}

#content280 p, #content280 li, #content280 h2 {
color: #406AB3;
	font-size: 80%;
	line-height: 130%;
}

#content h2, #content2 h2, #content280 h2 {
	font-weight: bold;
	margin: 0;
	background-color:transparent;
text-transform:none;
letter-spacing: 0;
border:0;
}

#content a, #content2 a {
	color: #333333;
}

#content280 a {
color: #406AB3;
	text-decoration: none;
	font-weight: bold;
}

#content280 a.title {
	text-decoration: underline;
}

/* body link styles */

#content a, #content2 a {
	text-decoration: underline;
	font-weight: bold;
}

#content a:hover, #content2 a:hover, #content280 a:hover {
	text-decoration: none;
	font-weight: bold;
}

/* positions image on left of page */

#pageimage {
position: absolute;
left: 0px;
top: 177px;
}

#pageimage2 {
position: absolute;
left: 0px;
top: 207px;
}

#pageimage3 {
position: absolute;
left: 0px;
top: 107px;
}

/* positions links to classes on right of page */

#pagelinks, #pagelinks2, #pagelinks3, #pagelinks4 {
position: absolute;
right: 0px;
width: 173px;
}

#pagelinks {
top: 177px;
}

#pagelinks2 {
top: 207px;
}

#pagelinks3 {
top: 221px;
}

#pagelinks4 {
top: 122px;
}

#pagelinks p, #pagelinks li, #pagelinks2 p, #pagelinks2 li, #pagelinks3 p, #pagelinks3 li, #pagelinks4 p, #pagelinks4 li {
color: #666666;
font-size: 75%;
}

/* colouring for blocks behind page links, specific to level colour code */
/* the generic stuff shared by all */
#class1, #class2, #class3, #class4, #class5, #class6, #class7  {
background-color: #c5392b;
padding: 10px;
margin-bottom: 10px;
}

#class1 p, #class2 p, #class3 p, #class4 p, #class5 p, #class6 p, #class7 p {
margin-top: 0;
color: white;
font-size: 80%;
font-weight: bold;
}

#class1 ul, #class2 ul, #class3 ul, #class4 ul, #class5 ul, #class6 ul, #class7 ul {
list-style-image: url(images/arrow2.gif);
margin: 0;
margin-left: 10px;
margin-top: 10px;
padding: 0;
}

#class1 li, #class2 li, #class3 li, #class4 li, #class5 li, #class6 li, #class7 li {
	margin: 0;
	padding: 0 0 2px 0;
	color: white;
}

#class1 a, #class2 a, #class3 a, #class4 a, #class5 a, #class6 a, #class7 a  {
color: white;
text-decoration: none;
}

#class1 a:hover, #class2 a:hover, #class3 a:hover, #class4 a:hover, #class5 a:hover, #class6 a:hover, #class7 a:hover  {
color: white;
text-decoration: underline;
}


/* colours */
#class1 {
background-color: #fdb813;
}

#class2 {
background-color: #f58220;
}

#class3 {
background-color: #c5392b;
}

#class4 {
background-color: #957fb5;
}

#class5 {
background-color: #4e84c4;
}

#class6 {
background-color: #33c3df;
}

#class7 {
background-color: #64aa3c;
}


#footer {
	padding-top: 10px;
	padding-bottom: 10px;
	font-size: 70%;
	color: #666666;
	background-color: transparent;
	text-align: center;
	clear: both;
	}
	
	#footer a {
	color: #666666;
	text-decoration: none;
	}
	
		#footer a:hover {
	color: #333333;
	text-decoration: underline;
	}

/* generic stuff */
.floatright {
float: right;
margin-left: 10px;
}

.floatleft {
float: left;
margin-right: 10px;
}

.leftnomargin {
float: left;
margin-top: -3px;
}

.clear {
clear: both;
}

form {
margin: 0px;
}

.outline {
border: 1px solid #5a8db2;
padding: 0;
margin-bottom: 10px;
background-color:#FFFFFF;
width: 535px;
}
.outline th, .outline td {
font-size:75%;
padding: 3px;
border-bottom: 1px solid #5a8db2;
}

#content .outline h2, #content2 .outline h2 {
background-color:#479ed2;
margin: 0;
text-transform:none;
letter-spacing: 0;
border:0;
color: #FFFFFF;
padding: 4px;
}
.outline p {
padding: 3px 10px;
}

/* page specific stuff */

/* homepage - so little CSS, so many images - absolute positions for pic-based hp */

#mainpic {
position: absolute;
left: 333px;
top: 207px;
width: 197px;
}

#imagelinks {
float: right;
width: 183px;
}

.margintop {
margin-top: 10px;
}

/* level text colours */

#l1 p, #l1 h2 {
color: #b2801e;
}

#l2 p, #l2 h2 {
color: #da6e1b;
}

#l3 p, #l3 h2 {
color: #b7291b;
}

#l4 p, #l4 h2 {
color: #827eaf;
}

#l5 p, #l5 h2 {
color: #5a8db2;
}

#l6 p, #l6 h2 {
color: #3eb6cc;
}

#l7 p, #l7 h2 {
color: #7c964a;
}

/* alert message */
#adminmessage {
background-color:#FFFFCC;
margin: 5px;
padding: 5px;
border: 1px solid #479ED2;
color: #FF0000;
font-weight: bold;
font-size: 75%;
}

/* franchise page */
#centre {
margin: 13px 267px 0px 267px;
	padding: 0px;
	min-height: 300px;
  height: auto !important;
  height: 300px;
}

#centre p, #left p, #right p {
	color: #5a8db2;
font-size: 80%;
}

#left {
position: absolute;
left: 0px;
top: 203px;
width: 210px;
}

#right {
position: absolute;
right: 0px;
width: 200px;
top: 203px;
}

/* map styles */

dl.map.on {
	position:relative;
	width:437px;
	height:739px;
	background:url(images/map.gif) no-repeat;
	text-align:left;
	margin:0px;
	padding:0px;
		font-size:75%;
	font-weight: bold;
	float: right;
}
dl.map.on dt {
	list-style:none;
	display:inline;
}
dl.map.on dd {
	position:absolute;
	left:-9999px;
	width:135px;
		min-height:25px;
	height:auto !important; /*fixes IE6 and 7 */
	height:25px; /*fixes IE6 and 7 */
	padding:5px;
	border:1px solid #ffffff;
	background:#8c8c8c;
	z-index:11;
	color:#FFFFFF;
}

dl.map.on a.location {
	display:block;
	position:absolute;
	text-indent:-9999px;
	background:url(images/location-dot.gif) no-repeat;
	width:10px;
	height:10px;
	outline:none;
	z-index:10;
	text-decoration:none;
}
dl.map.on a.location:hover {
	background:url(images/location-dot-over.gif) no-repeat -1px -1px;
}

.box {
border: 1px solid #406AB3;
padding: 6px;
margin-top: 10px;
padding-bottom: 0;
font-size: 90% !important;
width: 265px;
}

.box h3 {
color: #ffffff;
background-color: #406AB3;
margin: -6px;
margin-bottom: 3px;
font-size: 80%;
padding: 3px;
}

/* end map styles - point locations in .php page head */

/* ADDITIONAL FRANCHISEE PAGE STYLES */
#franchiseepics img {
margin-left: 10px;
}

#franchiseepanel {
float:right; 
margin-top: 13px; 
margin-bottom: 6px;
width: 163px; 
background-color: #ffffff; 
color: #479ed2; 
padding: 0 5px 5px 5px; 
border: 1px solid #479ed2;
}

#franchiseepanel h3, #franchiseepanel p {
font-size:75%;
margin: 0;
margin-bottom: 4px;
padding: 0; 
}

#franchiseepanel a {
font-weight: bold;
text-decoration: none;
color: #666666;
}

.franchiseepanel {
margin: 10px 0 10px 0;
width: 715px; 
background-color: transparent; 
color: #479ed2; 
padding: 10px; 
border: 1px solid #479ed2;
font-size:75%;
}