/* Generic Default CSS */

/* TITLE OF SCHOOL GOES IN HERE */

/* PrimarySchool CSS v 2.0 */
/* Basic CSS Framework */

/* 
(c) 2007 Robert Willie.
01 Feb 2007.
All Rights Reserved
This CSS cannot be resold, redistributed or reused without express permission.
Contact: rob@primarysite.net
Author: Robert Willie


BEST VIEWED IN NOTEPAD ++  		http://notepad-plus.sourceforge.net/

Table of Contents 	

1. 	General page layout		
2.	Page Titles		
3.	Accessibility and General Navigation		
4.	Home page elements	
5.	Kids' Zone			
6.	Classpages
7.	Primarysite CMS specific styles
	
Tip: To quickly jump to a section, search for the section number in brackets. Nb. To jump to Page Titles, search for (2).


/* Navigation Styles 

Firstly we need to link to our nav type :-)
Delete the link to stylesheet that is not required - Edit the stylesheet that is required. */

@import url(../styles/popup_nav.css);





/*(1)  General Page layout */ 

html,body{
margin: 0;
padding: 0;
font-family: Arial, Helvetica, sans-serif;
font-size: small;
color:#05284B;
background-color: #9DCEFF;
}

#header{
height: 177px;
background-image: url(../images/header.gif);
background-repeat: no-repeat;
}

#homeheader{
height: 177px;
background-image: url(../images/homeheader.gif);
background-repeat: no-repeat;
}

/* #container and #container2 are wrappers that contain col-one and col-two.

#container is for the main horizontal graphic that goes down the page (Y axis). 
The other containers are available so that you can place additional graphics such as a watermark, or an image at the bottom of the page that extends under the footer.
http://www.westfield-inf.leics.sch.uk/ uses this technique for the bear's head at the base of the navigation.
More containers can be added for extra background images, but the basic framework caters for 2.*/

#container{
margin: 0px auto;
width: 791px;
position: relative;
top: 0px;
background-image: url(../images/container_bg.gif);
background-repeat: repeat-y;
}

#homecontainer{
margin: 0px auto;
width: 791px;
position: relative;
top: 0px;
background-image: url(../images/homecontainer_bg.gif);
background-repeat: repeat-y;
}

#container2{
margin: 0px auto;
width: 791px;
position: relative;
background-image: url(../images/watermark.gif); 
background-repeat: no-repeat;
background-position: top right;
top: 0px;
}

#homecontainer2{
margin: 0px auto;
width: 791px;
position: relative;
background-image: none; 
background-repeat: no-repeat;
background-position: top right;
top: 0px;
}



/* #col-one and #col-two are the main content areas. #col-one is used to provide a smaller box (for navigation), while #col-two is used to provide a bigger one for content.
#col-one has absolute positioning, while #col-two is relative to the document, sitting below the head and above the footer.
 
The only key thing to know about their usage is that the margins on #col-two need to be set with #col-one in mind. Also, the min-hight of #col-two dictates the overall basic height of the page.

So, if #col-one is positioned on the left, and 200px wide, then the left margin of #col-two will need to be at least 200px, else it will go under #col-one. You may also need to adjust the min-height of #col-two in order to accomodate the height of #col-one.

For some designs, you may also need to place a background image in #col-one.
*/

#col-one{
position: absolute;
top: 176px;
left: 0px;
width: 155px;
margin: 0px 0px 0px 0px;
padding: 0px;
padding-top: 0px;
height: 377px;
background-image: url(../images/nav_bk.jpg);
background-repeat: none;
}



#col-two{ 
top: 0px;
margin:  0px 15px 20px 170px;
padding: 0px 0px 0px 0px;
position: relative;
min-height: 340px; 
}

#homecol-two{ 
top: 0px;
margin:  0px 15px 20px 185px;
padding: 0px 0px 0px 0px;
position: relative;
min-height: 367px; 
}


#footer{
height: 33px;
clear: both;
background-image: url(../images/footer.gif); 
background-repeat: no-repeat;
}

#homefooter{
height: 17px;
clear: both;
background-image: none; 
background-repeat: no-repeat;
}


