@charset "utf-8";
/*img.png, #top_nav img, #header img, #bttom_nav li, a.house { behavior: url(/code/iepngfix.php) }*/
/*img, div, a, a:hover { behavior: url(/code/iepngfix.php) }*/
/* CSS Document */
	  body,div,dl,dt,dd,ol,ul,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
margin: 0;
padding: 0;
}
  
html { font-size: 13px; font-family: "Comic Sans MS", cursive; }
/* CSS Document */
/* Colors:
Red: EC1C24
Aqua: 80DADC
Dark Blue 006BB5
Bright Green 009345
Text: 333
light aqua: c8f3f4

* {border: 1px solid #CCCCCC;}

*/

/* basic elements */

html {
	margin: 0;
	padding: 0;
	background: url(/images/hooves_bg.gif);
	height:100%;
	}
body {
    font: 12px Verdana, sans-serif;;
	line-height: 1.6em; 
	color: #333; 
	margin: 0; 
	padding: 0;
	
	}
body.village, .village2, .home #right_content, .kids, .sir_save_story {
    font: 12px "Comic Sans MS", cursive, trebuchet, sans-serif;
	line-height: 1.6em; 
	color: #333; 
	margin: 0; 
	padding: 0;
	}
p { 
	margin-top: .5em; 
	text-align: left;
	}
/*h1 {
	font: normal 32px Georgia, "Times New Roman", Times, serif;
	color: #EC1C24;
	margin: 0;
	
}
h2 { 
	font: normal 1.6em Verdana, sans-serif; 
	margin-top: 0;
	margin-bottom: .5em;
	color: #006BB5;
	}
h3 { 
	font: normal Georgia, "Times New Roman", Times, serif;
	letter-spacing: 1px; 
	margin-bottom: 0; 
	color: #80DADC;
	}*/
h1 {
	font: normal 32px Georgia, "Times New Roman", Times, serif;
	color: #EC1C24;
	margin: 0;
	
}
h2 { 
	font-size:22px;
	font-weight:normal; 
	color: #006BB5;
	line-height:1.1em;
	}

h3 { 
	font: normal Georgia, "Times New Roman", Times, serif;
	font-size:18px;
	margin-bottom: .2em; 
	color: #EC1C24;
	}
p + h3, p + h2 { 
	margin-top:.5em;
	}		
h4 { 
	font-size:14px;
	font-weight:bold;
	margin-bottom: .2em; 
	display:block;
	}		
a:link { 
    text-decoration: underline;
	color: #006BB5;	
	}
a:visited { 
    text-decoration: underline;
	color: #006BB5;	
	}
a:hover, a:active { 
    text-decoration: underline;
	color: #EC1C24;
	cursor:pointer;	
	}
	
img, a img {
	border:0;
}

/*********************** 

Specific tags, all pages 

**********************/

#header {
	position:absolute;
	z-index:5;
	top:0px; left:0px;
	width:100%;
	height:190px;
	background-color:#FFFFCC;
	background: url(/images/card_bg.gif) repeat;
}
#header h1 {
	position:absolute;
	width:500px;
	bottom:-40px;
	left:455px;
	z-index:12;
	color:#333333;
	text-align:right;
}


#sir-save {
	/*position:absolute;*/
	position:relative; /*cg 3/15/09*/
	z-index:10;
	top:0px; left:455px;
	width:500px; /*500*/
	height:190px; /*190*/
	margin:0;
	/*background: url(/images/pig_placeholder.png);*/
}

#sir-save img {
 z-index:10;
}

#sir-save div {
 z-index:11;
 position: absolute;
 width:297px;
 top:15px;
 left:10px;
 height:160px;
 overflow:hidden;
}
#sir-save div p	{
	font-size:16px;
	line-height:1em;
	margin-top:0;
	padding-bottom:.2em;

}
#sir-save a:link, #sir-save a:active, #sir-save a:visited {
	text-decoration:none;
}
#main_content {
/*padding-top:190px;*/
padding-top:50px; /*cg 3/15/09*/
width:955px;
min-height:300px;		

}

#footer {
width:955px;
height:40px;
clear:both;
}
#footer a#logo {
float:right;
}

