@import url(http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,700);

body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, img, form, fieldset, input, textarea, blockquote {
	margin: 0; padding: 0; border: 0;
}

body{
	font-family: 'Open Sans', sans-serif;
}

h1, h2, h3, h4, h5{
	font-weight: normal;
	
}

h3{
	margin-bottom: 40px;
}

h4{
	margin-bottom: 20px;

}

p{
	margin-bottom: 20px;
}

a{
	text-decoration: underline;
}

a:hover{
	text-decoration: underline;
}

/* generic */

.half{
	position: relative;
	margin-left: -1%;
	margin-right: -1%;
	overflow: hidden;
}

.half .left,
.half .right{
	width: 48%;
	margin-left: 1%;
	margin-right: 1%;
}

.half .right{
	float: right;
}

.half .left{
	float: left;
}

.callto{}
.callto a{
	display: block;
	padding: 10px 20px;
	text-decoration: none;
}
.callto a:hover{
	opacity: 0.8;
}

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

.primary{
	width: 60%;
	float: left;
	margin-bottom: 40px;
}

.secondary{
	width: 30%;
	float: right;
}

/* topbar */

#header {
    background: url(../images/bg-full.png) center bottom no-repeat;
    height: 210px;
}
#header .container{
	position: relative;
}
#header #logo {
    top: 65px;
    left: 106px;
    position: absolute;
}
#header #logo img{}
#header .details {
    list-style: none;
    position: absolute;
    top: 23px;
    right: 160px;
}
#header .details li.enrol{
	margin-bottom: 15px;
}
#header .details li.enrol a{
	color: #00b2c0;
	font-size: 21px;
	text-decoration: none;
	line-height: 1em;
}
#header .details li.enrol a span{
	font-size: 25px;
}
#header .details li.enrol a:hover{
	opacity: 0.8;
}
#header .details li.email a{
	color: #b1610c;
	font-size: 21px;
	text-decoration: none;
	line-height: 1em;
}
#header .details li.email a span{
	font-size: 16px;
}
#header .details li.email a:hover{	
	opacity: 0.8;
}

/* nav */

#nav{
	background: #cdaf93;
}
#nav .container{}
#nav .nav{
	list-style: none;
	text-align: left;
}
#nav .nav li{
	display: inline-block;
	text-align: center;
	
}
#nav .nav li.active a,
#nav .nav li:hover a
{
	background: url(../images/heart.png) right top no-repeat;
	
}
#nav .nav li.active a
{
	color: #ffdada;
	
}
#nav .nav li a{
	color: #6b442d;
	text-decoration: none;
	display: block;
	height: 43px;
	line-height: 43px;
	margin-top: 6px;
	margin-bottom: 6px;
	border-right: 1px solid #b1987e;
	padding-left: 5px;
	padding-right: 5px;
}
#nav .nav li:last-child a{
	border-right: none;
}
#nav .nav li a:hover{
	color: #ffdada;
}


/* banner */

#banner{
	background: url(../images/banner.png) center center no-repeat;
	border-bottom: 1px solid #cdaf93;
}
#banner .container{
	text-align: center;
	width: 520px;
	padding: 40px 20px;
	margin: 0 auto;
}
#banner h3{
	color: #7b5643;
	font-size: 30px;
	margin-bottom: 30px;
	line-height: 1em;
	text-transform: uppercase;
}
#banner p{
	color: #7b5643;
}

#banner p:last-child{
	margin-bottom: 0;
}


/*main */

#main{}
#main .container{
	overflow: hidden;
	padding-top: 40px;
	padding-bottom: 40px;
}
#main h3 {
    height: 120px;
    text-indent: -9999px;
    margin-bottom: 10px;
	line-height: 1em;
}
#main h4 {
    color: #7b573f;
	font-size: 20px;
	font-weight: normal;
}
#main.subpage h3 {
    background-position: center bottom !important;
}
#main p{
	color: #7b573f;
}

#main p:last-child{
	margin-bottom: 0;
}
#main ul {
    list-style-type: disc;
    padding-left: 19px;
    margin-bottom: 20px;
}
#main ul li{
	color: #7b573f;
	margin-bottom: 20px;
}
#main ul li:last-child{
	margin-bottom: 0;
}

.bird {
    background: url(../images/pic002.png) -163px bottom no-repeat;
}
	
.elephant {
    background: url(../images/pic003.png) -163px bottom no-repeat;
}

.lion {
    background: url(../images/pic004.png) -159px bottom no-repeat;
}

.croc {
    background: url(../images/pic011.png) -159px bottom no-repeat;
}

.sun {
    background: url(../images/pic012.png) -159px bottom no-repeat;
}