/* Randoms is the container for an "on refresh" image generator. 
It's not used on many sites, but is often placed in the header. 

An include file is used:  
<MM:BeginLock translatorClass="MM_SSI" type="ssi_comment" orig="%3C!-- #include file=%22../special_includes/randoms.asp%22 --%3E" fileRef="../special_includes/randoms.asp" depFiles="file:///C|/Documents and Settings/rossoliver/My Documents/oldpc/schoolsites/localsites/parish/special_includes/randoms.asp"><div id="randoms" class="hide_from_access">
<%
RANDOMIZE
Small = 1
High = 6
RandomNumber = INT((High-Small+1)*Rnd+Small)
SELECT CASE RandomNumber
CASE "1"%>
<img src="../images/randoms/1.jpg" alt="Anytown Primary School" title="Anytown Primary School"/>
<%CASE "2"%>
<img src="../images/randoms/2.jpg" alt="Anytown Primary School" title="Anytown Primary School"/>
<%CASE "3"%>
<img src="../images/randoms/3.jpg" alt="Anytown Primary School" title="Anytown Primary School"/>
<%CASE "4"%>
<img src="../images/randoms/4.jpg" alt="Anytown Primary School" title="Anytown Primary School"/>
<%CASE "5"%>
<IMG SRC="../images/randoms/5.jpg" alt="Anytown Primary School" title="Anytown Primary School"/>
<%CASE "6"%>
<img src="../images/randoms/6.jpg" alt="Anytown Primary School" title="Anytown Primary School"/>
<%END SELECT%>
</div></><MM:EndLock>

so to change the images used, please edit randoms.asp */

#randoms{
z-index: 100;
}

/*(2) Page Titles 

I've created styles for the basic set of pages. For additional page titles, please add to these styles, following the same syntax.
Firstly we declare the images that each title will use - I've kept it alphabetical so they are easy to find */

#title_brainbuilders{
background: url(../images/titles/brainbuilders.gif) no-repeat;
}
#title_calendar{
background: url(../images/titles/calendar.gif) no-repeat;
}
#title_classpages{
background: url(../images/titles/classpages.gif) no-repeat;
}
#title_clubs{
background: url(../images/titles/clubs.gif) no-repeat;
}
#title_contact{
background: url(../images/titles/contact.gif) no-repeat;
}
#title_curriculum{
background: url(../images/titles/curriculum.gif) no-repeat;
}
#title_english{
background: url(../images/titles/english.gif) no-repeat;
}
#title_friendsreunion{
background: url(../images/titles/friendsreunion.gif) no-repeat;
}
#title_gallery{
background: url(../images/titles/gallery.gif) no-repeat;
}
#title_games{
background: url(../images/titles/games.gif) no-repeat;
}
#title_governors{
background: url(../images/titles/governors.gif) no-repeat;
}
#title_guestbook{
background: url(../images/titles/guestbook.gif) no-repeat;
}
#title_history{
background: url(../images/titles/history.gif) no-repeat;
}
#title_keyinformation{
background: url(../images/titles/keyinformation.gif) no-repeat;
}
#title_kidszone{
background: url(../images/titles/kidszone.gif) no-repeat;
}
#title_ks1links{
background: url(../images/titles/ks1links.gif) no-repeat;
}
#title_ks2links{
background: url(../images/titles/ks2links.gif) no-repeat;
}
#title_letters{
background: url(../images/titles/letters.gif) no-repeat;
}
#title_maths{
background: url(../images/titles/maths.gif) no-repeat;
}
#title_news{
background: url(../images/titles/news.gif) no-repeat;
}
#title_newsletters{
background: url(../images/titles/newsletters.gif) no-repeat;
}
#title_parents{
background: url(../images/titles/parents.gif) no-repeat;
}
#title_pta{
background: url(../images/titles/pta.gif) no-repeat;
}
#title_science{
background: url(../images/titles/science.gif) no-repeat;
}
#title_staff{
background: url(../images/titles/staff.gif) no-repeat;
}
#title_tour{
background: url(../images/titles/tour.gif) no-repeat;
}
#title_welcome{
background: url(../images/titles/welcome.gif) no-repeat;
}
#title_whoswho{
background: url(../images/titles/whoswho.gif) no-repeat;
}
#title_yeargroups{
background: url(../images/titles/yeargroups.gif) no-repeat;
}
#title_memoriesbrowse{
background: url(../images/titles/memoriesbrowse.gif) no-repeat;
}
#title_memoriesalbum{
background: url(../images/titles/memoriesalbum.gif) no-repeat;
}

