body {											
margin: 0;
padding: 0;
color: #333233; 
font-family: Arial, Verdana, sans-serif; 
font-size: 15px;
line-height: 1.6em;
background: url(images/bg-main2.jpg) repeat; }

html, body {height: 100%;}				                /* for sticky footer */

a {font-size: 100%; color: #59b892; text-decoration: none; letter-spacing: 1px; }
a:hover { text-decoration: none; color: #111; }
a img {border: 0;}
a {outline: none; }

h1, h2, h3 { font-weight: normal; text-align: center; }
h1 { font-size: 40px; margin-bottom: 10px; line-height: 1.7em; letter-spacing: 1px; text-shadow: 1px 1px 1px #000; }
h2 { font-size: 19px; color: #83ad35; }
h3 { font-size: 14px; }

.img1 {margin:0 0 30px 30px;}
.img2 {margin:20px 30px 30px 0; }
.img3 {margin:20px 5px 0 0; position:absolute; right:20px; -webkit-transform:  rotate(10deg);-moz-transform:  rotate(10deg);-o-transform:  rotate(10deg);writing-mode: lr-tb;}
.imgfoot { margin-right: 10px;}
.imgfoot2 { margin-left: 10px;}

.img1, .img2, .img3, .img4 { border: 8px solid #fff; 
-webkit-box-shadow:       0 8px 10px -6px #111;
        -moz-box-shadow:  0 8px 10px -6px #111;
             box-shadow:  0 8px 10px -6px #111; }

.bigger { font-size: 17px; }

#container {  overflow:hidden; min-height: 100%; position: relative; margin: 0 auto;  }

#surround {position: relative; height: 260px; background: #faf9d9; }
#header {position: relative; width: 960px; height: 100%; margin: 0 auto; background: url(images/beads.png) no-repeat right top; }
#logo { width:auto; padding-top: 3px; margin: 0 auto; text-align: center; }

#phone { position: absolute; bottom: 150px; right: 60px; color: #111; font-size: 21px; letter-spacing: 2px; text-shadow: 1px 1px 1px #000; font-weight: bold; width: auto; height: auto; }
#email { position: absolute; bottom: 100px; right: 60px;  height: auto; width: auto; font-weight: bold; }
#email a { color:#111; font-size: 21px; letter-spacing: 2px; text-shadow: 1px 1px 1px #000; }
#email a:hover { text-decoration: none; color: #63cfa4; text-shadow: 1px 1px 1px #000; }

#menusurround {position: absolute; bottom: 0; right: 0; left: 0; height: 35px; background: #63cfa4; font-size: 25px; 
-webkit-box-shadow:      0 8px 10px -6px #111;
       -moz-box-shadow:  0 8px 10px -6px #111;
            box-shadow:  0 8px 10px -6px #111;}
#menu { width: 960px; margin: 0 auto; letter-spacing: 1px; }
#menu a, #menu a:hover, #menu a:active, #menu .active {  display: inline-block; padding: 4px 22px 0 22px; text-align:left; text-decoration: none; width: auto; } 
#menu a         { color:#000; text-shadow: 1px 1px 1px #fff; }
#menu a:hover   { color:#787d83; } 
#menu a:active  { color:#fff; }
#menu .active   { color:#fff; text-shadow: 1px 1px 1px #000;}

#main { border: dashed #63cfa4 3px; background: #fff; overflow: auto; height: auto; margin: 30px auto 0 auto; width: 960px;
border-radius: 			  30px 30px; 
      moz-border-radius:  30px 30px;  
     webkit-border-radius:30px 30px; 
      o-border-radius: 	  30px 30px;
-webkit-box-shadow:             0 8px 10px -6px #111;
              -moz-box-shadow:  0 8px 10px -6px #111;
                   box-shadow:  0 8px 10px -6px #111; }  /* padding-bottom must be same height as the footer  */
#mainwords { padding: 20px; background: url(images/bg-words.png) repeat; }

.empty { clear: both; }

.equal { text-align: justify; -ms-text-justify: distribute-all-lines; text-justify: distribute-all-lines; clear: both; }
.stretch { width: 100%; display: inline-block; font-size: 0; line-height: 0;}

#banner { position: relative; background: #eee url(images/bg-banner.png) no-repeat bottom; font-size: 16px; width: 900px; margin: 0 auto 20px auto; padding: 12px 0 0 0; clear: both; height: 240px; text-align: center; }
#banner p { margin: 4px 240px 0 0; }
#imgdrop {position: absolute; top: 58px; right: 10px;}

.cent { text-align: center;}

hr { color:#5bceca; background-color: #5bceca; height: 1px; border: none; margin: 10px 325px 10px 100px; }
hr.test { color:#fff; background-color: #fff; height: 1px; border: none;  margin: 0; }

/* ________________________________________________________ */

.nudge { height: 190px; clear: both; }     
/* OPTIONAL this can force footer to stick to bottom in FF - & also useful for adding gap between content & footer - make height larger than footer height */  

/* ________________________________________________________ */

.contactdetails { margin-top: 30px; width: 500px; margin: 0 auto; }
.contactdetails label { text-align: left; float: left;  width: 270px; padding: 5px 5px 5px 0; }
.contactdetails input {width: 200px; margin-bottom: 16px; padding: 5px; border: 3px solid #fcc6f9; }

.commentarea { margin-left: 5px; width: 500px; margin: 0 auto; }
.commentarea textarea { margin-bottom: 20px; width: 472px; height: 100px; padding: 6px; background: #fff; border: 3px solid #fcc6f9; }

.submitbutton { width: 500px; margin: 0 auto; }
.submitbutton input { width: 490px; padding: 6px; background: #a1c470; font-size: 22px; text-align: center; border: 3px #fcc6f9 solid; color: #fff;}

.submitbutton input:hover { color: #000; background: #fcc6f9; cursor:pointer; border: 3px #a1c470 solid; }
.submitbutton input:active {background:#ccc; border: 3px #ccc solid; }

.mandatory {color: red;}

#thanks {  background: url(images/bg-main2.jpg); border: 3px #fcc6f9 solid; text-align: center; font-size: 20px; font-weight: bold; width: 450px; margin: 30px auto; 
-webkit-box-shadow:      0 8px 10px -6px #ccc;
       -moz-box-shadow:  0 8px 10px -6px #ccc;
            box-shadow:  0 8px 10px -6px #ccc;	 }

#infosurround { height: 180px; }
.info { position: relative; height: 165px; width: 300px; margin: 10px auto 0 auto; padding-left: 140px; background: #fff; border: 1px solid #83ad35;}
.info h3 { text-align: left; }
.info a { color: #ccc; }
.info form { color: inherit; }
.info label {float: left; padding-top: 4px;  width: 150px; }
.space input { width: 120px; border: #99ca3d 1px solid; background: #f1f1f1; }
.button input { margin-top: 2px; width: 50px; background: #99ca3d; font-weight: bold; font-size: 12px; border: 1px #ccc solid; }

#footer {position: relative; background: #faf9d9; height: 150px; margin: -150px auto 0 auto; /*covers extra area created in maincontent */ font-size: 11px; 
color: #111; text-align: center; clear: both;
-webkit-box-shadow:      0 -5px 18px -5px #111;
       -moz-box-shadow:  0 -5px 18px -5px #111;
            box-shadow:  0 -5px 18px -5px #111; }

/* reducing the height by a few pixel can help remove vertical side bar if page should fit a normal monitor */

#footer a { color: #111; text-decoration: none; font-size: 11px;   }
#footer a:hover { color: #fff; }
#footer a img {border: 0;}
#footer a {outline: none; }
#footerwords {  padding-top: 25px;   }