@import url('reset.css');

/*begin universal styles*/
body {
  background:url(../images/background.jpg) top center no-repeat #3b6fa3;
  font-family: arial,helvetica,sans-serif;
  font-size:.8em;
  line-height: 1.25em;
  color: #555555;
}

h1 {
  font-weight:bold;
  color:#333;
  font-size:1.4em;
}

h2 {
  font-size: 1.25em;
  font-weight:bold;
  color:#cf633d;
}

h3 {
  font-size: 1em;
  font-weight:bold;
  color:#cf633d;
}

p {
  color: #555555;
  margin:.8em 0;
}

a:link, a:active, a:visited {
  text-decoration:none;
  color: #990000;

}

a:hover {
  text-decoration:underline

}

strong {
  font-weight: bold;
}


/*end universal styles*/

/************** Layout *****************/

a.green-button {
  height:26px;
  width:119px;
  background:url(../images/green-button.png) top left no-repeat;
  display:block;
  font-family:Arial, Helvetica, sans-serif;
  color:#FFFFFF;
  font-size:12px;
  font-weight:bold;
  text-align:center;
  padding-top:8px;
  text-decoration:none;
}

#inner-page {
  width:978px;
  margin:auto;
  padding-top:10px;
  z-index:1;
}


/************************Begins Sitewide Nav*/
#nav-wrapper {
  width:978px;
  height:146px;
  background:url(/images/nav_background.png) top left no-repeat;
  position:relative;
  z-index:2;
}

#nav-wrapper .call_us {
  position:absolute;
  top:1px;
  right:20px;
  z-index:3;
  height: 37px;
  width: 235px;
  background:url(/images/call_us.png) bottom left no-repeat;
  padding-left: 100px;
  padding-top: 10px;
  font-size: 18px;
  color: #3f3f3f;
}

#nav-wrapper ul.find {
  width:180px;
  height:30px;
  right:50px;
  top:50px;
  position:absolute;
}

#nav-wrapper ul.find li {
  height:30px;
  float:left;
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  color:#333;
}


#nav-wrapper ul.find li.find-padding {
  padding-top:10px;
  height:25px;
}

a.find-link:link, a.find-link:active, a.find-link:visited {
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  color:#333;
  text-decoration:none;
}

a.find-link:hover {
  text-decoration:underline;
}

#nav-wrapper #logo {
  width:170px;
  height:140px;
  background:url(../images/logo.png);
  float:left;
  margin-top:2px;
  margin-left:2px;
}

#nav-wrapper #link-wrapper {
  float:right;
  height:140px;
  width:780px;
}

#nav-wrapper #link-wrapper ul.icons {
  height:74px;
  width:500px;
  margin-top:2px;
}

#nav-wrapper #link-wrapper ul.icons li {
  float:left;
}

#nav-wrapper #link-wrapper ul.icons li.cart {
  position:relative;
  height:74px;
  text-align:center;
}

#nav-wrapper #link-wrapper ul.icons li.cart p {
  position:absolute;
  top:46px;
  left:26px;
}

#main-nav-wrapper {
  width:766px;
  height:51px;
  margin-top:17px;
  float:right;
  margin-right:1px;
  margin-bottom:1px;
  position:relative;
}

#main-nav-wrapper #main-nav {
  background:url(../images/main_nav_background.png) top left no-repeat;
  width:608px;
  height:51px;
  float:left;
  position:relative;
}

#main-nav ul.main-links {
  height:30px;
  width:600px;
  margin:17px;
  position:relative;
  z-index:1;
}

#main-nav ul.main-links li {
  height:40px;
  float:left;
  padding-right:14px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  color:#FFF;
  position:relative;
}

#main-nav ul.main-links li .arrow {
  position:absolute;
  top:-10px;
  left:10px;
  width:25px;
  height:12px;
  background:url(../images/drop_arrow.png) top left no-repeat;
}

#main-nav ul.main-links li .drops {
  width:270px;
  position:absolute;
  top:34px;
  left:-10px;
  background-color:#FFFFFF;
  padding-top:2px;
  top:33px;
  padding-bottom:10px;
  border:1px solid #e8e6e6;
  display:none;
}