.error {
	color:#EC1C24;
}

/* 
Main Navigation 
*/
ul#top_nav {
position:absolute;
height:80px; width:420px;
margin:0; padding:0;
bottom:-15px;
left:10px;
z-index:12;
}
ul#top_nav li, #top_nav li a img, #top_nav li a {
display:inline;
height:80px;
width:80px;
margin:0; padding:0; border:none;
}
ul#top_nav li.one a img { background: url(/images/nav_village.png); }
ul#top_nav li.two a img { background: url(/images/nav_goals.png); }
ul#top_nav li.three a img { background: url(/images/nav_chores.png); }
ul#top_nav li.four a img { background: url(/images/nav_progress.png); }
ul#top_nav li.five a img { background: url(/images/nav_logs.png); }

ul#top_nav li.one a:hover img { background: url(/images/nav_village_on.png); }
ul#top_nav li.two a:hover img { background: url(/images/nav_goals_on.png); }
ul#top_nav li.three a:hover img { background: url(/images/nav_chores_on.png); }
ul#top_nav li.four a:hover img { background: url(/images/nav_progress_on.png); }
ul#top_nav li.five a:hover img { background: url(/images/nav_logs_on.png); }


#left_nav {
float:left;
width:285px;
padding: 25px 0 0 10px;
margin-right:10px;
}
#right_content {
float:left;
width:650px;
}


ul#bottom_nav {
float: left;
margin: 0 0 0 10px; padding:0;
}
ul#bottom_nav li, #bottom_nav li a img, #bottom_nav li a {
display:inline;
height:40px;
width:110px;
margin:0; padding:0; border:none;
}
ul#bottom_nav li.one a img { background: url(/images/bottom_nav_01.png); }
ul#bottom_nav li.two a img { background: url(/images/bottom_nav_02.png); }
ul#bottom_nav li.three a img { background: url(/images/bottom_nav_03.png); }
ul#bottom_nav li.three_logged_in a img { background: url(/images/nav_parentlogout.png); }
ul#bottom_nav li.four a img { background: url(/images/nav_parenthome.png); }
ul#bottom_nav li.five a img { background: url(/images/nav_logout.png); }

ul#bottom_nav li.one a:hover img { background: url(/images/bottom_nav_on_01.png); }
ul#bottom_nav li.two a:hover img { background: url(/images/bottom_nav_on_02.png); }
ul#bottom_nav li.three a:hover img { background: url(/images/bottom_nav_on_03.png); }
ul#bottom_nav li.three_logged_in a:hover img { background: url(/images/nav_parentlogout_on.png); }
ul#bottom_nav li.four a:hover img { background: url(/images/nav_parenthome_on.png); }
ul#bottom_nav li.five a:hover img { background: url(/images/nav_logout_on.png); }



/*End Template CSS
*/

/* Slider CSS - CG is this correct?
*/
/*#heading {
	display: block;
	text-align: center;
	margin-bottom: 1em;
}*/

#heading * {
cursor:pointer;
display:inline;
padding:4px;
vertical-align:middle;
}
			
#heading * {
	display: inline;
	padding: 4px;
	user-select: none;
	cursor: pointer;
	vertical-align: middle;
}
#heading li.active {
	background-color: #66ccff;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-opera-border-radius: 3px;
	-moz-border-radius: 3px;
}

#wrapper { 
/*	border: 1px dotted gray; */
	}

#panes {
	border-style: none;
	width: 955px;
	margin: 0 auto 0 auto;
}
#panes ul {
	list-style:none;
	}

/* Removed TF
#panes p {
  width: 600px;
  margin: 0 auto 1em auto;
  line-height: 1.2em;
}


#panes div div { overflow: hidden; }
*/

#previous { float: none; cursor: pointer; }
#next { float: none; cursor: pointer; }

/*Kids Page Chores List CSS	*/


li.chore div {
	height:0px;
	/*overflow: hidden;*/
	width:955px;
}

#chore_list {
	width: 935px;
	display: inline;
}
#chore_list li.chore  li {
	display: inline;
	font-size: 11px;
	line-height: 13px;
	float: left;
	padding: 0px 10px 0px 0px;
	margin: 0px 0px 0px 0px;
}