/* Then we add the positional declarations:

The syntax is as follows:

In the Xhtml:

<h2 id=title_welcome> Welcome </h2>

In the CSS:

height = height of your widest image,
width =  width of your largest image,
margin = 0 auto to center the box in which our title sits.
text-align = center / left / right etc depending on where you wish the text to show,
text-indent = -5000px if you want to push the text off the screen, and only have the image showing.
background-image = set this to none if you dont want background images to show (but dont forget to remove the text-indent else nothing will show up).
*/

#title_brainbuilders,
#title_calendar,
#title_classpages,
#title_clubs,
#title_contact,
#title_curriculum,
#title_english,
#title_friendsreunion,
#title_gallery,
#title_games,
#title_governors,
#title_guestbook,
#title_history,
#title_keyinformation,
#title_kidszone,
#title_ks1links,
#title_ks2links,
#title_letters,
#title_maths,
#title_news,
#title_newsletters,
#title_parents,
#title_pta,
#title_science,
#title_staff,
#title_tour,
#title_welcome,
#title_whoswho,
#title_yeargroups,
#title_memoriesbrowse,
#title_memoriesalbum
{height: 41px; 
text-align: left; 
width: 215px; 
margin: 0px 0px 20px 0px; 
text-indent: -5000px;}

#title_memoriesalbum{width: 300px; }


/* (3)  Accessibility and General Navigation 

Here are some styles which are used in conjunction with the alternative style sheets for accessibility purposes.
Something to note:
visibility: hidden will hide content (it will still take up the same space, just wont be visible), while, display: none, will remove it from the flow. 
*/

.hide {visibility: hidden;} /* To hide something from all views */
.hide_default {display: none;} /* To hide something from default view */

#loginbox{
text-align: center;
padding: 5px;
}

/* .key is used to style the accesskey text.*/

.key{
display: none;
}


#wai_logo img {border: none;} /* If you're satisfied that the site conforms to WAI standards, drop in a link , 
and remove the image border with this. */



/* For links to work as link, visited, focus, and hover , they must be in this order.. please change the colours to suit */

a:link{
color: #003399;
text-decoration: none;
}
a:visited {
color:#003399;
text-decoration: none;
}

a:hover{
color: #FF0000;
text-decoration: underline;
}


/* Styles for links at the bottom of the page */

#bottomlinks {text-align:center;} /* Because we want these to be in the middle */

#bottomlinks ul li{
color: #003399;
list-style-type: none;
display: inline;
height: 2em;
}
#bottomlinks a{
text-decoration: none;
color: #003399;
border-bottom: none;
}
#bottomlinks a:hover{
color: #FF0000;
border-bottom: 2px dotted;
}


/* (4)  Home page elements */

/* #fader is a container for the fading image slideshow. 
Please make it the width and height of your images. For info on how to use the fader please see the documentation*/
#fader{
position: absolute;
left: -30px;
top: -22px;
width: 200px;
height: 200px;
}

#ticker {
height:18px;
margin: 0 auto;
left: 4px;
z-index:50000;
position: absolute;
top: -60px;
width: 455px;
}

div#ticker a#EditButton{
position:relative;
left:-20px;
top: 0px !important;
z-index:100!important
}

/* #newsbox acts as a container for the news */
#newsbox{
position: absolute;
top: 205px;
left: 27px;
background-image: none;
background-repeat: no-repeat;
width: 200px;
height: 200px;
color: #FFFFFF;
text-align: center;
font-weight: bold;
}

#newsbox a{
color: #FFFFFF;
}
#newsbox a:hover{
color: #66CCFF;
}

/* #hometext contains the welcome message */
#hometext{
position: absolute;
font-family: "Comic Sans MS";
font-size: normal;
font-weight: normal;
color: #FFFFCC;
left: 280px;
top: 140px;
width: 300px;
text-align: left;
}

/* #diarydatesbox acts as a 
container for the homepage calendar */
#diarydatesbox{
position: absolute;
top: 0px;
left: 0px;
width: 300px;
height: 300px;
}

#hitcountbox{
position: absolute;
width: 400px;
height: 27px;
left: 260px;
top: 335px;
}

/* Teasers */

#teaserbox ul li { display: inline; padding: 0; list-style-type: none;}