#main-nav ul.main-links li .drops ul.drop-links {
  background-color:#edebeb;
  width:250px;
  margin:auto;
  padding-top:4px;

}


#main-nav ul.main-links li .drops ul.drop-links li {
  width:250px;
  float:none;
  height:17px;
  padding:0px;
  padding-top:3px;
  position:relative;
}

#main-nav ul.main-links li .drops ul.drop-links li:hover {
  background:#137821;
}

#main-nav ul.main-links li .drops ul.drop-links li #second-drop {
  width:270px;
  position:absolute;
  top:-3px;
  left:250px;
  background-color:#FFFFFF;
  padding-top:10px;
  padding-bottom:10px;
  border:1px solid #e8e6e6;
}


a.nav-links:link, a.nav-links:active, a.nav-links:visited, a.nav-links:hover {
  font-family:Arial, Helvetica, sans-serif;
  font-size:14px;
  color:#FFF;
  text-decoration:none;
}

a.drop-link:link, a.drop-link:active, a.drop-link:visited{
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  color:#333;
  text-decoration:none;
  margin-left:10px;
  width:100%;
  height:100%;
  display:block;
}

a.drop-link:hover {
  color:#FFF;
}


a#start-your-own-kis, a#start-your-own-kis:active, a#start-your-own-kis:link, a#start-your-own-kis:hover, a#start-your-own-kis:visited {
  background:url(/images/start_your_own_kis_bg.png) top left;
  background-repeat:repeat-x;
  display:block;
  height:31px;
  padding: 10px 5px;
  font-size: 15px;
  float:right;
  width:148px;
  color: white;
  font-weight:bold;
  text-align:center;
  text-decoration:none;
}

#left-column #sidebarCalendar {
   cursor: pointer;
}

#left-column table.sidebar-calendar {
  border: none;
  width: 100%;
}

#left-column table.sidebar-calendar tbody tr {
  border: none;
}

#left-column table.sidebar-calendar th {
  border: none;
  vertical-align: top;
  padding: .2em;
  text-align: center;
  font-weight: bold;
}

#left-column table.sidebar-calendar td {
  vertical-align: top;
  text-align: center;
  padding: .2em;
}


#left-column table.sidebar-calendar thead tr {
  text-align: center;
}

#left-column .month-name {
  font-weight: bold;
  background-color: #39637e;
  color: white;
  display:block;
  text-align: center;
  padding: .3em;
}

#left-column table.sidebar-calendar td.today {
  font-weight: bold;
  border: 1px solid black;
}

/************************Begins Homepage Banner Styles*/
#home-banner {
  width:978px;
  clear:both;
  height:296px;
  margin:auto;
  background:url(../images/home-banner-background.jpg);
  position:relative;
  z-index:0;
  margin-top:20px;
  -moz-box-shadow: 0px 3px 5px #000;
  -webkit-box-shadow: 0px 3px 5px #000;
  box-shadow: 0px 3px 5px #000;
}



/************************Begins Announcments Scroll Styles*/

#home-banner #announcements {
  width:417px;
  height:128px;
  float:left;
  background:url(../images/news_backdrop.png) top left no-repeat;
  margin-top:130px;
  margin-left:50px;
  padding-top:5px;
  padding-bottom:5px;
  position:relative;
  font-size: 12px;
}

#home-banner #announcements p {
  margin-top:4px;
}

#home-banner #announcements h3 {
  color: #e41938;
  font-size: 14px;
}

#home-banner #announcements p, #home-banner #announcements h3 {
  margin: 10px 0;
}

#home-banner #announcements p.date{
  font-family:Arial, Helvetica, sans-serif;
  font-style:italic;
  color:#1e6421;
  font-weight:bold;
  padding:0px;
  margin:0px;
}

/*----------------BEGIN HOMEPAGE BANNER SLIDER*/


#slides-wrapper {
  float:right;
  height:296px;
}


/*----------------BEGIN HOMEPAGE PAGE CONTENT*/
#page-content {
  width:978px;
  background-color:#FFF;
  margin:0 auto;
}


body.home #page-content {
  margin-top:10px;
}

body.home #page-content {
  border-bottom:solid #333 1px;
}

/*----------------BEGIN HOMEPAGE CALL OUTS*/

