@import url(../styles/popup_nav.css);
/*@import url(../styles/list_nav.css);*/
/* For the page */

html{
margin: 0;
padding: 0;
}

body{
margin: 0;
padding: 0;
background:url( ../images/pagebk.jpg) repeat-x;
font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
color:#FFFFFF;
font-size: small;
}

#wrapper {
top: 20px;
margin: 0 auto;
padding: 0;
width: 980px;
position: relative;
}

#innerWrapper {
margin: 0;
padding: 0;
background:url( ../images/slither.jpg);
}

#homeBody #innerWrapper {
margin: 0;
padding: 0;
background:url( ../images/homebk.jpg);
}

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

#addi{
	position: relative;
	top: 172px;
	left: 670px;
	width: 300px;
	color: #191970;
	text-align: right;
	font-size:  small;
	font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
#addi a{text-decoration: none; color: #191970;}
#addi a:hover{text-decoration: none; color: #191970;}

#addihome{
	position: absolute;
	top: -62px;
	left: 670px;
	width: 300px;
	color: #191970;
	text-align: right;
	font-size:  small;
	font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
#addihome a{text-decoration: none; color: #191970;}
#addihome a:hover{text-decoration: none; color: #191970;}


#email{
	position: relative;
	top: 6px;
	left: 552px;
	width: 300px;
	color: #FFFFFF;
	text-align: right;
	font-size:  x-small;
	font-weight:  bold;
	font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
#email a{text-decoration: none; color: #FFFFFF;}
#email a:hover{text-decoration: none; color: #FFDF00;}



#emailhome{
	position: relative;
	top: 6px;
	left: 552px;
	width: 300px;
	color: #FFFFFF;
	text-align: right;
	font-size:  x-small;
	font-weight:  bold;
	font-family: Trebuchet MS, Verdana, Arial, Helvetica, sans-serif;
}
#emailhome a{text-decoration: none; color: #FFFFFF;}
#emailhome a:hover{text-decoration: none; color: #FFDF00;}


/* For the header */
#header{
background: url( ../images/header.jpg) no-repeat;
height: 231px;
position: relative;
}
#header h1,#header h2 
{display: none; }

/* To style the header on the homepage */
#homeBody #header {
background: url( ../images/homeheader.jpg) no-repeat;
height: 97px;
position: relative;

}

/*For Content Pages */
#content{
margin: 20px 30px 0 230px; /* Top, Right, Bottom, Left */
margin-bottom: 0/* don't put margin on bottom of content - IE bug */;
padding:0;
position: relative;
min-height: 345px;
background: none;
}

/* To style the Content area on the Homepage */
#homeBody #content{
margin: 0px 0px 0 230px; /* Top, Right, Bottom, Left */
margin-bottom: 0/* don't put margin on bottom of content - IE bug */;
padding:0;
position: relative;
min-height: 525px;
background: none;
}

/*For the Research Zone content area*/
#researchBody #content{margin: 0 33px 0px 194px; /* Top, Right, Bottom, Left */}
#researchBody #content img {position: relative; left: 80px;}



/* For the research zone Iframe */
#researchBody #rZoneContent{position: relative; left: 85px}

/* For the Kidszone Iframe */
#kZoneContent  {position: relative; left: 65px;}


/*For Footer */
#footer {
position: relative;
background: url(../images/footer.jpg) no-repeat 0 0;
height: 246px;
padding: 0;
margin: 0;
}

#homeBody #footer {
position: relative;
background: none;
background-color: #FFFFFF;
height: 5px;
padding: 0;
margin: 0;
}

/*For Navigation column */
#navigationTTL {display: none;}

#column {
left:10px;
position:absolute;
top:164px;
width:167px;
z-index: 600;
}


/* To globally style page Titles */

h1.pageTitle {
position: relative;
left: -235px;
top: -10px;
margin: 0 auto;
padding: 0;
display: block;
width: 254px; 
height: 53px;
text-indent: -5000px;
}

#homeBody h1.pageTitle {
display: none;  /*To hide page title on homepage */
}


/* To give page Titles their images. Note - we specify the page body id first, this tells the css to only look for the h1.pageTitle which belongs to the respective Body ID */

#calendarBody h1.pageTitle 		{background: url( ../images/pageTitles/calendar.gif) no-repeat 0 0;}
#classpagesBody h1.pageTitle 	{background: url( ../images/pageTitles/classpages.gif) no-repeat 0 0;}

/* For classpages */

