/* Reset all styles *********************************************************/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}
li {list-style:none;}
caption,th {text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
sup,sub {line-height:-1px;vertical-align: text-top;}
sub {vertical-align:text-bottom;}
input, textarea, select{font-family:inherit;font-size:inherit;font-weight:inherit;}

/* standard html tags *******************************************************/
html {
	background: #e0d6e0 url(img/html-bg.gif) top repeat-x;
}

body {
	font-family: "Trebuchet MS", Arial, sans-serif;
	font-size: 82%;
	line-height: 1.5;	
	}

.container {
	margin: 0 auto;
	width: 900px;
	}

a, a:link, a:visited {
	color: #636;
	text-decoration: none;
	outline: none;
}
a:hover {
	text-decoration: underline;
}

acronym {
	border-bottom: 1px dotted;
}

em {
	font-family: serif; 
	font-size: 110%;
	font-style: oblique;
}

h1, h2, h3, h4, h5, h6, em {
	color: #636;
	font-weight: bold;
	margin: 0;
	margin-bottom: .75em;
}

h2 {font-size: 2em;}
h2 {font-size: 1.75em;}
h3 {font-size: 1.5em;}
h4 {font-size: 1.25em;}
h5 {font-size: 1em;}

img {border: none;}

p {
	margin-bottom: 1.5em;
}

strong {font-weight: bold;}

/* Layout *******************************************************************/
#header {
	background: #a4c9eb url(img/header-bg.gif) top no-repeat;
	border-right: 2px solid #636;
	border-left: 2px solid #636;	
	height: 270px;
	}

#header h1 {display: none;}

#header #logo img {
	float: left;
	margin-top: 40px;
	margin-left: 40px;
}

#content {
	background: #a4c9eb;
	border-right: 2px solid #636;
	border-left: 2px solid #636;
}

#content #secondary {
	float: left;
	width: 250px;
}

#content #primary {
	margin-left: 250px;
	margin-right: 30px;
	/*margin: 0 30px;*/
}

#content #policy {
	margin-left: 30px;
	margin-right: 30px;
	/*margin: 0 30px;*/
}

#content #primary img {
	border: 2px solid #636;	
}

#content #primary .kids .kid {
	float: left;
	margin-bottom: 20px;
	text-align: center;
	width: 32%;
}
#content #primary .bio img {
	margin: 0 1em 0 0;
}
#content #primary ul#kidlist {
	list-style: none;
	margin: 0;
 	padding: 0;
}
#content #primary ul#kidlist li {
	float: left;
	padding: .5em 0;
}
#content #primary ul#kidlist li img {
	border-width: 1px;
	float: left;
	margin-right: .5em;
}
#content #primary ul#kidlist li a {
	display: block;
	height: 25px;
}

#content #primary div.puppeteer {
	margin: 1em 0;
}

#content #primary .sponsors .sponsor {
	float: left;
	height: 12em;
	text-align: center;
	width: 24%;
	background-color:#FFFFFF;
	}

#content .col-center {
	float: left;
	width: 400px;
}

#content .col-right {
	float: left;
	font-size: .916em;
	line-height: 1.5;
	margin: 10px 0 0 20px;
	width: 180px;
}

#contactInfo dl {margin-bottom: .5em;}
#contactInfo dt {font-weight: bold;}
#contactInfo dd {padding-left: 1em;}

#contact.home #secondary img {
	border: 2px solid #636;
}


#home #sponsors {
	background: url(img/home-sponsors-bg.gif) top no-repeat;
	clear: left;
	height: 144px;
	margin-top: 30px;
	background-color:#FFFFFF;
}
#home #sponsors h2 {display: none;}
#home #sponsors p {
	text-align: center;
	padding-top: 24px;
	margin-bottom: .5em;
}
#home #sponsors a.callout {
	display: block;
	text-align: center;
	margin-bottom: 5px;
}

#footer {
	background: url(img/footer-bg.gif) top center no-repeat;
	clear: both;
	height: 50px;
	margin: 0;
	padding: 0;
}

#footer p {
	margin: 0;
	padding-top: 2.5em;
	text-align: center;
	line-height: 1;
}

