*{
  margin: 0;
  padding: 0;
}

body{
  background-color: #EDECF2;
  font-family: 'Open Sans', sans-serif;
  font-size: 13px;
}


img{
  border: 0;
}

a{
  text-decoration: none;
  color: #004730;
}
a:focus{
  outline: none;
}
a:hover{
  color: #005B3E;
}

h1{
  font-size: 32px;
  line-height: 40px;
  font-weight: 300;
  border-bottom: 1px solid #CCCCCC;
  color: #333333;
  text-shadow: 0 0 3px #FFFFFF;
  margin-bottom: 15px;
}

h2{
  font-size: 19px;
  line-height: 25px;
  font-weight: normal;
  color: #333333;
  margin-top: 30px;
  margin-bottom: 5px;
}


h3{
  font-size: 15px;
  line-height: 20px;
  font-weight: normal;
  color: #333333;
  margin-top: 30px;
  margin-bottom: 5px;
}

h1 a, h2 a, h3 a{
  color: #333333;
}


p{
  margin-bottom: 20px;
}

ul, ol{
  margin: 0 0 15px 30px;
} 

li{
  margin-bottom: 8px;
}

#container{
  width: 952px;
  margin: 0 auto;
  position: relative;
}


#header{
  height: 30px;
  margin-bottom: 30px;
}

#header #name{
  width: 300px;
  background-image: url(images/greengradient.png);
  line-height: 40px;
  height: 40px;
  font-size: 20px;
  color: #FFD200;
  text-align: center;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;
  float: left;
}

#header #name a{
  color: #FFD200;
}

#header #contacts{
  background-color: #CCCCCC;
  border-bottom-right-radius: 10px;
  padding-right: 10px;
  height: 30px;
  overflow: hidden;
  line-height: 30px;
  text-align: right;
  font-size: 10px;
  font-family: verdana;
  color: #4C4C4C;
}

#header #contacts img{
  vertical-align: middle;
  margin-left: 20px;
}

#header #contacts a{
  color: #4C4C4C;
}

#header #contacts a:hover{
  color: #000000;
}

#top{
  height: 80px;
  background-image: url(images/top.png);
}

#content{
  background-image: url(images/bg.png);
}

#bottom{
  height: 7px;
  background-color: #004730;
}


#sidebar{
  float: left;
  width: 200px;
  margin-left: 70px;
  position: relative;
  top: -50px;
}

#sidebar #logo{
  text-align: center;
  margin-bottom: 30px;
}

#sidebar #logo #mobilenavbutton{
  display: none;
}

#sidebar #promo{
  margin-top: 20px;
}

#sidebar #promo a{
  display: block;
  margin-bottom: 15px;
}

#sidebar ul{
  list-style-type: none;
  margin: 0;
}

#sidebar li{
  margin-bottom: 5px;
}


#sidebar .link{
  display: block;
  line-height: 25px;
  height: 25px;
  padding-left: 10px;
  overflow: hidden;
  font-size: 12px;
  background-image: url(images/yellowgradient.png);
  color: #00573D;
  margin-bottom: 3px;
}

#sidebar .link:hover{
  background-image: url(images/fadegradient.png);
}

#sidebar .current, #sidebar .current:hover{
  color: #FCE10E;
  background-image: url(images/greengradient.png);
  font-weight: bold;
  text-shadow: 0 0 5px #000000;
}

#main{
  margin-left: 370px;
  margin-right: 40px;
  font-size: 12px;
  position: relative;
  padding-top: 315px;
  padding-bottom: 20px;
}

#main p{
  line-height: 18px;
}


#submenu{
  float: right;
  width: 180px;
  border-left: 1px solid #004730;
  margin-bottom: 40px;
  margin-left: 20px;
}

#submenu ul{
  list-style-type: none;
  margin: 0;
  padding-left: 5px;
}

#submenu a{
  display: block;
  background-color: #D1D3D4;
  line-height: 14px;
  font-size: 11px;
  padding: 5px 2px 5px 10px;
  margin-bottom: 5px;
  color: #333333;
  background-image: url(/images/submenuarrow.png);
  background-position: left center;
  background-repeat: no-repeat;
}
#submenu a:hover{
  background-color: #004730;
  color: #FFFFFF;
}

#submenu .current, #submenu .current:hover{
  background-color: #808285;
  color: #FFFFFF;
}




#footer{
  margin-top: 60px;
}



#footer #fblike{
  float: left;
  width: 208px;
  text-align: center;
  padding-top: 10px;
}

#footer #buttons{
  position: relative;
  border-left: 2px solid #00573D;
  border-top: 2px solid #00573D;
  height: 78px;
  margin-left: 210px;
}

#footer #buttonstitle{
  position: absolute;
  top: -30px;
  right: 30px;
  height: 30px;
  line-height: 30px; 
  padding-right: 20px;
  width: 135px;
  background-image: url(images/greengradient.png);
  color: #FFD200;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;  
  text-align:right;
}


#footer #buttons ul{
  list-style-type: none;
  margin: 0;
}

#footer #buttons li{
  float: left;
  width: 180px;
  margin-left: 5px;
}

#footer #buttons a{
  display: block;
  background-color: #DDDCE2;
  height: 33px;
  width: 160px;
  margin-top: 5px;
  line-height: 33px;
  font-size: 11px;
  color: #333333;  
  padding: 0 10px 0 10px;
  overflow: hidden;
}