#nurseryBody h1.pageTitle 		{background: url( ../images/pageTitles/classpages.gif) no-repeat 0 0;}
#receptionBody h1.pageTitle 		{background: url( ../images/pageTitles/reception.gif) no-repeat 0 0;}
#foundationBody h1.pageTitle 	{background: url( ../images/pageTitles/classpages.gif) no-repeat 0 0;}
#class1Body h1.pageTitle 		{background: url( ../images/pageTitles/year1-2.gif) no-repeat 0 0;}
#class2Body h1.pageTitle 		{background: url( ../images/pageTitles/year3-4.gif) no-repeat 0 0;}
#class3Body h1.pageTitle 		{background: url( ../images/pageTitles/year5-6.gif) no-repeat 0 0;}
#class4Body h1.pageTitle 		{background: url( ../images/pageTitles/eco.gif) no-repeat 0 0;}
#class5Body h1.pageTitle 		{background: url( ../images/pageTitles/year5.gif) no-repeat 0 0;}
#class6Body h1.pageTitle 		{background: url( ../images/pageTitles/year6.gif) no-repeat 0 0;}

#slideshowBody h1.pageTitle 		{background: url( ../images/pageTitles/slideshow.jpg) no-repeat 0 0;}

#clubsBody h1.pageTitle 			{background: url( ../images/pageTitles/clubs.gif) no-repeat 0 0;}
#communityBody h1.pageTitle 		{background: url( ../images/pageTitles/community.gif) no-repeat 0 0;}
#councilBody h1.pageTitle 		{background: url( ../images/pageTitles/council.gif) no-repeat 0 0;}
#galleryBody h1.pageTitle 		{background: url( ../images/pageTitles/gallery.gif) no-repeat 0 0;}
#governorsBody h1.pageTitle 		{background: url( ../images/pageTitles/governors.gif) no-repeat 0 0;}
#guestbookBody h1.pageTitle 		{background: url( ../images/pageTitles/guestbook.gif) no-repeat 0 0;}
#homeBody h1.pageTitle 			{background: url( ../images/pageTitles/welcome.gif) no-repeat 0 0;}
#keyinfoBody h1.pageTitle 		{background: url( ../images/pageTitles/keyinfo.gif) no-repeat 0 0;}
#lettersBody h1.pageTitle 		{background: url( ../images/pageTitles/letters.gif) no-repeat 0 0;}
#linksBody h1.pageTitle 			{background: url( ../images/pageTitles/links.gif) no-repeat 0 0;}
#newsBody h1.pageTitle 			{background: url( ../images/pageTitles/news.gif) no-repeat 0 0;}
#newslettersBody h1.pageTitle 	{background: url( ../images/pageTitles/newsletters.gif) no-repeat 0 0;}
#parentsBody h1.pageTitle 		{background: url( ../images/pageTitles/parents.gif) no-repeat 0 0;}
#platformBody h1.pageTitle 		{background: url( ../images/pageTitles/platform.gif) no-repeat 0 0;}
#pollBody h1.pageTitle 			{background: url( ../images/pageTitles/poll.gif) no-repeat 0 0;}
#ptaBody h1.pageTitle 			{background: url( ../images/pageTitles/pta.gif) no-repeat 0 0;}
#staffBody h1.pageTitle 			{background: url( ../images/pageTitles/staff.gif) no-repeat 0 0;}
#tsaBody h1.pageTitle 			{background: url( ../images/pageTitles/tsa.gif) no-repeat 0 0;}
#tourBody h1.pageTitle 			{background: url( ../images/pageTitles/tour.gif) no-repeat 0 0;}
#usefullinksBody h1.pageTitle 	{background: url( ../images/pageTitles/links.gif) no-repeat 0 0;}
#vleBody h1.pageTitle 			{background: url( ../images/pageTitles/vle.gif) no-repeat 0 0;}
#welcomeBody h1.pageTitle 		{background: url( ../images/pageTitles/welcome.gif) no-repeat 0 0;}
#whoswhoBody h1.pageTitle 		{background: url( ../images/pageTitles/whoswho.gif) no-repeat 0 0;}

#contactBody h1.pageTitle 		{background: url( ../images/pageTitles/contact.gif) no-repeat 0 0;}
#sitepolicyBody h1.pageTitle 	{background: url( ../images/pageTitles/sitepolicy.gif) no-repeat 0 0;}
#sitemapBody h1.pageTitle 		{background: url( ../images/pageTitles/sitemap.gif) no-repeat 0 0;}

#kidszoneBody h1.pageTitle 		{background: url( ../images/pageTitles/kidszone.gif) no-repeat 0 0;}