.frog {
    background: url(../images/pic013.png) -159px bottom no-repeat;
}

.whale {
    background: url(../images/pic014.png) -159px bottom no-repeat;
}

.bird2 {
    background: url(../images/pic015.png) -159px bottom no-repeat;
}

.bear {
    background: url(../images/pic016.png) -159px bottom no-repeat;
}

.lang {
    background: url(../images/pic0013.png) -159px bottom no-repeat;
}

.sched{
	color: #7b573f;
	font-size: 16px;
	font-weight: bold;
	background: #fdead1;
	border-radius: 10px;
	text-align: center;
	padding: 40px 0;
	margin-bottom: 30px;
}	

.secondary h4{
	text-transform: uppercase;
	font-size: 28px;
	font-weight: normal;
	color: #7a5640;
}

.secondary p{
	font-size: 14px;
	color: #7a5640;
}
.secondary p:last-child{
	margin-bottom: 0;
}

.secondary p.callto a{
	display: inline-block;
	padding: 5p 10px;
	color: #fff;
	border-radius: 5px;
	background: #f9baba;
	font-weight: bold;
}

.secondary .box1{
	padding: 30px;
	border-radius: 10px;
	background: #ffdada;
	margin-bottom: 30px;
}
.secondary .box2{
	padding: 30px;
	border-radius: 10px;
	background: #cdb093;
	margin-bottom: 30px;
}

.secondary .box2 h4{
	color: #fff;
}

.full{
	min-height: 400px;
}

#roll{}
#roll .item{
	overflow: hidden;
	margin-bottom: 40px;
}
#roll .cover{
	float: left;
	margin: 0 20px 20px 0;
}
#roll .cover img{
}
#roll .content{
	overflow: hidden;
}
#roll .content p{}
#roll .content ul{
	padding-left: 20px;
}
#roll .content p:last-child{}

#main .grid{
	position: relative;
	margin-left: -1%;
	margin-right: -1%;
	list-style: none;
	overflow: hidden;
	padding: 0;
	margin-bottom: 20px;
}
#main .grid li{
	margin-left: 1%;
	margin-right: 1%;
	margin-bottom: 20px;
	background: #f5eee9;
	float: left;
	display: table;
}

#main .grid li span{
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	padding: 40px 0;
}

#main .grid li span{
	font-weight: bold;
}
#main .grid li em{
	font-weight: normal;
	font-size: 90%;
}

#main .grid.two li{
	width: 48%;
}
#main .grid.three li{
	width: 31%;
}

.contact .container{
	text-align: center;
}

#banner.contact{
	background: url(../images/banner2.jpg) center center no-repeat;
	margin-bottom: 200px;
}

#banner .details{
	position: relative;
	overflow: hidden;
	display: inline-block;
	text-align: left;
	line-height: 40px;
	border-top: 1px solid #7a5640;
	padding-top: 20px;
}
#banner .details dt{
	font-weight: bold;
	float: left;
	width: 140px;
	text-align: left;
	clear: left;
}
#banner .details dd{
	float: left;
	color: #7b5643;
}
#banner .details a{
	color: #7b5643;
	text-decoration: underline;
}
#banner .details a:hover{
	text-decoration: none;
}

.orange{ color: #f28701; }
.blue{ color: #00b2be; }
.green{ color: #64a527; }
.pink{ color: #dc004f; }


/* bottom */

#bottom{
	background: #ffdada;
}


#bottom .container{
	overflow: hidden;
	position: relative;	
	height: 71px;
}
#bottom h3{}
#bottom p{}

#bottom .details {
    list-style: none;
}
#bottom .details li{
	float: left;
	margin-right: 40px;
}
#bottom .details li.enrol{
	margin-top: 13px;
}
#bottom .details li.enrol a{
	color: #00b2c0;
	font-size: 21px;
	text-decoration: none;
	line-height: 1em;
}
#bottom .details li.enrol a span{
	font-size: 25px;
}
#bottom .details li.enrol a:hover{
	opacity: 0.8;
}
#bottom .details li.email{
	margin-top: 15px;
}



#bottom .details li.email a{
	color: #b1610c;
	font-size: 21px;
	text-decoration: none;
	line-height: 1em;
}
#bottom .details li.email a span{
	font-size: 16px;
}
#bottom .details li.email a:hover{	
	opacity: 0.8;
}

#bottom .details li.facebook{
	margin-top: 20px;
	float: right;
	margin-right: 0;
}

#bottom .details li.facebook a{
	background: url(../images/facebook.jpg) left center no-repeat;
	display: inline-block;
	width: 147px; height: 34px;
	text-indent: -9999px;
}

#bottom .details li.facebook a:hover{
	opacity: 0.8;
}




