/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */
*:focus {
  outline: none !important;
}
body.no-scroll {
  overflow-y: hidden !important;
}

.nowrap {
  white-space: nowrap !important;
}
.show-on-scroll, .show-on-scroll-stagger-item {
  opacity: 0;
  transform: translateY(30px);
  transition: all 300ms ease-in-out;
}
.show-on-scroll-sideways {
  opacity: 0;
  transition: all 400ms ease-out;
}
.show-on-scroll-bot-to-top {
  transform: translateY(100px);
}
.show-on-scroll-top-to-bot {
  transform: translateY(-100px);
}

.show-on-scroll.showed, .show-on-scroll-stagger-item.showed, .show-on-scroll-sideways.showed {
  opacity: 1;
  transform: translateY(0px);
}
/*a, a:hover {
  font-family: inherit !important;
  font-weight: inherit !important;
  line-height: inherit !important;
}*/
.center-absolute {
  left: 0 !important;
  right: 0 !important;
  top: 0 !important;
  bottom: 0 !important;
  margin: auto !important;
}
.subtitle-separator {
  max-height: 1px !important;
}
.sideways-lr {
  writing-mode: sideways-lr;
}
.vertical-rl {
  writing-mode: vertical-rl;
}
.txt-center {
  text-align: center;
}
.txt-right {
  text-align: right;
}
#logo-kelo-top {
  color: #2c180f;
  z-index: 10;
}

#logo-kelo-bottom {
  color: #ffffff;
  z-index: 9;
}

.logo-kelo-svg {
  position: absolute;
}

#home-logo-wrapper {
  position: relative;
  box-sizing: border-box;
}

.home-kelo-logo {
  position: sticky !important;
  top: 80px;
  height: 435px;
}

/*Header*/
.menu-kelo_header_002-container .jet-nav,
.menu-kelo_header_001-container .jet-nav {
  gap: 40px;
}

#sticky-header {
  opacity: 0;
  transition: opacity 300ms ease-in-out;
}
#sticky-header.menu-mobile-open {
  background-color: #ffffff00 !important;
}
#sticky-header.show {
  opacity: 1;
}

#header-nav .jet-nav {
  gap: 44px;
}

#header-nav span.jet-nav-link-text, #sticky-header-nav span.jet-nav-link-text {
  position: relative;
  z-index: 1;
  display: inline-block;
}

#header-nav .current-menu-item span.jet-nav-link-text::before, #sticky-header-nav .current-menu-item span.jet-nav-link-text::before {
  background-color: #8f5022;
  width: 100%;
}

#header-nav span.jet-nav-link-text::before, #sticky-header-nav span.jet-nav-link-text::before  {
  content: "";
  position: absolute;
  z-index: -1;
  left: -1px;
  height: 1px;
  width: 0;
  transition: width 0.5s;
}
#header-nav span.jet-nav-link-text::before {
  top: -16px;
}
#sticky-header-nav span.jet-nav-link-text::before {
  top:0px;
}
.sticky-header-logo div {
  text-align: center;
}
#header-nav span.jet-nav-link-text:hover::before, #sticky-header-nav span.jet-nav-link-text:hover::before {
  background-color: #8f5022;
  width: 100%;
}

#kelo-logo-h {
  width: 118px;
  vertical-align: bottom;
}
.kelo-logo-h {
  fill: #2c180f;
}

#kelo-header.menu-open .kelo-logo-h, #sticky-header.menu-mobile-open .kelo-logo-h{
  fill: #eee9e5;
}

/*Image sliders*/
.max-800 {
  max-height: 800px !important;
}
.listing-img-slider-dots .jet-slick-dots {
  position: absolute;
  margin: 0 !important;
  bottom: -36px;
}

.listing-img-slider-dots a {
  display: unset !important;
}

/*Brush strokes*/
#home-graffitis-container::before,
#home-graffitis-container::after {
  content: "";
  position: absolute;
  inset: 0;
  mix-blend-mode: multiply;
  pointer-events: none;
  transition: opacity 1s ease;
  z-index: 0;
}
#home-graffitis-container::before {
  background-color: rgba(150, 86, 42, 1);
  opacity: 1;
}