li.classpageshome a{
position: absolute;
width: 100px;
height: 100px;
display: block;
background: url(../images/teasers/classpages.gif) no-repeat;
overflow: hidden;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.classpageshome a:hover{
background-position: -100px 0;
} 

li.tourhome a{
position: absolute;
width: 100px;
height: 100px;
display: block;
background: url(../images/teasers/tour.gif) no-repeat;
overflow: hidden;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.tourhome a:hover{
background-position: -100px 0;
} 

li.galleryhome a{
position: absolute;
width: 100px;
height: 100px;
display: block;
background: url(../images/teasers/gallery.gif) no-repeat;
overflow: hidden;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.galleryhome a:hover{
background-position: -100px 0;
} 

li.kidszonehome a{
position: absolute;
width: 100px;
height: 100px;
display: block;
background: url(../images/teasers/kidszone.gif) no-repeat;
overflow: hidden;
left: 0px;
top: 0px;
text-indent: -5000px;
}

li.kidszonehome a:hover{
background-position: -100px 0;
} 


/* (5) Kids' Zone */

/* To style "back to" text */
.back_to{
text-align: left;
font-weight: bold;
padding-top: 5px;
padding-bottom: 5px;
} 

#kidsbgbox{
background-image: url(../images/kidszoneimages/kidszonebg.gif); 
background-repeat: no-repeat; 
width: 550px;
height: 464px; 
margin: 0 auto;
}

#kidsbgbox ul li { display: inline; padding: 0; list-style-type: none;}

li.kgames a{
position: absolute;
width: 107px;
height: 65px;
display: block;
background: url(../images/kidszoneimages/games.gif) no-repeat;
overflow: hidden;
font-weight: bold;
left: 430px;
top: 200px;
text-indent: -5000px;
}
li.kgames a:hover{
background-position: -107px 0;
} 

li.ks1links a{
position: absolute;
width: 107px;
height: 65px;
display: block;
background: url(../images/kidszoneimages/ks1links.gif) no-repeat;
overflow: hidden;
font-weight: bold;
left: 250px;
top: 120px;
text-indent: -107px;
}
li.ks1links a:hover{
background-position: -107px 0;
} 

li.ks2links a{
position: absolute;
width: 107px;
height: 65px;
display: block;
background: url(../images/kidszoneimages/ks2links.gif) no-repeat;
overflow: hidden;
font-weight: bold;
left: 270px;
top: 410px;
text-indent: -5000px;
}
li.ks2links a:hover{
background-position: -107px 0;
} 

li.english a{
position: absolute;
width: 107px;
height: 65px;
display: block;
background: url(../images/kidszoneimages/english.gif) no-repeat;
overflow: hidden;
font-weight: bold;
left: 50px;
top: 180px;
text-indent: -5000px;
}
li.english a:hover{
background-position: -107px 0;
} 

li.history a{
position: absolute;
width: 107px;
height: 65px;
display: block;
background: url(../images/kidszoneimages/history.gif) no-repeat;
overflow: hidden;
font-weight: bold;
left: 390px;
top: 400px;
text-indent: -5000px;
}
li.history a:hover{
background-position: -107px 0;
} 

li.science a{
position: absolute;
width: 107px;
height: 65px;
display: block;
background: url(../images/kidszoneimages/science.gif) no-repeat;
overflow: hidden;
font-weight: bold;
left: 150px;
top: 130px;
text-indent: -5000px;
}
li.science a:hover{
background-position: -107px 0;
} 

li.maths a{
position: absolute;
width: 107px;
height: 65px;
display: block;
background: url(../images/kidszoneimages/maths.gif) no-repeat;
overflow: hidden;
font-weight: bold;
left: 60px;
top: 240px;
text-indent: -5000px;
}
li.maths a:hover{
background-position: -107px 0;
} 

li.brain a{
position: absolute;
width: 107px;
height: 65px;
display: block;
background: url(../images/kidszoneimages/brain.gif) no-repeat;
overflow: hidden;
font-weight: bold;
left: 400px;
top: 130px;
text-indent: -5000px;
}
li.brain a:hover{
background-position: -107px 0;
}

/* (6)  Classpages and Year Groups */


#classbox {} /* Give this a height if you need to extend col-two on the classpage */

#classbox ul li { display: inline; padding: 0; list-style-type: none;}

li.nursery a {
width: 100px;
height: 100px;
display: block;
background: url(../images/classpages/nursery.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.nursery a:hover {
background-position: -100px 0;
}

li.foundation a {
width: 100px;
height: 100px;
display: block;
background: url(../images/classpages/foundation.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.foundation a:hover {
background-position: -100px 0;
}

li.foundation1 a {
width: 100px;
height: 100px;
display: block;
background: url(../images/classpages/foundation1.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.foundation1 a:hover {
background-position: -100px 0;
}

li.foundation2 a {
width: 100px;
height: 100px;
display: block;
background: url(../images/classpages/foundation2.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.foundation2 a:hover {
background-position: -100px 0;
}

li.foundation3 a {
width: 100px;
height: 100px;
display: block;
background: url(../images/classpages/foundation3.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.foundation3 a:hover {
background-position: -100px 0;
}

li.reception a {
width: 146px;
height: 157px;
display: block;
background: url(../images/classpages/reception.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 80px;
top: 40px;
text-indent: -5000px;
}
li.reception a:hover {
background-position: -146px 0;
}

li.year1 a {
width: 146px;
height: 157px;
display: block;
background: url(../images/classpages/year1.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 240px;
top: 40px;
text-indent: -5000px;
}
li.year1 a:hover {
background-position: -146px 0;
} 

li.year2 a {
width: 146px;
height: 157px;
display: block;
background: url(../images/classpages/year2.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 400px;
top: 40px;
text-indent: -5000px;
}
li.year2 a:hover {
background-position: -146px 0;
} 

li.year3 a {
width: 146px;
height: 157px;
display: block;
background: url(../images/classpages/year3.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 0px;
top: 200px;
text-indent: -5000px;
}
li.year3 a:hover {
background-position: -146px 0;
}

li.year4 a {
width: 146px;
height: 157px;
display: block;
background: url(../images/classpages/year4.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 150px;
top: 200px;
text-indent: -5000px;
}
li.year4 a:hover {
background-position: -146px 0;
}
li.year5 a {
width: 146px;
height: 157px;
display: block;
background: url(../images/classpages/year5.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 300px;
top: 200px;
text-indent: -5000px;
}
li.year5 a:hover {
background-position: -146px 0;
}

li.year6 a {
width: 146px;
height: 157px;
display: block;
background: url(../images/classpages/year6.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 450px;
top: 200px;
text-indent: -5000px;
}
li.year6 a:hover {
background-position: -146px 0;
}

li.year7 a {
width: 100px;
height: 100px;
display: block;
background: url(../images/classpages/year7.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.year7 a:hover {
background-position: -100px 0;
}

li.year8 a {
width: 100px;
height: 100px;
display: block;
background: url(../images/classpages/year8.gif) no-repeat;
overflow: hidden;
position: absolute;
left: 0px;
top: 0px;
text-indent: -5000px;
}
li.year8 a:hover {
background-position: -100px 0;
}

/* (7) Primarysite CMS specific styles */

h2.sectionheading {
color: #009900;
}

#Guestbook {
border: #42A0FF solid thick;
}
#Guestbook .sort{
background-color: #42A0FF;
}
#Guestbook .sort a{
color: #FFFF00;
}
#Guestbook .sort a:hover{
color:#FFFFFF;
}
#Guestbook .allowdeny {
color: #FFFF00;
background-color: #42A0FF;
}
#Guestbook .allowdeny a{
color: #FFFF00;
}
#Guestbook .allowdeny a:hover{
color:#FFFFFF;
}
#Guestbook .guest {
background-color: #FFED6F;
}
#Guestbook .message {
background-color: #FFFFFF;
}

.addmessage {
font-size: medium;
text-align: center;
font-weight: bold;
}
#Guestbook .sort{
font-size: small;
text-align: center;
width: 100%;
}
#Guestbook .allowdeny {
font-size: x-small;
height: 1%; /*KLUDGE - to force IE to have layout */
}
#Guestbook .guest {
padding: 10px 5px 10px 5px;
font-size: x-small;
height: 1%; /*KLUDGE - to force IE to have layout */
}
#Guestbook .message {
padding: 10px 5px 10px 5px;
font-size: small;
height: 1%; /*KLUDGE - to force IE to have layout */
}

/*  For Memories  */

#memories-main { 
position: relative;
background: url(../images/memories/background.gif) no-repeat center center; 
height: 336px; width: 600px; 
margin: 0 auto; 
}
#memories-main ul { position: relative; list-style: none; padding: 0; margin: 0;}
#memories-main li a { position: absolute; display: block; text-indent: -9999px; }

#memories-main li.browse a { background: url(../images/memories/browse.gif) no-repeat; height: 91px; width: 128px; }
#memories-main li.add a { background: url(../images/memories/add.gif) no-repeat; height: 68px; width: 114px; }
#memories-main li.view a { background: url(../images/memories/view.gif) no-repeat; height: 139px; width: 122px; }
#memories-main li.submit a { background: url(../images/memories/submit.gif) no-repeat; height: 69px; width: 161px; }

#memories-main li.add a:hover { background-position: -114px 0px; }
#memories-main li.browse a:hover  { background-position: -128px 0px; }
#memories-main li.view a:hover  {  background-position: -122px 0px; }
#memories-main li.submit a:hover { background-position: -161px 0px; }

#dateranges ul { width: 390px; margin: 0 auto; padding: 0; overflow: auto; }
#dateranges li { list-style: none; text-indent: 0; float: left; width: 180px; text-align: center; font-weight: bold; margin: 5px; padding: 0; }
#dateranges li.browseall { width: 370px; }

#dateranges li a { display: block; border: solid 1px; padding: 10px; }
#dateranges li a:hover { border: solid 1px; text-decoration: none; }

p.addmems { text-align: center; font-weight: bold; margin: 0 0 30px; }

p.addmems a { display: block; width: 300px; border: solid 1px; margin: 0 auto; padding: 10px; }
p.addmems a:hover { border: solid 1px; text-decoration: none; }

.memsWaiting { text-align: center; font-weight: bold; }

.memssorting form { display: inline; margin: 10px 40px; }
.memsrecordnav { text-align: center; margin: 10px; font-weight: bold; }
.memspaging { text-align: center; margin-bottom: 15px; }

.eachMemory { border: solid 2px; margin-bottom: 10px; }
.memoryName p { margin: 0; padding: 10px; font-weight: bold; }
.memoryDates p { margin: 0; padding: 10px; }
.memoryProfile p { margin: 0; padding: 10px; }
.memoriesPosted { padding: 1px 10px; }

.memsheading { font-weight: bold; }

.allowdeny {background: #555;}
.allowdeny a {color: #fff;}
.allowdeny .unModerated {background: #F00;}


/*   Change Memories Colours etc  */

#memories-main li.browse a { top: 22px; left: 28px; }
#memories-main li.add a { top: 71px; left: 160px; }
#memories-main li.view a { top: 82px; left: 326px; }
#memories-main li.submit a { top: 242px; left: 249px; }

#dateranges li a { color: #191970; background-color: #FDD71E; }
#dateranges li a:hover { color: #000; background-color: #FE8532; }

p.addmems a { color: #191970; background-color: #FDD71E; }
p.addmems a:hover {  color: #000; background-color: #FE8532; }

.eachMemory { border-color: #ccc; }
.memoryName p { background: #ccc; }
.memoryDates p { background: #ddd; }
.memoryProfile p { background: #eee; }

/* CMS 3+ specific styles */
.newstitlehome, .eventhome{margin:0;font-weight:bold}
#MediaBlock .MediaFloat{width:33.3%}

/* CALENDAR STYLES */

#termeventslatest , #termevents { 
}
#termeventslatest .termtitle , #termevents .termtitle { 
	font-weight: bold;
	text-align: center;
	font-size: medium;
}
#termeventslatest .latesttitle , #termevents .latesttitle { 
    font-size: small;
	color: #FFFFFF;
	font-weight: bold;
	background-color: #FF0000;
	text-align: center;
	border-top: solid 1px #000000;
	border-left: solid 1px #000000;
	border-right: solid 1px #000000;
}
#termeventslatest .latest , #termevents .latest { 
	background-color: #FFCCCC;
	background-image: url(icons/dontforget.gif);
	background-repeat: no-repeat;
	border: solid 1px #000000;
	padding-left: 80px;
}


#termeventslatest .date , #termevents .date { 
    width: 200px;
    margin-left: 3px;
    font-size: small;
    line-height: 22px;
   color: #000000;
    float: left;
    font-weight: bold;
}
#termeventslatest .event , #termevents .event { 
    line-height: 22px;
    margin-left: 3px;
    font-size: small;
    font-weight: normal;
}
#termeventslatest a , #termevents a { 
   text-decoration: none;
   color: #0000CC;
}
#termeventslatest a:hover , #termevents a:hover { 
   text-decoration: none;
   color: #FF0000;
}


#termeventslatest .termheader , #termevents .termheader { 
    font-size: small;
	color: #FFFFFF;
	font-weight: bold;
	background-color: #0000CC;
	text-align: center;
	border: solid 1px #000000;
}
#termeventslatest .eventarea , #termevents .eventarea { 
	background-color: #D5EAFF;
	border-right: solid 1px #000000;
	border-left: solid 1px #000000;
}


#termeventslatest .detailtitle , #termevents .detailtitle { 
	font-weight: bold;
	font-size: medium;
}
#termeventslatest .detailtitleonday , #termevents .detailtitleonday { 
	font-weight: bold;
	font-size: medium;
	text-align: center;
}
#termeventslatest .detaildata , #termevents .detaildata { 
	font-size: small;
}
#termeventslatest .detailfield , #termevents .detailfield { 
	font-size: small;
	font-weight: bold;
}



/* MONTHLY CALENDAR STYLES */

#monthlycalendars{
}
#monthlycalendars a{
color: #FFFFFF;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}
#monthlycalendars a:hover{
color: #00FF00;
}
.dwzCalendarExternalTable{
background-color:#bbbbba;
}
.dwzCalendarInternalTable{
border:0;
}
.dwzCellPrev{
text-align:center;
height:18px;
background-color:#666666;
}
.dwzCellMonth{
text-align:center;
height:20px;
background-color:#666666;
font-family: Arial, Helvetica, sans-serif;
font-size:11px;
font-weight:bold;
color:#FFFFFF;
}
.dwzCellNext{
text-align:center;
height:20px;
background-color:#666666;
color:#000000;
}
.dwzCellWeekDay{
text-align:center;
height:20px;
background-color:silver;
font-family: Arial, Helvetica, sans-serif;
font-size:10px;
font-weight:bold;
background-color:#FFFFFF;
vertical-align:middle;
width:20px
}
.dwzLineSeparator{
height:0px;
}
.dwzCellNextMonth{
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#999999;
font-weight :normal;
width:20px;
height:20px;
background-color: #d1d1d0;
vertical-align:bottom;
text-align:right;
}
.dwzCellPrevMonth{
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#999999;
font-weight :normal;
width:20px;
height:20px;
background-color: #d1d1d0;
vertical-align:bottom;
text-align:right;
}
.dwzCellNoEvent{
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#000000;
background-color:#e4e4e0;
width:20px;
height:20px;
text-align:right;
vertical-align:bottom;
}
.dwzCellEvent{
background-color:#666666;
width:20px;
height:20px;
text-align:right;
vertical-align:bottom;
}