#home #footer {background-image: url(img/home-footer-bg.gif);}


/* forms ********************************************************************/

#content #primary form {
 	float: left;
	width: 100%;
}
#content #primary form fieldset {
	border: none;
	border-top: 1px solid #636;
	padding: 1em;
}
#content #primary fieldset fieldset {
	border-top: 1px solid #82a7c9;
	padding: 0;
}
#content #primary form fieldset legend {
	color: #636;
	font-weight: bold;
	padding: 0 .5em;
}
#content #primary form input[type="text"], 
#content #primary form textarea,
#content #primary form select {
	border: 1px solid #82a7c9;
	font-family: "Trebuchet MS", Arial, sans-serif;
	font-size: 1.2em;
	padding: .125em;
}
#content #primary form dl {margin: 1em 0;}
#content #primary form dl.horz {
	clear: both;
	padding: 0 .5em;
}
#content #primary form dl.horz dt {
	float: left;
	text-align: right;
	padding-right: .5em;
	width: 14em;
}
#content #primary form dl.horz dd {margin-left: 15em;}
#content #primary form dl.horz dd input[type="text"], 
#content #primary form dl.horz dd textarea {width: 15em;}
#content #primary form dl.horz dd ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

#content #primary form p.submit {
	border-top: 2px solid #636;
	padding: 1em;
	text-align: right;
}

#content #primary form #schedule div {
	margin-left: 15em;
}
#content #primary form #schedule h4 {
	color: #000;
	float: left;
	width: 8em;
}
#content #primary form #schedule dl {float: left;} 
#content #primary form #schedule fieldset dl {margin: .25em 0;}
#content #primary form #schedule dl.vert dt{
	float: left;
	padding: 0 .5em;
}
#content #primary form #schedule dl input {width: 5em;}

/* #main_nav Nav ************************************************************/
ul#main_nav {
	float: left;
	left: 71px;
	list-style: none;
	margin: 0;
	outline: none;
	padding: 0;
	position: relative;
	top: 97px;
	width: 400px;
}

ul#main_nav li {
	float: left;
	margin-left: 19px;
	margin-top: 14px;
}

ul#main_nav li a {
	background-position: top left;
	display: block;
	height: 36px;
	text-indent: -9999px;
	width: 178px;
}

ul#main_nav li.our_program a {background-image: url(img/btn-main-our_program.gif);}
ul#main_nav li.kids_corner a {background-image: url(img/btn-main-kids_corner.gif);}
ul#main_nav li.support_kotb a {background-image: url(img/btn-main-support_kotb.gif);}
ul#main_nav li.contact a {background-image: url(img/btn-main-contact.gif);}

ul#main_nav li a:hover {background-position: top center;}

body#our_program ul#main_nav li.our_program a {background-position: top right;}
body#kids_corner ul#main_nav li.kids_corner a {background-position: top right;}
body#support_kotb ul#main_nav li.support_kotb a,
body#support ul#main_nav li.support_kotb a {background-position: top right;}
body#contact ul#main_nav li.contact a {background-position: top right;}


/* #sub_nav *****************************************************************/

ul#sub_nav {
	list-style: none;
	margin: 0;
	outline: none;
	padding: 0;
}

ul#sub_nav li a {
	background-position: top left;
	display: block;
	height: 34px;
	margin: 10px auto 0;
	outline: none;
	text-indent: -9999px;
	width: 194px;
}

ul#sub_nav li#sub-about a {background-image: url(img/btn-sub-about.gif);}
ul#sub_nav li#sub-curriculum a {background-image: url(img/btn-sub-curriculum.gif);}
ul#sub_nav li#sub-kids a {background-image: url(img/btn-sub-kids.gif);}
ul#sub_nav li#sub-puppeteers a {background-image: url(img/btn-sub-puppeteers.gif);}
ul#sub_nav li#sub-performance a {background-image: url(img/btn-sub-performance.gif);}

ul#sub_nav li a:hover {background-position: top center;}

