/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme/
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: 1.0.1
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
*/


/* GENERAL 
 * -----------------------------------------------------*/
/* hide scrollbar but allow scrolling */
body {
    -ms-overflow-style: none; /* for Internet Explorer, Edge */
    scrollbar-width: none; /* for Firefox */
    overflow-y: scroll; 
}
body::-webkit-scrollbar {
    display: none; /* for Chrome, Safari, and Opera */
}

strong {font-weight:600;color:#191919;}

.main-content a:link, 
.main-content a:visited, 
.main-content a:active {font-weight:500;color:#0000EE;}

a:link,
a:visited,
a:active,
a.masked:link, 
a.masked:visited, 
a.masked:active {font-weight:inherit;color:inherit;text-decoration:none;}



.blend {mix-blend-mode: exclusion;} /* Neat little design effect for text / svg  */

.project-details {font-size:11px;line-height:18px;}
.project-details span {font-weight:600; color: #000; margin-right:5px;}

.plain-text-button, 
.plain-text-button .elementor-button, 
.plain-text-button .elementor-button-text {width:100%;}
.plain-text-button .elementor-button {padding:10px 0px 10px 0px;background:none;border: 0 0 0 0.5px #cccccc solid;}
.plain-text-button .elementor-button-text {text-align:left;}



.main-content ul {
  margin: 1em 0 3em 0;
  /*padding: 0 0 0.3em 0;*/
  list-style: none;
}
.main-content li::before { 
  content: "";
  border-color: transparent #111;
  border-style: solid;
  border-width: 0.35em 0 0.35em 0.45em;
  display: block;
  height: 0;
  width: 0;
  left: -1em;
  top: 1.2em;
  position: relative;
}


.elementor-post-info__item-prefix {font-weight:500;}
.elementor-post-info__terms-list a {}


/* STICKY HEADER 
 * -----------------------------------------------------*/

/*Sticky - Header*/
#sticky-header, #sticky-header-solid { 
	transition-property: color;
	transition-property: background;
    transition-duration: 0.5s;
    transition-timing-function: ease;
}

#sticky-header #site-logo,
#sticky-header #hamburger-button,
#sticky-header-solid #site-logo,
#sticky-header-solid #hamburger-button {padding-top: 0px; padding-bottom:0px; z-index:200;}

#sticky-header #site-logo {transition: color 0.15s ease;} 

/*Sticky - Scroll Point Opacity change*/
#sticky-header.elementor-sticky--effects {background-color: rgba(255,255,255,1.0)!important;} 
#sticky-header.elementor-sticky--effects #site-logo {filter: invert(100%);} 
#sticky-header.elementor-sticky--effects .hamburger-inner, 
#sticky-header.elementor-sticky--effects .hamburger-inner::before, 
#sticky-header.elementor-sticky--effects .hamburger-inner::after {background: #000;}  /*After sticky loads*/

/*Sticky - No Opacity Effect*/
#sticky-header-solid {background-color: rgba(255,255,255,1.0)!important;} 
#sticky-header-solid .hamburger-inner, 
#sticky-header-solid .hamburger-inner::before, 
#sticky-header-solid .hamburger-inner::after {background: #000;} 

/*Home Sticky - Menu Invert Colours change*/
.fs-menu-is-active #sticky-header.elementor-sticky--effects {background-color: rgba(0,0,0,1.0)!important;}
.fs-menu-is-active #sticky-header.elementor-sticky--effects #site-logo {filter: invert(0%);} 
.fs-menu-is-active #sticky-header.elementor-sticky--effects .hamburger-inner, 
.fs-menu-is-active #sticky-header.elementor-sticky--effects .hamburger-inner::before, 
.fs-menu-is-active #sticky-header.elementor-sticky--effects .hamburger-inner::after {background: #fff;}

/*Other Pages - Menu Invert Colours change*/
.fs-menu-is-active #sticky-header-solid {background-color: rgba(0,0,0,1.0)!important;}
.fs-menu-is-active #sticky-header-solid #site-logo {filter: invert(100%);} 
.fs-menu-is-active #sticky-header-solid .hamburger-inner, 
.fs-menu-is-active #sticky-header-solid .hamburger-inner::before, 
.fs-menu-is-active #sticky-header-solid .hamburger-inner::after {background: #fff;}  
 
/*Dropdown*/
#sticky-header ul.elementor-nav-menu--dropdown a, 
#sticky-header ul.elementor-nav-menu--dropdown a:focus,
#sticky-header ul.elementor-nav-menu--dropdown a:hover {border-left: 0px solid transparent!important;}



/* STICKY HEADER - HAMBURGER ANIMATION
 * -----------------------------------------------------*/
/*!
 * Hamburgers
 * @description Tasty CSS-animated hamburgers
 * @author Jonathan Suh @jonsuh
 * @site https://jonsuh.com/hamburgers
 * @link https://github.com/jonsuh/hamburgers
 */

.hamburger {
	float: right; padding: 0px; display: inline-block; cursor: pointer; 
	transition-property: opacity, filter; transition-duration: 0.15s; transition-timing-function: linear; 
	font: inherit; color: inherit; text-transform: none; background-color: transparent!important; 
	border: 0; margin: 0; overflow: visible; z-index:99999;
}
.hamburger:hover { opacity: 0.7; }
.hamburger:hover, .hamburger:focus{ background: unset; outline: unset;}
.hamburger.is-active:hover { opacity: 0.7; }
.hamburger.is-active .hamburger-inner,
.hamburger.is-active .hamburger-inner::before,
.hamburger.is-active .hamburger-inner::after { background-color: #fff; }
    
.hamburger-box { width: 40px; height: 24px; display: inline-block; position: relative; }

.hamburger-inner {display: block;top: 50%;margin-top: -2px; }

.hamburger-inner, 
.hamburger-inner::before, 
.hamburger-inner::after {
    width: 40px;
    height: 2px;
    background-color: #fff;  /*Before sticky*/
    border-radius: 4px;
    position: absolute; 
	transition-property: transform;
	transition-property: background;
    transition-duration: 1s;
    transition-timing-function: ease; 
}

.hamburger-inner::before, .hamburger-inner::after {content: ""; display: block; }
.hamburger-inner::before {top: -10px; }
.hamburger-inner::after { bottom: -10px; }

/*
* Spring
*/

.hamburger--spring .hamburger-inner {top: 2px;transition: background-color 0s 0.13s linear; }
.hamburger--spring .hamburger-inner::before {
	top: 10px; 
	transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); 
}
  .hamburger--spring .hamburger-inner::after {
    top: 20px;
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); 
}
.hamburger--spring.is-active .hamburger-inner {transition-delay: 0.22s;background-color: transparent !important; }
.hamburger--spring.is-active .hamburger-inner::before {
    top: 0;
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 10px, 0) rotate(45deg); 
}
.hamburger--spring.is-active .hamburger-inner::after {
    top: 0;
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 10px, 0) rotate(-45deg); 
}