body.home #call-outs-wrapper {
  background:url(../images/call_out_background.png) top left no-repeat #FFFFFF;
  width:978px;
}


body.home ul.call-outs {
  margin-bottom: 25px;
}

ul.call-outs li, #call-outs-wrapper div.column {
  width:296px;
  float:left;
  padding-right:15px;
  padding-left:15px;
}

body.no-camps ul.call-outs li, body.no-camps #call-outs-wrapper div.column {
  width: 429px;
  padding-left: 30px;
  padding-right: 30px;
}

#call-outs-wrapper div.column p {
  position:relative;
  left:165px;
}

body.no-camps #call-outs-wrapper div.column p {
  left:310px;
}

ul.call-outs li h2 {
  color:#e41938;
  padding-top:230px;
}

ul.call-outs li p {
  color:#333;
  font-size:12px;
  margin-top:5px;
}

ul.call-outs li a.green-button {
  float:right;
  margin-top:10px;
}

ul.call-outs li.camp {
  background:url(../images/camp_slide_background.png) top left no-repeat;
}


ul.call-outs li.classes {
  background: url(../images/find_classes.png) top left no-repeat;
}

ul.call-outs li.birthdays {
  background: url(../images/birthdays.png) top left no-repeat;
}


/*----------------BEGIN HOMEPAGE BODY CONTENT*/

#home-body-wrapper {
  width:978px;
  background:url(../images/home_body_top_gradient.png) no-repeat;
  margin-top:10px;
  padding-top:20px;
  padding-bottom:20px;
}

#left-column {
  width:268px;
  padding-left:20px;
  float:left;
}

#left-column a.left-link:link, a.left-link:active, a.left-link:visited, a.left-link:hover {
  color:#333333;
  text-decoration:underline;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;

}

#left-column img.click-to-see {
  margin-left:60px;
  margin-bottom:10px;
}

#left-column img.mascot {
  margin-top:20px;
}

#right-column {
  width:650px;
  float:right;
  padding-right:20px;
}

body.nosidebar #right-column {
  width:938px;
  float:none;
  padding-left: 20px;
  padding-right:20px;

}

#right-column p, .group, .instructions, #errorExplanation {
  margin: .8em 0;
}

#right-column h1 { margin: .6em 0; }
#right-column h2 { margin: .6em 0; }
#right-column h3 { margin: .7em 0; }
#right-column h4 { margin: .8em 0; }


body.home .announcements h2, body.home .announcements h2 {
    color: #e41938;
}

body.home .announcements p.date {
  font-family:Arial, Helvetica, sans-serif;
  font-style:italic;
  color:#1e6421;
  font-weight:bold;
}
/*----------------BEGIN FOOTER STYLES*/

#footer-wrapper {
  width:944px;
  height:244px;
  margin:auto;
  clear:both;
  background-color:#666666;
  margin-top:40px;
  -moz-box-shadow: 0px 3px 5px #000;
  -webkit-box-shadow: 0px 3px 5px #000;
  box-shadow: 0px 3px 5px #000;
  font-family:Arial, Helvetica, sans-serif;
  color:#FFFFFF;
  font-size:11px;
  text-decoration:none;
}

#footer-wrapper img.footer-image {
  float:right;
}

#footer-wrapper #footer-links {
  width:600px;
  float:left;
  height:235px;
  margin-left:7px;
}

#footer-wrapper #footer-links .link-holder {
  float:left;
  width:175px;
  height:235px;
}

#footer-wrapper #footer-links ul.footer-links li{
  height:13px;
}

#footer-wrapper #footer-links ul.footer-links li.header {
  height:25px;
  margin-top:9px;
}

#footer-wrapper #footer-links ul.footer-links li.location {
  height:auto;
  line-height:12px;
}

#footer-wrapper #footer-links ul.footer-links li h3 {
  font-family:Arial, Helvetica, sans-serif;
  font-size:20px;
  color:#FFFFFF;
  font-weight:normal;
  padding-bottom:10px;
}

#footer-wrapper #footer-links ul.footer-links li h4 {
  font-family:Arial, Helvetica, sans-serif;
  font-size:16px;
  color:#FFFFFF;
  font-weight:normal;
  padding-bottom:10px;
}

