/* CSS Document */

/*Style sheet for the header and footer template*/

/*This style effects virtually everything within page, as all the page content sits within the body tag*/
BODY {PADDING: 0; MARGIN: 0; font-family: Verdana, Arial, Helvetica, sans-serif;}

/*This box contains the main page content*/
.container {min-height: 300px; width: 760px; margin: 0 auto; overflow: visible;}

/*This is the style for all links in the main page content*/
.container a, .container a:link, .container a:visited, .container a:active {text-decoration: underline;}	

.navigation {height: 28px; width: 750px; margin: 0 auto;}
.navigation ul {margin: 0; padding: 0;}
.navigation li {margin: 0; padding: 0; list-style: none; font-size: 70%; text-align: center; float: left; padding: 0 2px 0 0;}

.navigation a:link, .navigation a:visited, .navigation a:active {text-decoration: none; float: left; padding: 0.8em 0 0 0; line-height: 0.9em;}
.nav-generic, .nav-generic-current {width: 82px; height: 1.7em;}
.nav-services, .nav-services-current {width: 122px; height: 1.7em; }
.nav-generic2, .nav-generic2-current {width: 143px; height: 1.7em;}

.nav-generic:hover, .nav-generic-current {width: 82px;}
.nav-services:hover, .nav-services-current {width: 122px;}
.nav-generic2:hover, .nav-generic2-current {width: 143px;}

.profile-top {width: 542px; height: 26px; background:  url("../images/staff/profile_top.jpg") transparent no-repeat 20px 0; margin: 20px 0 0 0;}
.profile {border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; width: 520px; margin: 0 20px 20px 20px; overflow: hidden;}
.profile-text {width: 385px;}
.profile-photo {width: 125px; margin: 0 0 0 10px;}

.minus {margin: -10px 0 10px 15px;}

.bottom-bar {height: 32px; width: 750px; margin: 0 auto; padding: 5px; clear: both;}
.bottom-bar ul {margin: 10px 0 0 0; _margin: 15px 0 0 0; padding: 0;}
.bottom-bar li {margin: 0; padding: 0; list-style: none; font-size: 70%; text-align: center; float: left; padding: 0 10px 0 14px; background:  url("../images/bottombar_bullet.gif") transparent no-repeat left 5px;}
.bottom-bar-hide {background-image: none !important; padding: 0 10px 0 0 !important;}
.bottom-bar a {text-decoration: none;}

.submenu {width: 187px; margin:0 5px 0 0; _margin:0 3px 0 0; padding: 0 0 0 5px; min-height: 384px; _height: 384px;}
.main {width: 560px; margin: 15px 0 0 0;}
.search {margin: 6px 0 -3px 0; width: 100%; height: 30px;}
.search-box {margin: 0; width: 138px; float: left;}
.button {width: 28px; float: left; margin: 0 0 0 5px; padding: 0;}

.submenu h3 {margin: 0 5px 0 0; _margin: 0; border-top: none; padding: 0;}
.submenu P {padding: 0; margin: 7px 5px 5px 0; font-size: 70%; line-height: 160%; padding: 5px 0 0 0;}
.submenu-photo {text-align: center; margin: 10px 0 0 -7px; _margin: 10px 0 0 -4px;}
.submenu a img {border: none;}
.readmore {margin: 0 0 0 5px;}

.submenu ul {margin: 0 0 0 -4px; padding: 0; list-style: none; line-height: 100%; clear: both;}/*These are important for the spacing around lists*/
.submenu ul ul {margin: -5px 0 0 0; padding: 0; list-style: none; line-height: 123%;}/*These are important for the spacing around lists - line-height set to 123% to stop firefox showing a 1px line of background colour*/

div.submenu ul li {font-size: 70%;}
div.submenu ul ul li {font-size: 85%;}

/*These control the amount of space around each menu item (navigation, sub-navigation, sub-sub-navigation, the !important is used to change the colour of text otherwise a white background is being used with white text!*/
div.submenu ul li a {padding: 5px; display: block;}
div.submenu ul ul li a {padding: 4px 5px 4px 15px; display: block;}


.logos {margin: -6px 0 0 0;}
.white {font-size: 1%;}

.quick-links h3 {margin: 5px 5px 5px 3px; border-top: none; padding: 0;}
.quick-links {width: 192px; min-height: 100px; margin: 0 7px 10px 5px; _margin: 0 7px 0 3px;}
.quick-links ul {margin: 0 0 0 5px !important; padding: 0;}
.quick-links li {padding: 0 0 0 12px !important; line-height: 185% !important; background:  url("../images/quicklinks_bullet.gif") transparent no-repeat 0 7px !important;}