/*
* Spring Reverse
*/

.hamburger--spring-r .hamburger-inner {
  top: auto; bottom: 0;
  transition-duration: 0.13s;
  transition-delay: 0s;
  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); 
}
.hamburger--spring-r .hamburger-inner::after {
    top: -20px;
    transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0s linear; 
}
.hamburger--spring-r .hamburger-inner::before {
    transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); 
}
.hamburger--spring-r.is-active .hamburger-inner {
  transform: translate3d(0, -10px, 0) rotate(-45deg);
  transition-delay: 0.22s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1); 
}
.hamburger--spring-r.is-active .hamburger-inner::after {
    top: 0;
    opacity: 0;
    transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0s 0.22s linear; 
}
.hamburger--spring-r.is-active .hamburger-inner::before {
    top: 0;
    transform: rotate(90deg);
    transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1); 
}

/* STICKY HEADER - TOGGLE MENU LOADER
 * -----------------------------------------------------*/
#fullscreen-menu {padding-top: 0px; padding-bottom: 0px;}
#rightsection {background-color: rgba(0,0,0,1.0)!important;}
@media screen and (max-width: 768px) {
	#rightsection > .e-con-inner {padding-top:100px;}
}


/* TAXONOMY LOOP GRIDS & FILTERS
 * -----------------------------------------------------*/
#taxonomy-nav {z-index:1;}


/* HOMEPAGE - SLIDER
 * -----------------------------------------------------*/