a.footer-link:link, a.footer-link:active, a.footer-link:visited, a.footer-link:hover {
  font-family:Arial, Helvetica, sans-serif;
  color:#FFFFFF;
  font-size:11px;
  text-decoration:none;
}

#bottom-links {
  width:978px;
  margin:auto;
  height:40px;
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  color:#FFF;
  text-decoration:none;
  padding-top:10px;
}

#bottom-links #link-float {
  float:left;
}

a.bottom:link, a.bottom:active, a.bottom:visited, a.bottom:hover {
  font-family:Arial, Helvetica, sans-serif;
  font-size:12px;
  color:#FFF;
  text-decoration:none;
}

#bottom-links p.copyright {
  float:right;
  color:#FFF;
  margin:0px;
  padding:0px;
}

/*----------------BEGIN SUBPAGE STYLES*/

#subpage-banner {
  width:977px;
  height:357px;
}

#subpage-body-wrapper {
  width:978px;
  margin-top:10px;
  padding-top:20px;
  padding-bottom:20px;
  background:#FFF;
  float:right;
}

/*----------------BEGIN GALLERY STYELS*/

#gallery-wrapper {
  height:480px;
  width:978px;
  position:relative;
  overflow:hidden;
  margin-top:10px;
}

#gallery-wrapper .large_arrow_right {
  position:absolute;
  right:0px;
  top:100px;
  z-index:100;
}

#gallery-wrapper .large_arrow_left {
  position:absolute;
  left:-20px;
  top:100px;
}

#page-content.gallery {
  width:978px;
  background:url(../images/call_out_background.png) top left no-repeat #FFF;
  margin:0 auto;
  position:relative;
  padding-bottom:10px;
  clear:both;
}

#page-content.gallery .small_arrow_left {
  position:absolute;
  left:10px;
  top:15px;
}

#page-content.gallery .small_arrow_right {
  position:absolute;
  right:10px;
  top:15px;
}

#gallery-wrapper ul.photos {
  height:480px;
  position:relative;
  left:0px;
}

#gallery-wrapper ul.photos li {
  width:978px;
  height:480px;
  position:absolute;
  text-align:center;
}

#thumbs-wrapper {
  width:800px;
  height:45px;
  margin:auto;
  position:relative;
  overflow:hidden;
  padding-top:10px;
}

#thumbs-wrapper ul.thumbs {
  height:45px;
  position:relative;
  left:0px;
}

#thumbs-wrapper ul.thumbs li {
  height:45px;
  width:80px;
  float:left;
}

/*----------------BEGIN SOCIAL MEDIA ICONS STYLES*/

ul.social-icons {
  width:37px;
  height:66px;
  padding-top:8px;
  position:fixed;
  top:100px;
  left:-1px;
  background:url(../images/social_backdrop.png) top left no-repeat;
}

ul.social-icons li {
  width:34px;
  padding-left:3px;
  height:22px;
  float:left;
  margin-bottom:3px;
  position:relative;
}

ul.social-icons li #sm-pop {
  width:122px;
  height:37px;
  background:url(../images/sm_backdrop.png) top left no-repeat;
  position:absolute;
  left:15px;
  top:-25px;
  display:none;
  padding-left:15px;
  padding-top:10px;
}

ul.social-icons li:hover #sm-pop {
  display:block;
}

/* ---------------- Calendar -------------------------------- */


table.calendar {
  border: 1px solid #D7D7D7;
  border-collapse: collapse;
}

table.calendar tbody tr {
  height: 100px;
  border: 1px solid black;
}

table.calendar th {
  width: 14%;
  border: 1px solid #D7D7D7;
  vertical-align: top;
  padding: 2px;
}

table.calendar td {
  border: 1px solid #D7D7D7;
  vertical-align: top;
  padding: 2px;
}

table.calendar td.today {
  background: #FFFFDD;
}

table.calendar thead tr {
  text-align: center;
}

table.calendar td.previous-month, table.calendar td.following-month {
  background-color: #F6F7F8;
  border: 1px solid #D7D7D7;
}

.calendar .month-name {
  display: inline;
  font-weight: bold;
}

