:root {
  --custom_widgets_logo_marquee_gap: 60px;
  --custom_widgets_logo_grid_gap: 40px;
  --custom_widgets_logo_marquee_repeats: 3; /* number of initial group duplicates */
  --custom_widgets_logo_marquee_duration:calc(var(--custom_widgets_logo_marquee_speed) * var(--custom_widgets_logo_marquee_repeats) );
  --custom_widgets_logo_marquee_direction: normal;
  --custom_widgets_logo_marquee_fade_effect_color: #ffffff;
  --custom_widgets_logo_marquee_fade_width: 100px;
}
.custom-widgets-logo-marquee-widget {
  width: 100%;
  overflow-x: clip;
}

.custom-widgets-logo-marquee-widget-wrapper {
  height: 100%;
  width: 100%;
  position: relative;
}

.custom-widgets-logo-marquee-widget-inner > div {
  width: 100% !important;
  position: relative;
}

.custom-widgets-logo-marquee-widget-inner > div > div {
  height: 100%;
  margin-left:calc(var(--custom_widgets_logo_marquee_gap)/2);
  margin-right:calc(var(--custom_widgets_logo_marquee_gap)/2);
  overflow: hidden;
}

.custom-widgets-logo-marquee-widget-inner > div a {
  position: absolute;
  top:0;
  left:calc(var(--custom_widgets_logo_marquee_gap)/2);
  width: calc(100% - var(--custom_widgets_logo_marquee_gap));
  height: 100%;
  z-index: 1;
}

.custom-widgets-logo-marquee-widget-inner > div img {
  
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  max-width:initial !important;
  display: block;
  margin-left:auto;
  margin-right:auto;
}

.custom-widgets-logo-marquee-widget-inner{
  height: 100%;
  width: fit-content;
  align-items: center;
  display: flex;
  position: relative;
  animation: custom_widgets_logo_marquee_animation var(--custom_widgets_logo_marquee_duration) 0.5s linear infinite;
  animation-direction: var(--custom_widgets_logo_marquee_direction);
  will-change: transform;
}

@keyframes custom_widgets_logo_marquee_animation {
  to {
    transform: translateX(-33.3%);
  }
}


.custom-widgets-logo-marquee-widget.pause-on-hover:hover .custom-widgets-logo-marquee-widget-inner {
  animation-play-state: paused;
}

.custom-widgets-logo-marquee-widget.logo-marquee-fade .custom-widgets-logo-marquee-widget-wrapper:before, 
.custom-widgets-logo-marquee-widget.logo-marquee-fade .custom-widgets-logo-marquee-widget-wrapper:after {
    position: absolute;
    top: 0;
    width: var(--custom_widgets_logo_marquee_fade_width);
    height: 100%;
    content: "";
    z-index: 1;
}

.custom-widgets-logo-marquee-widget.logo-marquee-fade .custom-widgets-logo-marquee-widget-wrapper:before {
  left: 0;
  background: linear-gradient(to right, var(--custom_widgets_logo_marquee_fade_effect_color) 0%, transparent 100%);
}
.custom-widgets-logo-marquee-widget.logo-marquee-fade .custom-widgets-logo-marquee-widget-wrapper:after  {
  right: 0;
  background: linear-gradient(to left, var(--custom_widgets_logo_marquee_fade_effect_color) 0%, transparent 100%);
}


.custom-widgets-logo-marquee-widget .elementor-button-wrapper {
  display: none;
}

.custom-widgets-logo-marquee-widget .elementor-button {
  cursor: pointer;
}

.custom-widgets-logo-marquee-widget .elementor-button-content-wrapper.load-less-text {
  display: none;
}