#chore_list li.chore  li h2{
display:inline;
}
	
#chore_list li.chore {
	background-color:#D1F2F2;
	float:left;
	width:100%;
	padding: 5px 0 5px 0;
	margin: 0 0 5px 0;
	height:35px;
	overflow: hidden;
	list-style-type:none;
	display:inline-block;
}
#chore_list li img {
	float: left;
	margin: 0 5px 0 10px; padding: 0px;
}
#chore_list h2 { 
	font-size: 24px;
	line-height: 28px; 
	margin:0;
	color: #006BB5;
	height:40px;
	min-width: 200px;
	vertical-align:middle;
	display: inline-block;
	}
#chore_list textarea {
width:400px;
height: 40px;
margin-left:10px;
	}
#chore_list li.chore li.expand {
	float:right;
}
	
/* END Kids Page Chores List CSS	*/

/*Overlay Pop up windows, rest of the style is inline*/
.cbOverlay {
	z-index:200;
	}
.cbContainer {
	z-index:201;
	}
/* END Overlay Pop up windows*/


.myform{
margin:0 auto 15px;
width:400px;
padding:14px;
/*min-height:500px;
 height:auto !important;
 height:500px;*/
}

div.myform ul li{
  list-style:none;
  }
  
div.myform li {
  margin-bottom:20px;
}  

div.sign_in{
border:solid 2px #b7ddf2;
background:#ebf4fb;
}
div.sign_in h1 {
font-size:14px;
font-weight:bold;
margin-bottom:8px;
}
div.sign_in p{
/*font-size:11px;
color:#666666;*/
margin-bottom:20px;
border-bottom:solid 1px #b7ddf2;
padding-bottom:10px;
}
div.sign_in label{
display:block;
font-weight:bold;
text-align:right;
width:140px;
float:left;
clear:left;
}
div.sign_in .small{
color:#666666;
display:block;
font-size:11px;
font-weight:normal;
text-align:right;
width:140px;
line-height:1.1em;

}
div.sign_in input, div.sign_in select, div.sign_in textarea {
/*float:left;
*/font-size:12px;
padding:4px 2px;
border:solid 1px #aacfe4;
width:200px;
margin:2px 0 20px 10px;
}
div.sign_in .button{
	clear:both;
	margin-left:150px;
	width:125px;
	background:#666666 ;
	text-align:center;
	line-height:1.2em;
	color:#FFFFFF;
	font-size:11px;
	font-weight:bold;
}

/*div.sign_in a{
clear:both;
float:left;
}

div.sign_in a:link, div.sign_in a:visited, div.sign_in a:active {
text-decoration:none;
color:#666666;
}*/

div.sign_in a:hover{
color:#000000;
}

ul.inline {
float: left;
  width: 40em;
 margin: 0;
  padding: 0;
}
ul.inline li {
  display: inline;
 float: left;
  width: 10em;
   margin: 0;
  padding: 0;
  font-size:10px;
  }
ul.inline2 {/*chores list under parents view*/
float: left;
  width: 80em;
 margin: 0;
  padding: 0;
}
ul.inline2 li {
  display: inline;
 float: left;
  width: 16em;
   margin: 0 0 10px 0;
  padding: 0;
  text-align:center;
  
  }
    
li.title {
font-size:12px;
font-weight:bold;
text-align:center;
}

/*li.completed {
background-color:#FF0099;
}*/
.hidden {
	opacity: 0;
	position: absolute;
}
.visible {
	opacity: 1;
}


input.calendar,
select.calendar {
	width: 99px;
}

button.calendar {
	background: url(/images/calendar-icon.gif);
	border: 0;
	cursor: pointer;
	height: 20px;
	margin-right: 6px;
	width: 20px;
}
button.calendar:hover,
button.calendar.active {
	background-position: 0 20px;
}

