@font-face {
  font-family: LiebherrText-Regular;
  src: url('https://assets-cdn.liebherr.com/assets/api/cbef770b-7eef-4164-8dc7-a304a545b01f/original/LiebherrText-Regular_Web.woff2')
    format('woff2'),
  url('https://assets-cdn.liebherr.com/assets/api/474894f9-c341-4057-bdfa-b5d84a0a05bf/original/LiebherrText-Regular_Web.woff')
    format('woff');
  font-display: swap;
}
@font-face {
  font-family: LiebherrText-Bold;
  src: url('https://assets-cdn.liebherr.com/assets/api/53da5b14-5565-4436-8d08-3bf3cf0262ae/original/LiebherrText-Bold_Web.woff2')
    format('woff2'),
  url('https://assets-cdn.liebherr.com/assets/api/e4261118-f994-4bdc-8f5b-9dec7c0ec00a/original/LiebherrText-Bold_Web.woff')
    format('woff');
  font-display: swap;
}

@font-face {
  font-family: LiebherrHead-Black;
  src: url('https://assets-cdn.liebherr.com/assets/api/3c3d21f7-2747-4a07-bb1b-f9f4598c21df/original/LiebherrHead-Black_Web.woff2')
    format('woff2'),
  url('https://assets-cdn.liebherr.com/assets/api/114f48b5-dfe3-4739-b96d-03167ed68c38/original/LiebherrHead-Black_Web.woff')
    format('woff');
  font-display: swap;
}

  /* Progress bar colour */
[class*="ProgressBar__Bar"]{
    background-color: #000000 !important;
  }
 [class*="ProgressBar__Line"]{
    background-color: Gray!important;
  }
 [class*="ProgressBar__Text"]{
    background-color: #000000!important;
  }

  /* tile button customisation */
a.tile {
  background-color: #ffffff;
  color: #000000;
  border: 2px solid #F0F3F6;
  border-radius: 4px;
  border-color: #F0F3F6;
  font-size: 16px;
  font-weight: bold;
  min-height: 72px;
}
a.tile:hover {
    border: 2px solid #000000; /* Increases thickness to 2px and changes color to black when hovering on the tile */

}
a.tile {
    transition: box-shadow 0.2s ease-in-out; /* Smooth transition */
}

a.tile:hover {
    box-shadow: 4px 4px 10px rgba(0, 0, 0, 0.3); /* Shadow on hover */
}

a.tile svg path {
    fill: black !important; /* Force the arrow to be solid black */
    stroke: black !important; /* Ensure the outline is black */
    stroke-width: 0.3px !important;
}

/* code to change the look of the Automation loading spinner*/
@keyframes custom-automation-loader-animation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}

.automation-loader svg {
  display: none;
}


.automation-loader {
  width: 96px;
  height: 96px;
  position: relative;
}

.automation-loader::before {
  width: 96px;
  height: 96px;
  content: url("data:image/svg+xml,%3Csvg width='96' height='96' viewBox='0 0 96 96' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M78.3477 81.3131C87.4428 73.0706 93.1703 61.2632 93.1703 48.0934C93.1703 34.9236 87.5345 23.3206 78.5997 15.0781' stroke='%23FECC00' stroke-width='4' stroke-miterlimit='10'/%3E%3Cpath d='M3.73047 59.5391C8.86225 78.885 26.5486 93.1447 47.6714 93.1447C52.3221 93.1447 56.8124 92.4408 61.0278 91.1693' stroke='%23FECC00' stroke-width='4' stroke-miterlimit='10'/%3E%3Cpath d='M61.3243 5.06629C57.0173 3.72661 52.4353 3 47.6701 3C25.4247 3 6.95948 18.8264 2.99609 39.7392' stroke='%23FECC00' stroke-width='4' stroke-miterlimit='10'/%3E%3C/svg%3E%0A");
  display: block;
  transform-origin: center;
  animation: custom-automation-loader-animation 10s linear infinite;
  animation-delay: 0.5s;
}

