/*
Reset to sensible defaults.
Removes any browser-specific font sizes, margins and generally standardise
everything.
*/

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,button,textarea,p,blockquote,th,td, hr { 
	margin: 0;
	padding: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
fieldset,img, button {
	border: 0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style: normal;
	font-weight: normal;
}
ol,ul {
	list-style: none;
}
caption,th {
	text-align: left;
}
h1,h2,h3,h4,h5,h6 {
	font-size: 100%;
	font-weight: normal;
}
q:before,q:after {
	content: '';
}
abbr,acronym {
  border: 0;
}
a img {
  border: none;
}

/*
Page structure.
Set up the width and margins of the page, and create grid.
Also set up footer and help boxes, as they are kind of part of the grid..
*/

div.container {
  padding: 0 20px; /* Ensures that there is always at least a 20px margin */
}
div.inner-container {
  width: 946px;
  margin: 0 auto; /* Margins will expand either side to center content. */
}
div.span-1, div.span-2 {
  float: left;
  margin-right: 20px;
}
div.span-1 {
  width: 302px;
}
div.span-2 {
  width: 624px;
}
div.span-3 {
  width: 946px;
  margin: 0;
}
div.last {
  margin-right: 0 !important;
}


div#footer {
  padding: 1.083em 0 1.5em;
  border-top: 0.416em solid;
  clear: both;
  border-color: #e5e5bd;
}

/*
Default font, block, margin and border settings.
Set up the fonts to use a font-size of 12px, and a baseline of 18px, and sets
the standard font-size at 1em. Also sets up default font styles and weights.
*/

div.help-box {
  padding: 1.5em 1.5em 0 1.5em;
  border: 0.083em solid; /* 1px */
  margin: 1.416em 0; /* 17px */
}
body {
  font-size: 75%; /* 12px */
  line-height: 1.5; /* 18px */
  font-family: "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
}
a {
  text-decoration: none;
}
p, div#content ul, form {
  margin-bottom: 1.5em; /* 18px */
}
strong, a, h4, h5, h6, p.strong, p.summary a {
  font-weight: bold;
}
em {
  font-style: italic;
}
blockquote {
  padding-left: 2em;
  border-left: 1em solid;
}
h3 {
  font-size: 2em; /* 24/36px */
  margin-bottom: .667em; /* 16px */
  border-bottom: .083em solid; /* 2px */
}
h3 span {
  font-size: .5em; /* 12px */
  line-height: 1.5em; /* 18px */
  font-weight: bold;
}
/* TODO: Find a way to nest this in h3 */
span.utility { /* Sometimes a h3 will have a utility floating to the right */
  font-weight: bold;
  padding-top: 1.083em; /* 13px */
  float: right;
}
h4, .large {
  font-size: 1.166em; /* 14px */
  line-height: 1.286em; /* 18px */
}
h4 span {
  font-size: 0.857em; /* 12px */
  line-height: 1em; /* 18px */
}
/* TODO: Should be less verbose */
div.event h4 span {
  display: block;
  font-size: 1em; /* 14px */
  line-height: 1.286em; /* 18px */
}
hr {
  border: 0;
  height: 0.166em;
  margin-bottom: 1.333em;
  clear: both;
}
div#content li {
  margin-left: .25em;
  list-style: disc;
  list-style-position: inside;
}

/*
Utility classes.
*/
.no-margin {
  margin: 0 !important;
}
.no-top-margin {
  margin-top: 0 !important;
}
.left {
  float: left;
}
.right {
  float: right;
}
.left.padded {
  padding: .5em 1.5em 1.5em 0;
}
.right.padded {
  padding: .5em 0 1.5em 1.5em;
}
.small {
  font-size: 0.833em;
  line-height: 1.8em;
  margin-bottom: 1.8em;
}
.center {
  text-align: center;
}

div.thumbnail {
  background: transparent url(./../img/div.thumbnail.64x64.png) top left no-repeat;
  position: relative;
  float: left;
  padding: 2px;
  margin: 0 10px 10px 0;
  width: 64px;
  height: 64px;
  background: transparent url(./../img/div.thumbnail.64x64.png) top left no-repeat;
}
div.thumbnail img {
  position: absolute;
  width: 64px;
  height: 64px;
}
div.thumbnail.selected {
  background: transparent url(./../img/div.thumbnail.64x64.selected.png) top left no-repeat;
}
div.thumbnail.selected img {
  clip: rect(5px 59px 59px 5px);
}

