/* 
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 */
.single-past-projects .e-gallery-item {
    display: none;
}
.single-past-projects div#elementor-lightbox-slideshow-single-img {
    display: none !important;
}
.single-past-projects .e-gallery-item:nth-child(-n+12) {
    display: inline-block;
}
button.termly-styles-closeTag-a5641f.t-closeModal:hover {
    color: #044445 !important;
    background: #B4E702;
}
button.termly-styles-closeTag-a5641f.t-closeModal:hover svg {
    fill: #044445;
}
.termly-styles-root-be197e > button:hover {
    background: #034444 !important;
}

/*Hover Effect*/
.hover-effect {
    transition: background-color 0.3s ease-in-out, background-image 0.3s ease-in-out, color 0.3s ease-in-out;
}
.hover-effect .elementor-icon-box-icon svg path {
    transition: stroke 0.3s ease-in-out;
}
.hover-effect .elementor-icon-box-wrapper .elementor-icon-box-title,
.hover-effect .elementor-icon-box-wrapper p,
.hover-effect .elementor-button-text {
    transition: color 0.3s ease-in-out;
}

.hover-effect:hover {
    background-color: #044445 !important;
    background: url('https://tenfour.digitalfoldstaging.co.za/wp-content/uploads/2024/11/Frame-2147224029.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

.hover-effect:hover .elementor-icon-box-icon svg path {
    stroke: #B4E702;
}

.hover-effect:hover .elementor-icon-box-wrapper .elementor-icon-box-title, .hover-effect:hover .elementor-icon-box-wrapper p, .hover-effect:hover .elementor-button-text {
    color: #FFFFFF;
} 
/*End Hover Effect*/

button.mfp-close:hover {
    background: transparent !important;
}
/*Sticky header*/
/*Normal state header styling*/
@media only screen and (min-width: 1024px) {
	#header {
    transition: all 0.3s ease-in;
		padding: 40px 0;
}
	
/*Sticky header styling*/
	.sticky #header-logo {
	 transform: scale(0.9); 
	 margin-left: -12.4px;
}
.sticky {
    padding: 20px 0 !important;   
    background: #FFFFFF;
}
	
}
@media only screen and (min-width: 768px)  and (max-width: 1023px) {
	#header {
    transition: all 0.3s ease-in;
		padding: 32px 0;
}

/*Sticky header styling*/
	.sticky #header-logo {
	 transform: scale(0.9); 
	 margin-left: -5.25px;
}
.sticky {
    padding: 16px 0 !important;   
    background: #FFFFFF;
}
}

/*Header logo*/
#header #header-logo {
	transition: all 0.3s ease-in;
}

/*Responsive*/
@media only screen and (min-width: 768px) {
	header#header {
			min-width: 100% !important;	
	}	
	}
/*End sticky header*/

/*Listing Grid Nav Icon*/
.jet-listing-grid__slider-icon.slick-arrow > svg {
    display: none !important; 
}

/* Next Arrow Normal*/
.jet-listing-grid__slider-icon.next-arrow.slick-arrow {
    width: 48px; 
    height: 48px; 
    background: url('https://tenfour.digitalfoldstaging.co.za/wp-content/uploads/2024/11/arrow-left-circle-4.svg') no-repeat center center !important;
    background-size: contain !important;
}

/* Next Arrow Hover */
.jet-listing-grid__slider-icon.next-arrow.slick-arrow:hover { 
    background: url('https://tenfour.digitalfoldstaging.co.za/wp-content/uploads/2024/11/Untitled-2.svg') no-repeat center center !important;
    background-size: contain !important;
}

/* Prev Arrow Normal */
.jet-listing-grid__slider-icon.prev-arrow.slick-arrow {
    width: 48px; 
    height: 48px; 
    background: url('https://tenfour.digitalfoldstaging.co.za/wp-content/uploads/2024/11/arrow-left-circle-4.svg') no-repeat center center !important;
    background-size: contain !important;
}

/* Prev Arrow Hover */
.jet-listing-grid__slider-icon.prev-arrow.slick-arrow:hover { 
    background: url('https://tenfour.digitalfoldstaging.co.za/wp-content/uploads/2024/11/Untitled-2.svg') no-repeat center center !important;
    background-size: contain !important;
}