@media (max-width:1024px) {
  .custom-widgets-logo-marquee-grid-view-tablet  .custom-widgets-logo-marquee-widget-inner {
    animation: none; 
    width:auto; 
    display:grid; 
    gap:var(--custom_widgets_logo_marquee_gap);
    grid-template-columns: repeat(var(--custom_widgets_logo_marquee_grid_columns), 1fr);
  }

  .custom-widgets-logo-marquee-grid-view-tablet  .logo-marquee-widget-item-inner img {
    max-width:100% !important;
  }

  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget-wrapper:before,
  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget-wrapper:after {
    display:none;
  }

  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget {
    overflow-x:initial;
  }

  .custom-widgets-logo-marquee-grid-view-tablet .logo-marquee-widget-item-inner {
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .custom-widgets-logo-marquee-grid-view-tablet .clone {
    display: none !important;
  }

  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget:not(.grid-expanded) .hide-on-init-tablet.custom-widgets-hide {
    display:none !important;
  }
  

  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget.logo-grid-fade .custom-widgets-logo-marquee-widget-wrapper:after {
    display: block !important;
    bottom:0;
    top:auto;
    width:100%;
    left:0;
    right:0;
    background: linear-gradient(to top, var(--custom_widgets_logo_marquee_fade_effect_color) 0%, var(--custom_widgets_logo_marquee_fade_effect_color) 20%, transparent 100%);
    height: var(--custom_widgets_logo_marquee_fade_width);
  }

  .custom-widgets-logo-marquee-grid-view-tablet .elementor-button-wrapper {
    display: block;
  }

  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget.grid-expanded .elementor-button-content-wrapper.load-more-text {
    display: none;
  }
  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget.grid-expanded .elementor-button-content-wrapper.load-less-text {
    display: block;
  }

  

}

@media (max-width:766px) {
  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget-inner {
    animation: none; 
    width:auto; 
    display:grid; 
    gap:var(--custom_widgets_logo_marquee_gap);
    grid-template-columns: repeat(var(--custom_widgets_logo_marquee_grid_columns), 1fr);
  }

  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget-inner > div img {
    max-width:100% !important;
  }

  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget.logo-marquee-fade .custom-widgets-logo-marquee-widget-wrapper:before, 
  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget.logo-marquee-fade .custom-widgets-logo-marquee-widget-wrapper:after {
    display:none;
  }

  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget {
    overflow-x:initial;
  }

  .custom-widgets-logo-marquee-grid-view-mobile .logo-marquee-widget-item-inner {
    margin-left:0 !important;
    margin-right:0 !important;
  }

  .custom-widgets-logo-marquee-grid-view-mobile .clone {
    display:none !important;
  }

  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget:not(.grid-expanded) .hide-on-init-mobile.custom-widgets-hide,
  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget:not(.grid-expanded) .hide-on-init-mobile.custom-widgets-hide {
    display:none !important; 
  }

  /*
  .custom-widgets-logo-marquee-grid-view-mobile:not(.grid-expanded) .hide-on-init-mobile.custom-widgets-hide,
  .custom-widgets-logo-marquee-grid-view-tablet:not(.grid-expanded) .hide-on-init-mobile.custom-widgets-hide {
    display:none !important; 
  }
  */

  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget.logo-grid-fade .custom-widgets-logo-marquee-widget-wrapper:after, 
  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget.logo-grid-fade .custom-widgets-logo-marquee-widget-wrapper:after {
    display: block !important;
    bottom:0;
    top:auto;
    width:100%;
    left:0;
    right:0;
    background: linear-gradient(to top, var(--custom_widgets_logo_marquee_fade_effect_color) 0%, transparent 100%);
    height: var(--custom_widgets_logo_marquee_fade_width);
  }

  .custom-widgets-logo-marquee-grid-view-mobile .elementor-button-wrapper,
  .custom-widgets-logo-marquee-grid-view-tablet .elementor-button-wrapper {
    display: block;
  }

  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget.grid-expanded .elementor-button-content-wrapper.load-more-text,
  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget.grid-expanded .elementor-button-content-wrapper.load-more-text {
    display: none;
  }
  .custom-widgets-logo-marquee-grid-view-mobile .custom-widgets-logo-marquee-widget.grid-expanded .elementor-button-content-wrapper.load-less-text,
  .custom-widgets-logo-marquee-grid-view-tablet .custom-widgets-logo-marquee-widget.grid-expanded .elementor-button-content-wrapper.load-less-text {
    display: block;
  }

}