@font-face { font-family: 'ChellChromeBold'; src: url('fonts/chelnu2-webfont.eot'); src: local('?'), url('fonts/chelnu2-webfont.woff') format('woff'), url('fonts/chelnu2-webfont.ttf') format('truetype'), url('fonts/chelnu2-webfont.svg#webfontRiVb9DvR') format('svg'); font-weight: normal; font-style: normal; }

body { background:#28FFF4; margin: 0px; padding: 0px; font-family: Verdana, Arial, Helvetica, sans-serif; }

/* From the other css file */
.outer-wrapper{border-top:4px solid #000;min-width:1024px;  position: relative; background: #FFE2CF url(images/body-bg_2c.jpg) ;}
.inner-wrapper{width:960px;margin:20px auto 10px auto;overflow:hidden;}

.content{float:left;}
.content h1{font:96px "InterstateCondMonoBlkRegular","Franklin Gothic Demi Cond",serif;letter-spacing:-1.5px;text-align:center;margin:62px 0 0 0;line-height:102px;}
.content h2{font-size:24px;font-style:italic;font-weight:normal;line-height:30px;margin:37px 0 0 0;text-align:justify;}
.content h2 a{color:#000;text-decoration:none;font-weight:bold;outline:0;}
.content h2 a:hover{text-decoration:underline;}
.content p{line-height:22px;margin-top:48px;}
.content p img{display:block;margin:20px 0 40px 0;}
.content .column{float:left;width:460px;}
.content .column.left-column{margin-right:20px;}
.content .column.right-column{margin-left:20px;}
/* End -- From the other css file */

#wrapper { position: relative;}
#toplink { position: absolute; right: 0pt; top: 10px; }
#toplink a { display: block; width: 28px; height: 134px; background: url('pages/images/backtotop.gif') no-repeat scroll left top transparent; }

#top { width: 950px; margin-top: 5px; margin-right: auto; margin-bottom: auto; margin-left: auto; }

#title {  width: 100%; background: #1C3341; position: fixed; top: 0px;  height: 65px;  text-align: center;}
#title h1 { font-family: ChellChromeBold, Georgia, "Times New Roman", Times, serif;  color: #fff; text-shadow: 2px 2px 2px #777;  font-size: 48px; line-height: 1em; margin:10px auto;}

.heading { float: left; width: 100%; margin-top: 10px;}

#navigation { float:left; width:100%; overflow:hidden; position:relative; margin:3px auto; }

#navigation ul { clear:left; float:left; list-style:none; margin:0; padding:0; position:relative; left:50%; text-align:center; }

#navigation ul li {display:block; float:left; list-style:none; margin:0; padding:0; position:relative; right:50%; }

#navigation ul li a { display:block; margin:0 0 0 1px; padding:3px 10px; color:#0ff; font-weight: bold; text-shadow: 2px 2px 2px #888;  line-height:1.3em; font-size: 1.2em; font-family: ArialRoundedMTBold, tahoma, sans-serif;}

#navigation ul li a:hover { color:#ff0; }

#navigation ul li a.active, #navigation ul li a.active:hover { color:#000000; font-weight:bold; }


#gallery {position: relative;}

.place {position: absolute; top: 300px; left: 180px; width: 310px;  }
.place h3 {font-size: 1em;} 
.place h3 span, .place2 h3 span {color: #00F;}
.place2 {position: absolute; top: 330px; left: 270px; width: 500px;  }
.place2 h3 {font-size: 0.9em;}
#map {position: absolute; top: 130px; right: 0;  z-index: -100;}
#add {position: absolute; top: 50px; right: 0px; }

h1 { color: #0075FF; font-size: 24px; font-weight: normal; margin: 0px; padding: 0px;}

.heading h2 { font-family: 'ArialRoundedMTBoldBold', tahoma, sans-serif; color: #0075FF; font-size: 30px; margin: 5px; padding: 5px; float: left; text-shadow: 1px 1px 1px #555; border: 2px solid #0075FF; }

p {padding: 5px;}

span.description { color: #9f9f9f; font-size: 16px; float: left;}

.top { float: left; height: 48px; width: 950px; }

.top p { text-align: center; color: #999999; font-size: 10px;}

a:link, a:visited, a:active { color:#008F8C; }
a:hover { color:#003F3E; }

.welcome {float:right; width: 100%;}
.welcome h2, .welcome2 h2, .welcome3 h2 {font: bold 1.2em/1.3em Helvetica, Sans-Serif; color:#F00; margin: 5px; text-shadow: 1px 1px 1px #aaa;}
.welcome span, .welcome2 span, .welcome3 span  {font: bold 1em/1.3em Helvetica, Sans-Serif; color:#00F; text-shadow: 1px 1px 1px #aaa;}

.welcome2 {float:right; width: 100%;}
.welcome3 {float:right; width: 100%;}

h3 { font-size: 1.1em; color: #0075FF; text-shadow: 1px 1px 1px #777; margin: 20px 5px;}
h4 { font-size: 1em; color: #F00; margin: 0 0 10px 20px; text-align: right; text-shadow: 1px 1px 1px #777;}
.leftdiv3 h4 {font-size: 1em; color: #F00; margin: 10px; text-align: left; text-shadow: 1px 1px 1px #777;}
h5 {color: #00F; font-size: 0.9em; margin: 0; padding: 0; text-shadow: 1px 1px 1px #777; font-weight: bold; }
h6 {color: #00F; font-size: 0.8em; margin: 0; padding: 0; text-shadow: 1px 1px 1px #777; font-weight: bold; }
h5 span {color:#F00;}
.banner {border: 1px solid #777;}

.rightdiv {float:right; width: 310px;}
.rightdiv3 {float:right; width: 310px;}
.right2div {float:right; width: 250px;}
.leftdiv {float:left; width: 330px;}
.left2div {float:left; width: 300px;}
.leftdiv3 {float:left; width: 400px;}
.leftdiv h3, .rightdiv h3 {margin: 0 0 0 10px; padding: 0;}
.leftdiv h5 {position:absolute; top:120px; left: 180px; width: 150px;}



/* footer */
#footer { position: fixed; bottom: 0px;  width: 100%; height: 30px; background: #1C3341; text-align: center; }

#footer h3 { font-size: 0.9em; color: #fff; text-shadow: 0px 0px 0px #777; margin: 5px 50px;}

#footer a:link, #footer a:visited, #footer a:active { color:#0ff; }
#footer a:hover { color:#ff0; }


#slider1 { padding: 0pt; margin: 0pt; list-style: none outside none; overflow: hidden; height: 700px; }
#slider1 li { padding: 0pt; margin: 0pt; }

#example .multiple li { width: 240px; }
#example .images li { width: 221px; }
#example .images img { float: none; }
#example .custom { margin-top: 30px; border: 1px dotted rgb(153, 153, 153); padding: 15px; }
#example .custom #my-pager a, #example .custom #my-start-stop a { margin-right: 12px; font-size: 32px; }
#example .ticker li { width: 500px; }
#example .controls a { font-size: 24px; }
#example .show { border-bottom: 1px dotted rgb(153, 153, 153); padding-bottom: 30px; margin-bottom: 30px; }
#example .thumbs { text-align: center; padding-top: 30px; }
#example .thumbs a { margin-right: 10px; }
#example .thumbs img, #example .bx-pager img { border: 1px solid rgb(102, 102, 102); }
#example .thumbs .pager-active img { border: 1px solid rgb(232, 0, 218); }
.custom-pager #example .bx-pager a { background: none repeat scroll 0% 0% transparent; }
.custom-pager #example .bx-pager .pager-active img, .custom-pager #example .bx-pager a:hover img { border: 1px solid rgb(232, 0, 218); }
#callback-wrapper { text-align: center; border: 1px dotted rgb(153, 153, 153); background: none repeat scroll 0% 0% greenyellow; margin-top: 24px; font-size: 26px; padding: 20px 0pt 0pt; display: none; }
#callback-wrapper p {  }

.thumbs a {font-size: 1.2em; font-weight: bold; text-decoration:none; text-shadow: 1px 1px 1px #333;}
.thumbs {margin: 10px auto; width: 960px; text-align: center; margin-top: 80px}
.thumbs span {color:red; font-size: 1.1em;}

#homepage, #about, #gallery, #portfolio, #contact, #kindergarten {  width: 950px; height: 600px; margin: 10px auto; position: relative; }


/* ======= Contact CSS ======= */
#contact { display: block; width: 900px;  margin: 5px auto; padding: 10px; color: #116CFF; position: relative; text-shadow: 1px 1px 1px #555;}
#contact p, label, legend { font: 1em "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif; }

/* Form style */
#contact label { display: inline-block; float: left; height: 26px; line-height: 26px; width: 150px; font-size: 1.2em; }
#contact input, textarea, select { width: 280px; margin: 0; padding: 5px; color: #666; background: #f5f5f5; border: 1px solid #ccc; margin: 5px 0; font:1.2em "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif; -webkit-border-radius:5px; -moz-border-radius:5px;}   
#contact input:focus, textarea:focus, select:focus { border: 1px solid #999; background-color: #fff; color:#333; }
#contact input.submit {cursor: pointer; width: 100px;  position:absolute; bottom:100px; right: 220px; padding:5px; font-weight:bold; color:#f00; border:1px solid #eee; -webkit-border-radius:5px; -moz-border-radius:5px; background-color: #ECCA9C;}
#contact input.submit:hover { background:#666; color:#f00; font-weight: bold;}
#contact input[type="submit"][disabled] { background:#888; }
#contact fieldset { padding:15px; border:1px solid #eee; -webkit-border-radius:5px; -moz-border-radius:5px; }
#contact legend { padding:7px 10px; font-weight:bold; color:#f00; border:1px solid #eee; -webkit-border-radius:5px; -moz-border-radius:5px; margin-bottom:0 !important; margin-bottom:20px; }
#contact span.required{ font-size: 13px; color: #ff0000; } /* Select the colour of the * if the field is required. */
#message { margin: 10px 0; padding: 0; }
.error_message { display: block; height: 22px; line-height: 22px; background: #FBE3E4 url('../assets/error.gif') no-repeat 10px center; padding: 3px 10px 3px 35px; color:#8a1f11;border: 1px solid #FBC2C4; -webkit-border-radius:5px; }
.loader { padding: 0 10px; }
#contact #success_page h1 { background: url('../assets/success.gif') left no-repeat; padding-left:22px; }
acronym { border-bottom:1px dotted #ccc; }
#comment {float:right;}
#comment label { display: inline-block; float: left; height: 26px; line-height: 26px; width: 200px; font-size: 1.2em; }
.name {float:left;}
#spam {position: absolute; top: 200px; right: 50px;}
#cont {position:relative; }
#form a {text-align: center; border: 1px solid #fff; margin: 20px; padding: 20px; background: none; -webkit-border-radius:5px; -moz-border-radius:5px;  -moz-box-shadow: inset 0 0 5px #0ff; -webkit-box-shadow: inset 0 0 10px #0ff; text-decoration:none; position: absolute; top: 100px; left: 100px; text-shadow:0 0 5px #ffe, 1px 1px 1px #777;}
#map2 a {text-align: center; border: 1px solid #fff; margin: 3px; padding: 5px; background: none; -webkit-border-radius:5px; -moz-border-radius:5px;  -moz-box-shadow: inset 0 0 5px #0ff; -webkit-box-shadow: inset 0 0 10px #0ff; text-decoration:none; position: absolute; bottom: 150px; right: 50px; text-shadow:0 0 5px #ffe, 1px 1px 1px #777;}
#map2 a:hover {color:#0ff; text-shadow:0 0 10px #ffe, 1px 1px 1px #777; background: #333;}

*:focus{outline:none;}
a:focus { outline: 0;}
input, textarea {font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;background-color:#fff;border:1px solid #ccc;font-size:20px;width:300px;min-height:30px;display:block;margin-bottom:16px;margin-top:8px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;-webkit-transition: all 0.5s ease-in-out;-moz-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;}
textarea {min-height:200px;}
input:focus, textarea:focus {-webkit-box-shadow:0 0 25px #ccc;-moz-box-shadow:0 0 25px #ccc;box-shadow:0 0 25px #ccc;
-webkit-transform: scale(1.05);-moz-transform: scale(1.05);transform: scale(1.05);}
input:not(:focus), textarea:not(:focus) {opacity:0.5;}
input[type=submit] {padding:10px;background:none;opacity:1.0;}