div.video {
  clear: both;
}
div.video div.thumbnail {
  display: none;
}
div.video.has-thumbnail div.thumbnail {
  display: block;
  margin-top: 0.166em;
  margin-bottom: 1.416em;
}
div.video.has-thumbnail p.summary {
  padding-left: 6.2em;
}

div.img-container-summary {
  position: relative;
  float: left;
  background: transparent url(./../img/img.summary.png) top left no-repeat;
  padding: 2px;
  width: 81px;
  height: 85px;
  margin-top: 0.166em;
  margin-bottom: 1.416em;
}
div.img-container-summary.wide {
  float: none;
  background: transparent url(./../img/img.summary.wide.png) top left no-repeat;
  width: 298px;
  margin-top: 0.083em;
  margin-bottom: 0.083em;
}
div.img-container-summary img {
  position: absolute;
  margin-left: -108px;
  width: 298px;
  height: 81px;
  clip: rect(0px 189px 81px 108px);
}
div.img-container-summary.wide img {
  margin: 0;
  clip: rect(0px 298px 81px 0px);
}
.summary-image-padded {
  margin-left: 100px;
}
div.article-image, img.gallery {
  background: #efefd3;
  padding: 5px;
  font-weight: bold;
  color: #a2bd8c;
}
div.article-image.left {
  float: left;
  margin: 0 1em 1.5em 0;
}
div.article-image.right {
  float: right;
  margin: 0 0 1.5em 1em;  
}
div.article-image img {
  float: left;
}
div.article-image span {
  display: block;
  float: left;
  margin-top: 0.416em;
}

/*
Buttons.
These are slightly tricky.
*/

div.button-wrapper {
  overflow: hidden; /* Make sure floats work properly */
  width: 100%; /* Force IE to have hasLayout */
  text-align: center; /* If contains additional content, it is centered */
  padding: 1.25em 0; /* 15px 0 */
}
div.button-wrapper .center-content {
  margin-top: .25em; /* 3px */
  display: block;
}
div.button-wrapper .text-insert {
  margin-top: .25em !important; /* 3px */
  margin-right: 1em !important;
  display: block;
  float: left;
}
a.button{
  color: #a2bd8c;
  background: url(./../img/a.button.png) no-repeat center right;
  display: block;
  float: left;
  padding-right: 24px;
  margin-right: 1em; /* 12px */
}
a.button:hover {
  color: #419808;
  background-image: url(./../img/a.button.hover.png);
}
a.button.submit {
  margin-top: .333em; /* 4px */
  float: left;
  margin-left: .666em;
}
a.button span {
  background: url(./../img/a.button.span.png) no-repeat center left;
  display: block;
  padding: .25em .5em .25em 1em; /* 3px 6px 3px 12px */
  border-right: 1px solid #ffffef;
}
a.button.back {
  background: url(./../img/a.button.back.png) no-repeat center left;
  padding-right: 0;
  padding-left: 24px;
}
a.button.back:hover {
  background-image: url(./../img/a.button.back.hover.png);
}
a.button.back span {
  background: url(./../img/a.button.back.span.png) no-repeat center right;
  padding-left: .5em; /* 6px */
  padding-right: 1em; /* 12px */
  border-right: 0;
  border-left: 1px solid #ffffef;
}
a.button.align-right {
  float: right;
  margin-left: 1em; /* 12px */
  margin-right: 0;
}
a.button.green {
  color: #ccff99;
  background-image: url(./../img/a.button.green.png);
}
a.button.green span {
  background-image: url(./../img/a.button.green.span.png);
  border-color: #73b850;
}
a.button.green:hover {
  color: #fff;
  background-image: url(./../img/a.button.green.hover.png);
}
a.button.event {
  color: #fff;
  background: url(./../img/a.button.event.png) no-repeat center right;
}
a.button.event span {
  background: url(./../img/a.button.event.span.png) no-repeat center left;
  border-color: #99cc66;
}


/*
Details.
*/
div.detail {
  background-repeat: no-repeat;
  background-position: left .25em;
  padding-left: 40px;
  border-bottom: 0.166em solid;
  margin-bottom: 1.333em;
}
div.info {
  background-image: url(./../img/div.detail-info.png);
}
div.address {
  background-image: url(./../img/div.detail-address.png);
}
div.url {
  background-image: url(./../img/div.detail-url.png);
  margin-top: -.75em;
  padding-top: .75em;
}
div.file {
  background-image: url(./../img/mime-types/all.png);
  background-position: 0.333em 0.125em;
  border-bottom: none;
  margin-bottom: 0;
}


div.video-player {  
  margin-bottom: 1.5em;
  text-align: center;
}