table.calendar ul.events-for-day  {
  margin-left: 0px;
  padding-left: 2px;
  list-style-position:inside;
  margin-top: 0px;
}

/* ----------------------------------- */

em {
  font-style:italic
}

fieldset, .box {
  width: 95%;
  border: 1px solid #bbbbbb;
  background:#FFFFFF url(/images/gradient-inner.png) repeat-x scroll 0 0;
  padding: 0 1em;
}

legend {
  margin: 0 1em;
  color: black;
  font-weight: bold;
  font-family:Verdana,sans-serif;
}

/* ------- Payment forms -------------- */

td.field-label {
    font-weight: bold;
    text-align: right;
    padding: .5em;
}


/* -------------------------------- */

.listing-table, .detail-table {
  border: 1px solid #bbbbbb;
  background:#FFFFFF url(/images/gradient-inner.png) repeat-x scroll 0 0;
  border-collapse: collapse;
  color: black;
}


.listing-table a {
  text-decoration: underline;
}

.listing-table th, .detail-table th {
  background-color:  #39637e;
  border: 1px solid #bbbbbb;
  color:white;
  font-family:Verdana,Geneva,Arial,Helvetica,sans-serif;
  font-weight:bold;
  padding: .5em;
}

.listing-table th {
  text-align: center;
}

.detail-table th {
  text-align: right;
}

.listing-table tr.odd {
  background-color: white;
}

.listing-table tr.even {
  background-color: #F1F2F2;
}

.listing-table td {
  border: 1px solid #bbbbbb;
  padding: .3em .5em;
}

.detail-table td {
  background-color: #F1F2F2;
  border: 1px solid #bbbbbb;
  padding: 3px 4px;
}

.detail-table2 th {
  text-align: left;
}

.detail-table2 td, .detail-table2 th {
  padding: .3em .5em;
}

a.sexybutton.sexysimple.cancel {
  background-color: #a8a7ac;
}

.spacer {
  width: 100%;
  height: .5em;
}

#layout-messages {
  background-color: #FFE3E3;
  border: 1px solid #dd0000;
  border-radius: 0.8em;
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  -khtml-border-radius:  0.8em;
  font-size: 1.2em;
  padding: 1em;
  margin: .8em 0;
}

#flash  {
  margin-right:30px;
}

.title {
  font-weight: bold;
  font-size: larger;
}

.label {
  font-weight: bold;
}

.info-note {
  color: red;
  font-style: italic;
  margin: 15px 5px;
}

.instructions {
  font-size: larger;
}

.wizard-navigation .left-side {
  float: left;
}

.wizard-navigation .right-side {
  margin-left: 450px;
}

/* -------------- Rails ----------------------- */

.fieldWithErrors {
  display:inline;
}

.fieldWithErrors label {
  color: red;
}

#errorExplanation {
  padding: .8em .8em .8em .8em;
  margin-left: 2em;
  width: 75%;
  background-color: #FFE3E3;
  border: 1px solid #dd0000;
  border-radius: 0.8em;
  -moz-border-radius: 0.8em;
  -webkit-border-radius: 0.8em;
  -khtml-border-radius:  0.8em;
  font-size: 1.2em;

}

#errorExplanation h2 {
  text-align: left;
  font-weight: bold;
  padding: 0 5px 0 15px;
  font-size: 16px;
  color: #c00;
}

/*
  Desired effect is look good whether or not header message(e.g. h2)
  is present. If it is not, then make the 'The following fields..'(e.g. p)
  bold and red instead.
*/
#errorExplanation p {
  color: #c00;
  margin-bottom: 0;
  margin: .2em 0;
  font-weight:bold;
}

/* with header message */
#errorExplanation h2 + p {
  color: #333;
  font-weight:normal;
}

#errorExplanation ul li {
  color: #333;
  list-style: disc;
  list-style-position:inside;
  margin: 0;
  padding: 3px 0 0 15px;
}


/* ----------------------------------- */

.left {
  float:left;
}

.right {
  float: right;
}

.clear {
  clear:both;
}


.larger {
  font-size: larger;
}

.pad-left {
  padding-left: 1em;
}

.inline {
  display: inline;
}

.hidden {
  display: none;
}