/* The kids' zone titles are set out in a slightly different way due to them all being on a single 
page and thus you can't style via the normal method using the body tag id. */
h1#ks1linksBody.pageTitle 		{background: url( ../images/pageTitles/ks1links.gif) no-repeat 0 0;}				
h1#ks2linksBody.pageTitle 		{background: url( ../images/pageTitles/ks2links.gif) no-repeat 0 0;}				
h1#gamesBody.pageTitle 			{background: url( ../images/pageTitles/games.gif) no-repeat 0 0;}			
h1#historyBody.pageTitle 		{background: url( ../images/pageTitles/history.gif) no-repeat 0 0;}
h1#scienceBody.pageTitle 		{background: url( ../images/pageTitles/science.gif) no-repeat 0 0;}
h1#englishBody.pageTitle 		{background: url( ../images/pageTitles/english.gif) no-repeat 0 0;}
h1#mathsBody.pageTitle 			{background: url( ../images/pageTitles/maths.gif) no-repeat 0 0;}
h1#brainbuildersBody.pageTitle 	{background: url( ../images/pageTitles/brainbuilders.gif) no-repeat 0 0;}

#govs_zoneBody h1.pageTitle		{background: url(../images/pageTitles/govszone.gif) no-repeat;}
#gov_calBody h1.pageTitle		{background: url(../images/pageTitles/gov_cal.gif) no-repeat;}
#gov_meetBody h1.pageTitle		{background: url(../images/pageTitles/gov_meet.gif) no-repeat;}
#gov_docsBody h1.pageTitle		{background: url(../images/pageTitles/gov_docs.gif) no-repeat;}
#gov_bulletinBody h1.pageTitle	{background: url(../images/pageTitles/gov_bulletin.gif) no-repeat;}
#gov_profileBody h1.pageTitle	{background: url(../images/pageTitles/gov_profile.gif) no-repeat;}
#gov_linksBody h1.pageTitle		{background: url(../images/pageTitles/gov_links.gif) no-repeat;}


/*Layout Engine Stuff - no need to edit this.*/
ul#topcontrols {top: -20px; margin: 0; padding: 0; text-align: right; position: absolute; z-index: 500; width: 100%;}
#topcontrols li {display: inline; margin-right: 10px; color: #191970;}
#topcontrols a{text-decoration: none; color: #191970;}
#topcontrols a:hover{text-decoration: none; color: #FFFFFF;}

#baseText {width: 960px; margin: 21px auto 0; color: #191970;}
#baseText a{text-decoration: none; color: #191970;}
#baseText a:hover{text-decoration: none; color: #79AE2C;}


#copyRight {float: left;}
#sitePrivacy {float: left; padding-left: 10px;}
a#byPrimarySite {float: right;}
a#byPrimarySite, a#sitePrivacy {text-decoration: none;}
li#FGview {display: none;}
.w3cbadge {margin-top: 10px; border: none;}
/* For Login and Web logo*/
p#logStandards{
position: relative;
top: 0;
width: 88px; 
margin: 0 auto; 
padding: 0px; 
text-align: center;
clear: both; /* Needed so that the login button and W3C logo doesn't collapse into the base text area in standards compliant browsers */
}

