/* 
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 */

body {
  --sb-track-color: #dee1e3;
  --sb-thumb-color: #2a2f33;
  --sb-size: 10px;
}

header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1000;
}

body::-webkit-scrollbar {
  width: var(--sb-size)
}

body::-webkit-scrollbar-track {
  background: var(--sb-track-color);
  border-radius: 0;
}

body::-webkit-scrollbar-thumb {
  background: var(--sb-thumb-color);
  border-radius: 0;
  
}

@supports not selector(::-webkit-scrollbar) {
  body {
    scrollbar-color: var(--sb-thumb-color)
                     var(--sb-track-color);
  }
}

.jet-engine-frontend-query-editor-buttons {
    display: none !important;
}

.asb_header {
	transition: all 0.75s ease !important;
}

.asb_header.scrolled {
	background-color: #2a2f33 !important;
	min-height: 100px;
}

.asb_fade_up, .asb_fade_left, .asb_fade_right {
    transition: none !important;
    will-change: transform, opacity;
}

.asb_grow_horizontal {
    transition: none !important;
    will-change: transform, opacity;
}

.anim_words_left {
    transition: none;
}

.anim_words_left h2 div,
.anim_words_left h3 div,
.anim_words_left h4 div {
    transition: none;
    transform-origin: left center;
    will-change: transform, opacity;
    visibility: hidden;
    transform: translateX(75px);
    opacity: 0;
}

.anim_words_left.reverse h2 div,
.anim_words_left.reverse h3 div,
.anim_words_left.reverse h4 div {
    transform: translateX(-75px);
}

.anim_letters_left {
    transition: none;
}

.anim_letters_left h2 div,
.anim_letters_left h3 div, 
.anim_letters_left h4 div {
    transition: none;
    transform-origin: left center;
    will-change: transform, opacity;
    visibility: hidden;
    transform: translateX(75px);
    opacity: 0;
}

.anim_letters_left.reverse h2 div,
.anim_letters_left.reverse h3 div, 
.anim_letters_left.reverse h4 div {
    transform: translateX(-75px);
}

.anim_letters_up {
    transition: none;
}

.anim_letters_up h2 div,
.anim_letters_up h3 div, 
.anim_letters_up h4 div {
    transition: none;
    transform-origin: left center;
    will-change: transform, opacity;
    visibility: hidden;
    transform: translateY(50px);
    opacity: 0;
}

.asb_btn {
    transition: border-color 0.5s ease !important;
}

.asb_btn .elementor-heading-title a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 14px 35px 12px 35px;
    gap: 5px;
    transition: all 0.35s ease;
}

.asb_btn .elementor-heading-title:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    border-radius: 0;
    border-left: 1px solid #ef3a24;
    border-top: 1px solid #ef3a24;
    transition: all 0.35s ease;    
}

.asb_btn .elementor-heading-title:after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    height: 20px;
    width: 20px;
    border-radius: 0;
    border-right: 1px solid #ef3a24;
    border-bottom: 1px solid #ef3a24;
    transition: all 0.35s ease;    
}

.asb_btn:hover .elementor-heading-title:before {
    top: -5px;
    left: -5px;
}

.asb_btn:hover .elementor-heading-title:after {
    bottom: -5px;
    right: -5px;
}

.asb_ico_btn {
    transition: border-color 0.5s ease !important;
}

.asb_ico_btn .elementor-heading-title a {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 30px 13px 37px;
    gap: 7px;
    transition: all 0.35s ease;
}

.asb_ico_btn .elementor-heading-title a i {
    position: relative;
    top: -1px;
    font-size: 18px;
    transform: rotateZ(-45deg);
    transition: all 0.35s ease;
}

.asb_ico_btn:hover .elementor-heading-title a i {
    transform: rotateZ(0);
    color: #EF3A24;
}

.asb_ico_btn .elementor-heading-title:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    border-radius: 0;
    border-left: 1px solid #ef3a24;
    border-top: 1px solid #ef3a24;
    transition: all 0.35s ease;    
}

.asb_ico_btn .elementor-heading-title:after {
    content: '';
    position: absolute;
    bottom: 0;
    right: 0;
    height: 20px;
    width: 20px;
    border-radius: 0;
    border-right: 1px solid #ef3a24;
    border-bottom: 1px solid #ef3a24;
    transition: all 0.35s ease;    
}

.asb_ico_btn:hover .elementor-heading-title:before {
    top: -5px;
    left: -5px;
}

.asb_ico_btn:hover .elementor-heading-title:after {
    bottom: -5px;
    right: -5px;
}

@media (max-width: 767px) {
    .asb_ico_btn .elementor-heading-title a {
        padding: 14px 25px 12px 32px;
        gap: 5px;
    }
    
    .asb_ico_btn .elementor-heading-title a i {
        top: 0;
        font-size: 16px;
    }
}

/* CUSTOM ANIMATIONS */
@keyframes fadeDown {
    from {
        opacity: 0;
        transform: translate3d(0, -20px, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.elementor-element.fadeInDown {
    animation-name: fadeDown;
}

@keyframes fadeLeft {
    from {
        opacity: 0;
        transform: translate3d(-20px, 0, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.elementor-element.fadeInLeft {
    animation-name: fadeLeft;
}

@keyframes fadeRight {
    from {
        opacity: 0;
        transform: translate3d(20px, 0, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.elementor-element.fadeInRight {
    animation-name: fadeRight;
}

@keyframes fadeUp {
    from {
        opacity: 0;
        transform: translate3d(0, 20px, 0);
    }

    to {
        opacity: 1;
        transform: none;
    }
}

.elementor-element.fadeInUp {
    animation-name: fadeUp;
}

@media (max-width: 767px) {
   .asb_header.scrolled {
    	min-height: 85px;
    } 
}