/* CSS for the Daycare main pages. */

body {
padding: 0;
margin: -10px 0 0 -10px;
margin: 0 0 0 0; 
background:    url(../images/pageback.gif) repeat-y;
background-color: White;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color:  #666666;
}

/* set the position of the nav bar table from the top */
/* if you change this you will need to adjust the flyout div positions to correspond */
.navtable {
	margin-top: 20px;
}

/* this sets the right hand side table shadow as the cell background image */
.maintdbg {
background-image:   url("../images/tableback.jpg");
background-repeat: repeat-y;
}
/* style for the main table content area - gives the left and bottom border effect */
.maintable{
background: white;
color: #666666;
border-bottom: 1px solid #663300;
border-left: 1px solid #663300;
}

/* a class for the header table, so that we can add a left border to match the main table */
.headertable {
	border-left: 1px solid #663300;
}
/* This is used to apply the watermark for the content area - 
the background image and position can be removed safely if needed or changed,
 if you want to use one of your own images */
.maintd {
	padding: 0px 10px 10px 20px;

}
/*style for the left side bar area behind the menu buttons*/
.sidebar {
border-right: 20px;
width: 145px;
padding-left: 5px;
background-color: #FF99FF;
}

/* gives the left sidebar a background color */
.sidebar td {
	background-color: #FF99FF;
}
 /* standard link styles */
/* The link before it has been clicked." */
a:link {
color: #0033FF ;  /* Blue */
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: none;
}

/* NOT SURE what this one does.  */
a:active {
color: #339900; 
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: none;
} 

/* When the link has been visited. */
a:visited {
color: #CC3333; /* Reddish */
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}

/* When the pointer is "hovers" over the link. */
a:hover {
color: #339900; /* Green */
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}

/* styles the main table links */
.maintable a:link {
color: #0033FF ;  /* Blue */
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: none;
}
.maintable a:visited {
color: #CC3333; /* Reddish */
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}
.maintable a:hover {
color: #339900; /* Green */
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
/* padding: 5px 5px 5px 5px; */
/* The above padding line makes links move a little
   when the mouse is over the link. */
text-decoration: underline;
}
.maintable a:active {
color: #576B77;
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
text-decoration: underline;
}

/*standard heading tags*/
h1 {	
font-size: 18px;
color: #990099;	
font-weight: bold;
}
h2 {
font-size:15px;
color: #990066;
text-decoration: underline;
}
h3 {	
font-size: 14px;
color: #990066;
text-decoration: underline;
}
p {	
font-size: 14px;
color: #333333;
}

/* Use the following character style to emphasize body text selections.*/
.emphasis {
font-family: Arial;
font-size: 14px;
font-style: italic;
color: #990066;
font-weight: bold;
}
/* Use the following character style to emphasize body text selections.*/
.textlarge {
font-family: Arial;
font-size: 24px;
font-style: normal;
color: #333333;
font-weight: normal;
}
/* Use the following character style to emphasize body text selections.*/
.textmedium {
font-family: Arial;
font-size: 18px;
font-style: normal;
color: #333333;
font-weight: normal;
}


/*styles for the contact form*/
form { margin: 0;} /*declaring a margin of 0 will NOT give you unwanted white space underneath the end of the form*/

label,span.spacer {width:120px;}

/*styles the form fields*/
label{
font-weight:bold;
color : #663300;
}
fieldset{
padding:10px;
border : 1px solid #663300;
margin-bottom : 15px;
}

/* class for the login form on entry page
we have named it form2 so it doesn't clash with the styles of the contact form */
.form2{
padding:6px;
margin-bottom : 10px;
}

/*styles the 'contact form' text at top of contact form*/
legend {
color: #663300;
font-weight: bold;
font: 14px Arial, Verdana, Geneva, Helvetica, sans-serif;
padding: 10px;  /*gives a bit of padding between the border and the text*/
}
/*styles the comments box*/
textarea{
background-image:   url("../images/shadeform.jpg");
}

/*styles the input fields*/
input{
background-image:   url("../images/shadeform.jpg");
}

/*wrapper div wraps the total web page*/
/* Use the 1000 pixel height to force the web browser scroll bars to show up.  This
keeps the pages uniform when the user switches between short pages (where they may
not neet a scroll bar) and the the long pages.*/
#wrapper {
	position: relative;
	margin:auto;
	width:750px;
	text-align: left;
	height: 1000px;
}

/*The following are the flyout layers.  I preface the names with "dd" to indicate that
they are "drop-downs."  Inside each layer, in the HTML file, you place a table with cells
that link to different webpages.*/

/*flyout 1 div change the co ordinates for left and top if you need to move the flyout*/

#ddgeneralinfo {
position:absolute; 
left:142px; 
top:245px; 
width:153px; 
height:95px; 
z-index:5; 
visibility: hidden;}

/*flyout 1 div change the co ordinates for left and top if you need to move the flyout*/

#ddprograms {
position:absolute; 
left:142px; 
top:277px; 
width:153px; 
height:95px; 
z-index:5; 
visibility: hidden;}

/*flyout 2 div change the co ordinates for left and top if you need to move the flyout*/
#ddstaff {
position:absolute;
left:142px;
top:309px;
width:153px;
height:95px;
z-index:5;
visibility: hidden;
}
/*flyout 3 div change the co ordinates for left and top if you need to move the flyout*/
#ddfacilities {
position:absolute;
left:142px;
top:341px;
width:153px;
height:95px; 
z-index:5;
visibility: hidden;
}
/*flyout 4 div change the co ordinates for left and top if you need to move the flyout*/
#ddphotos {
position:absolute;
left:142px;
top:373px;
width:153px;
height:95px;
z-index:5;
visibility: hidden;
}
/*flyout 5 div change the co ordinates for left and top if you need to move the flyout*/
#ddparent {
position:absolute;
left:142px;
top:406px;
width:153px;
height:95px;
z-index:5;
visibility: hidden;
}
/*this is the closer div -this is needed so that on mouseout the dropdowns close*/
#closer {
left:142px; 
position:absolute; 
margin-top:200px;
visibility:hidden;
width:500px;	
z-index:1;
}

/* styles the menu table inside the flyout div*/
.menu{
border: 1px solid #663300;
font: 11px Verdana, Geneva, Arial, Helvetica, sans-serif;
width: 150px;
background-color: #E1A638;
}

.menu a{
background: #E1A638;
display: block;       /*needed so that the whole cell is highlighted on mouseover*/
text-decoration: none;
width: 100%;
}

.menu a:link{
/* background: #E1A638; */
background: #FF99FF;
border-right:1px solid #663300;
border-bottom:1px solid #663300;
border-left:1px solid #663300;
color: #FFFFCC;
padding: 2px 2px 2px 2px;
}

.menu a:visited,.menu a:active{
background:#FF99FF;
border-right:1px solid #663300;
border-bottom:1px solid #663300;
border-left:1px solid #663300;
color: #FFFFCC;
padding: 2px 2px 2px 2px;

}

.menu a:hover{
/*background-image: url(file:///D|/2_elegante/sitefiles/graphics/menubackover.jpg);*/
background-repeat: repeat-x;
background: #FF99FF;
border-right:#663300 1px solid;
border-bottom:#663300 1px solid;
border-left: #663300 1px solid;
color: #CC0000;
padding: 2px 2px 2px 2px;
}