/* footer */

#footer{
	background: #cdaf93;
	
}

#footer .container{
	overflow: hidden;
	padding: 20px 0;
}

#footer .left{
	float: left;
}
#footer .right{
	float: right;
}

#footer p{
	font-size: 13px;
	color: #fff;
	margin: 0;
}
#footer p span{
	white-space: nowrap
}
#footer p strong{
	font-weight: bold
}
#footer p a{
	text-decoration: underline;
	color: #fff;
}
#footer p a:hover{
	text-decoration: none;
}
#footer .left{
float: left;
}
#footer .right{
float: right;
}





/* form */

#contactus label
{
   font-size: 14px;
}

#contactus input[type="text"],
#contactus textarea
{
  font-size: 14px;
  background: #f1f1f1;
  width: 98%;
  padding: 3px 1%;

}

#contactus input[type="text"]
{
  height:18px;
}

#contactus #scaptcha
{
  width:60px;
  height:18px;
}

#contactus input[type="submit"]
{
  padding: 10px 20px;
  text-decoration: none;
  text-transform: uppercase;
}

#contactus textarea
{
  height:54px;
}

#contactus input[type="text"]:focus,
#contactus textarea:focus
{
  outline: none;
  background: #e6e6e6;
}

#contactus .container
{
   margin: 0;
   padding: 0;
   width: auto;
}

#contactus .error
{
   font-size: 13px;
   color: #900;
   background-color : #ffff00;
}

#contactus fieldset#antispam
{
   padding:2px;
   border-top:1px solid #EEE;
   border-left:0;
   border-right:0;
   border-bottom:0;
   width:350px;
}

#contactus fieldset#antispam legend
{
   font-size: 13px;
   font-weight:bold;
   color:#333;   
}

#contactus .short_explanation
{
   font-size: 13px;
   color:#000;   
}

/* spam_trap: This input is hidden. This is here to trick the spam bots*/
#contactus .spmhidip
{
   display:none;
   width:10px;
   height:3px;
}
#fg_crdiv
{
   font-size: 13px;
   opacity: .2;
   -moz-opacity: .2;
   filter: alpha(opacity=20);   
}
#fg_crdiv p
{
    display:none;
}


/* map */

.map{
    overflow:hidden;
    padding-bottom:56.25%;
    position:relative;
    height:0;
}
.map iframe{
    left:0;
    top:0;
    height:100%;
    width:100%;
    position:absolute;
}


/* #Media Queries
================================================== */

.slicknav_menu{ display: none; }


/***********blog****************/
/***********blog****************/
/***********blog****************/
/***********blog****************/
/***********blog****************/

#main{ overflow: hidden; }

.blog .primary{ width: 65%; float: left; }
.blog .secondary {
    width: 30%;
    float: right;
    padding: 15px;
    background: #ffdada;
}

.blog .secondary h2 {
    color: #333;
    text-transform: uppercase;
    margin-bottom: 9px;
}


.blog #blogroll{ min-height: 400px;}

.blog .block {
    overflow: hidden;
    padding: 15px;
    margin: 0 0 15px 0;
    border: 1px solid #e1e1e1;
}

.block h1,
.block h2,
.block h3,
.block h4,
.blcok p{
	margin: 0 0 15px 0;
}

.block h1{ font-size: 30px; }
.block h2{ font-size: 25px; }
.block h3{ font-size: 20px; }
.block h4{ font-size: 18px; }
.block small{
	display: block;
	margin: 0 0 15px 0;
}
.block p{}

.block ul{ list-style: disc; }
.block ul li{ margin: 0 0 15px 0;}

.block ol{ list-style: disc; }
.block ol li{ margin: 0 0 15px 0;}


.block .info{
	overflow: hidden;
}
.block .info h1{
	margin-bottom: 15px;
}
.block .info p{
}
.block .info small{
	margin-bottom: 15px;
}

.block .thumb{
	float: left;
	margin: 0 15px 15px 0;
}
.block.article .thumb{
	float: right;
	margin: 0 0 15px 15px;
}
.block .thumb img{
	display: block;
	margin: 0;
	padding: 0;
	border: none;
}

.block .callto{}

.block .callto a {
    display: inline-block;
    background: #00b2c0;
    color: #fff;
    text-transform: uppercase;
}

.block .callto a:hover{
	opacity: 0.8;
}

.posts{}
.posts li{}
.posts li a {
    color: #6b442d;
    text-decoration: none;
}
.posts li a:hover{
	opacity: 0.8;
}

@media only screen and (max-width: 1300px) {

#header {
    background: url(../images/bg2.png) center bottom no-repeat;
    height: 260px;
}

#header #logo {
    top: 15px;
    left: 0;
}