/*
Form elements.
*/
form {
  overflow: hidden;
  width: 100%;
}
form.search input.text {
  float: left;
}
label {
  display: block;
}
label.required, span.required label {
  font-weight: bold;
}
input.text, span.text input, textarea {
  font-size: 1em;
  padding: .25em;
  border: .25em solid;  
  border-color: #efefd3;
  font-weight: bold;
  margin: 0.25em 0 .5em;
}
input.text, span.text input {
  width: 200px;
}
textarea {
  width: 604px;
}
form ul, span.radio-buttons {
  margin: .75em 0;
  display: block;	
}
form li {
	margin: 0 .5em 0 0;
	list-style: none !important;
}
form ul label, span.radio-buttons label {
/*  display: inline;*/
}
input.submit {
  margin-bottom: 1.5em;
  font-size: 1em;
  display: block;
}
.error {
  color: #f00;
}
.error ul, .error li {
  display: inline;
}

/*
Featured event.
This is a special case which only appears on the homepage.
*/
div.featured-event {
  background-color: #99cc66;
  border: 0.416em solid #669933;
  margin: 0.5em 0 1.5em 0;
}
div.featured-event div.button-wrapper {
  padding-bottom: 0.833em;
  padding-left: 0.75em;
  width: 282px; /* Nasty width hack - IE6 just won't play ball */
}
div.featured-event h3 {
  position: relative;
  background: url(./../img/h4.featured-event.png) no-repeat;
  text-indent: -3000px;
  height: 31px;
  border: none;
  margin: 0;
  font-size: .5em;
}
div.featured-event img, div.featured-event embed, div.featured-event object {
  display: block;
}
div.featured-event img {
  margin: 9px;
}
div.featured-event h4, div.featured-event p {
  color: #fff;
  padding: 0 .75em;
}
div.featured-event p {
  padding: 0 .9em !important;
}
div.featured-event h4 span {
  font-size: 1em;
  line-height: 1.266em; /* 18px */
  color: #fff;
  font-weight: normal;
  display: block;
}



/* Tags */

div.tag-wrapper {
  overflow: hidden; /* Force hasLayout */
  width: 100%; /* Force hasLayout */
  margin: 0.25em 0 1.25em; /* 3px 12px 15px 0 */
}
div.tag-wrapper a {
  font-weight: bold;
  color: #a2bd8c;
  background: url(./../img/a.tag.png) no-repeat center right;
  display: block;
  float: left;
  padding-right: 1em;
  margin: 1em 1em 0 0; /* 0 12px 15px 0 */
}
div.tag-wrapper a span {
  background: url(./../img/a.tag.span.png) no-repeat center left;
  display: block;
  padding: .25em 0 .25em 1em; /* 3px 6px 3px 12px */
}
div.tag-wrapper a:hover {
  color: #419808;
}
div.tag-wrapper a.selected {
  background-image: url(./../img/a.tag.selected.png);
  color: #fff;
}
div.tag-wrapper a.selected span {
  background-image: url(./../img/a.tag.selected.span.png);
}

/* RSS */

a.rss {
  text-indent: -3000px;
  display: block;
  width: 27px;
  height: 15px;
  background: url(./../img/a.rss.png) no-repeat;
}

/* Navigation */

ul#top-navigation {
  font-size: 1.166em;
  line-height: 2.072em;
  font-weight: bold;
}
ul#top-navigation a {
  margin-right: 1em;
}
div#footer ul, div#footer p {
  font-size: 0.833em;
  line-height: 1.8em;
  margin-bottom: 1.8em;
}
div#footer h4 {
  font-size: 1.4em;
}

/* Masthead & Navigation */

h1 a{
  display: block;
  width: 1000px;
  height: 72px;
}
h1 span {
  display: none;
}
h2 {
  position: relative;
  text-indent: -3000px;
  height: 78px;
  margin-left: -27px;
}
body.homepage div#splash {
  margin: 0 0 18px -27px;
  padding-left: 27px;
  background: url(./../img/enterprising-britain/body.homepage.div.jpg) 0 132px no-repeat;
}
body.homepage h2 {
  height: 190px;
  background: url(./../img/h2.homepage.png) no-repeat;
}


#top-navigation {
  margin-top: 1px;
  height: 29px;
  background: url(./../img/ul.top-navigation.png) no-repeat;
}
ul.horizontal-navigation li {
  display: inline;
}
div.navigation-column {
  display: inline;
  float: left;
  width: 100px;
  margin-right: 18px;
}
p#copyright {
  clear: both;
}
div.logos {
  text-align: right;
}
div.logos img {
  vertical-align: middle;
  margin-left: 40px;
}
.clear {
  clear: both;
}

