body, p, h1, h2, h3, h4, ul, li{font-family: "HCo Gotham", "Gotham A", "Gotham B";}
    .layout{max-width: 1440px; margin: 0 auto;}

body{font-size:14px; line-height: 1.5}

h1, h2, h3, h4, h5{color:#000;}


h1, .h1{font-size: 2.57em}
h2, .h2{font-size: 2.14em}
h3, .h3{font-size: 1.71em}
h4, .h4{font-size: 1.42em}
h5, .h5{font-size: 1.28em}

p, li, a {font-size: 1.28em}

body{ background-color:#f5f5f5 }
.content{background-color: #fff; max-width: 1300px; margin:0 auto; padding-top:40px}

.jumbotron .h1, .jumbotron h1 {
    font-size: 2.57em;
}


    .nav li a {
    color: #000;
    font-weight: bold;
    }

    .nav li a:hover{text-decoration: underline;
      color:black}

    .btn-primary{background-color: #2db035; border-color:#2db035; font-weight: bold}
    .btn-primary:hover{background-color: #fff; border-color:#2db035; color:#2db035;}

    a{color:black}

    .btn-default{background-color:#2db035; color:#fff }
    .btn-default:hover;{background-color:#2db035; color:#fff }


    * {
  box-sizing: border-box;
}

.navbar-header{height: 120px;}

/* Style the search field */
form.example input[type=text] {
  padding: 10px;
  font-size: 1.21em;
  border: 1px solid grey;
  float: left;
  width: 80%;
  background: #f1f1f1;
}

/* Style the submit button */
form.example button {
  float: left;
  width: 20%;
  padding: 10px;
  background: #2196F3;
  color: white;
  font-size: 1.21em;
  border: 1px solid grey;
  border-left: none; /* Prevent double borders */
  cursor: pointer;
}

form.example button:hover {
  background: #0b7dda;
}

/* Clear floats */
form.example::after {
  content: "";
  clear: both;
  display: table;
}

.navbar{border-bottom: solid black 1px; background-color:white; -webkit-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.3);
box-shadow: 0px 5px 10px 0px rgba(0,0,0,0.3);}

.navbar-toggle .icon-bar {
    background: #2db035;
}
.navbar-toggle {border: 1px solid #2db035;}
.navbar-collapse{ background-color:white; }

.menu-spacer{margin-top:150px;}

.fbrand{padding:0px; max-width: 300px}


.card {
  height: 335px;
  position: relative;
  overflow: hidden;
}
.card .card-inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  transition: transform 0.5s;
  backface-visibility: hidden;
}
.card:hover .card-inner {
  transform: rotateY(180deg);
  backface-visibility: hidden;
}


.card .card-front, .card .card-back {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}
.card .card-back {
  transform: rotateY(180deg);
  backface-visibility: hidden;
}

hr.divider {
  border: 1px solid #2db035;
}

footer{background-color: #fff; border-top:2px solid #2db035; padding:40px; -webkit-box-shadow: 5px 0px 10px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 5px 0px 10px 0px rgba(0,0,0,0.3);
box-shadow: 5px 0px 10px 0px rgba(0,0,0,0.3); }
footer p{font-size:1.14em; color:#000!important}

.white{color:#fff}

.card{margin:20px 40px;}

.circle {
        width: 150px;
        height: 150px;
        border: 1px solid #000;
      }

.card-front{border: 1px solid #d5d5d5; padding: 10px;}
.card-back{border: 1px solid #d5d5d5; padding: 10px 20px;}
.card-front p, .card-back p{ font-size:1em }
.card-mask{clip-path: polygon(0 0, 100% 0, 100% 85%, 0% 100%); margin-bottom:20px;}

.dark-bg{background-color:#606060;}

.card-container{width: 95%; margin: 0 auto;}

.contact-info{min-height: 275px; border: 1px solid #d5d5d5;  border-radius: 10px; background-color: #fff; margin:10px 20px; margin-top:-100px; padding-top: 100px; margin-top: -65px;
    padding-top: 75px; padding-left: 10px; padding-right: 10px;}

.circular--square { border-top-left-radius: 50% 50%; border-top-right-radius: 50% 50%; border-bottom-right-radius: 50% 50%; border-bottom-left-radius: 50% 50%; margin:0 auto;}

@media only screen and (max-width: 1200px) {
  .card {min-height: 400px; transition: ease-in-out, width .35s ease-in-out;}

}


@media only screen and (max-width: 991px) {
  .card {min-height: 635px!important; transition: ease-in-out, width .35s ease-in-out;}
  .card-front p, .card-back p{ font-size:1.71em }
  .card-inner h5{ font-size:2.14em }
  .card-inner p{ font-size:1.71em }
}

@media only screen and (max-width: 450px) {
  .card {min-height: 600px!important; transition: ease-in-out, width .35s ease-in-out;}
  .card-front p, .card-back p{ font-size:1.28em }
  .card-inner h5{ font-size:1.71em }
  .card-inner p{ font-size:1.28em }
}