/*
Theme Name: Hello Elementor Child
Theme URI: https://elementor.com/hello-theme/?utm_source=wp-themes&utm_campaign=theme-uri&utm_medium=wp-dash
Template: hello-elementor
Author: Elementor Team
Author URI: https://elementor.com/?utm_source=wp-themes&utm_campaign=author-uri&utm_medium=wp-dash
Description: Hello Elementor is a lightweight and minimalist WordPress theme that was built specifically to work seamlessly with the Elementor site builder plugin. The theme is free, open-source, and designed for users who want a flexible, easy-to-use, and customizable website. The theme, which is optimized for performance, provides a solid foundation for users to build their own unique designs using the Elementor drag-and-drop site builder. Its simplicity and flexibility make it a great choice for both beginners and experienced Web Creators.
Tags: accessibility-ready,flexible-header,custom-colors,custom-menu,custom-logo,featured-images,rtl-language-support,threaded-comments,translation-ready
Version: 3.3.0.1739195076
Updated: 2025-02-10 13:44:36

*/
* {
    box-sizing: border-box;
    -ms-box-sizing: border-box;
    -o-box-sizing: border-box;
}

::-webkit-scrollbar {
    background: #F5E9DF;
    width: 5px;
    height: 5px;
}

::-webkit-scrollbar-button {
    display: none;
}

::-webkit-scrollbar-track {
    display: none;
}

::-webkit-scrollbar-track-piece {
    display: none;
}

::-webkit-scrollbar-thumb {
    background: #99856C;
    background-clip: content-box;
    border-radius: 9px;
}

::-webkit-scrollbar-corner {
    display: none;
}

::-webkit-resizer {
    display: none;
}

div#sideMenu {
    height: 100dvh;
    overflow: auto;
}

div#closeMenu {
    cursor: pointer;
}

div#sideMenu {
    -moz-transition: all ease .5s;
    -webkit-transition: all ease .5s;
    -o-transition: all ease .5s;
    transition: all ease .5s;
    visibility: hidden;
    opacity: 0;
    z-index: -3;
}

div#sideMenu.active {
    visibility: visible;
    opacity: 1;
    z-index: 100;
}

body.menuActive {
    overflow: hidden;
}

header.header:before {
    content: "";
    background: linear-gradient(#181818, transparent);
    height: 0px;
    backdrop-filter: blur(10px);
    mask-image: linear-gradient(to bottom, #181818 0% 20%, #18181800 100%);
    transition: height .7s cubic-bezier(.34, 1.56, .64, 1);
}

header.header.fixeds:before {
    height: 150px;
}

/* From Uiverse.io by ryota1231 */
.animated-button {
    position: relative;
    display: flex;
    align-items: center;
    gap: 4px;
    border: 1px solid;
    border-color: transparent;
    font-size: 16px;
    background-color: ;
    border-radius: 100px;
    font-weight: 600;
    color: #f5e9df;
    box-shadow: 0 0 0 2px #ffffff;
    cursor: pointer;
    overflow: hidden;
    transition: all 0.6s cubic-bezier(0.23, 1, 0.32, 1);
    max-width: fit-content;
    padding: 0 36px;
}

.animated-button img {
    position: absolute;
    width: 24px;
    z-index: 9;
    transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.animated-button img:nth-child(1) {
    right: 16px;
}

.animated-button img:nth-child(4) {
    left: -25%;
}

.animated-button .circle {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 20px;
    height: 20px;
    background-color: #f8f0e9;
    border-radius: 50%;
    opacity: 0;
    transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.animated-button .text {
    position: relative;
    z-index: 1;
    transform: translateX(-12px);
    transition: all 0.8s cubic-bezier(0.23, 1, 0.32, 1);
}

.animated-button:hover {
    box-shadow: 0 0 0 12px transparent;
    color: #212121;
    border-radius: 12px;
}

.animated-button:hover img:nth-child(1) {
    right: -25%;
}

.animated-button:hover img:nth-child(4) {
    left: 16px;
}

.animated-button:hover .text {
    transform: translateX(12px);
    color: #181818;
}

.animated-button:hover img {
    fill: #1f387e;
}

.animated-button:active {
    scale: 0.95;
    box-shadow: 0 0 0 4px #99856C;
}

.animated-button:hover .circle {
    width: 220px;
    height: 220px;
    opacity: 1;
}
.animated-button-2 {
    border-top: 1px solid rgb(255 255 255 / 20%);
    display: flex;
    padding: 10px;
    flex-direction: row;
    align-items: center;
    gap: 10px;
    text-align: right;
    justify-content: flex-end;
    overflow: hidden;
    max-width: 100%;
}

.animated-button-2 .text {
    font-family: "Vesterbro", Sans-serif;
    font-size: 13px;
    font-weight: 400;
    line-height: 16px;
    color: #F5E9DF;
    padding-top: 3px;
    right: -40%;
    position: relative;
    transition: all ease .6s;
}

.animated-button-2 img.uc-svg-image {
    transition: all ease .6s;
    right: -20%;
    position: relative;
    width: 20px;
}

.animated-button-2:hover img.uc-svg-image {
    right: 77%;
}

.animated-button-2:hover .text {
    right: 0%;
}





html[lang="ar"] .animated-button-2 {
    direction: ltr;
}

html[lang="ar"] .animated-button-2 img.uc-svg-image {
    right: -10%;
}

html[lang="ar"] .animated-button-2:hover img.uc-svg-image {
    right: 88%;
}

html[lang="ar"] .owl-carousel .owl-stage-outer {
    direction: ltr;
}