@charset "utf-8";
/* CSS Document */

.ict-dedicated-footer {
    background-color: #000000 !important;
    color: #ffffff;
    text-align: left !important;
}

.ict-dedicated-footer .columns,
.ict-dedicated-footer .ict-list,
.ict-dedicated-footer .footer-column-content,
.ict-dedicated-footer-column-1 {
    text-align: left !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
}

.ict-dedicated-footer .ict-list {
    display: block !important; /* switch from inline block if needed */
    margin-left: 0;
    padding-left: 0;
}

#teconsent { text-align: right; }
#teconsent {
    position: fixed;
    bottom: 0px;
    right: 0px;
    z-index: 900;
}

#consent_blackbar {
    position: fixed;
    bottom: 0;
    width: 100%;
    z-index: 1000;
}

.headermenu {
  display: none !important;
}

/* =========================
   Responsive hero image swap (shared)
   Uses CSS variables with sensible defaults (Page 1).
   Page 2 overrides are applied via a CLASS on the same container.
   ========================= */

/* Reset .ict-image so it doesn’t force aspect ratios */
.ict-image {
  all: unset;
  display: block !important;
  text-align: center;   /* optional, helps center image */
}

/* Defaults for Page 1 (desktop & mobile) */
.ict-image {
  --hero-desktop: url("/137096913/Handler/Picture/GU/F/Molson%20Coors/Carling/CAR%20X%20UMBRO%20Retro%20Fleece%20On%20Pack%20152x38%20SBar%20AW%20-%20v2.png");
  --hero-mobile:  url("/938747066/Handler/Picture/GU/F/Molson%20Coors/Carling/CAR%20X%20UMBRO%20Retro%20Fleece%20On%20Pack%20POS%20A3P%20KV%20AW%20-%20v2-min.png");
}

/* Page 2 override via CLASS on the container:
   <div class="ict-image image is-as-image scratchcard-banner"> ... */
.ict-image.scratchcard-banner {
  --hero-desktop: url("/-299039149/Handler/Picture/GU/F/Molson%20Coors/Carling/7935-2CARFleeceUpdatedAssets452x1796pxL.jpg");
  --hero-mobile:  url("/-201177920/Handler/Picture/GU/F/Molson%20Coors/Carling/7935-1CARFleeceUpdatedAssets4961x3508pxP.jpg");
}

/* Make the <img> behave responsively and consume the variables */
.ict-image img {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  margin: 0 auto;
  content: var(--hero-desktop) !important; /* ensure we override any default */
}

/* Mobile swap */
@media (max-width: 768px) {
  .ict-image img {
    content: var(--hero-mobile) !important;
  }
}

section.Footer {
  color: white;
}

section.Footer a {
  color: white;
  text-decoration: none;
}

section.Footer a:hover {
  text-decoration: underline;
}