body {font-family: "Trebuchet MS", Arial, sans-serif; font-size:14px;}

#main {width:960px; margin:0px auto; position:relative;}
#header {background-color:#ec2028; padding-top:15px;}
#footer {margin:30px 0 0 0; border-top:2px solid #ec2028; padding:30px 0;}

/*header*/
.headerContent {background-color:#00447c; padding:18px 20px;}
.headerContent .logo {width:300px; float:left; display:block;}
.utilities {float:right; width:auto; padding-top:12px;}
.utilities li,.utilities li a {float:left; display:block; height:32px; width:32px; margin-right:7px; font-weight:bold; color:#fff; font-size:14px;}
.utilities li {width:auto;}
.utilities li.facebook {background:transparent url(../img/facebook.png) no-repeat top left;}
.utilities li.twitter {background:transparent url(../img/twitter.png) no-repeat top left;}
.utilities li.wordpress {background:transparent url(../img/wordpress.png) no-repeat top left;}
.utilities li.vimeo {background:transparent url(../img/vimeo.png) no-repeat top left; margin-right:27px;}
.utilities li.profileLink {font-family: 'Quicksand', sans-serif; font-size:13px; padding-top:0px; text-transform: capitalize; margin-top: -15px; height: 65px; font-weight: 700; }  
.utilities li.profileLink a {color:#ec2028; float:none; display:inline; }

/*headers styles*/
h1 {padding:8px 0 24px 0; text-align:center;text-transform:uppercase; display:block; color:#00447c;font-family: 'Quicksand', sans-serif; font-size:20px; font-weight: 700;  }
h1 span {display:inline; padding:0 15px;}
h2, .overlay h2 {padding:8px 10px; text-transform:uppercase; color:#fff; background-color:#ec2028;font-family: 'Quicksand', sans-serif; font-size:19px; font-weight: 700;  }
h2.b {background-color:#00447c; }
.row1 .centerCol h2 {position:absolute; top:130px;}
h3, .wideCol h3.profile{text-transform:uppercase; color:#00447c; font-family: 'Quicksand', sans-serif; font-size:16px; line-height:normal; font-weight: 700; }
.tableContainer h3 {text-align:center; font-size:18px;}
.tableContainer h3  a {color:#ec2028;}
.tableContainer.tablePage h3 {font-size:24px; text-align:left;}
.wideCol h3 {font-size:24px; margin:0 0 20px 0; text-transform:none; line-height:26px;}
.payment h3 {margin:40px 0 10px 0; font-size:16px; text-transform:uppercase;}
.wideCol .contactInfo h3 {margin-bottom:10px; font-size:16px; text-transform:uppercase;}
h4 {padding:10px; color:#fff; background-color:#8dc63f; font-family:Arial, Helvetica, sans-serif; font-size:18px;}
h5 {color:#ec2028; text-transform:uppercase; text-transform:uppercase;font-family: 'Quicksand', sans-serif; font-size:19px; font-weight: 700;}

/*shared element styles*/
.link {color:#ec2028; text-transform:uppercase; display:block; font-family: 'Quicksand', sans-serif; font-size:16px; font-weight: 700;}
.spacer1 {height:2px; background:transparent url(../img/spacer1.png) repeat-x top left; margin:20px 0; width:50%;  }
.leftCol .spacer1 {margin-top:40px;}
.spacer2 {height:2px; background:transparent url(../img/spacer2.png) repeat-x top left; margin:20px 0; width:50%;  }
 

/*container styles*/
.row1 {background:transparent url(../img/row1Back.jpg) repeat-y top left;}
.row1foot {background:transparent url(../img/row1Bottom.jpg) no-repeat top left; width:960px; height:5px; clear:left;}
.row2 {background:transparent url(../img/row2Back.jpg) repeat-y top left;}
.row2foot {background:transparent url(../img/row2Bottom.jpg) no-repeat top left; width:960px; height:5px; clear:left;}
.row3 {background:transparent url(../img/row3Back.jpg) repeat-y top left;}
.row3foot {background:transparent url(../img/row3Bottom.jpg) no-repeat top left; width:960px; height:5px; clear:left;}
.row3 .container3 {position:relative; margin-bottom:-5px;}
.content {margin-bottom:20px;}
.leftCol, .rightCol {width:230px; float:left; margin-right:20px;}
.centerCol {width:460px; float:left; margin-right:20px; position:relative;}
.rightCol {margin-right:0px;}
.wideCol {width:710px; float:left;}
.container1 {position:relative; padding:14px 10px;border:1px solid #e5ecf2; background-color:#fff;  border-bottom:0px;   }
.container2 {background-color:#e8f4d9; border:1px solid #8dc63f; padding:12px; border-bottom:0px; }
.loginPage .container2 {text-align:center;}
.container3 {background-color:#00447c; padding:0 10px 16px 10px; }
.container2 li {background:transparent url(../img/greenDot.gif) no-repeat 0px 17px; padding: 10px 0 10px 13px; display:block;}
.subContainer {background-color:#8dc63f; padding:16px 10px;}
.row3 .subContainer {margin-bottom:20px;}
.subContainer li {padding:4px 0;}
.subContainer li a, h2  a {color:#fff;}
.imageContainer-home {height:200px; width:460px; background:transparent url(../img/GoddardFamilyConnect_Home.jpg) no-repeat top left;}
.imageContainer-login {height:200px; width:460px; background:transparent url(../img/GoddardFamilyConnect_Login.jpg) no-repeat top left;}
.photoContainer {width:210px; margin-right:20px; float:left;}
.textContainer {width:425px; float:left;}
.loginPage #main, .loginPage #footer {width:100%; border:0px;}
.loginPage #main {background-color:#00457c;}
.loginPage #footer {background-color:#fff;}
.loginPage #footer ul {width:960px; border-top:2px solid #ec2028; padding:30px 0; margin:0px auto; position:relative; }
.loginPage #footer ul ul {width:auto; border-top:0px; padding:0px; margin:0px;}
.loginPage .centerCol {float:none; margin:0 auto 100px auto; position:relative; padding:50px 0 0 0;}

/*table styles*/
.tableContainer table {width:100%; margin:15px 0 20px 0; border-bottom:2px solid #01467d;}
.tableContainer table td, .tableContainer table th {text-align:center;}
.tableContainer table th {border-bottom:2px solid #01467d; }
.tableContainer table td {background-color:#f6f6f6; padding:6px 0; border-bottom:1px solid #becbd6;}
.tableContainer table td.td1 {background-color:#ededed; }
.tableContainer .currentEvent {background-color:#8dc63f!important; border:1px solid #74a631; color:#fff;}
.tableContainer .event{background-color:#00447c!important; border:1px solid #03345d; color:#fff;}
.tablePage  {padding:0 22px;}
.tablePage table td {height:124px; width:121px; text-align:left; padding:10px; color:#00447c; font-weight:bold; border-bottom:3px solid #becbd6; font-family: 'Quicksand', sans-serif; font-size:16px; font-weight: 700;}
.tablePage table td p {font-weight:normal; padding-top: 8px; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:14px;}
.tablePage table th {border-bottom:3px solid #01467d; padding:0 0 8px 0; color:#00447c; font-family: 'Quicksand', sans-serif; font-size:16px; font-weight: 700;}
.tablePage table th span {color:#ec2028;}
.tablePage .breadcrumb {font-family:arial, sans-serif; font-size:14px; color:#ec2028; margin:0 0 18px 0;}
.tablePage .breadcrumb span {color:#00447c;}

/*content styles*/
p.event {padding:0 0 4px 0;}
p.event, p.event a, .payment p a {color:#ec2028; }
p.event span {color:#333;}
p.event.first {padding-top:10px;}
p.contact {padding:8px 0;}
.container3 p, .container3 p a  {color:#fff;}
p.contact span {display:block;}
.container3 .link, .row2 .container1 .link {margin-top:20px; display:block;}
.childInfo {width:205px; float:left;}
.childInfo.child2, .childInfo.child4 {float:right;}
.child3, .child4 {margin-top:20px;}
.childInfo p {font-weight:bold;}
.payments {padding:20px 0 0 0; font-weight:bold;}
.photoContainer  img {margin-bottom:25px;}
.textContainer p, .splitContainer p {margin-top:20px;}
.payment p {padding-bottom:16px;}
.payment p a {display:inline; margin-left:16px;}
.payment p a.newDrop {margin-left:10px; color:#00447c;}
.payment p input[type=text], .loginPage input {height:30px; border:1px solid #e0e0e0; box-shadow:0 0 0; color:#00447c; padding:0 4px; line-height:30px;}
.loginPage input {width:240px; display:block; margin:0px auto 12px auto; text-align:left;}
.recurring  p {float:left; }
.recurring  p.question { margin-right:10px; }
p.paymentPref  label {padding:0 12px 0 0; float:left; vertical-align:middle}
.payment p input[type=text].datepicker {height:31px; line-height:31px;border:0px; background:transparent url(../img/calendar.gif) no-repeat top right; width:118px; cursor:pointer;}
p.payOther {position:relative;}
p.payOther input {position:absolute; top:-5px; left:125px;}
.payment .spacer1 {margin-top:60px;}
.loginPage p a {color:#ec2028; display:block; padding-bottom:12px;}
.loginPage p.access { color:#00447c;  padding-bottom:20px;}

/*toggle containers*/
.addCardToggle, .addCheckingToggle  {height:41px; line-height:41px; background:transparent url(../img/highlight.gif) no-repeat top left; color:#fff; margin:16px 0; padding:0px ; cursor:pointer;  font-family: 'Quicksand', sans-serif; font-size:16px; text-transform:uppercase; text-shadow:1px 1px 1px #333; font-weight: 700;}
.addCardToggle span, .addCheckingToggle  span {padding:0; text-transform:uppercase; color:#fff; display:inline-block; float:left;  padding:0px 12px;}
.paymentToggles .toggle {float:right; text-align:right;}
.paymentToggles input {width:325px;}
.paymentToggles input.acctRout {width:165px;}

/*contact page*/
.contactInfo {float:left; display:block; width:200px; margin-right:35px;}
.contactInfo.last {margin-right:0px;}
.contactInfo .address {padding:12px 0;}
.contactInfo p {padding:0 0px 1px 0px;}
.contactInfo p span, .payments  span, .childInfo  p span, .childInfo p span {float:left;}
.contactInfo p span.value, .payments  span.amount, .payments  span.date, .childInfo p span.value {float:right; display:inline; font-weight:normal;}
.contactInfo .address span {float:none;}
.cont1 {margin-bottom:16px; padding-bottom:16px; border-bottom:1px solid #cfcfcf;}

/*footer styles*/
#footer li {float:left;  font-family:arial, sans-serif; font-size:12px; font-weight:bold;}
#footer li.foot1 {color:#00447c; width:285px; padding-left:20px;}
#footer li.foot2 {width:310px; padding-left:40px;}
#footer li.foot2 a, #footer li.foot2 li {color:#ec2028; display:block;  float:none;}
#footer li.foot2 li.copy {padding-top:16px;}
#footer li.foot3 {float:right; }
#footer li.foot3 img {margin-left:10px;  }
  
/*checkbox replacement*/
input.hiddenCheckbox {position: absolute; left: -10000px; /* Hide the input */}
label.prettyCheckbox span.holderWrap {display: block; float: left;position: relative;margin-right: 5px;overflow: hidden;}
label.prettyCheckbox span.holder {display: block;position: absolute;top: 0; left: 0;}
label.radio span.holder {
		height: 35px; /* Total height of your checkbox image */
		background:transparent url(../img/radioNew.gif) 0 0  no-repeat; /* Path to your checkbox image */
		cursor:pointer;}
label.checked span.holder,
label.checked:hover span.holder { top: -18px !important; } /* Background position when checked */

/*overlay styles*/
.overlay {background-color:#fff; margin:0px auto; position:relative;}
.portalLogin.overlay, .errorMessage.overlay {width:305px; }
.overlay.monthlyStatements {width:500px;}
.portalLogin.overlay, .errorMessage.overlay {background-color:#00447c; }
.overlay .content {padding:20px; margin-bottom:0px;}
.portalLogin.overlay p, .errorMessage.overlay p {color:#fff;}
.errorMessage.overlay p {font-style:italic;}
.overlay input {height:32px; line-height:32px;}
.overlay input.datepicker {margin:8px 14px 30px 0;}
.monthlyStatements .newDrop {margin:8px 14px 10px 0;}
.portalLogin{ color:#00447c; margin-bottom:12px; border:0px; width:234px; }
.portalLogin.overlay input {border:1px solid #e1e1e1; margin-bottom:8px;}
.overlay a {color:#ec2028; }
.overlay p.text {padding:20px 0 10px 0; font-style:italic;}
.overlay h3 {margin-bottom:14px;}
.overlay h2 {padding:15px 0 15px 15px;}
.overlay h2.highlight, .overlay h2.highlightmd {padding:10px;}
h2.highlight { background:transparent url(../img/highlight-sm.gif) no-repeat top left;}
h2.highlightmd { background:transparent url(../img/highlight-md.gif) repeat top left;  text-align:right;}
h2.highlightmd a, h2.highlight a {color:#fff;}
.loginPage h2.highlight { background:transparent url(../img/highlight-md2.gif) no-repeat top left; position:absolute; bottom:-16pxpx; left:0px; width:100%; line-height:35px; height:50px; text-align:right;}
.loginPage h2.highlight a {padding-right:24px;}

/*new page split styles*/
.class-detail {padding:0 0 25px 0; margin: 0 0 10px 0; border-bottom:1px solid #e6edf3;}
.class-detail span {width:75px; display:inline-block;}
.containerSplit {width:100%;}
.containerSplit .splitContainer {width:320px; float:left; }
.containerSplit .splitContainer img {float:left; margin:0 15px 15px 0;}
.containerSplit .splitContainer.teacherContainer {border-right:1px solid #e6edf3; padding-right:20px;}
.containerSplit .splitContainer.classroomContainer {float:right;}
.containerSplit h5 {margin:15px 0 20px 0;}

/*button styles*/
a.button {height:30px;   padding:0 12px; color:#fff; text-transform:uppercase; font-family: 'Quicksand', sans-serif; background-image:url(../img/highlight-sm.gif); background-repeat:no-repeat; background-position:0px 0px; background-size:100% 100%; display: inline-block; line-height:28px; text-align:center; font-weight:700}

.calendarCell
{
    position: relative;
}

.calendar-icon-image
{
    position: absolute;
    bottom: 0px;
    right: 0px;
}