body.about ul#sub_nav li#sub-about a {background-position: top right;}
body.curriculum ul#sub_nav li#sub-curriculum a {background-position: top right;}
body.kids ul#sub_nav li#sub-kids a {background-position: top right;}
body#kids ul#sub_nav li#sub-kids a {background-position: top right;}
body.puppeteers ul#sub_nav li#sub-puppeteers a {background-position: top right;}
body.performance ul#sub_nav li#sub-performance a {background-position: top right;}


body#kids #content #primary img,
body.kids #content #primary img {
	border: none;
}

/* HOME PAGE ****************************************************************/

body#home #content ul li {
	display: inline;
}

body#home #content ul li h2,
body#home #content ul li p {
	display: none;
}

body#home #content ul li a {
	display: block;
	height: 360px;
	float: left;
	margin-left: 18px;
	text-indent: -99999px;
	width: 420px;
}

body#home #content li.about a {background: url(img/about.png) top left no-repeat;}
body#home #content li.kids_corner a {background: url(img/kids_corner.png) top left no-repeat;}
body#home #content li.support a {background: url(img/support.png) top left no-repeat;}
body#home #content li.performance a {background: url(img/performance.png) top left no-repeat;}


/****** Curriculum **********************************************************/ 
body.curriculum #content #primary h3 {margin-bottom: 0;}
body.curriculum #content #primary img {border: none;}
ul.bullets li {
	background: url(img/li-bg.gif) top left no-repeat;
	margin-bottom: 1em;
	padding-left: 20px;
}

/****** bio *****************************************************************/ 
#content #primary .puppeteer h3 {
	padding-top: 1em;
}

#content #primary .puppeteer {
}

/****** becomePuppeteer **************/ 
#secondary .becomePuppeteer {
	background: url(img/becomePuppeteer-bg.gif) top left repeat-y;
	margin-left: 29px;
	margin-top: 29px;
	width: 193px;
}

#secondary .becomePuppeteer h2 {
	background: url(img/becomePuppeteer-header.gif) top left no-repeat;
	display: block;
	height: 30px;
	text-indent: -99999px;
}
#secondary .becomePuppeteer p {
	font-size: .9em;
}
#secondary .becomePuppeteer p strong {
	color: #636;
	font-size: 1.1em;
}
#secondary .becomePuppeteer a {
	background: url(img/findOurMore.gif) top left no-repeat;
	display: block;
	height: 24px;
	text-indent: -99999px;
	width: 124px;
}
#secondary .becomePuppeteer a:hover {
	background: url(img/findOurMore.gif) top right no-repeat;
}
#secondary .becomePuppeteer .body {
	background: url(img/becomePuppeteer-footer.gif) bottom left no-repeat;
	padding: 0 1em 1em 1em;
}

/* Donations *************************/
#secondary .donations {
	background: url(img/donate/body.gif) top left repeat-y;
	margin-left: 29px;
	width: 193px;
}
#secondary .donations h3 {
	background: url(img/donate/header.gif) top left no-repeat;
	display: block;
	height: 30px;
	text-indent: -99999px;
	width: 193px;	
}
#secondary .donations .body {
	background: url(img/donate/footer.gif) bottom left no-repeat;
	padding: 0 1em 1em 1em;
}
#secondary .donations ul li a {
	background-position: top left;
	display: block;
	height: 34px;
	margin: .25em .2em;
	text-indent: -99999px;
	width: 154px;
}
#secondary .donations ul li.d100 a {background: url(img/donate/100.gif);}
#secondary .donations ul li.d050 a {background: url(img/donate/050.gif);}
#secondary .donations ul li.d025 a {background: url(img/donate/025.gif);}
#secondary .donations ul li.d010 a {background: url(img/donate/010.gif);}
#secondary .donations ul li.d005 a {background: url(img/donate/005.gif);}
#secondary .donations ul li.d001 a {background: url(img/donate/001.gif);}
#secondary .donations ul li.dany a {background: url(img/donate/other.gif);}

#secondary .donations ul li a:hover {background-position: top right;}

/* Sponsors **************************/
#secondary .sponsors {
	background: url(img/sponsors/body.gif) top left repeat-y;
	margin-left: 29px;
	margin-top: 29px;
	width: 193px;
}
#secondary .sponsors h3 {
	background: url(img/sponsors/header.gif) top left no-repeat;
	display: block;
	height: 30px;
	text-indent: -99999px;
	width: 193px;	
}
#secondary .sponsors .body {
	background: url(img/sponsors/footer.gif) bottom left no-repeat;
	padding: 0 1em 1em 1em;
}


