/*********************************************************/
/* gross layout */

* {
	margin: 0;
	padding: 0;
}

/* Content is placed in divs */
/* style 1: main, additional, taster (home page) */
/* style 2: main, alternate (info pages) */
/* style 3: wide, taster (tag output page) */

/* Within each of these divs, the actual content is enclosed in further divs */
/* .content - coloured box */
/* .secondary - internal navigation at top of main */
/* .tertiary - internal navigation at foot of main */

.main, .wide, .tags, .footer { clear:both; }

/* individual coloured boxes with content in */
.content, .site {
	padding: 0.7em;
	margin: 0.7em;
}

div[title="last"] {
	padding: 0.7em 0.7em 0.7em 0.7em;
	margin: 0.7em;
}

.flash {
 margin: 1.1em 2.2em 1.1em 2.2em;
}

.left {
	position: relative;
	float: left;
	margin-right: 0.7em;
}

.left2 {
	position: relative;
	float: left;
	margin-right: 7em;
}

.right {
	position: relative;
	float: right;
	margin-left: 0.7em;
}

img.inline { 
	display: inline; /* thanks to wordpress codex for this tip */
	margin-bottom: 0.7em;
}

.clear { clear: both; }

#topimage {
	position: relative;
	float: left;
	padding-left: 0.7em;
	margin-bottom: -1em;
}

#header {
	background: #ffffff;
	margin-left: 0.7em;
	margin-top: -0.7em; /* I do not know why, but it runs the white up to the top! */
	padding-top: 0.5em;
}

/* end gross layout */
/*********************************************************/
/* typography and fine layout */


h1, h2 {
	font-size: 0.9em;
}

h3, .item {
	margin: 0.5em 0 0.5em 0;
	padding-top: 0.7em;
	clear: both;
	position: relative;
}

/* when we don't want a horizontal bar */
h3.favourite {
	margin: 0;
	padding: 0;
	clear: both;
	border: 0;
	font-size: 1em;
}

h4 {
 	padding-top: 0.7em;
}

h5 {
	font-size: 0.9em;
}

body, textarea, select {
	font-family: "trebuchet ms", verdana, sans-serif, serif;
}

#navigation3 { 
	font-size: 0.8em; 
	font-weight: bold;
	margin-bottom: 0.4em;
	padding-bottom: 0.4em;
	background-color: #fff;
	margin-top: 0.3em;
} 

p, table, li, input, button, option, textarea {
	font-size: 1em;
}

input:focus, input:active, input:hover,
button:focus, button:active, button:hover,
select:focus, select:active, select:hover,
textarea:focus, textarea:active, textarea:hover
{
	background-color: #fcefb8; /* 50 per cent tint pantone 120C */
}

input[type="submit"], input[type="reset"] {
	margin-bottom: 0.4em;
}

p {
	margin-bottom: 0.5em;
}

.main p {
	margin-right: 0.5em;
}

ul {
 margin-bottom: 0.5em;
}

.main ul, .alternate ul, .wide ul {
 margin-left: 2em;
 margin-right: 1.5em;
}

.publication {
 font-style: italic;
}

/* firefox and IE need this; opera and safari don't */
a img {
	border-style: none;
}

.content > a > img { 
	margin-right: 1em;
}


.additional img, .taster img { margin: 0.7em 0 0.7em 0; }

.publication { font-style: italic; }

.content, .site {
	border-style: solid;
/*	border: .2em; */
}

.footer ul {
	list-style: none;
}

.footer li {
	display: inline;
	padding-right: 0.5em;	
}

.footer .content {

	padding-top: 1.5em;
}

#header-links {
	background-color: #fff;
	color: #000;
}

#header-links ul {
	list-style: none;
	padding-left: 0.7em;
	padding-top: 0.3em;
}

#header-links li {
	display: inline;
	padding-right: 0.5em;
}

#header-links a {
	color: #990066;
}

ul#navigation3 {
	clear: both;
	float: left;

	list-style: none;
	margin-left: 0.4em;
}

ul.icons.really {
	margin-left: 2em;
}

#navigation3 li {
	display: inline;
	padding-right: 0.4em;
	float: left;
	text-decoration: none;
}

#navigation3 a {
	color: #000;
	display: block;
	background-repeat: no-repeat;
	background-position: center center;
	vertical-align: bottom;
	padding: 4.5em 0.4em 0 0.4em;
	text-decoration: none;
	background-color: #fff;
}

.validation {
	position: relative;
	margin-top: 1.5em;
	float: right;
/*	display: none;*/ /* don't frighten the horses */
}

blockquote p {
	margin: 0 1em 0.5em 1em;
}

form img.stayput {
	margin: 0 0 0 0;
}

.additional form p {
	line-height: 2em;
}

ul.games {
	list-style: none;
}

.phrase-start {
	font-size: 3em;
}

.phrase-end {
	font-size: 1.7em;
}

.taster ul {
	list-style: none;
}

/* what you gets when you change the text ccolout to be
   the same as the box colour */
.aaaargh {
	padding: 0.5em;
	font-size: 1.7em;
	background-color: #FAE017;
	color: black;
}

/* contact us form */
.label {
	clear: both;
	float: left;
	width: 12em;
	padding: 0 0.7em 0.5em 0;
	text-align: right;
}

.input {
	float: left;
	margin-bottom: 1em;
}

/* Some space between send and reset buttons in contact us form */
.spaced {
	margin-left: 3em;
	margin-bottom: 0.5em;
}

#hidden-accesskeys {
	display: none;
}

.hidden {
	display: none;
}

/* in your area pages */
ul.icons {
	position: relative;
	list-style: none;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

ul.icons > li {
	margin: 0 0 0 0;
	padding: 0 0 0 0;

}

ul.sitemap {
	margin-top: 0.7em;
	padding-right: 10em;
}

ul.sitemap li {
	margin-top: 0.3em;
}


/* end typography and fine layout */
/*********************************************************/
/* internal navigation */
.secondary ul {
 list-style: none;
}

.secondary li.active {
 list-style: disc;
}
/* end internal navigation */
/*********************************************************/
/* tags */

.tags li {
	display: inline;
	list-style: none;
	line-height: 1.8em;
	padding-right: 0.2em;
}

.tag-most-popular { font-size: 2em; }
.tag-more-popular { font-size: 1.6em; }
.tag-average-popular { font-size: 1.3em; }
.tag-less-popular { font-size: 1em; }

/* end tags */
/*********************************************************/
/* colours */
/* fixed colours */

.enquire-purple {
/*	color: #A10082 */
	color: #990066; /* wcag-purple */
}

#navigation3 a {
 color: #000000;
}

h3, .item {
 border-style: solid;
 border-width: 2px 0 0 0;
}

/* end fixed colours */
/* colours controlled by style sheets */

/* TODO ... investigate whether this is used, and why */
.unit > h3 {
	color: #000000; 
}

/* end colours controlled by style sheets */
/* end colours */
/*********************************************************/