/*8DC540-light, 006738-dark*, 424242-grey #b2d1b4-mint*/

    @font-face {
      font-family: "amatic";
      src: url('../fonts/Amatic-Bold.ttf');
    }

    #contesttitle {
      font-family: "amatic";
      font-size: 400%;
    }

    .questions {
      font-family: "amatic";
      font-size: 200%;
      letter-spacing: 1px;
    }

    #join {
      padding-top: 75px;
    }
    /*a hrefs*/
    a:link {
      color: #006738;
    }

    a:hover {
      text-decoration: none;
    }

    /*scroll to top button*/
    .scroll-top-wrapper {
      position: fixed;
      opacity: 0;
      visibility: hidden;
      overflow: hidden;
      text-align: center;
      z-index: 99999999;
      background-color: #777777;
      color: #eeeeee;
      width: 50px;
      height: 48px;
      line-height: 48px;
      right: 30px;
      bottom: 30px;
      padding-top: 2px;
      border-top-left-radius: 10px;
      border-top-right-radius: 10px;
      border-bottom-right-radius: 10px;
      border-bottom-left-radius: 10px;
      -webkit-transition: all 0.5s ease-in-out;
      -moz-transition: all 0.5s ease-in-out;
      -ms-transition: all 0.5s ease-in-out;
      -o-transition: all 0.5s ease-in-out;
      transition: all 0.5s ease-in-out;
    }
    .scroll-top-wrapper:hover {
      background-color: #888888;
    }
    .scroll-top-wrapper.show {
      visibility:visible;
      cursor:pointer;
      opacity: 1.0;
    }
    .scroll-top-wrapper i.fa {
      line-height: inherit;
    }

    /*buttons customized*/
    .btn-custom {
      background: transparent;
      border-color: #006738;
      color: #006738;
    }

    .btn-custom:hover {
      background: #8DC540;
      border-color: #8DC540;
    }

    /*navbar*/
    .navbar {
      margin-bottom: 0px;
      position: fixed;
      z-index: 12;
      width: 100%
    }

    .nav li {
      text-transform: uppercase;
    }

    .jumbotron {
      width: 100%;
      height: 100%;
      overflow: hidden;
      position: center;
      margin-bottom: 0;
    }

    #banner {
      height: 100%;
      width: 100%;
      background-image: url('../img/stonecrop.jpg');
      -webkit-box-shadow: 0px 3px 36px 16px rgba(0,0,0,0.75);
      -moz-box-shadow: 0px 3px 36px 16px rgba(0,0,0,0.75);
      box-shadow: 0px 3px 36px 16px rgba(0,0,0,0.75);
      position: relative;
      z-index: 2;
    }

    /*slogan in banner/jumbotron*/
    .jumbotronwords {
      padding-top: 80px;
      color: #b2d1b4;
      text-align: center;
    }

    /*down arrow related*/
    .centerglyph {
      text-align: center;
    }

    .glyphicon-chevron-down {
      font-size: 30px;
      z-index: 5;
      color: black;
    }
    
    /*about us section*/
    #aboutusbg {
      background-color: #424242;
      padding-bottom: 100px;
    }

    .thumbnail {
      border: 4px solid black;
      height: 530px;
      background-image: url('../img/halftone.png');
    }

    .thumbnail h3 {
      color: #006738;
    }

    #aboutus {
      margin-bottom: 50px;
    }

    .introdiv {
      padding-bottom: 50px;
    }

    /*services section*/

    .caption h3 {
      text-align: center;
    }

    #servicelist {
      font-size: 18px;
      padding-left: 40px;
    }

    .servicestext {
      color: black;
      -webkit-box-shadow: 0px 3px 36px 16px rgba(0,0,0,0.75);
      -moz-box-shadow: 0px 3px 36px 16px rgba(0,0,0,0.75);
      box-shadow: 0px 3px 36px 16px rgba(0,0,0,0.75);
      position: relative;
      z-index: 2;
    }

    #servicesbg {
      background-color: #8DC540;
      padding-top: 100px;
      padding-bottom: 100px;
    }

    /*featurette related*/
    #featurettebg {
      background-image: url('../img/halftone.png');
      margin-top: -100px;
    }

    #featurette1 {
      color: #21610B;
    }

    #featurette2 {
      color: #298A08;
    }

    #featurette3 {
      color: #86B404;
    }

    #maintenance {
      padding-top: 150px;
    }

    #referral {
      padding-top: 100px;
    }

    #seasonal {
      padding-top: 100px;
      padding-bottom: 100px;
    }

    /*gallery section*/
    .gallerycontent {
      padding-top: 50px;
      padding-bottom: 100px;
    }

    .gallerypic {
      margin-bottom: 20px;
      margin-top: 20px;
    }

    #gallery {
      color: white;
    }

    .gallerydiv {
      background-color: #424242;
      padding-top: 100px;
      padding-bottom: 100px;
    }

    /*contact section*/
    #contactlogo {
      padding-top: 50px;
    }

    .contactus {
      color: black;
    }

    #contactbg {
      background-image: url('../img/halftone.png');
      -webkit-box-shadow: 2px 19px 39px 3px rgba(0,0,0,0.75);
      -moz-box-shadow: 2px 19px 39px 3px rgba(0,0,0,0.75);
      box-shadow: 2px 19px 39px 3px rgba(0,0,0,0.75);
      position: relative;
      z-index: 2;
      padding-bottom: 100px;
    }

    #contactbox {
      padding: 20px;
    }

    #formbg {
      border: 4px solid black;
      margin-top: 30px;
      background-color: white;
    }

    #formbox {
      padding-top: 20px;

    }

    /*form highlight colour*/
    .form-control:focus {
      border-color: #8DC540;
      box-shadow: 0 2px 2px rgba(140, 213, 64, 0.075) inset, 0 0 8px rgba(140, 213, 64, 0.6);
      outline: 0 none;
    }

    /*contact icon related*/
    .contacticon {
      color: #8DC540;
      border: 2px solid green;
      border-radius: 25px;
      padding: 5px;
      margin-right: 5px;
    }

    .blackonhover:hover {
      color: black;
      border-color: black;
    }

    .glyphicon-earphone:hover {
      color: black;
      border-color: #006738;
    }

    .glyphicon-envelope:hover {
      color: black;
      border-color: #006738;
    }

    .social-links a{
      text-align: center;
      float: left;
      width: 36px;
      height: 36px;
      border: 2px solid #006738;
      border-radius: 100%;
      margin-right: 7px; /*space between*/

    } 
    .social-links a i{
      font-size: 20px;
      line-height: 30px;
      color: #8DC540;
    }

    /*map related*/

    #map {
      margin-top: -50px;
      margin-bottom: -50px;
    }


    /*footer section*/
    #footer {
      background-color: black;
      width: 100%;
      color: white;
      position: relative;
    }

    #footertext {
      text-align: right;
      padding-top: 5px;
    }

    #footer a:visited {
      color: #8DC540;
    }

    #footer a:active {
      color: #8DC540;
    }

    #footer a:link {
      color: #8DC540;
    }

    form {
      padding: 20px;
    }

    textarea {
      resize: none;
    }

    @media only screen and (min-width: 1024px) {
      .jumbotron {
        min-height: 500px;
      }
    }