div.calendar {
	background: url(/images/calendar.png);
	height: 195px;
	padding: 0 6px;
	text-align: center;
	width: 147px;
	
}	
	div.calendar * {
		margin: 0;
		padding: 0;
	}	
	div.calendar div {
		background: none !important;
		cursor: move;
		height: 185px;
		overflow: hidden;
		padding-top: 10px;
		position: relative;
		width: 147px;
		
		
	}	
	
	div.calendar caption {
		color: #333;
		font: normal 12px/16px Arial, Helvetica, sans-serif;
		padding-top: 6px;
		text-align: center;
		width: 100%;
	}
	div.calendar caption a {
		cursor: pointer;
		display: block;
		height: 12px;
		overflow: hidden;
		position: absolute;
		text-indent: -100px;
		top: 17px;
		width: 11px;
	}
	div.calendar caption a.prev {
		background-image: url(/images/calendar-prev.gif);
		left: 0;
	}
	div.calendar caption a.next {
		background-image: url(/images/calendar-next.gif);
		right: 0;
	}
	div.calendar caption a:hover {
		background-position: 0 12px;
	}
	div.calendar caption span {
		height: 25px;
		position: relative;
		text-align: center;
	}
	div.calendar caption span.month {
		padding-right: 8px;
	}
	div.calendar caption span.month:after {
		content: ',';
	}

	div.calendar table {

		background: #FFF;
		border: 0;
		border-collapse: collapse;
		border-spacing: 0;
		cursor: default;
		margin: 0 auto;
		overflow: hidden;
		width: 147px;
	}
	div.calendar td,
	div.calendar th {
		border: 0;
		color: #0597DB;
		font: normal 12px Arial, Helvetica, sans-serif;
		height: 21px;
		text-align: center;
		width: 21px;
	}
	div.calendar td {
		background: url(/images/calendar-td.gif);
		color: #FFF;
		font-size: 11px;
	}
	div.calendar td.invalid {
		color: #999;
	}
	div.calendar td.valid {
		background: url(/images/calendar-valid.gif);
		color: #0597DB;
		cursor: pointer;
	}
	div.calendar td.hilite {
		background: url(imgaes/calendar-hilite.gif);
	}
	div.calendar td.inactive {
		background: url(/images/calendar-td.gif) 0 100%;
		color: #FFF;
	}
	div.calendar td.active,
	div.calendar td.hover {
		background: url(/images/calendar-valid.gif) 0 100%;
		color: #FFF;
		cursor: pointer;
	}

/*styles for view goals page*/
ul#goal_list {
	width: 955px;
	display: inline;
}
#goal_list li.goal li {
	display: inline;
	font-size: 11px;
	line-height: 13px;
	padding: 0px 10px 0px 0px;
	margin: 0px 0px 0px 0px;
	float:left;
}	
#goal_list li.goal {
	float:left;
	width:100%;
	padding: 5px 0 5px 0;
	margin: 0 0 5px 0;
	border: 1px dashed #999999;
}
li.goal li img {
	float: left;
	margin: 0 5px 0 10px; padding: 0px;
}
#goal_list h2 {
	font-size: 24px;
	line-height: 28px; 
	margin:0;
	color: #006BB5;
	vertical-align:top;
	height:35px;
	}
#goal_list h2 img {
	margin: 0 5px 0 10px;
}	
div.textarea {
width:300px;
height: 82px;
margin: 0 0 3px 10px;
padding: 2px 0 2px 2px;
border:1px solid #CCC;
overflow:auto;
}

.area{
/*#area0, #area1, #area2, #area3 {*/
	background: url(/images/slider_bg.gif) repeat-x;
	border: 1px solid #CCCCCC;
	height: 20px;
	width: 200px;
	float:left;
}
.knob{
/*#knob0, #knob1, #knob2, #knob3{*/
	height: 20px;
	width: 20px;
	background: url(/images/slider_box.gif);
	cursor:w-resize;
}
.goal p {
text-align:left;
clear:left;
}	
.drag {
	position:relative;
	padding-right:100px;	
	}
.coins {
	position: absolute;
	left:0px; bottom:-100px;
	width:100px;
	height:100px;
	margin:0px 0px 0px 0px;
	overflow:hidden;
}