#home-graffitis-container::after {
  background: linear-gradient(360deg, rgba(150, 86, 42, 1) 0%, rgba(255, 255, 255, 0) 100%);
  opacity: 0;
}
#home-graffitis-container.show::before {
  opacity: 0;
}
#home-graffitis-container.show::after {
  opacity: 1;
}

.brush-wrapper,
.brushStroke {
  position: absolute;
  transform-origin: center center;
}

.brushStroke-circle-empty {
  fill: none;
}

.brushStroke-circle-color:not(.stroke-gradient),
.brushStroke-line-001:not(.stroke-gradient),
.brushStroke-line-002:not(.stroke-gradient) {
  fill: #96562a;
}

.stroke-gradient {
  mix-blend-mode: screen;
  opacity: 0.28;
}

.row-flex p {
  display: flex;
  gap: 40px;
}

.form-row input,
.form-row .wpcf7-form-control-wrap {
  width: -webkit-fill-available;
}
.form-row textarea{
  height: 148px;
}

.form-row input,
.form-row textarea,
.form-row select {
  background-color: #ffffff00;
  border-radius: 0;
  border: none;
  border-bottom: 1px solid #eee9e5;
  font-size: 18px;
  color: #eee9e5;
}
.form-row input,
.form-row textarea {
  padding: 0 0 8px 0 !important;
}
.form-row select {
  padding: 0 0 16px 0 !important;
}
.form-row option {
  color:#2c180f;
}
.form-row input::placeholder, .form-row textarea::placeholder {
  color: #eee9e5;
  font-size: 18px;
}
.wpcf7-form > p{
  text-align: center;
}

.wpcf7-submit {
  background-color: #ffffff00 !important;
  border: 1px solid #eee9e5;
  color: #eee9e5 !important;
  margin-top: 32px;
  padding: 8px 48px 8px 48px !important;

}
.wpcf7-submit:hover {
  background-color: #eee9e5!important;
  border: 1px solid #eee9e5;
  color: #96562a !important;
}
.wpcf7-spinner {
  display: none;
}

.wpcf7-response-output {
  border: none !important;
  padding: none !important;
  color: #eee9e5 !important;
  font-weight: 500 !important;
  font-size: 20px !important;
}
#footer-container-logo {
  max-height: 490px;
}
/*Tablet*/
@media all and (max-width: 1024px) {
  #menu-mobile {
    transform: translateY(-100vh);
    opacity: 0;
    transition: all 300ms ease-in-out;
  }
  #menu-mobile.open {
    transform: translateY(0);
    opacity: 1;
  }
  .sticky-header-logo div {
    text-align: left;
  }
  .center-absolute-tablet {
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    bottom: 0 !important;
    margin: auto !important;
  }

  .text-center-tablet {
    text-align: center !important;
  }

  .home-kelo-logo {
    top: 96px;
  }

  .hamburger-menu {
    justify-self: end;
    width: 32px;
    height: 24px;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .5s ease-in-out;
    -moz-transition: .5s ease-in-out;
    -o-transition: .5s ease-in-out;
    transition: .5s ease-in-out;
    cursor: pointer;
  }

  .hamburger-menu span {
    display: block;
    position: absolute;
    height: 1px;
    width: 100%;
    border-radius: 1px;
    background-color: #2c180f;
    opacity: 1;
    left: 0;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    -webkit-transition: .25s ease-in-out;
    -moz-transition: .25s ease-in-out;
    -o-transition: .25s ease-in-out;
    transition: .25s ease-in-out;
  }

  .hamburger-menu span:nth-child(1) {
    top: 0px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
  }

  .hamburger-menu span:nth-child(2) {
    top: 10px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
  }

  .hamburger-menu span:nth-child(3) {
    top: 20px;
    -webkit-transform-origin: left center;
    -moz-transform-origin: left center;
    -o-transform-origin: left center;
    transform-origin: left center;
  }

  .hamburger-menu.open span {
    background-color: #eee9e5;
  }

  .hamburger-menu.open span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    transform: rotate(45deg);
    top: -3px;
    left: 4px;
  }

  .hamburger-menu.open span:nth-child(2) {
    width: 0%;
    opacity: 0;
  }

  .hamburger-menu.open span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 20px;
    left: 4px;
  }
    .form-row input,
    .form-row .wpcf7-form-control-wrap {
      width: 100%;
    }
}

@media all and (max-width: 767px) {
  .home-kelo-logo {
    top: 48px;
  }
}