/* TOUR */

.tourclass {
    margin: 0;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
}
.tourtitle {
	font-weight: bold;
	font-size: small; /* for IE5/Win */
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: medium; /* Actual Value */ 
	text-align: center;
	margin: 0;
	padding-top: 4px;
}
.tourtext {
	font-size: x-small; /* for IE5/Win */
	voice-family: "\"}\"";
	voice-family: inherit;
	font-size: small; /* Actual Value */
	text-align: center;
	margin: 0;
}


.tourdetail { position: relative; }
.tourtitle { font-weight: bold; }
.tourimage a.EditButton { position: absolute; top: 258px; }

.tourimage { 
position: relative; 
width: 400px; 
margin: 0 auto; 
text-align: center; 
z-index: 2; 
}

.tourarrows { 
position: absolute; 
top: 0px; 
width: 100%; 
z-index: 1; 
}

.tourarrows a {
position: relative; 
display: block; 
margin: 20px;
width: 116px;
height: 152px;
text-indent: -9999px;
background-position: center center;
background-repeat: no-repeat;
}

.tourarrows a.left {
float: left;background-image: url(../images/tour/previous.gif);
}
.tourarrows a.right {
float: right; 
background-image: url(../images/tour/next.gif);
}

#scrollingText {
    height: 20px;
    left: 8px;
    position: absolute !important;
    top: 2px;
    width: 452px;
}