/**
 * @package silvercoconut
 * @author lemsmyth
 * @since 1.0.0
 * =========================
 *     CONTACT FORM CSS
 * =========================
 */

 h1.entry-title {text-align: center;}
 .entry-content {text-align: center;}
 #coconutContactForm {text-align: center;}
.silver-coconut-contact-form {
  padding: 40px 0;
  max-width: 500px;
  width: 100%;
  margin: 0 auto;
  background-color: #fff; }
  .silver-coconut-contact-form .form-group {
    margin-bottom: 30px;
    position: relative; }
    .silver-coconut-contact-form .form-group:before {
      position: absolute;
      display: block;
      content: '';
      bottom: 0;
      left: 0;
      right: 0;
      height: 2px;
      background-color: #CBCBCB; }
    .silver-coconut-contact-form .form-group .form-control-msg {
      text-transform: uppercase;
      font-size: 10px;
      font-weight: 500; }
    .silver-coconut-contact-form .form-group .has-error:before {
      background-color: #A94442; }

.silver-coconut-form-control  {
  /* text-align: center; */
  resize: vertical;
  border: none;
  border-radius: 0;
  width: 100%;
  padding: 8px 15px;
  outline: none !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
  background-color: #fff !important; }
  .silver-coconut-form-control::-webkit-input-placeholder {
    text-transform: uppercase; }
  .silver-coconut-form-control::-moz-input-placeholder {
    text-transform: uppercase; }
  .silver-coconut-form-control:-ms-input-placeholder {
    text-transform: uppercase; }
  .silver-coconut-form-control:-o-input-placeholder {
    text-transform: uppercase; }
  .silver-coconut-form-control:hover, .silver-coconut-form-control:focus, .silver-coconut-form-control:active {
    box-shadow: none; }

#btn-silver-coconut-form {
  position: absolute;
  display: block;
  height: 60px;
  width: 200px;
  background-color: #ECFBFF;
  font-family: 'Pacifico';
  font-size: 19px;
  color: #2D7586;
  padding-right: 30px;
  overflow: visible;
  border: 2px solid #A6E0EE;
  border-radius: 3px;
  cursor: pointer; }
  #btn-silver-coconut-form svg {
    position: absolute;
    height: 30px;
    width: auto;
    top: 13px;
    right: 25px;
    -webkit-transition: -webkit-transform 0.15s;
    -moz-transition: -moz-transform 0.15s;
    -ms-transition: -ms-transform 0.15s;
    -o-transition: -o-transform 0.15s;
    transition: transform 0.15s; }
    #btn-silver-coconut-form svg path {
      fill: #2D7586; }
  #btn-silver-coconut-form:hover {
    background-color: #DDF7FF;
    color: #2d7586;
    border: 2px solid #A6E0EE; }
    #btn-silver-coconut-form:hover svg {
      -webkit-transform: rotate(10deg);
      -moz-transform: rotate(10deg);
      -ms-transform: rotate(10deg);
      -o-transform: rotate(10deg);
      transform: rotate(10deg);
      -webkit-transition: -webkit-transform 0.15s;
      -moz-transition: -moz-transform 0.15s;
      -ms-transition: -ms-transform 0.15s;
      -o-transition: -o-transform 0.15s;
      transition: transform 0.15s; }
  #btn-silver-coconut-form.clicked {
    background-color: #CFF5B3;
    border: 2px solid #CFF5B3;
    color: #6AAA3B;
    padding-right: 6px;
    -webkit-animation: bounce-in 0.3s;
    -moz-animation: bounce-in 0.3s;
    -ms-animation: bounce-in 0.3s;
    -o-animation: bounce-in 0.3s;
    animation: bounce-in 0.3s;
    cursor: default; }
    #btn-silver-coconut-form.clicked svg {
      -webkit-animation: flyaway 1.3s linear;
      -moz-animation: flyaway 1.3s linear;
      -ms-animation: flyaway 1.3s linear;
      -o-animation: flyaway 1.3s linear;
      animation: flyaway 1.3s linear;
      top: -800px;
      right: -1000px; }
      #btn-silver-coconut-form.clicked svg path {
        fill: #6AAA3B; }

