/** Shopify CDN: Minification failed

Line 10:0 Unexpected "<"
Line 103:2 Unexpected "<"

**/


/* CSS from section stylesheet tags */
<style>
    /* Container for the marquee */
    .marquee {
      overflow: hidden;
      white-space: nowrap;
      position: relative;
      background: #f8f8f8;
      padding-bottom: 4rem;
      width: 100%;
    }
    /* The moving content is now a flex container with a width that fits its content */
    .marquee-content {
      display: flex;
	  white-space: nowrap ;
      width: max-content;
      overflow: hidden ;
      width: 100%;
    }
    /* Each icon item (stacked vertically) */
    .marquee-item {
      display: inline-flex;
      flex-direction: row;
      animation-duration: 18s ;
	  animation-iteration-count: infinite ;
	  animation-name: marquee-content ;
	  animation-timing-function: linear ;
      padding: 5px 15px 5px 15px ;

    }
  .stack{
      display: inline-flex;
      flex-direction: column;
      align-items: center;
      width: 250px;
      margin-right: 60px;
    
  }
  @media screen and (max-width: 750px) {
    .stack{
      margin-right:0px;
      width: 180px;
    }

    .marquee-item svg {
      width: 40px !important;
      height: 40px !important;
    }

    .icon-text{
        font-size: 0.8em !important;
        max-width: 300px; 
    }
  }
  
  
    .marquee-item svg {
      width: 75px;
      height: 75px;
    }

  

    .icon-text {
      margin-top: 5px;
      font-size: 1.2em;
      text-align: center;
      font-weight: 700;
      color: #333;
      max-width: 300px;          /* Limit the width to 80px (adjust as needed) */
      white-space: normal;      /* Allow text to wrap */
      overflow-wrap: break-word;
      line-height: 1.2; /* Adjust this value to decrease line spacing */
    }
  
  
  .stack:hover .stack svg {
            width: 100px;
			height: 100px;
        -webkit-transition: background-color 300ms linear;
        -moz-transition: background-color 300ms linear;
        -o-transition: background-color 300ms linear;
        -ms-transition: background-color 300ms linear;
        transition: background-color 300ms linear;          
		}
    /* Animate the marquee-content from 0 to -50% so the duplicate content creates a continuous loop */
    @keyframes marquee-content {
			from {
				transform: translateX( 0% );
			}
			to {
				transform: translateX( -100% );
			}
		}
  </style>