#homepage-slider .swiper-slide-inner {/*max-width: 1460px!important;*/}
.slider > .elementor-container {padding:0px;}
.portfolio-slider .elementor-swiper-button {/*border: solid 1px #fff;*/background:#000;padding:10px;}



/* HOMEPAGE - PROJECT POST LOOP TEMPLATE
 * -----------------------------------------------------*/
/*General*/
.portfolio-post .loop-grid-post-title, .portfolio-post-terms, .portfolio-post img {transition: all 0.7s ease;}

/*Content*/
.portfolio-post .loop-grid-post-title, .portfolio-post .portfolio-post-terms {opacity:0;}
.portfolio-post:hover .loop-grid-post-title, .portfolio-post:hover .portfolio-post-terms {opacity:1;}

/*Image*/
.portfolio-post .elementor-widget-theme-post-featured-image {overflow:hidden;}
.portfolio-post img {opacity:1;}
.portfolio-post:hover img {
	opacity:0.7;
	transform: rotate(10deg) scale(2);
	-ms-transform: rotate(10deg) scale(2);
	-webkit-transform: rotate(10deg) scale(2);
	filter: blur(8px);
	-webkit-filter: blur(8px);
}

.elementor-portfolio__filters {/*background:#f9f9f9;*/}

/* HOMEPAGE - NEWS POST LOOP TEMPLATE
 * -----------------------------------------------------*/
@media screen and (min-width: 768px) {
	#homepage-post-loop h2 {font-size:20px;}
}


/* BLOG POST SINGLE
 * -----------------------------------------------------*/
.post-template-default p {padding-bottom:20px;}
.post-template-default h2, .post-template-default h3 {margin-top:40px;}

.post-template-default blockquote {
	background: #f5f5f5;
    margin: 3em 0 3em 0;
    padding: 3em 3em 0.8em 3em;
	font-size:18px;
	line-height:38px;
}

.post-template-default .pullout-text {
	background: #f5f5f5;
    margin: 2em 0 3em 0;
    padding: 3em 3em 0.8em 3em;
	font-size:18px;
	line-height:38px;
}


/* CUSTOM CURSOR
 * -----------------------------------------------------*/

html,
*{
cursor: none;
}

.cursor{
   position: fixed;
   width: 20px;
   height: 20px;
   border-radius: 50%;
   background-color: #f5f5f5;
   pointer-events: none;
   mix-blend-mode: difference;
   z-index: 999;
   transition: transform 0.2s;
 }



/* CUSTOM TAXONOMY FILTER
 * -----------------------------------------------------*/

/*Containers*/
.taxonomy-scroll-wrapper {
    display: flex; /* Align the 'All' link and scrolling container horizontally */
    align-items: center;
    gap: 10px; /* Space between 'All' link and scrolling list */
}

.taxonomy-scroll-container {

	display: flex; /* Ensure flex layout */
    overflow-x: auto; /* Enable horizontal scrolling */
    white-space: nowrap; /* Prevent wrapping of the child elements */
    scroll-behavior: smooth; /* Enable smooth scrolling */
    max-width: 100%; /* Constrain the width for scrolling */

    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
    scroll-snap-type: x mandatory; /* Enable scroll snapping */
}

/*Hide Scrollbars*/
.taxonomy-scroll-container::-webkit-scrollbar {
    display: none; /* Hide scrollbar for WebKit browsers */
}

/*List*/
.custom-taxonomy-list {
    display: inline-flex; /* Horizontal layout */
    margin: 0;
    padding: 0;
    list-style: none;
    /*white-space: nowrap;*/ /* Prevent line breaks */
	flex-wrap: nowrap; /* Ensure items stay in a single line */
    
}
.taxonomy-item {
    /*display: inline-block;*/
	flex: 0 0 auto; /* Prevent shrinking and ensure items don't stretch */
    margin-right: 10px; /* Add spacing between the terms */
    white-space: nowrap; /* Prevent text wrapping inside terms */

    scroll-snap-align: start; /* Snap each item to the start of the scroll container */
    user-select: none;
    cursor: pointer;
}

/*Links*/
.taxonomy-scroll-wrapper a.taxonomy-link {
    padding: 1px 15px;
    background-color: #f5f5f5;
    border-radius: 100px;
    text-decoration: none;
    color: #333;
    transition: background-color 0.3s ease-in-out;
	display: inline-block;
    font-size: 12px;
}
.taxonomy-scroll-wrapper a.taxonomy-link.active {
    background-color: #000;
    color: #fff;
}
.taxonomy-scroll-wrapper a.taxonomy-link:hover {
    background-color: #ddd;
}


/* Clients
 * -----------------------------------------------------*/
.client-logo-carousel img {max-height:120px;}


h1 span {clear:both;display:block;font-size:16px;}