/* standard classes *********************************************************/
.clearfix:after,
#primary .puppeteer:after,
#content #primary .sponsors:after {
	clear: both;
	content: ".";
	display: block;
	font-size: 0;
	height: 0;
	visibility: hidden;
}

.alignleft {text-align: left;}
.alignright {text-align: right;}
.aligncenter {text-align: center;}
.clear {clear: both;}
.left {float: left;}
.right {float: right;}
.mute {color: #444; font-size: .86em;}

ul.images {
	margin-left: 30px;
	width: 260px;
}
ul.images p {
	color: #636;
	font-family: serif;
	font-size: 110%;
	font-style: oblique;
	line-height: 1.25;
}

/* Kids Corner **************************************************************/

#town {
	background: url(img/kids_corner/town/town.gif) top center no-repeat;
	position: relative;
	margin-top: -30px;
	width: 896px; height: 983px;
}

#town li,
#town li a {
	background-position: top left;
	background-repeat: no-repeat;
	display: block;
	position: absolute;
	text-indent: -99999px;
}

#town li a:hover {
	background-position: top right;
}

#town li.library a {
	background-image: url(img/kids_corner/town/library.png);
	top: 647px; left: 20px;
	width: 523px; height: 190px;
	z-index: 1;
}
#town li.arena a {
	background-image: url(img/kids_corner/town/arena.png);
	top: 527px; left: 488px;
	width: 384px; height: 217px;
	z-index: 1;
}
#town li.highschool a {
	background-image: url(img/kids_corner/town/highschool.png);
	top: 327px; left: 95px;
	width: 416px; height: 211px;
	z-index: 1;
}
#town li.hospital a {
	background-image: url(img/kids_corner/town/hospital.png);
	top: 271px; left: 598px;
	width: 256px; height: 136px;
	z-index: 1;
}
#town li.schoolbus a {
	background-image: url(img/kids_corner/town/schoolbus.png);
	top: 456px; left: 230px;
	width: 179px; height: 98px;
	z-index: 2;
}

#town li.town {
	background-image: url(img/kids_corner/town/town.png);
	top: 726px; left: 554px;
	width: 342px; height: 212px;
	z-index: 1;
}
#town li.playground {
	background-image: url(img/kids_corner/town/playground.png);
	top: 265px; left: 150px;
	width: 210px; height: 106px;
	z-index: 0;
}
#town li.dog {
	background-image: url(img/kids_corner/town/dog.png);
	top: 843px; left: 595px;
	width: 91px; height: 126px;
	z-index: 2;
}
#town li.baseball {
	background-image: url(img/kids_corner/town/baseball.png);
	top: 556px; left: 246px;
	width: 247px; height: 122px;
	z-index: 1;
}
#town li.flag {
	background-image: url(img/kids_corner/town/flag.png);
	top: 418px; left: 434px;
	width: 51px; height: 112px;	
	z-index: 3;
}


/* KC Nav ********/

#kcn {
	margin: 0 auto;
	margin-top: -30px;
	position: relative;
	top: 40px;
	width: 768px;
	z-index: 1;
}

#kcn li {
	display: inline;
}

#kcn li a {
	background-position: top left;
	background-repeat: no-repeat;
	display: block;
	float: left;
	text-indent: -99999px;
	width: 128px; height: 80px;
}

#kcn li a:hover {background-position: top right;}

#kcn li.town       a {background-image: url(img/kids_corner/kcn/town.png);}
#kcn li.schoolbus  a {background-image: url(img/kids_corner/kcn/schoolbus.png);}
#kcn li.library    a {background-image: url(img/kids_corner/kcn/library.png);}
#kcn li.hospital   a {background-image: url(img/kids_corner/kcn/hospital.png);}
#kcn li.highschool a {background-image: url(img/kids_corner/kcn/highschool.png);}
#kcn li.arena      a {background-image: url(img/kids_corner/kcn/arena.png);}