/* This sets the width of the media items and so you can increase or 
decrease the size so that 4 items will fit on the screen at a time.
This overrides the property set in style.css.  Please do not edit 
the style.css stylesheet. */
.MediaFloat{width: 180px;}
/* Change section heading properties here and not in style.css*/
h2.sectionheading{color: #3CF5F7;}

.hide_default {display: none;}

/* 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: #FFDF00; text-decoration: none;}
a:visited {color:#FFDF00; text-decoration: none;}
a:focus{color:#FFDF00; text-decoration: none; border: none;}
a:hover{color: #3CF5F7; text-decoration: underline;}
a:active{color: #3CF5F7; text-decoration: none;}


#latestNews {
width: 300px; 
height: 60px; 
display: block;
position: absolute;
background: none;
left: 10px;
top: 265px;
color: #FFFFFF;
}

p.newstitlehome a { color: #FFFFFF; font-weight: bold;}

p.newstitlehome a:hover { color: #FFDF00; font-weight: bold;}


p.newstitlehome {margin: 0}
p.eventhome {margin: 0}

#latestNews h2, #diaryDates h2 {
visibility: hidden;
margin: 0;}

#diaryDates {
width: 300px; 
height: 60px; 
display: block;
position: absolute;
background: none;
left: 10px;
top: 350px;
color: #051D4D;
}

#homeBody p.eventhome a {color: #051D4D; font-weight: bold;}

#homeBody p.eventhome a:hover  { color: #3D7E11; font-weight: bold;}

#homeText {
width: 350px; 
display: block; 
height: 200px; 
position: absolute;
top: -46px;
left: 350px;
color: #FFFFFF;
text-align: center;
font-weight:  bold;
}

#homeText p {padding: 0px; margin: 0px;}

#newsletterbox{
position: absolute;
width: 190px;
left: 147px;
top: 122px;
display: block;
color: #003081;
text-align: left;
}

#newsletterbox a{
	color: #003081;
}

#newsletterbox a:hover{
	color: #3D7E11;
}

#newsletterbox p {padding: 0px; margin: 0px;}


#hitcounter {
position: absolute;
top: 390px;
left: 660px;
height: 16px;
margin: 0;
padding: 0;
text-align: center;
}



	
/* Teasers */

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

li.classpageshome a, 
li.tourhome a, 
li.galleryhome a, 
li.kidszonehome a {
position: absolute; 
overflow: hidden; 
text-indent: -5000px; 
display: block;
width: 100px;
height: 100px;
}

li.classpageshome a{
background: url(../images/teasers/classpages.gif) no-repeat;
left: 0px;
top: 0px;
}

li.tourhome a{
background: url(../images/teasers/tour.gif) no-repeat;
left: 0px;
top: 0px;
}

li.galleryhome a{
background: url(../images/teasers/gallery.gif) no-repeat;
left: 0px;
top: 0px;
}

li.kidszonehome a{
background: url(../images/teasers/kidszone.gif) no-repeat;
left: 0px;
top: 0px;
}


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


#classbgbox ul {position: relative; top: 0px; height: 450px; width: 600px; margin: 0px auto; padding: 0; list-style-type: none;}


li.nursery a, 
li.reception a,
li.class1 a, 
li.class2 a,
li.class3 a, 
li.class4 a, 
li.class5 a, 
li.class6 a, 
li.class7 a, 
li.class8 a {
display: block; 
width: 150px; 
height: 150px;
position: absolute;
text-indent: -5000px;
}



li.reception a{top: 30px; left: 100px; background: url( ../images/classpages/reception.gif) no-repeat;}
li.class1 a{top: 30px; left: 250px; background: url( ../images/classpages/year1-2.gif) no-repeat;}
li.class2 a{top: 30px; left: 400px; background: url( ../images/classpages/year3-4.gif) no-repeat;}
li.class3 a{top: 200px; left: 175px; background: url( ../images/classpages/year5-6.gif) no-repeat;}
li.class4 a{top: 200px; left: 325px; background: url( ../images/classpages/eco.gif) no-repeat;}
li.class5 a{top: 200px; left: 200px; background: url( ../images/classpages/year5.gif) no-repeat;}
li.class6 a{top: 200px; left: 350px; background: url( ../images/classpages/year6.gif) no-repeat;}

li.foundation a:hover , 
li.nursery a:hover , 
li.reception a:hover ,
li.class1 a:hover , 
li.class2 a:hover , 
li.class3 a:hover ,
li.class4 a:hover , 
li.class5 a:hover , 
li.class6 a:hover 
{background-position: -150px 0px;}


#classpagepusher {clear: both;}



#kidszoneBody .small {position: absolute; top: 50px;}



#kidszonebox  ul{position: relative; background-image: url(../images/kidszoneimages/kidszonebg.jpg); 
background-repeat: no-repeat; top: 0px; height: 510px; width: 486px; margin: 0px auto; padding: 0; list-style-type: none;}

li.kgames a, li.ks1links a, li.ks2links a, li.english a, li.history a, li.science a, li.maths a, li.brain a{
display: block;
overflow: hidden;
font-weight: bold;
text-indent: -5000px;
position: absolute;
top: 0px; 
left: 0px;
}

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

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

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

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

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

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

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

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


/* For the Governors' Zone */

#gov_box {
position: relative; 
top: 23px; 
left: 0; 
margin: 0 auto; 
height: 330px; 
width: 380px;
}
#gov_login p a{position: relative; top :0; left: 0; margin: 0; padding: 0;}
.govstext {
font-size: small;
font-weight: bold;
padding-top: 85px;
text-align: center;
}


#cplogin {position: relative; top: 300px;}

div#profiles a, div#govcalendar a, div#forum a, div#meetings a, div#docs a, div#weblinks a {
position: absolute;
width: 100px;
height: 140px;
display: block;
}
div#profiles a, div#govcalendar a, div#forum a{top: 0px;}
div#meetings a, div#docs a, div#weblinks a {top: 150px;}

