/* ========== BASIC ANIMATIONS ========== */

/* Fade In */
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  .fade-in { animation: fadeIn 1.5s ease-in-out; }
  
  /* Slide Up */
  @keyframes slideUp {
    from { transform: translateY(30px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
  }
  .slide-up { animation: slideUp 1s ease-out; }
  
  /* Zoom In */
  @keyframes zoomIn {
    from { transform: scale(0.9); opacity: 0; }
    to { transform: scale(1); opacity: 1; }
  }
  .zoom-in { animation: zoomIn 0.8s ease-in; }
  
  /* Bounce */
  @keyframes bounce {
    0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
    40% { transform: translateY(-20px); }
    60% { transform: translateY(-10px); }
  }
  .bounce { animation: bounce 1.2s; }
  
  /* ========== DIRECTIONAL FADE INS ========== */
  
  @keyframes fadeInRight {
    from { transform: translateX(30px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
  }
  .fade-in-right { animation: fadeInRight 1s ease-in-out; }
  
  @keyframes fadeInLeft {
    from { transform: translateX(-30px); opacity: 0; }
    to { transform: translateX(0); opacity: 1; }
  }
  .fade-in-left { animation: fadeInLeft 1s ease-in-out; }
  
  @keyframes fadeInTop {
    from { transform: translateY(-30px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
  }
  .fade-in-top { animation: fadeInTop 1s ease-in-out; }
  
  @keyframes fadeInBottom {
    from { transform: translateY(30px); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
  }
  .fade-in-bottom { animation: fadeInBottom 1s ease-in-out; }

  @keyframes popInCustom {
    0% {
        transform: scale(0.5);
        opacity: 0;
    }

    100% {
        transform: scale(1);
        opacity: 1;
    }
}

  .pop-in {
    animation-name: popInCustom;
    animation-duration: 2s;
    animation-delay: .4s;
    animation-fill-mode: forwards;
    animation-timing-function: ease;
    opacity: 0;
}

.pop-in-1 {
    animation-name: popInCustom;
    animation-duration: 2s;
    animation-delay: .8s;
    animation-fill-mode: forwards;
    animation-timing-function: ease;
    opacity: 0;
}

.pop-in-2 {
    animation-name: popInCustom;
    animation-duration: 2s;
    animation-delay: 1.2s;
    animation-fill-mode: forwards;
    animation-timing-function: ease;
    opacity: 0;
}

.pop-in-3 {
    animation-name: popInCustom;
    animation-duration: 2s;
    animation-delay: 1.6s;
    animation-fill-mode: forwards;
    animation-timing-function: ease;
    opacity: 0;
}

.pop-in-4 {
    animation-name: popInCustom;
    animation-duration: 2s;
    animation-delay: 2s;
    animation-fill-mode: forwards;
    animation-timing-function: ease;
    opacity: 0;
}

.pop-in-5 {
    animation-name: popInCustom;
    animation-duration: 2s;
    animation-delay: 2.4s;
    animation-fill-mode: forwards;
    animation-timing-function: ease;
    opacity: 0;
}
  
  /* ========== TIMING HELPERS ========== */
  
  /* Speed */
  .slow   { animation-duration: 2s !important; }
  .slower { animation-duration: 3s !important; }
  .fast   { animation-duration: 0.6s !important; }
  
  /* Delay */
  .delay-1s { animation-delay: 1s !important; }
  .delay-2s { animation-delay: 2s !important; }
  .delay-3s { animation-delay: 3s !important; }
  .delay-4s { animation-delay: 4s !important; }
  .delay-5s { animation-delay: 5s !important; }
  .delay-6s { animation-delay: 6s !important; }
  



/* Comman */
.text-center {
    text-align: center;
}

.wpcf7 {}
.wpcf7-form {}

.wpcf7 .wpcf7-form label {
    color: #707732;
    font-weight: 700;
    transition: all .15s cubic-bezier(.4,0,.2,1);
    font-size: 18px;
}
.wpcf7 .wpcf7-form label small {
    font-size: 85%;
    font-weight: 400;
    margin-left: .25em;
    opacity: .6;
}

.wpcf7 .wpcf7-form .cf7-field-wrap {
    position: relative;
}
.wpcf7 .wpcf7-form .cf7-input-wrap {
}

.wpcf7 .wpcf7-form .cf7-field-wrap label {
left: 16px;
margin: 0;
max-width: 100%;
pointer-events: none;
position: absolute;
top: 43px;
transform: translateY(-50%);
transition: all .15s cubic-bezier(.4,0,.2,1);
width: 100%;
z-index: 2;
}
.wpcf7 .wpcf7-form .cf7-textarea-wrap label {
    top:15px;
    }

/* When focused or has value, float it up */
.wpcf7 .wpcf7-form .cf7-field-wrap.is-focused > p > label,
.wpcf7 .wpcf7-form .cf7-field-wrap.is-filled  > p > label {
  top: 0px;
  transform: none;
  font-size: 13px;
}

.wpcf7 .wpcf7-form input:not([type=checkbox]):not([type=radio]):not([type=submit]) {
    outline: none;
    padding: 1.4em 16px 16px 16px;
    border: 1px solid #54674a;
    border-radius: 0;
    color: #000000;
    font-size: 17px;
    font-weight: 500;
    display: block;
    width: 100%;
}

.wpcf7 .wpcf7-form .wpcf7-textarea { 
    height: 200px;
    outline: none;
    padding: 1.4em 16px 16px 16px;
    border: 1px solid #54674a;
    border-radius: 0;
    color: #000000;
    font-size: 17px;
    font-weight: 500;
    display: block;
    width: 100%;
}

.wpcf7 .wpcf7-form .wpcf7-submit {
    border: none;
    cursor: pointer;
}
.wpcf7-not-valid-tip {
    color: #b32d2e;
    font-size: 16px;
    font-weight: normal;
    display: block;
}
.wpcf7 form.failed .wpcf7-response-output, .wpcf7 form.aborted .wpcf7-response-output {
    border-color: #b32d2e;
    background: #b32d2e;
    color: #ffffff;
    padding: 0.5em 1em;
}


.comment-respond {
    padding: 20px 0px 30px 0px;
}
.comment-form .submit {
    cursor: pointer;
    border: none;
}
.comment-form input:not([type=checkbox]):not([type=radio]):not([type=submit]) {
    outline: none;
    padding:16px;
    border: 1px solid #54674a;
    border-radius: 0;
    color: #000000;
    font-size: 17px;
    font-weight: 500;
    display: block;
    width: 100%;
}

.comment-form #comment { 
    height: 200px;
    outline: none;
    padding:16px;
    border: 1px solid #54674a;
    border-radius: 0;
    color: #000000;
    font-size: 17px;
    font-weight: 500;
    display: block;
    width: 100%;
}