/*
*************************************************

My Nursery School
Screen Styles

Created by the Kelly Franklin
http://www.wiltonwebdesign.com

*************************************************
*/


/*================ RESET BROWSER STYLES =========================*/

html { text-align: center; padding: 3em 0;  overflow-x: hidden }

* {margin: 0; padding: 0; vertical-align: baseline; font-weight: normal; font-family: inherit; font-style: normal;}


/*================ BASE =========================*/

body {background: #fff url(/img/bg/body_bg.jpg) 0 0 fixed repeat-y;  font:14px/161.6% 'Trebuchet Ms', Helvetica, Verdana, Arial, Sans-Serif; color: #292929; position: relative; width: 880px; margin: 0 auto; text-align: left;}

a {text-decoration: none; color: #a4282d;}
	a:hover {color:#d75b5f; }
	#main p a {border-bottom: 1px dotted #ccc;}
	a.bookmark, a.bookmark:active, a.bookmark:hover, a.bookmark:visited {color: #290a0b}
	
h2, h3, h4 {font-weight: normal; color: #290a0b; font-family: Georgia, Garamond, serif; }
	
	h2 {font-weight: normal;  font-size: font-size: 174%; font-size: 215%; margin: .3em 0 .5em 0; }
	    body.error #main h2 {margin: 1.5em 0 1em 0}
	
	h3 {font-size: 182%; margin: 1.2em 0 .7em 0; }
		#sidebar h3 {font-size: 146.5%; padding-top: .6em; border-top: 1px solid #e4e4e4;}
			#sidebar h3.first {padding-top: 0; margin-top: 0; border-top: none}
		#two_thirds h3 {margin : .7em 0}	

	h4 { font-size: 141%; margin: 1em 0 .55em 0; clear: both}
		h4.narrow {background-color:#fff;margin:0 0 0.5em;}

p, ul, ol {font-size: 100%;}
	#sidebar p, #sidebar li {font-style: italic; line-height: 146.5%; line-height: 138.5%}
		#sidebar p.phone_number {font-size: 123.1%; font-style: normal}

p {margin: 0 0 1em 0;}
	#main p big {line-height: 1.35em; font-style: italic; font-family: Georgia, Garamond, serif;}
	#main p big em {font-style: normal; font-size: 123.1%;}
	p.indent {text-indent:1.7em}
	
ul {margin: 1em 0;}
	ul li {list-style: none; background: transparent url(/img/bg/list-marker.gif) no-repeat left 0.5em; padding-left: 10px; margin-bottom: 0.9em;  }
	
	#kamp_days {margin-left:1.5em; margin-top:1.4em;}
		#kamp_days li p {line-height: 16px; font-size: 13px}
	
	#one_third ul li {margin-bottom: .75em; line-height: 140%}
	
	ul.em_list li {font-style: italic; font-size: 93%; line-height: 1.35em}
	ul.tight li {margin-bottom: .5em}	
		
	#sidebar ul li {background: transparent url(/img/bg/list-marker.gif) no-repeat left 0.6em;}
		#sidebar ul ul {margin: -.3em 0 .5em 0; font-size: 93%; }
			#sidebar ul li li {font-style: normal; background: none; padding: 0; margin: 0 0 .2em 0}

	#sidebar li p {line-height: 146.5%}

ol {list-style-type:none; margin: .3em 0 0 2.5em; }
	ol li p {font-size: 77%; line-height: 1.3em; font-style: italic; font-family: Georgia, Garamond, serif; text-align: right}
	   ol sup {color: #434343;}

#main blockquote {background: transparent url(/img/bg/blockquote_l.png) no-repeat .9em .6em; margin: 0; padding: 0 0 0 4em;  }
	     blockquote p {font-style: italic; line-height: 146.5%; margin: 0 0 .7em 0; }
		blockquote.bbb {margin:  1.6em 0 1.8em 0}
		
abbr {text-decoration:none;border-bottom:none;}
sup {vertical-align:super; font-size: 70%}

em {font-style: italic}
strong {text-transform: uppercase}

img {border: 0; display: block}
	.left {float: left; margin: .5em 1.5em 0 0;}
	.right {float: right; margin: .5em 0 0 1em;}

	.right img, .left img {float: none; margin-bottom: 4px; display: block; }
         	 div.right p, div.left p {font-size: 85%; font-style: italic; line-height: 131%; margin: 0 0 1.3em 0; margin: 0 0 .7em 0}
	
	#main img {border: 6px solid #e9e9e9; padding: 1px; -moz-border-radius: 5px;  -khtml-border-radius: 5px;  -webkit-border-radius: 5px; }
		#main img.noborder {border: none; margin: .25em 1em 0 0}


.clear {clear: both}
.nudge_up {margin-top: 0}


/*----- Forms -----------*/

form {width:380px; position: relative; padding: 0 0 2.3em 0; margin: 1.3em 0 0 0}
	form#contactform {padding: 0 0 2.3em 6em;}
fieldset{margin:0;padding:0;border:none;}		
legend {display:none;}	
label {font-weight: bold; margin:.5em 0; font-size: 12px; position: relative; width: 100%; display: inline-block}
	label label.error {width: 370px; text-align: right; position: absolute; top: -.55em; right: 0;  font-style:italic; font-weight: bold; font-size: 11px; color: #9F3631}
	label em {font-style: normal; display: inline-block; margin: 0 0 0 2px;  color: #9F3631}
	label span.spam {font: normal 11px 'Trebuchet Ms', Helvetica, Verdana, Arial, sans-serif; color: #6F613E; text-transform: uppercase}
input, textarea {width:370px; padding: 4px; font:99% Georgia, Garamond, serif; border:1px solid #78af62; }		
textarea{height:100px;overflow:auto; font:99% 'Trebuchet Ms', Helvetica, Verdana, Arial, Sans-Serif;}
	input[type="text"]:focus, textarea:focus {background: #f4ffef;  border: 1px solid #577F47}
	input.button {display: block;  background: #669f4f;  border: 1px solid #84b76f; color: #fff; font: normal 12px/12px 'Trebuchet Ms', Helvetica, Verdana, Arial, Sans-Serif; text-transform: uppercase; letter-spacing: 1px; border-width: 0; padding: 1px 0 3px 0; height:23px; width: 74px; margin: 2em 0 0 0; position: absolute; bottom: 0; right: 0; }
		input.button:hover {background: #78af62; border-width: 0; outline: none;}
p.error {color: #9F3631; font-weight: bold}
	
/*----- Tables -----------*/

table { font-size:inherit;font:100%; border-collapse: separate; border-left:2px solid #ebebeb; border-bottom: 2px solid #ebebeb; width:100%; margin: 1.5em 0 0 0; border-spacing: 0 0; }
   #midmunch {margin: .5em 0 1em 0}
   #kamp {margin: .5em 0 2em 0}
   
caption {visibility: hidden; height: 1px}

.alt td, .alt th {background-color: #efefef; }
	th, td {font-size: .9em; line-height: 1em; padding: 9px 5px 8px 5px; border-left: 2px solid #fff; vertical-align: middle; text-align: center; empty-cells: show} 

thead th {border-bottom: 2px solid #ebebeb; border-left: none; text-align: center; padding: 6px 5px; }

th.age { text-align: left; background: #fff; font-weight: bold; font-size: 1em; color: #290a0b; font-family: Georgia, Garamond, serif; font-variant: small-caps; border-top: 2px solid #ebebeb; border-right: 2px solid #ebebeb; border-bottom: none}
   th.age small {font-weight: bold; font-size: .9em}

th.when {text-align: right; padding: 9x 10px 8px 0; border-left: none}	
	th sup {display: inline-block; margin-left: -2px}
	th.when span {color: #6f6f6f}
		th.when span.aside {font-size: .85em; color: #292929; }
		
td.age {text-align: left}
td.check {text-align: center; font-size: 1em; color: #008000}
td.price {border-right: 2px solid #ebebeb; }

	
/*================ LAYOUT =========================*/

#wrapper {background: #fff; position: relative; width: 100%; padding: 0 0 12px 0; -moz-border-radius: 10px;  -khtml-border-radius: 10px;  -webkit-border-radius: 10px; -moz-box-shadow: 0px 0px 8px rgba(0,0,0,0.3);  -khtml-box-shadow: 0px 0px 8px rgba(0,0,0,0.3);  -webkit-box-shadow: 0px 0px 8px rgba(0,0,0,0.3); position: relative; z-index: 90;  }

#header {width: 880px; height: 222px; padding: .8em 0 0 0; position: relative; }

#top { background: #efefef; width: 100%; position: relative; top: -15px; height: 250px;}
	
	
#intro {position: absolute; left: 4%; top: 6%; width: 52%; z-index: 5000;}

#content { background: #fff;  position: relative; top:-7px;  min-height: 500px; height: auto;  padding-bottom: 50px;   }
	
	#full {position: relative; top: 5px; left: 0; width: 850px; padding: 1em; height: 100px; clear: both}
	#two_thirds {position: absolute; top: 0; left: 0; width: 60%; padding: 0 0 0 2.4em; }

	#one_third {position: absolute; top: 2.5em; left: 64%; width: 33%; }
	
	#main {position: relative; top: 0; left: 0; min-height: 750px; width: 60%; padding: 0 0 1.5em 2.4em; clear: both}
	   body.hours #main, body.location #main, body.contact #main {min-height: 480px}
	   body.error #main {min-height: 200px}
   
   		.half, .last_half {float: left;  width: 45%;  position: relative; margin-bottom: .8em}
			.half {margin-right: 40px}

   		.group {float: left; clear: both; width: 100%; }   
   			.first-list {float: left; margin: 0 0 12px 25px; width: 225px; position: relative;}
   			.second-list {float: right; width:250px; position: relative; margin: 0 0 12px 0;}
   			.group li {line-height: 16px; font-size: 13px;}
   
	#sidebar {font-size: 93%; position: absolute; top: 3.3em; left: 71%; width: 23%;  padding: 1.5em 1em 0 1em; background:  #efefef; -moz-border-radius: 10px;  -khtml-border-radius: 10px;  -webkit-border-radius: 10px; }
  	    body.hours #sidebar {top: 6.1em}
	    body.contact #sidebar {top: 4.9em}
	    body.location #sidebar {top: 5.8em}
	    body.programs #sidebar {top: 14.5em}
	    body.error #sidebar {top: 1em}
	    
	
#footer {position: absolute;  bottom: 0; left: 0; height: 36px; width: 830px;  background: #a4282d; xmargin: 2em 0 .7em 0; padding: 8px 0 0 20px; color: #fff; font: normal 1em Georgia, "Times New Roman, serif"; -moz-border-radius-bottomright: 10px; -webkit-border-bottom-right-radius: 10px; -moz-border-radius-topright: 10px; -webkit-border-top-right-radius: 10px}


/*================ HEADER ========================= */

#teaser {float: right; position:relative; margin: 3em .5em 0 0; width: 150px}
	p.offer {line-height: 1.25em}

h1 {font-weight: normal; font-size: 320%; line-height: 2.68em; font-family: Georgia, Garamond, serif; margin: 0; text-shadow: 1px 1px 2px rgba(0,0,0,0.2); padding: 0 0 0 26px;}
	
	h1 a {color: #bd3a37;  background: url(/img/bg/my-nursery-school-logo.png) no-repeat 0 0; text-indent: 100px; display: block; height: 160px; line-height: 150px; }
		       h1 a:hover {color:#d75b5f; background: url(/img/bg/my-nursery-school-logo.png) no-repeat 0 -180px;}
	    
	    h1 a big {font-size: 140%; color: #fff;background: transparent url(/img/bg/my_bg.gif) no-repeat 0 0; 
	    float:left; line-height:120px; position:relative; top: 13px; left: 100px;  width: 300px; height: 150px; z-index: 100}
	    
	    	span.bg {display: inline-block; position: absolute; top: 61px; left: 226px; width: 92px; height: 59px;background: #A33130; z-index: 20}
	    		h1 a:hover big {color: #ececec}
	    
	     h1 a small {font-size: 100%; display: inline-block; line-height: 150px; position: absolute; left: 246px; top: 0}


h2.tagline {color: #290a0b; font-size: 174%;; line-height: 1em; font-style: italic;position: absolute; top: 100px; left: 346px; z-index: 1}
	
	

/*----- Nav -----------*/

#navbar {background: #a4282d; height: 48px; width: 910px;position: absolute; bottom: 15px; left: -15px; -moz-box-shadow: 0px 0px 4px rgba(0,0,0,0.55);  -khtml-box-shadow: 0px 0px 4px rgba(0,0,0,0.55); -webkit-box-shadow: 0px 0px 4px rgba(0,0,0,0.55);z-index: 100; }

#triangle-l {border-color: transparent  #a4282d transparent transparent;border-style:solid;border-width:15px;height:0px;width:0px; position: absolute; bottom: 0; left:-30px;z-index: -1; }

#triangle-r {border-color: transparent transparent transparent #a4282d;border-style:solid;border-width:15px;height:0px;width:0px;position: absolute; bottom: 0; right:-30px;z-index: -1; }

#nav {list-style-type: none; width: 880px; height: 48px; padding: 0; margin: 0; position: absolute; top: 0; left: 0}

#nav li {float: left; display: inline; padding: 0;  margin: 15px 12px;  background-image: none; color: #efe59c; color: #fff; }
	#nav li.first {margin-left: 49px}
	#nav li.last {font-size: .9em; font-style: italic; position: absolute; right: 9px; top: 0px; top: -4px; line-height: 2em }
	
#nav a:link, #nav a:visited { color: #fff;color: #efe59c; font-size: 1.05em; line-height: 1.1em; display: block;   text-transform: uppercase; letter-spacing: 1px;    }
	#nav a:hover {color: #efe59c; color: #fff; }

body.about #nav a#about, body.about #nav a#about:hover, body.location #nav a#location, body.location #nav a#location:hover, body.pricing #nav a#pricing, body.pricing #nav a#pricing:hover, body.hours #nav a#hours, body.hours #nav a#hours:hover, body.programs #nav a#programs, body.programs #nav a#programs:hover, body.contact #nav a#contact, body.contact #nav a#contact:hover {color: #fff} 


/*================ CONTENT JAVASCRIPT ELEMENTS =========================*/


/*----- Testimonials ----------- */

div.bg {background: transparent url(/img/bg/testimonials_bg.gif) no-repeat;color: #292929; position: absolute; left: 61%; top: 19%; width: 39%; z-index: 6000; height: 176px; overflow: hidden}

div.no_bg {background: #fff; margin: 1.5em 0; color: #292929;  z-index: 6000; height: 98px; overflow: hidden}

blockquote.endorse {height: 162px; width: 300px; position: relative; margin-left: 13px; }
	
blockquote.program  {width:85%; }	

ul#blurbs {margin: 1.4em  0 0 0; padding: 0; }
ul#blurb_program {margin: 0; padding: 0; }

li.blurb {background-image: none; padding: 0; margin: 0}
	
#testimonials h3 {font-size: 153.9% ;margin: 0 0 .4em 0; line-height: 1.2em; color: #290A0B;  background-color: #fff}

#testimonials p  {font: italic 112%/138.5% Georgia, "Times New Roman", serif; margin: 0 0 .4em 0; color: #292929; background-color: #fff }
		#testimonials p.source {margin: 0; }
		#blurb_program p {font-size: 108%; line-height: 136%}

#testimonials cite { display: block; font: normal .8em  'Trebuchet Ms', georgia, "Times New Roman", serif; margin: 0 1em 0 0; color: #290A0B;  background-color: #efefef; text-align: right; position: absolute; bottom: 5px; right: 44px   }
	

/*----- Slideshow -----------*/

/* image replacement */
.graphic, #prevBtn, #nextBtn, #slider1prev, #slider1next{ margin:0; padding:0; display:block; overflow:hidden;
text-indent:-8000px;}

#slider {float: left;  width: 430px; height: 354px; margin: .5em 0 1.5em 1.2em; overflow: hidden; position: relative; display: inline; border: 10px solid #e9e9e9}

#slider h4 {margin: .2em 0 .3em 0}
#slider img { margin-bottom: 2px;}

#slider ul, #slider li {margin:0;padding:0;list-style:none; background: none }
	#slider li { float: left;  width: 430px; height:354px;overflow:hidden; }

div.slide_container {display: block; margin: 8px 14px} 	
p.caption {display: block; margin: 0; padding: 0; font-family: georgia; font-style: italic; font-size: 1.1em; line-height: 1em}	
		
#prevBtn, #nextBtn,#slider1next, #slider1prev { display:block; height:77px; width: 47px;  z-index:1000;
position:absolute; left: 17px;  top: 220px}
	#nextBtn, #slider1next{left:492px; top: 220px}		
	
	#prevBtn a, #nextBtn a, #slider1next a, #slider1prev a{display:block;position:relative; height:77px; width: 47px; background:url(/img/bg/leftarrow.png) no-repeat 0 0}	
	#nextBtn a, #slider1next a {background:url(/img/bg/rightarrow.png) no-repeat 0 0;}	
	

/*----- Carousel -----------*/

#carousel_container {height:130px;width:850px; background: transparent url(/img/bg/filmstrip_bg.png) no-repeat 6px 3px }

.slider {float:left;left: -5000px; position:relative; visibility:hidden;}
	
.slider ul {height:100px;width:600px;margin: 0 0 0 30px; }
	.slider ul li {padding:0 20px;padding: 1px; background: none}
		.slider ul li img {height:100px;width: 150px;padding-top:3px; }

.prev {cursor:pointer; float:left;padding-top:25px;}
.next {cursor:pointer; float:right; padding-top:25px;}

.caption-bottom {background: #000; color: #fff; cursor:default;padding:2px;font-size:11px; text-align:center; border-width:0px;}

.caption a, .caption a {background:#000;border:none; text-decoration:none;  padding:2px;}
	.caption a:hover, .caption a:hover {background:#202020;}


/*----- Map -----------*/

#map {padding: 10px 5px 5px 10px; border: 4px double #78AF62; margin: 0 0 1em 0; width: 490px; height:360px; }
.location #main {width: 512px}


form#lookup {width: 512px; clear: left; padding: 0; display: block; margin: 1.3em 0 2px 0}
#lookup label {float: left;}
	label.medium {width: 226px;}
	label.smaller {width: 166px;}
     input.medium {width: 166px; margin: 0 0 0 3px}	
     input.smaller {width: 126px; margin: 0 0 0 3px}
     input#getdirections {width: 124px; position: absolute; top: 7px; right: 0; height: 25px; line-height: 20px; margin: 0}
   
#sidebar big {font-size: 1.3em; font-family: Georgia, Garamond, serif;  line-height: 1.3em}
	.mailing {font-size: .9em;  display: block; margin: 0 0 1em .45em; padding: 0 0 1em 0; border-bottom: 1px solid #ddd}
	.indent {display: block; text-indent: .45em}
	
#sidebar small {text-transform: uppercase; font-size: .75em; letter-spacing: 1px}	   

div.googledir a {color: #292929; font-family: Georgia, Garamond, serif;}

div.googledir td {line-height: 1.35;}

/*================ FOOTER =============================*/

#footer a:link, #footer a:visited { color: #fff; margin: 0px 3px; font-size: 1.1em; border-bottom: 1px dotted #D75B5F}
	#footer a:hover {color: #d1e0ef}
#footer .tel { font-size: 1.5em; margin-left: 6.5em}
#footer  a.add {font-size: 1em; }
#footer .street-address {position: absolute; bottom: .8em; right:1em; line-height: 1.3em}



/*================ IE OVERRIDES =========================*/

* html body {overflow: hidden; }
* html .slider {position: absolute}
* html #content {height: 500px; }
* html h1 {line-height: 1.1em;}
	* + html h1 {line-height: 1.1em; }
* html h1 a small {top: -8px;}	
	* + html h1 small {top: -8px;}	
* html input, textarea {padding:2px 5px 5px 5px}
	* + html input,	* + html textarea {padding:2px 5px 5px 5px}
* html label label.error {top: -.65em;}
	* + html label label.error {top: -.65em}
* html input.button {padding: 3px 0} 
	* + html input.button {padding: 3px 0}
* html form#lookup {margin: 0 0 8px 0}
	* + html form#lookup {margin: 0 0 8px 0}	
* html table {border-collapse: collapse; }
	* + html table {border-collapse: collapse; }
* html #nav li.last {top: -7px;}
	* + html #nav li.last {top: -7px;}
* html #carousel_container {height:100px;}
* html #footer .street-address { line-height: 1.7em; bottom: .65em;}
	* + html #footer .street-address {line-height: 1.7em;  bottom: .65em;}
* html h4.nudge_up {margin: 0 0 .55em 0;}
	* + html h4.nudge_up {margin: 0 0 .55em 0;}
	
	
/*================ SAFARI and CHROME OVERRIDES =========================*/	

	@media screen and (-webkit-min-device-pixel-ratio:0){
	th.age { font-variant: normal; text-transform: uppercase; font-size: .85em}
	table {margin: 2.2em 0 0 0}
	#nav li.last {top: -8px;}
	input.button {padding: 4px 0 3px 0}
	body.location input.button {padding: 3px 0}
}