#footer #buttons a:hover{
  color: #00573D;
}

#footer #buttons img{
  vertical-align: middle;
}



#bottomcontacts{
  clear: both;
  margin-top: 30px;
  margin-bottom: 30px;
  border-top: 1px solid #00573D;
  border-bottom: 1px solid #00573D;
  text-align: center;
  padding: 10px;
  font-size: 12px;
  color: #666666;
}

#bottomcontacts a{
  color: #666666;
}

#bottomcontacts a:hover{
  color: #00573D;
}


#copy{
  text-align: center;
  color: #999999;
  font-size: 10px;
  margin-bottom: 30px;
}

#copy a{
  color: #999999;
}











#photo{
  position: absolute;
  width: 594px;
  height: 371px;
  top: -65px;
  left: -34px;
}

#photo #frame{
  width: 594px;
  height: 371px;
  background-image: url(images/frame.png);
  position: absolute;
  left:0;
  top:0;
  z-index: 3;
}

#photo #image{
  width: 594px;
  height: 371px;
  background-position: top center;
  background-repeat: no-repeat;
  position: absolute;
  left:0;
  top:15px;
  z-index: 1;
}

#photo #paperclip{
  width: 92px;
  height: 92px;
  background-image: url(images/paperclip.png);
  position: absolute;
  left:15px;
  top:-17px;
  z-index: 5;  
}


.rightphoto{
  float: right;
  border: 10px solid #CCCCCC;
  box-shadow: 0 0 20px #333333;
  margin: 0 0 25px 25px;
  -moz-transform:rotate(3deg);
  -webkit-transform:rotate(3deg);
  -ms-transform:rotate(3deg);
}


.stafftable td{
  border-bottom: 1px solid #CCCCCC;
  padding: 5px 10px 5px 0;
  vertical-align: top;
}



.newsitem{
  border-bottom: 1px solid #CCCCCC;
  padding-bottom: 20px;
}




#calendar{
  border-collapse: collapse;
  background-color: #f1f1f1;
  width: 95%;
  margin: 0 auto;
}

#calendar td{
  padding: 5px 3px 5px 3px;
  border: 1px solid #CCCCCC;
  vertical-align: top;
  height: 90px;
  width: 15%;
}

#calendar .date{
  text-align: right;
  font-weight: bold;
}

#calendar .heading td{
  background-image: url(images/greengradient.png);
  color: #FCE10E;
  text-shadow: 0 0 5px #000000;  
  text-align: center;
  height: 20px;
  line-height: 20px;
}

#calendar ul{
  list-style-type: none;
  margin: 0;
}

#calendar li{
  padding-bottom: 5px;
}



.calendarbutton{
  display: block;
  background-image: url(images/greengradient.png);
  line-height: 40px;
  height: 40px;
  width: 150px;
  font-size: 15px;
  color: #FFD200;
  text-align: center;
  border-radius: 10px;
  margin-top: -20px;
}

.calendarbutton:hover{
  color: #FFD200;
  background-position: bottom left;
}






#competition{
  
}

#competition td{
  padding: 0 10px 5px 0;
}

#competition .input{
  width: 250px;
  padding: 3px;
  border: 1px solid #CCCCCC;
  font-family: arial;
  font-size: 12px;
}

#competition .textarea{
  width: 250px;
  height: 60px;
  padding: 3px;
  border: 1px solid #CCCCCC;
  font-family: arial;
  font-size: 12px;
}

.submit{
  background-image: url(/images/greengradient.png);
  border-radius: 5px;
  color: #FFD200;
  font-size: 16px;
  border: none;
  padding: 6px 40px;
  cursor: pointer; 
}

.submit:hover{
  background-position: bottom left;
}

.clear{ clear: both; }


#main iframe, #main img{
  max-width: 100% !important;
}

#mobilecontacts{ display: none; }




.calendarpopup .mfp-iframe-scaler{
  height: 0px;
  height: 700px;
  padding-top: 0;
}


#facebook{
  width: 100%;
  height: 505px;
  background-color: #FFFFFF;
  box-shadow: 0 0 15px #666666;
  border-radius: 5px;
  overflow: hidden;
}
#facebook iframe{
  position: relative;
  top: -70px;
  width: 100%;
  height: 600px;
  border-radius: 5px;
}

.question{
  overflow: auto;
  padding: 8px 0;
  border-bottom: 1px solid #CCC;
}


.question .q{
  float: left;
  width: 130px;
}
.question .a{
  margin-left: 150px;
}

.question .a .input, .question .a .textarea, .question .a .select{
  border: 0;
  width: 94%;
  padding: 5px 2%;
  font-family: arial;
  font-size: 13px;
  transition: 1s box-shadow;
}
.question .a .textarea{
  height: 80px; 
}


.question .a .input:focus, .question .a .textarea:focus{
  box-shadow: 0 0 5px #666;
  transition: .3s box-shadow;
}

.question.error{
  border-left: 5px solid red; 
  padding-left: 5px;
}
.question.error .q{
  width: 120px;
} 
.question.error .a{
  margin-left: 140px;
} 

.question .a .note{
  display: block;
  font-size: 11px;
  line-height: 14px;
}

.formtitle{
  margin-top: 45px;
  background-color: #004730;
  color: #FFFFFF;
  padding: 5px;
  border-top-left-radius: 5px;
  border-top-right-radius: 5px;
}