div#profiles a {left: 10px; background: url(../images/govs_zone/profiles.png) no-repeat;}
div#govcalendar a {left: 150px; background: url(../images/govs_zone/calendar.png) no-repeat;}		
div#forum a {left: 290px; background: url(../images/govs_zone/forum.png) no-repeat;}
div#meetings a {left: 10px; background: url(../images/govs_zone/meetings.png) no-repeat;}
div#docs a {left: 150px; background: url(../images/govs_zone/docs.png) no-repeat;}
div#weblinks a {left: 290px; background: url(../images/govs_zone/links.png) no-repeat;}

div#profiles a:hover , 
div#govcalendar a:hover , 
div#forum a:hover , 
div#meetings a:hover , 
div#docs a:hover , 
div#weblinks a:hover  {
background-position: -100px 0;
}

.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%}
#Guestbook .guest{padding:10px 5px 10px 5px;font-size:x-small;height:1%}
#Guestbook .message{padding:10px 5px 10px 5px;font-size:small;height:1%}
#Guestbook{border:#42A0FF solid thick}
#Guestbook .sort{background-color:#42A0FF}
#Guestbook .sort a{color:#FF0}
#Guestbook .sort a:hover{color:#FFF}
#Guestbook .allowdeny{color:#FF0;background-color:#42A0FF}
#Guestbook .allowdeny a{color:#FF0}
#Guestbook .allowdeny a:hover{color:#FFF}
#Guestbook .guest{background-color:#FFED6F}
#Guestbook .message{background-color:#FFF}
body #addmessagediv{width:630px;height:100%;display:block;position:relative;margin:0 auto}
#guestbookform input,#guestbookform select{width:100px !important}
#guestbookform textarea {width:300px !important}

/* Calendar Styles */
#termeventslatest .termtitle , #termevents .termtitle {font-weight: bold;font-size: medium;}
#termeventslatest .latesttitle , #termevents .latesttitle {font-size: small;color: #FFFFFF;font-weight: bold;background-color: #FF0000;text-align: center;}
#termeventslatest .latest , #termevents .latest {background-color: #FFCCCC;background-image: url(icons/dontforget.gif);background-repeat: no-repeat;}
#termeventslatest .date , #termevents .date {color: #000000;}
#termeventslatest a , #termevents a {text-decoration: none;color: #0000CC;text-align: center;}
#termeventslatest a:hover , #termevents a:hover {text-decoration: none;color: #FF0000;}
#termeventslatest .termheader , #termevents .termheader {color: #FFFFFF;background-color: #0000CC;}
#termeventslatest .eventarea , #termevents .eventarea {background-color: #D5EAFF;}
#termevents div.small a{color: white}
#termevents div.small a:hover{text-decoration:underline}

/* MONTHLY CALENDAR STYLES */
#monthlycalendars a{color: #FFFFFF;}
#monthlycalendars a:hover{color: #00FF00;}
.dwzCalendarExternalTable{background-color:#bbbbba;margin: 0 auto;}
.dwzCellPrev{background-color:#666666;}
.dwzCellMonth{background-color:#666666;color:#FFFFFF;}
.dwzCellNext{background-color:#666666;color:#000000;}
.dwzCellWeekDay{background-color:#FFFFFF;color:black}
.dwzCellNextMonth{color:#999999;background-color: #d1d1d0;}
.dwzCellPrevMonth{color:#999999;background-color: #d1d1d0;}
.dwzCellNoEvent{color:#000000;background-color:#e4e4e0;}
.dwzCellEvent{background-color:#666666;}


/* EDITABLE SLIDESHOW */

#faderbox {
position: relative;
overflow: hidden;
width: 316px;
height: 299px;
left: 384px;
top: -3px;
}

.faderImages {
position: absolute;
width: 316px;
height: 299px;
margin: 0 30px 30px 0;
float: left;
overflow: hidden;
}

/* Fading Images */
.faderImages .image {
position: absolute;
width: 716px;  /* width of fader plus 400px (200 each side) */
margin-left: -200px;  /* pull to left to enable horizontal centering of images */
/*height and margin-top need changing in IE stylesheet as vertical align doesn't work in IE6 */
height: 699px;	/* height of fader plus 400px (200 each side) */
margin-top: -200px;  /* pull upwards to enable vertical centering of images */
_margin-top:0px;
line-height: 600px;	/* same as height */
text-align: center;
}

.faderImages .image  img { vertical-align: middle; }
.faderImages .image  img.portrait { width: 320px; }  /* width and height of window area */
.faderImages .image  img.landscape { height: 349px; } 


/* Mask - Delete if not needed */
#fadermask{
position: relative;
width: 316px;
height: 299px;
left: 0px;
top: 0px;
background-image: url(../images/mask.png);
z-index: 20;
}


/* Edit Button */
#EditSlideButton { position: absolute; left: 0px; top: 0px; z-index: 30; }