/* 
Theme Name: Brnd
Theme URI: https://github.com/elementor/hello-theme/
Description: Israpol Theme
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 1.0.1
Text Domain: brnd
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
*/
/*FOR MOBILE HERE*/
::-webkit-scrollbar {
-webkit-appearance: none;
}
::-webkit-scrollbar {
width: 8px;
}
  
::-webkit-scrollbar-track {
background: #333132;
/*border-left:1px solid #ccc;*/
}
  
::-webkit-scrollbar-thumb {
background: -webkit-linear-gradient(180deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
background: -moz-linear-gradient(180deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
background: linear-gradient(180deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#197885", endColorstr="#FFEF00", GradientType=1);
/*border:1px solid #eee;*/
height:100px;
/*border-radius:5px;*/
}
  
::-webkit-scrollbar-thumb:hover {
background: #FFEF00;
}

body, img {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
    user-select: none;
}


/* shrinking header section */

.shrinker {
	background: transparent;
        height: (set your header height in pixels);
	transition: all .2s linear!important;
	-webkit-transition: all .2s linear!important;
	-moz-transition: all .2s linear!important;
}

.shrinker.elementor-sticky--effects {
	background: #fff;
        height: (set your header height after shrinking in pixels)!important;
	padding-top: 2px!important;
	padding-bottom: 2px!important;
	box-shadow: 0px 6px 30px -4px rgba(0,0,0,.05);
	transition: all .2s linear!important;
	-webkit-transition: all .2s linear!important;
	-moz-transition: all .2s linear!important;
}

/* shrinking logo image */

/*
.shrinking-logo img {
	width: 60px!important;
	transition: all .2s linear!important;
	-webkit-transition: all .2s linear!important;
	-moz-transition: all .2s linear!important;
}

.shrinker.elementor-sticky--effects img {
	width: 30px!important;
	transition: all .2s linear!important;
	-webkit-transition: all .2s linear!important;
	-moz-transition: all .2s linear!important;
}
*/





.divider{
    width: 100%;
    height: 5px;
    
}

.grad{
/*    background: #197885;*/
background: -webkit-linear-gradient(90deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
background: -moz-linear-gradient(90deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
background: linear-gradient(90deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#197885", endColorstr="#FFEF00", GradientType=1);
}
.grad-text{
/*    background: rgb(255,206,106);*/
/*    background: #197885;*/
background: -webkit-linear-gradient(90deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
background: -moz-linear-gradient(90deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
background: linear-gradient(90deg, rgba(25, 120, 133, 1) 5%, rgba(255, 239, 0, 1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#197885", endColorstr="#FFEF00", GradientType=1);
    -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.grad-border{
    border-width: 1px;
  border-style: solid;
  border-image: linear-gradient(to top, #197885, #FFEF00) 1;
}
.grad-animate {
    background: linear-gradient(900deg, #197885, #FFEF00);
    background-size: 400% 400%;

    -webkit-animation: grad 15s ease infinite;
    -moz-animation: grad 15s ease infinite;
    animation: grad 15s ease infinite;
}

@-webkit-keyframes grad {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes grad {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes grad {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}

.reveal{
    --speed: .5s !important;
    animation: none !important;
}
.reveal > *{
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0) !important;
    transition: all var(--speed) ease-in-out !important;
}
.reveal.animated > *{
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%) !important;

}

.reveal-up{
        --speed: 2s !important;
        animation: none !important;
    }
    .reveal-up > *{
        clip-path: polygon(0 100%, 100% 100%, 100% 100%, 0 100%) !important;
        transition: all var(--speed) ease-in-out !important;
    }
    .reveal-up.animated > *{
        clip-path: polygon(0 100%, 100% 100%, 100% 0, 0 0) !important;

    }

        .reveal-left{
            --speed: 2s !important;
            animation: none !important;
        }
        .reveal-left > *{
            clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%) !important;
            transition: all var(--speed) ease-in-out !important;
        }
        .reveal-left.animated > *{
            clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%) !important;

        }

.projects-gallery .swiper-slide img {
    height: 600px;
    object-fit: cover;
    
}
.projects-gallery figure.swiper-slide-inner{
    line-height: 0!important;
}

.content {
        overflow: hidden;
        transition: max-height 0.3s ease; /* Smooth transition */
        max-height: 0px; /* Set initial height */
    }

.expanded {
        max-height: 300px !important;
}

/*
p {
    margin: 0!important;
}
*/


 /* Improved Animations Stylesheet from https://element.how/elementor-improve-entrance-animations/ , works for the 'fade' animations */

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

    to {
        opacity: 1;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        transform: none
    }
}

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

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

    to {
        opacity: 1;
        transform: none
    }
}

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




/*
#elementor-popup-modal-40 .dialog-widget-content{
    opacity: .97;
}
.close-popup{cursor: pointer;
}
*/

.elementor-field-type-acceptance {
    order: 2;
}


.rotate {
  -webkit-animation: rotate 15s normal linear infinite;
  animation: rotate 15s normal linear infinite;
}

@keyframes rotate {
  0% {
    -webkit-transform: rotate3d(0, 0, 1, 0deg);
    transform: rotate3d(0, 0, 1, 0deg);
  }
  25% {
    -webkit-transform: rotate3d(0, 0, 1, 90deg);
    transform: rotate3d(0, 0, 1, 90deg);
  }
  50% {
    -webkit-transform: rotate3d(0, 0, 1, 180deg);
    transform: rotate3d(0, 0, 1, 180deg);
  }
  75% {
    -webkit-transform: rotate3d(0, 0, 1, 270deg);
    transform: rotate3d(0, 0, 1, 270deg);
  }
  100% {
    -webkit-transform: rotate3d(0, 0, 1, 360deg);
    transform: rotate3d(0, 0, 1, 360deg);
  }
}


/* set a default icon once (you can override per-shortcode via icon="" attribute) */
.specs-col { --specs-icon: url('/wp-content/uploads/2025/08/rayk-bullet.png'); }

/* one column container */
.specs-col { display: block; color:white;
    font-family: "Noto Sans Hebrew", Sans-Serif;
}

/* titles */
.specs-col .specs-title {
  margin: 0 0 16px;
  font-size: 24px; line-height: 1.3; font-weight: 700;
  }
  [data-col="left"]{
      margin-top:47px;
  }


/* item row */
.specs-col .specs-item {
  position: relative;
  padding-inline-start: 28px; /* room for icon (LTR) */
  margin: 10px 0;
  font-size:18px;
  font-weight: 300;
  line-height: 1.6;
}

/* the icon */
.specs-col .specs-item::before {
  content: "";
  position: absolute;
  inset-inline-start: 0; /* works RTL/LTR */
  top: 6px;

  width: 18px; height: 18px;
  background-image: var(--specs-icon);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* RTL tweaks */
html[dir="rtl"] .specs-col .specs-item { padding-inline-start: 28px; padding-inline-end: 0; }
/*html[dir="rtl"] .specs-col .specs-item::before { inset-inline-start: auto; inset-inline-end: 0; }*/




/*DESKTOP ONLY*/
@media only screen and (min-width: 769px) {

    .shrinking-logo img {
	width: 100px!important;
}

.shrinker.elementor-sticky--effects img {
	width: 50px!important;
}
    figure.elementor-image-box-img img {
}
.elementor-widget-image-box .elementor-image-box-content {
    width: 700px!important;
}
    
}

/*TABLET ONLY*/
@media (max-width: 1024px) and (min-width: 768px) {
.projects-gallery .swiper-slide img {
        height: 400px;

    }
}

/*Mobile ONLY*/
@media only screen and (max-width: 767px) {
    .projects-gallery .swiper-slide img {
        height: 250px;

    }
    .elementor-element.elementor-element-fd6b76c, .elementor-element.elementor-element-cb8e968 {
    grid-column: 1 / 3;
    }
      [data-col="left"]{
      margin-top:0px;
  }

}


/* Media query for small screens (e.g., mobile) */
@media only screen and (min-width: 600px) {
    
}

/* Media query for medium screens (e.g., tablets) */
@media only screen and (min-width: 768px) {
    
}

/* Media query for large screens (e.g., desktops) */
@media only screen and (min-width: 1024px) {
    
}
/*****************************************************************************/