.piggybank {
	position: absolute;
	top:0px; left:0px;
	width:100px;
	height:100px;
	margin:0px 0px 0px 0px;
	cursor:move;
	}
li.goal_image img {
	height:100px;
	width:100px;
}
td img {
	float:left;
}

/*Tooltip Rollover Effects*/

span.tooltip, a.tooltip, a.tooltip:visited {
    position:relative;
    z-index:24; background-color:#ffffff;
    color:#d60000;
    text-decoration:none;
	cursor:help;
	}
span.tooltip:hover, a.tooltip:hover{z-index:25; background-color:#fff}

span.tooltip span, a.tooltip span{display: none;}

span.tooltip:hover span, a.tooltip:hover span{ 
    display:block;
    position:absolute;
    top:0; left:2em; width:15em;
    border:3px solid #80DADC;
	padding:5px;
    background-color: #FFFF99; color:#000000;
    text-align: left;
	}
/*End Tooltip Rollovers*/

/*alert box layover for goals page*/
		.cbOverlay {
			background-color: #80DADC;
		}
		
		.cbContainer {
			padding:5px;
			background-color:white;
			
		}
		.cbBox h3 {
			font-size:1.4em;
			margin:2px;
			background-color:#fff;
		}
		.cbBox p {
			margin:3px;
		}
		.cbBox .cbButtons {
			text-align:center;
		}
				
		pre {font-family: monospace;
			border:1px solid #80DADC;
			height:300px;
			overflow:auto;
			font-size:1.2em;
			background-color:#80DADC;
			min-width:600px;
		}
		.closeButton {
			position:absolute;
			top:10px;
			right:10px;
		}
		
		.close_goal{
		 font-size:12px;
		}
		.close_goal a, a:link, a:hover{
		 text-decoration:none;
		}
/*end styles for goals page*/

/*Chores Completion page*/

.chores_comp #wrapper {
	padding: 58px 50px 80px 50px;
	margin-bottom:60px;
	background: url(/images/calendar-background.gif) no-repeat;
	height:274px;
	width:529px;
	float:left;
	/*position:relative;
	clear:none;*/
	position:absolute;
	left:350px;
}
.chores_comp #wrapper h2 {
	margin-left:265px;
	color:#ffffff;	
	}
.chores_comp #main_content #left_nav {
position:relative;
float:left;
width:290px;
padding: 25px 0 0 15px;
clear:none;
}
.chores_comp #main_content li {
	font-size:20px;
	line-height:24px;
	list-style-type:none;
}
.chores_comp #wrapper ul {
	margin-top:15px;	
	}
.chores_comp li a img {
	margin-right:5px;
	background: url(/images/checkbox.png) no-repeat;	
}
.chores_comp li a:hover img {
	background: url(/images/checkbox_on.png) no-repeat;
	text-decoration:none;	
}
.chores_comp li a:active {
	text-decoration:line-through;
}
.chores_comp li.completed  {
   text-decoration:line-through;
}
.chores_comp li.completed  img {
   background: url(/images/checkbox_on.png) no-repeat;
}

		
a#next_wk img {	background: url(/images/next_week.png) no-repeat;	}
a:hover#next_wk img {	background: url(/images/next_week_on.png) no-repeat;	}
a#previous_wk img {	background: url(/images/last_week.png) no-repeat;	}
a:hover#previous_wk img {	background: url(/images/last_week_on.png) no-repeat;	}

.chores_comp #heading	{
	position:absolute;
	/*bottom:0px;*/
	left:10px;
	z-index:55;
	top:375px;
	width:650px;
	
	}
.chores_comp #heading li {
	font-size:14px;
	font-weight:bold;
	color:#ffffff;
	}	

.chores_comp #footer {
  /*position:absolute;
  bottom:65px;*/
  margin-top:200px;
}
/*end Chores Completion page*/