body#kids_corner.bus        #kcn li.schoolbus  a {background-position: top center;}
body#kids_corner.library    #kcn li.library    a {background-position: top center;}
body#kids_corner.hospital   #kcn li.hospital   a {background-position: top center;}
body#kids_corner.school #kcn li.highschool a {background-position: top center;}
body#kids_corner.arena      #kcn li.arena      a {background-position: top center;}

/* Bus *******************************/
#bus {
	background: url(img/kids_corner/bus/bus.gif) top center no-repeat;
	border-top: 5px solid #00467F;
	clear: left;
	position: relative;
	/*top: -40px;*/
	width: 896px; height: 523px;
	z-index: 0;
}

#bus li,
#bus li a {
	background-position: top left;
	background-repeat: no-repeat;
	display: block;
	position: absolute;
	text-indent: -99999px;
	z-index: 1;
}

#bus li a:hover {
	background-position: top right;
}

#bus li.eddie a {
	background-image: url(img/kids_corner/bus/eddie.png);
	top: 241px; left: -20px;
	width:172px; height: 170px;
}

#bus li.david a {
	background-image: url(img/kids_corner/bus/david.png);
	top: 257px; left: 167px;
	width:162px; height: 153px;
}

#bus li.brenda a {
	background-image: url(img/kids_corner/bus/brenda.png);
	top: 260px; left: 596px;
	width:180px; height: 147px;
}

#bus li.joanne a {
	background-image: url(img/kids_corner/bus/joanne.png);
	top: 62px; left: 546px;
	width:137px; height: 113px;
	z-index: 2;
}

#bus li.melody a {
	background-image: url(img/kids_corner/bus/melody.png);
	top: 159px; left: 692px;
	width:169px; height: 148px;
}

#bus li.renaldo a {
	background-image: url(img/kids_corner/bus/renaldo.png);
	top: 112px; left: 558px;
	width:159px; height: 146px;
}

#bus li.ellen a {
	background-image: url(img/kids_corner/bus/ellen.png);
	top: 102px; left: 115px;
	width:155px; height: 146px;
}

#bus li.mark a {
	background-image: url(img/kids_corner/bus/mark.png);
	top: 73px; left: 254px;
	width:186px; height: 289px;
}

/* Library ***************************/
#library {
	background: url(img/kids_corner/library/background.gif) top center no-repeat;
	border-top: 5px solid #00467F;
	clear: left;
	position: relative;
	/*top: -40px;*/
	width: 896px; height: 523px;
	z-index: 0;
}

#library li,
#library li a {
	background-position: top left;
	background-repeat: no-repeat;
	display: block;
	position: absolute;
	text-indent: -99999px;
	z-index: 1;
}

#library li a:hover {
	background-position: top right;
}

#library li.redBook a {
	background-image: url(img/kids_corner/library/redBook.png);
	top: 350px; left: 260px;
	width:152px; height: 70px;
}
#library li.blueBook a {
	background-image: url(img/kids_corner/library/blueBook.png);
	top: 365px; left: 410px;
	width:114px; height: 74px;
}
#library li.greenBook a {
	background-image: url(img/kids_corner/library/greenBook.png);
	top: 350px; left: 520px;
	width:152px; height: 70px;
}
#library li.picture a {
	background-image: url(img/kids_corner/library/picture.png);
	top: 50px; left: 600px;
	width:206px; height: 124px;
}

/* Arena *****************************/
#arena {
	background: url(img/kids_corner/arena/background.gif) top center no-repeat;
	border-top: 5px solid #00467F;
	clear: left;
	position: relative;
	/*top: -40px;*/
	width: 896px; height: 523px;
	z-index: 0;
}

#arena li,
#arena li a {
	background-position: top left;
	background-repeat: no-repeat;
	display: block;
	position: absolute;
	text-indent: -99999px;
	z-index: 1;
}

#arena li a:hover {
	background-position: top right;
}