/*Mobile Menu*/
@media only screen and (max-width: 767px) {
	.cst_mobile_menu_top ul li a {
		font-family: Sora;
		font-size: 12px !important;
		font-weight: 600;
		line-height: 12px;
		letter-spacing: -0.005em;
		text-transform: uppercase;
	}
	
	.mm-spn a {
		padding: 15px 30px;
	}
	
	.mm-spn li:after {
    	border: none;
    }
	
	.mm-spn li:before {
		color: #044445 !important;
		opacity: 1 !important;
		transform: rotate(134deg);
		margin-top: -14px;
	}
	
	.mm-spn li a:after {
		display: none !important;
	}
	
	.mm-spn li a[aria-current="page"] {
		color: #B4E702 !important;
		opacity: 1 !important;
	}
	
	.mm-spn li.current-menu-item.current_page_item::before {
		color: #B4E702 !important;
		opacity: 1 !important;
	}
	
	.mm-spn button.cont_quo {
		display: none !important;
	}
	
	.mm-spn .social_media_icon .social_box {
  margin-right: 10px;
}
	
/*Sub-menu styling*/
	.mm-spn.mm-spn--navbar::after, .mm-spn.mm-spn--navbar::before,  ul.sub-menu {
  	display: none;
}
	
/*Sub-menu li*/
	li.menu-item-39 {
		display: flex;
	}
	ul.sub-menu.active-submenu.mm-spn--open li {
    height: 40px;
}
	
	span.before-trigger {
		position: absolute;
		right: 15px;
		z-index: 10;
    width: 50px;
		height: 50px;
}
	
/*active-submenu class*/
	.active-submenu .sub-menu {
		display: block;
    background: none;
    margin-top: 220px;
		max-height: 170px !important;
		margin-left: 20px;
}
	.active-submenu .sub-menu li::before {
    display: none;
}
	.active-submenu li.menu-item-has-children.menu-item-39 + li {
    margin-top: 158px;
}	
	.active-submenu.mm-spn li::before {
		margin-top: -8px;
		transform: rotate(-45deg) !important;
	}
/*End sub-menu styling*/
}
/* End mobile menu*/

.e-gallery-item {
    display: none;
}
.e-gallery-item.fadeIn {
    display: block;
    transition: opacity 0.5s;
}

button#load-more-gallery {
    background-color: var(--e-global-color-secondary);
    font-family: "Sora", Sans-serif;
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    line-height: 16px;
    letter-spacing: 0px;
    fill: var(--e-global-color-primary);
    color: var(--e-global-color-primary);
    border-radius: 4px 4px 4px 4px;
    padding: 27px 43px 27px 43px;
    border-color: var(--e-global-color-secondary);
    display: block;
    margin: 60px auto 0;
}
.gallery-container {
    display: flex
;
    flex-wrap: wrap;
    gap: 30px;
}
.gallery-container a {
    width: 31.7%;
    border-radius: 8px;
	position: relative;
}
.gallery-container a img{
	display: block;
	width: 100%;
	height: 100%;
	 border-radius: 12px;
	height: 405px;
	object-fit: cover;
}
div#elementor-lightbox-slideshow-single-img {
    display: none !important;
}
.gallery-container a:hover:before{
	content: "";
	background: rgba(0,0,0,0.5);
	mix-blend-mode: var(--overlay-mix-blend-mode);
    transition-duration: var(--overlay-transition-duration);
    transition-property: mix-blend-mode, transform, opacity, background-color;
	position: absolute;
	inset: 0;
}
.gallery-container video {
    width: 100%;
    border-radius: 12px;
    height: 405px;
    object-fit: cover;
}
.single-past-projects div#elementor-lightbox-slideshow-single-img {
    display: none !important;
}
button.mfp-arrow.mfp-arrow-left.mfp-prevent-close:focus,
button.mfp-arrow.mfp-arrow-left.mfp-prevent-close:hover,
button.mfp-arrow.mfp-arrow-right.mfp-prevent-close:focus,
button.mfp-arrow.mfp-arrow-right.mfp-prevent-close:hover {
    background: transparent !important;
}

@media screen and (max-width: 1365px) {

.gallery-container a {
    width: 31.2%;
}
	
}
@media screen and (max-width: 1023px) {
    .gallery-container a {
        width: 30.4%;
    }
}
@media screen and (max-width: 767px) {
    .gallery-container a {
        width: 45.4%;
    }
	.gallery-container video {
    height: 162px;
}
	.gallery-container a img {
    height: 162px;
}
}

.slick-arrow {
	z-index: 10 !important;
}