#header .details{
	text-align: left;
	right: 0;
}

#header .details li.email,
#header .details li.enrol{
	display: inline-block;
}

#header .details li.enrol{
	margin-right: 20px;
}

/* 1300px */
}

@media only screen and (max-width: 980px) {

.container{
	width: 96%;
}

.slicknav_menu{ 
	display: block;
}

#nav .nav{
	display: none;
}

#header{
	margin-top: 40px;
}

#roll .cover{
	width: 30%;
}
#roll .cover img{
	width: 100%;
	height: auto;
	display: block;
}

.blog .block .thumb{
	width: 20%;
	height: auto;
}

.blog .block .thumb img{
	width: 100%;
	height: auto;
}


/* 980px */
}



@media only screen and (max-width: 860px) {
	
#header {
    background: url(../images/bg3.png) center bottom no-repeat;
    height: 290px;
}

#header .container {
	text-align: center;
}
#header #logo {
    position: static;
	display: inline-block;
	margin: 20px auto;
}

#header .details{
	position: static;
	text-align: center;
}

#header .details li.email,
#header .details li.enrol{
	display: block;
	margin-bottom: 5px;
}

#header .details li.email br,
#header .details li.enrol br{
	display: none;
}

#header .details li.enrol{
}

/* 860px */
}

@media only screen and (max-width: 767px) {
	
#header {
    background: url(../images/bg4.png) center bottom no-repeat;
    height: 250px;
}

.primary, .secondary{
	float: none;
	width: 100%;
}

#footer .left,
#footer .right{
	float: none;
	text-align:center;
}

#bottom .container{
	height: auto;
	padding: 20px 0;
}


#bottom .details{
	text-align: center;
}
#bottom .details li{
	float: none !important;
	width: auto;
	margin: 0 0 10px 0 !important;
	text-align: center;

}
#bottom .details li:last-child{
	margin-bottom: 0 !important;

}
#bottom .details li br{
	display: none;
}

#bottom .details li span{
	white-space: nowrap;
}

.bird, .elephant, .lion, .croc, .sun, .frog, .whale, .lang, .bird2, .bear{
	background: none;
	text-indent: 0 !important;
	color: #6f482d;
	text-transform: uppercase;
	font-size: 33px;
	height: auto !important;
	border-bottom: 1px dotted #ccc;
	padding-bottom: 10px;
	margin-bottom: 10px;
}

#header .details li.enrol {
    margin-right: 0;
}

.blog .primary,
.blog .secondary{
	float: none;
	width: auto;
	
}
.blog .primary{
	margin-bottom: 40px;
}

.blog .block .thumb{
	width: 40%;
}

/* 767px */
}

@media only screen and (max-width: 550px) {

#banner .container{
	width: 96%;
	padding-left: 2%;
	padding-right: 2%;
	background: #00b1c1;
	padding-top: 20px;
	padding-bottom: 20px;
}

#banner.contact .container{
	background: #ededed;
}

#banner.contact h3 {
    color: #7b5643;
}

#banner .details{
	text-align: center;
	width: 100%;
}
#banner .details dt,
#banner .details dd
{
	text-align: center !important;
	width: auto;
	float: none;
	clear: none;
	line-height: 25px;
}

#banner .details dd
{
	margin-bottom: 10px;
}

#banner .details dd:last-child
{
	margin-bottom: 0;
}

#banner h3, 
#banner p{
	color: #fff;
}

#banner h3{
	margin-bottom: 20px;
}


#main ul{
	margin-bottom: 20px;
}

#main .grid{
	margin-left: 0;
	margin-right: 0;
}
#main .grid li{
	float: none;
	width: 100% !important;
}

#main .grid li span{
	float: none;
	padding: 20px 0;
}

#banner.contact{
	margin-bottom: 0;
}



}

@media only screen and (max-width: 479px) {
	

#header {
    height: 290px;
}
#header h1 img{
	width: 100%;
	height: auto;
}

#header .details li.email br,
#header .details li.enrol br{
	display: block;
}

.bird, .elephant, .lion, .croc, .sun, .frog, .lang, .whale, .bird2, .bear{
	font-size: 28px;
}

#roll .item .cover{
	width: 100%;
	float: none;
}

#roll .item .cover img{
	width: auto;
}

.blog .article .thumb{
	float: none;
	width: auto;
	margin-left: 0;
}

.blog .article .thumb img{
	max-width: 300px;
	margin-left: 0;
}

.blog .block h1 {
    font-size: 23px;
    line-height: 30px;
}
	
	
	
/* 479px */
}

@media only screen and (max-width: 320px) {
	
/* 320px */
}

.responsive {
  width: 100%;
  height: auto;
}