#arena li.baseball a {
	background-image: url(img/kids_corner/arena/baseball.png);
	top: 330px; left: 120px;
	width:242px; height: 139px;
}
#arena li.basketball a {
	background-image: url(img/kids_corner/arena/basketball.png);
	top: 106px; left: 240px;
	width:112px; height: 112px;
}
#arena li.soccer a {
	background-image: url(img/kids_corner/arena/soccer.png);
	top: 118px; left: 480px;
	width:131px; height: 202px;
}
#arena li.football a {
	background-image: url(img/kids_corner/arena/football.png);
	top: 212px; left: 330px;
	width:124px; height: 91px;
}
#arena li.hockey a {
	background-image: url(img/kids_corner/arena/hockey.png);
	top: 90px; left: 500px;
	width:162px; height: 371px;
}
#arena li.volleyball a {
	background-image: url(img/kids_corner/arena/volleyball.png);
	top: 284px; left: 280px;
	width: 106px; height: 104px;
}
#arena li.marksled a {
	background-image: url(img/kids_corner/arena/marksled.png);
	top: 270px; left: 420px;
	width: 478px; height: 252px;
}

/* Class *****************************/
#class {
	background: url(img/kids_corner/class/background.gif) top center no-repeat;
	border-top: 5px solid #00467F;
	clear: left;
	position: relative;
	/*top: -40px;*/
	width: 896px; height: 523px;
	z-index: 0;
}

#class li,
#class li a {
	background-position: top left;
	background-repeat: no-repeat;
	display: block;
	position: absolute;
	text-indent: -99999px;
	z-index: 1;
}

#class li a:hover {
	background-position: top right;
}

#class li.computer a {
	background-image: url(img/kids_corner/class/computer.png);
	top: 290px; left: 220px;
	width: 184px; height: 172px;
}
#class li.drawings a {
	background-image: url(img/kids_corner/class/drawings.png);
	top: 90px; left: 80px;
	width: 189px; height: 118px;
}
#class li.quiz a {
	background-image: url(img/kids_corner/class/quiz.png);
	top: 90px; left: 304px;
	width: 91px; height: 102px;
}
#class li.survey a {
	background-image: url(img/kids_corner/class/survey.png);
	top: 384px; left: 400px;
	width: 98px; height: 84px;
}
#class li.newspaper a {
	background-image: url(img/kids_corner/class/newspaper.png);
	top: 354px; left: 500px;
	width: 158px; height: 117px;
}
/* Hospital **************************/
#hospital {
	background: url(img/kids_corner/hospital/background.gif) top center no-repeat;
	border-top: 5px solid #00467F;
	clear: left;
	position: relative;
	/*top: -40px;*/
	width: 896px; height: 523px;
	z-index: 0;
}

#hospital li,
#hospital li a {
	background-position: top left;
	background-repeat: no-repeat;
	display: block;
	position: absolute;
	text-indent: -99999px;
	z-index: 1;
}

#hospital li a:hover {
	background-position: top right;
}

#hospital li.computer {
	background-image: url(img/kids_corner/hospital/computer.png);
	top: 204px; left: 456px;
	width: 184px; height: 172px;
}
#hospital li.schedule a {
	background-image: url(img/kids_corner/hospital/schedule.png);
	top: 60px; left: 40px;
	width: 175px; height: 161px;
}
#hospital li.critter a {
	background-image: url(img/kids_corner/hospital/critter.png);
	top: 60px; left: 660px;
	width: 181px; height: 142px;
}
#hospital li.dog {
	background-image: url(img/kids_corner/hospital/dog.png);
	top: 370px; left: 516px;
	width: 112px; height: 154px;
}
#hospital li.treats {
	background-image: url(img/kids_corner/hospital/treats.png);
	top: 284px; left: 256px;
	width: 120px; height: 77px;
}





#kids_corner #footer {background-image: url(img/kids_corner/town/footer-bg.gif);}
#kids_corner.bus #footer {background-image: url(img/kids_corner/bus/footer-bg.gif);}
#kids_corner.library #footer {background-image: url(img/kids_corner/library/footer-bg.gif);}
#kids_corner.arena #footer {background-image: url(img/kids_corner/arena/footer-bg.gif);}
#kids_corner.school #footer {background-image: url(img/kids_corner/class/footer-bg.gif);}
#kids_corner.hospital #footer {background-image: url(img/kids_corner/hospital/footer-bg.gif);}


#email.email {
	background-image: url(css/img/email_back.png);
}