a.gallery {display:inline-block; text-decoration:none;}
a.slidea {margin: 18px 2px 0 0; float: left;}
a.slideb { margin: 0 2px 0 0; _margin: -15px 2px 0 0; float: left;}
a.slidec { margin: 18px 2px 0 0; _margin: -16px 2px 0 0; float: left;}
a.slided {margin: 0 2px 0 0; _margin: -50px 2px 0 0; float: left;}
a.slidee {margin: 18px 2px 0 0; _margin: -50px 2px 0 0; float: left;}
a.slidef {margin: 0 2px 0 0; _margin: -84px 2px 0 0; float: left;}



.recent {width:535px; height: 130px; margin:0 0 0 5px;}
.recent ul li {margin: 0 !important; padding: 0 !important; list-style-type: none !important; background: none !important; font-size: 112% !important; line-height: 100% !important;}

.news-image {margin: -128px 0 0 5px;}
.news-box {width: 165px; height: 128px; background: #fff; color: #333; position: relative; top: 0; left: 5px; filter: alpha(opacity=70); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=70); -moz-opacity: 0.70; opacity:0.7; z-index: 100;}
.news-box p {margin: 0; padding: 3px; font-weight: bold;}

.news-photos {width: 117px; height: auto; margin: 0 10px 0 5px; _margin: 0 10px 0 3px; /*background: url(../images/news_background.gif) #fff no-repeat 0 3px;*/ font-size: 70%;}
.news-photos ul, .recent ul {margin: 0; padding: 0;}
.news-photos ul li {margin: 0 0 1px 0 !important; _margin: 0 0 -1px 0 !important; padding: 2px 0 0 0 !important; list-style-type: none !important;  background: url() !important; }
.news-photos a {text-decoration: none !important;}
.special {margin: 0 0 2px 0;}
.special2 {margin: 0 0 15px 0;}


.photo-medium  p, .photo-small  p, .photo-large  p {margin: 0; padding: 4px; font-size: 60%;}

.white-background {background: #fff;}


.image-gallery {width: 480px; height: auto; margin: 15px 0 0 47px;}
.image-gallery ul {margin: 0; padding: 0;}
.image-gallery ul li {list-style-type: none !important; float: left; margin: 0 2px 2px 0 !important; _margin: 0 2px 0 0 !important; background: url() !Important;}
.image-gallery-h3 {margin: 5px 30px 10px 47px;}
.image-gallery-date {margin: -10px 0 10px 15px;}
.image-gallery-controls {width: 470px; height: auto; position:relative; left: 47px; bottom: 23px; text-align: center; font-size: 70%; padding: 5px; background: #fff; filter: alpha(opacity=80); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80); -moz-opacity: 0.80; opacity:0.8; z-index: 100;}


.main ul, .main ol {margin: 0; padding: 0;}
.main ul li, .main ol li {font-size: 70%; line-height: 140%; margin: 0; padding: 0 0 10px 30px; list-style: none;}

/*sets the text size for the h1 text, main heading top right hand corner*/
h1 {font-size: 120%; padding: 0.8em 0.2em 0 0; margin: 0 0 0 5px; line-height: 1.1em; font-family:Arial, Helvetica, sans-serif; position: absolute; top: 66px; font-weight: bold; left: 0;}

.h1-smaller {font-size: 80%; font-weight: normal;}


.h2-smaller {font-size: 80%; font-weight: normal;}


/*sets the styles for H4, H5, H6, H7, H8, H9, H10*/
h4, h5, h6, h7, h8, h9, h10 {font-size: 70%; font-weight: bold; margin: 15px 10px 10px 10px;}

/*sets the style for paragraph text*/
P {PADDING: 0; MARGIN: 0 5px 10px 15px; font-size: 70%; line-height: 140%;}

/*sets a border of zero for all images*/
img {border: 0;}

/*sets the font style to bold*/
.bold {font-weight: bold;}

/*sets a div to clear any divs above it*/
.clear {CLEAR: both;}

/*floats the div to the right*/
.right {float: right;}

/*floats the div to the left*/
.left {float: left;}

.margin-bottom {margin: 0 0 10px 0;}

.vertical-align {vertical-align: top;}

/*sets the form margins to zero*/
.form {margin: 0; padding: 0;}

.margin {margin: 15px 5px 10px 15px;}

table {margin: 10px 0 10px 15px; width: 525px; font-size: 70%; text-align: center;}
table table {font-size: 100%;}
table p {font-size: 100%;}

th {padding: 5px;}

td {border-bottom: 1px solid #ccc; padding: 7px 2px 7px 2px;}

.photo-small-left p, .photo-small-right p, .photo-medium-left p, .photo-medium-right p, .photo-large-left p, .photo-large-right p {margin: 0; padding: 0;}

.saxon {width:500px; height: 680px; background: url(../images/saxon.jpg) no-repeat 0 0; margin: 0 0 0 33px;}
.roman {width:500px; height: 680px; background: url(../images/romanmap.jpg) no-repeat 0 0; margin: 0 0 0 33px;}
.medieval {width:500px; height: 700px; background: url(../images/medieval_leicester_sites_000.jpg) no-repeat 0 0; margin: 0 0 0 33px;}
.saxon a, .roman a, .medieval a {text-decoration: none !important; font-size: 30%;}
.saxon em, .roman em, .medieval em {visibility: hidden;}
.saxon1:hover, .saxon2:hover, .saxon3:hover, .saxon4:hover, .roman1:hover, .roman2:hover, .roman3:hover, .roman4:hover, .roman5:hover, .roman7:hover, .roman8:hover, .roman9:hover, .medieval1:hover, .medieval2:hover, .medieval3:hover, .medieval4:hover, .medieval5:hover, .medieval6:hover, .medieval7:hover {filter: alpha(opacity=80); filter: progid:DXImageTransform.Microsoft.Alpha(opacity=80); -moz-opacity: 0.80; opacity:0.8;}


.saxon1 {width: 89px; height: 80px; top: 601px; left: 318px; display: block; position: relative;}
.saxon1:hover {background: url(../images/oxford_street.gif) transparent no-repeat 0 0; width: 200px;}

.saxon2 {width: 86px; height: 116px; top: 77px; left: 210px; display: block; position: relative;}
.saxon2:hover {background: url(../images/highcross_street.gif) transparent no-repeat 0 0; width: 200px;}


.roman1 {width: 74px; height: 71px; top: 0px; left: 236px; display: block; position: relative;}
.roman1:hover {background: url(../images/sanvey_gate.gif) transparent no-repeat 0 0; width: 200px;}

.roman2 {width: 70px; height: 90px; top: -14px; left: 196px; display: block; position: relative;}
.roman2:hover {background: url(../images/vine_street.gif) transparent no-repeat 0 0; width: 170px;}

.roman3 {width: 86px; height: 51px; top: -9px; left: 210px; display: block; position: relative;}
.roman3:hover {background: url(../images/highcross_street_roman.gif) transparent no-repeat 0 0; width: 110px; height: 95px;}

.roman4 {width: 53px; height: 73px; top: 14px; left: 55px; display: block; position: relative;}
.roman4:hover {background: url(../images/westbridge_wharf.gif) transparent no-repeat 0 0; width: 174px; height: 100px;}

.roman5 {width: 22px; height: 27px; top: 23px; left: 265px; display: block; position: relative;}
.roman5:hover {background: url(../images/st_nicholas.gif) transparent no-repeat 0 0; width: 132px; height: 50px;}

.roman7 {width: 41px; height: 53px; top: 12px; left: 133px; display: block; position: relative;}
.roman7:hover {background: url(../images/stibbe.gif) transparent no-repeat 0 0; width: 120px; height: 53px;}

.roman8 {width: 35px; height: 27px; top: -53px; left: 349px; display: block; position: relative;}
.roman8:hover {background: url(../images/littlelane.gif) transparent no-repeat 0 0; width: 81px; height: 33px;}

.roman9 {width: 17px; height: 17px; top: -98px; left: 173px; display: block; position: relative;}
.roman9:hover {background: url(../images/cumberland.gif) transparent no-repeat 0 0; width: 115px; height: 32px;}


.medieval1 {width: 60px; height: 18px; top: 18px; left: 197px; display: block; position: relative;}
.medieval1:hover {background: url(../images/medieval1.gif) transparent no-repeat 0 0; width: 160px; height: 50px;}

.medieval2 {width: 69px; height: 62px; top: 21px; left: 254px; display: block; position: relative;}
.medieval2:hover {background: url(../images/medieval2.gif) transparent no-repeat 0 0; width: 172px;}

.medieval3 {width: 60px; height: 81px; top: 8px; left: 219px; display: block; position: relative;}
.medieval3:hover {background: url(../images/medieval3.gif) transparent no-repeat 0 0; width: 166px;}

.medieval4 {width: 64px; height: 69px; top: 13px; left: 229px; display: block; position: relative;}
.medieval4:hover {background: url(../images/medieval4.gif) transparent no-repeat 0 0; width: 175px;}

.medieval5 {width: 77px; height: 47px; top: 9px; left: 227px; display: block; position: relative;}
.medieval5:hover {background: url(../images/medieval5.gif) transparent no-repeat 0 0; width: 181px;}

.medieval6 {width: 19px; height: 24px; top: 64px; left: 275px; display: block; position: relative;}
.medieval6:hover {background: url(../images/medieval6.gif) transparent no-repeat 0 0; width: 132px; height: 50px;}

.medieval7 {width: 45px; height: 68px; top: 51px; left: 83px; display: block; position: relative;}
.medieval7:hover {background: url(../images/medieval7.gif) transparent no-repeat 0 0; width: 157px;}