@-webkit-keyframes flyaway {
  0% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: 13px;
    right: 25px;
    height: 30px; }
  5% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: 13px;
    right: 0px;
    height: 30px; }
  20% {
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    transform: rotate(-20deg);
    top: 13px;
    right: -130px;
    height: 45px; }
  40% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: -40px;
    right: -280px;
    opacity: 1;
    -ms-filter: none;
    filters: none; }
  100% {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    top: -200px;
    right: -100px;
    height: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filters: alpha(opacity=0); } }
@-moz-keyframes flyaway {
  0% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: 13px;
    right: 25px;
    height: 30px; }
  5% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: 13px;
    right: 0px;
    height: 30px; }
  20% {
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    transform: rotate(-20deg);
    top: 13px;
    right: -130px;
    height: 45px; }
  40% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: -40px;
    right: -280px;
    opacity: 1;
    -ms-filter: none;
    filters: none; }
  100% {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    top: -200px;
    right: -100px;
    height: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filters: alpha(opacity=0); } }
@-o-keyframes flyaway {
  0% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: 13px;
    right: 25px;
    height: 30px; }
  5% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: 13px;
    right: 0px;
    height: 30px; }
  20% {
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    transform: rotate(-20deg);
    top: 13px;
    right: -130px;
    height: 45px; }
  40% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: -40px;
    right: -280px;
    opacity: 1;
    -ms-filter: none;
    filters: none; }
  100% {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    top: -200px;
    right: -100px;
    height: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filters: alpha(opacity=0); } }
@keyframes flyaway {
  0% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: 13px;
    right: 25px;
    height: 30px; }
  5% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: 13px;
    right: 0px;
    height: 30px; }
  20% {
    -webkit-transform: rotate(-20deg);
    -moz-transform: rotate(-20deg);
    -o-transform: rotate(-20deg);
    -ms-transform: rotate(-20deg);
    transform: rotate(-20deg);
    top: 13px;
    right: -130px;
    height: 45px; }
  40% {
    -webkit-transform: rotate(10deg);
    -moz-transform: rotate(10deg);
    -o-transform: rotate(10deg);
    -ms-transform: rotate(10deg);
    transform: rotate(10deg);
    top: -40px;
    right: -280px;
    opacity: 1;
    -ms-filter: none;
    filters: none; }
  100% {
    -webkit-transform: rotate(60deg);
    -moz-transform: rotate(60deg);
    -o-transform: rotate(60deg);
    -ms-transform: rotate(60deg);
    transform: rotate(60deg);
    top: -200px;
    right: -100px;
    height: 0;
    opacity: 0;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filters: alpha(opacity=0); } }
@-webkit-keyframes bounce-in {
  0% {
    padding-right: 30px; }
  40% {
    padding-right: 6px; }
  50% {
    padding-right: 30px; }
  100% {
    padding-right: 6px; } }
@-moz-keyframes bounce-in {
  0% {
    padding-right: 30px; }
  40% {
    padding-right: 6px; }
  50% {
    padding-right: 30px; }
  100% {
    padding-right: 6px; } }
@-o-keyframes bounce-in {
  0% {
    padding-right: 30px; }
  40% {
    padding-right: 6px; }
  50% {
    padding-right: 30px; }
  100% {
    padding-right: 6px; } }
@-ms-keyframes bounce-in {
  0% {
    padding-right: 30px; }
  40% {
    padding-right: 6px; }
  50% {
    padding-right: 30px; }
  100% {
    padding-right: 6px; } }
@keyframes bounce-in {
  0% {
    padding-right: 30px; }
  40% {
    padding-right: 6px; }
  50% {
    padding-right: 30px; }
  100% {
    padding-right: 6px; } }

.form-control-msg {
  display: none; }

.has-error .form-control-msg {
  display: block;
  color: #a94442; }

.js-show-feedback {
  display: block;
  margin-top: 5px; }