/*village stuff*/
.village #right_content {
	position:relative;
	height:400px;
	width:650px;
	background: url(/images/Village.jpg) no-repeat;
}
.house {
position:absolute;
height:61px;
width:91px;
}
/*moved to build village module cg*/
/*a.charred {	background: url(/images/house0.png) no-repeat;}
a.levelzero {	}
a.levelone {	background: url(/images/house1.png) no-repeat;}
a.leveltwo {	background: url(/images/house2.png) no-repeat;}
a.levelthree {	background: url(/images/house3.png) no-repeat;}

a.charred:hover {	background: url(/images/house1.png) no-repeat;}
a.levelzero:hover {	background: url(/images/house1.png) no-repeat;}
a.levelone:hover {	background: url(/images/house2.png) no-repeat;}
a.leveltwo:hover {	background: url(/images/house3.png) no-repeat;}*/


.village #left_nav ul li {
	list-style:none;
	font-size:20px;
	margin-top:10px;
}
.village #left_nav ul img {
	margin-right:5px;
	margin-bottom:-5px
}
/*end village stuff*/
/* Page specific overrides */
.event_log #chore_list li.chore {
	width:100%;
	padding: 5px 0 5px 10px;
	margin: 0 0 5px 0;
	height:15px;
}
.event_log #chore_list li.chore h2 {
	font-size:16px;
	line-height:20px;	
	}
	
.village #left_nav ul li {
	list-style:none;
	font-size:20px;
	margin-top:10px;
}
.village #left_nav ul img {
	margin-right:5px;
	margin-bottom:-5px
}


.home #right_content {
	width:300px; height:315px;
	position:relative;
	float:right;
	padding: 160px 40px 10px 40px;
	margin:-15px 0 10px 0;
	/*background: url(/images/homepage_scroll.png) no-repeat;*/
	background: url(/images/homepage_scroll.gif) no-repeat;
	font-size:13px;
	}
.home #left_nav {
	width:550px;
	}

.home #inset_box {
	width:230px; 
	float:left;
	padding: 5px;
	margin: 5px 5px 5px 0px;
	border: 1px solid #666666;
	background-color: #c8f3f4;
	}
.home #inset_box p {
	padding-left:20px;
	}
.home #inset_box p a img {
	margin: 0 5px 0 -20px;
	}			
.home #right_content ul {
	margin: .5em 0 0 20px;
}
.home #main_content { padding-top:140px;	}
.home #header h1 {	left:0px;	}	
.home #footer{ position:absolute; top:635px;}		
.about #wrapper, .about2 #wrapper {
	padding:10px;
}
.sir_save_story #header h1 {
	width:300px;
	left:655px;
}
.about2 #code_pig {
	float:right;
	padding: 100px 150px 20px 20px; 
	margin: 5px; 
	width:200px;
	height:140px;
	background: url(/images/code_pig.gif) no-repeat;
}
.parent_setup #header h1 {	
	width:150px; left:805px;
}
.parent_setup #header h1 {	
	width:150px; left:805px;
}
.for_parents #header h1 {	
	width:425px; left:530px;
}



.edit_goals .myform {
margin:0 0 20px 10px;
padding:14px;
width:auto;
}
.edit_goals div.myform ul li {
border-bottom:2px dashed #b7ddf2;
margin-bottom: 0;
padding: 5px 0 10px 0;
		}
		
.edit_goals div.sign_in label {
	text-align:left;
	width:600px;
	color: #EC1C24;
	font-size:14px;
		}
.edit_goals div.sign_in .small {
text-align:left;
width:600px;
}		
		
.edit_goals div.myform ul li img {
	float:right; 
	width:75px; 
	margin-left:10px;
	} 
	
.chores #heading {
	display:none;
}
.chores #content p {
	padding: 0 0 10px 10px;
	}

.chores_comp #wrapper a {
	text-decoration:none;
	}

	
.parent ul#child_list ul {
	list-style:none;
	background-color:#c8f3f4;
	float:left;
	clear:both;
	margin: 0 0 5px 0;
	padding: 5px 5px 5px 0px;
	width:950px;
}
.parent ul#child_list ul li {
	display: inline-block;
	float:left;
	margin-left:15px
}
.parent ul#child_list ul li img {
	margin-right:5px
}
.parent ul#child_list ul li span {
	padding: 2px;
	background-color:#FFFFFF;
	margin-left:21px
}
#main_content .page_intro {
	margin: 0 0 10px 10px;
	width:650px;
}

						
						