/*
Accessibility.
*/

.access {
  display: none;
}



/* Colours */

h1 a {
  background: url(./../img/h1.png) no-repeat;
  position: relative;
  margin-left: -56px;
}
p a:hover, div#footer a:hover, h3 span a:hover, h4 span a:hover, h5 span a:hover {
  color: #419808;
  border-bottom: 1px dotted #a2bd8c;
}


/* Calendar */

p.calendar {
  width: 3.75em;
  height: 4.333em;
  float: left;
  text-align: center;
  background: url(./../img/p.calendar.png) center no-repeat;
  margin: 0.083em 1em 1em 0;
}
p.calendar.right {
  float: right;
  margin-left: 1em;
  margin-right: 0;
}
p.calendar span.month {
  display: block;
  font-weight: bold;
  color: #fff;
  font-size: 0.833em;
  margin-top: 1.1em;
}
p.calendar span.day {
  display: block;
  font-size: 1.499em;
  margin-top: -0.166em;
}
.calendar-padded {
  margin-left: 4.75em;
}
p.calendar.featured {
  background: url(./../img/p.calendar.large.png) center no-repeat;
  height: 5.999em;
  width: 5.166em;
  line-height: inherit;
}
p.calendar.featured span.month, p.feature {
  font-size: 1.166em;
  margin-top: 1em;
}
p.calendar.featured span.day {
  font-size: 2.333em;
}



/*
Colours.
*/

body, div.help-box h3, input.text {
  color: #333;
}
a, h3, h4, h5, span.radio-buttons {
  color: #419808;
}
h3 span, h3 span a, h4 span, h4 span a, h5 span, h5 span a, p.summary a {
  color: #a2bd8c;
}
blockquote {
  color: #666;
  border-color: #efefd3;
}
body {
  background-color: #ffffef;
}
div#footer {
  background-color: #f5f5de;
}
#top-navigation a {
  color: #fff;
}
hr {
  background-color: #f4f4e5;
  color: #f4f4e5;
}
h3, div.detail {
  border-color: #f4f4e5;
}
div.help-box {
  background: #f7f7e1 url('./../img/div.help-box.png') top right no-repeat;
}
div.help-box, div.help-box h3 {
  border-color: #ededd6;
}

body {
/*  background: url(./../img/grid.png) !important;*/
  background-repeat: repeat-x;
  background-image: url(./../img/body.png);
}
body.homepage {
  background-image: url(./../img/body.homepage.png);
}
div#footer {
  background-repeat: repeat-x;
  background-image: url(./../img/div.footer.png);
}
body.news h2 {
  background-image: url(./../img/h2.news.png);
}
body.people h2 {
  background-image: url(./../img/h2.people.png);
}
body.events h2 {
  background-image: url(./../img/h2.events.png);
}
body.fyp h2 {
  background-image: url(./../img/h2.fyp.png);
}
body.videos h2 {
  background-image: url(./../img/h2.videos.png);
}
body.photos h2 {
  background-image: url(./../img/h2.photos.png);
}
body.about h2 {
  background-image: url(./../img/h2.about.png);
}
body.contact h2 {
  background-image: url(./../img/h2.contact.png);
}
/**/

.photo-fade {
	
}
.photo-frame {
	background: url(./../img/div.photo-frame.png) no-repeat;
	width: 614px;
	height: 280px;
	margin: 10px 0;
	padding: 10px;
	position: relative;
}
.photo-frame a {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 624px;
	height: 300px;
	z-index: 10;
}
.photo-frame img {
	z-index: 11;
}
.photo-frame a span {
	display: none;
	background-color: rgba(255, 255, 255, .9); background-color: rgb(255, 255, 255);
	right: 0;
	top: 20px;
	position: absolute;
	padding: 5px 15px;
}
.photo-frame a:hover span {
	display: block;
}
.photo-frame h3 {
	background-color: rgba(255, 255, 255, .9); background-color: rgb(255, 255, 255);
	color: #000;
	position: absolute;
	bottom: 35px;
	left: 10px;
	padding: 0 15px 0 10px;
	border: none;
}
.photo-frame h4 {
	background-color: rgba(255, 255, 255, .9); background-color: rgb(255, 255, 255);
	color: #000;
	position: absolute;
	bottom: 20px;
	left: 10px;
	padding: 5px 15px 5px 10px;
	border: none;
}