.automation-loader::after {
  width: 96px;
  height: 96px;
  content: url("data:image/svg+xml,%3Csvg width='96' height='96' viewBox='0 0 96 96' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_1847_149)'%3E%3Cpath d='M74.2356 40.9287C72.7119 33.779 68.3842 27.4121 61.6803 23.7013C54.9764 19.9904 47.4142 19.7122 40.5936 22.1319' stroke='black' stroke-width='4' stroke-miterlimit='10'/%3E%3Cpath d='M41.2188 74.0312C53.0749 77.0435 65.8898 71.9005 72.082 60.7139C73.4453 58.2509 74.385 55.6644 74.9404 53.0553' stroke='black' stroke-width='4' stroke-miterlimit='10'/%3E%3Cpath d='M29.8713 28.1097C27.9343 29.9647 26.237 32.1393 24.8648 34.6183C18.4588 46.1912 21.3717 60.3533 31.1058 68.4351' stroke='black' stroke-width='4' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='clip0_1847_149'%3E%3Crect width='60' height='60' fill='white' transform='translate(18 18)'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E%0A");
  top: 0;
  left: 0;
  display: block;
  position: absolute;
  animation: custom-automation-loader-animation 10s linear infinite;
}

.guide-8blPeEIHaX.guide-canvas {
  background-color: #ffd000;
}

.guide-canvas .ston-steps-footer-wrapper > div > a.ston-powered-by-stonly {
  display: none;
}

.ston-widget-header-title {
  color: #000;

  font-family: "LiebherrHead-Black";
  font-size: 28px;
  font-style: normal;
  font-weight: 900;
  line-height: 32px;
}

.guide-canvas .button-wrap button {
  opacity: 1;
  display: flex;
  width: 100%;
  height: 72px;
  padding: 12px 36px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
  align-self: stretch;
  border: 1px solid #51585D;
  border-radius: 0;
}

.ston-widget-light .guide-canvas .button-wrap button {
  display: flex;
  height: auto;
  padding: 12px 36px;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 8px;
}

.guide-canvas  .button-wrap button.back-button {
  width: auto;
  padding: 12px;
}

.guide-canvas  .button-wrap button.back-button > span > svg {
  display: none;
}

.guide-canvas  .button-wrap button.back-button > span {
  width: 24px;
  height: 24px;
}

.guide-canvas  .button-wrap button.back-button > span::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 24px;
  background-image: url("https://res.cloudinary.com/liebherr/image/upload/fl_sanitize/patternlibicons/regular/font-arrow-left.svg");
  background-size: contain;
  background-repeat: no-repeat;
}

.guide-canvas  .button-wrap button:hover {
  border-color: #6B7278;
  background-color:rgba(0, 0, 0, 0);
} 

.guide-canvas  .button-wrap button > div {
  color: #000;
  font-feature-settings: 'liga' off, 'clig' off;
  /* Copy/Copy_Small_Bold */
  font-family: "LiebherrText-Bold";
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
}

.ston-widget-light .guide-canvas  .button-wrap button > div{
  color: #000;
  font-feature-settings: 'liga' off, 'clig' off;
  /* Functional/Btn_Text */
  font-family: "LiebherrText-Bold";
  font-size: 14px;
  font-style: normal;
  font-weight: 700;
  line-height: 24px;
  letter-spacing: 0.78px;
  text-transform: uppercase;
}

.guide-canvas  .button-wrap button:hover > div {
  color: #6B7278;
}

.guide-canvas  .button-wrap button:hover > div > svg {
  display: none;
}

.guide-canvas .content h2.subtitle {
  color: #000;
  /* CO Headlines/XL_1200+/H6 */
  font-family: "LiebherrHead-Black";
  font-size: 20px;
  font-style: normal;
  font-weight: 900;
  line-height: 24px; /* 120% */
}

.guide-canvas .content .content-text {
  color: #000;
  font-feature-settings: 'liga' off, 'clig' off;
  /* Copy/Copy_Medium_Small */
  font-family: "LiebherrText-Regular";
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px; /* 142.857% */
}