@biggive/components 202303201257.0.0 → 202303231047.0.0

package/dist/collection/components/biggive-timeline/biggive-timeline.js

@@ -2,6 +2,7 @@ import { h } from '@stencil/core';
 export class BiggiveTimeline {
   constructor() {
     this.currentTab = 0;
+    this.scrollOffset = 0;
     this.tabHeadings = [];
     this.children = [];
     this.spaceBelow = 0;
@@ -34,12 +35,15 @@ export class BiggiveTimeline {
    * Shows the i'th element in the timeline, counting from zero. Does nothing if i out of range.
    */
   showTab(i) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const tabs = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.navigation ul li');
     const entries = (_b = this.host.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelectorAll('.entry');
+    if (tabs.length > 0) {
+      this.scrollContextTab = (_c = this.host.shadowRoot) === null || _c === void 0 ? void 0 : _c.querySelector('.navigation ul li');
+    }
     if (i >= 0 && i <= (tabs === null || tabs === void 0 ? void 0 : tabs.length) - 1) {
       this.currentTab = i;
-      let currentTabTitle = (_c = tabs[i]) === null || _c === void 0 ? void 0 : _c.innerHTML;
+      let currentTabTitle = (_d = tabs[i]) === null || _d === void 0 ? void 0 : _d.innerHTML;
       let j = 0;
       tabs === null || tabs === void 0 ? void 0 : tabs.forEach(function (tab) {
         if (i == j) {
@@ -66,11 +70,40 @@ export class BiggiveTimeline {
       i++;
     }
   }
+  scrollTab(direction) {
+    var _a;
+    if (!this.scrollContextTab) {
+      return;
+    }
+    let sleeve = this.scrollContextTab.parentElement;
+    let max = sleeve.scrollWidth - ((_a = sleeve.parentElement) === null || _a === void 0 ? void 0 : _a.offsetWidth);
+    if (direction == 'PREV') {
+      if (this.scrollOffset + this.scrollContextTab.offsetWidth > 0) {
+        return;
+      }
+      this.scrollOffset = this.scrollOffset + this.scrollContextTab.offsetWidth;
+      if (this.scrollContextTab.previousElementSibling) {
+        this.scrollContextTab = this.scrollContextTab.previousElementSibling;
+      }
+    }
+    else if (direction == 'NEXT') {
+      if (0 - this.scrollOffset > max) {
+        return;
+      }
+      this.scrollOffset = this.scrollOffset - this.scrollContextTab.offsetWidth;
+      if (this.scrollContextTab.nextElementSibling) {
+        this.scrollContextTab = this.scrollContextTab.nextElementSibling;
+      }
+    }
+    sleeve.style.transitionDuration = '0.3s';
+    sleeve.style.transitionTimingFunction = 'ease-out';
+    sleeve.style.transform = 'translate3d(' + this.scrollOffset + 'px, 0, 0)';
+  }
   clickPrevHandler() {
-    this.showTab(this.currentTab - 1);
+    this.scrollTab('PREV');
   }
   clickNextHandler() {
-    this.showTab(this.currentTab + 1);
+    this.scrollTab('NEXT');
   }
   render() {
     return (h("div", { class: 'container space-below-' +
@@ -96,7 +129,7 @@ export class BiggiveTimeline {
         ' entry-title-colour-' +
         this.entryTitleColour +
         ' entry-text-colour-' +
-        this.entryTextColour }, h("div", { class: "navigation" }, h("div", { class: "button prev", onClick: () => this.clickPrevHandler(), title: "Previous" }, h("svg", { width: "9", height: "16", viewBox: "0 0 9 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M8.29311 14.5703L1.73926 8.01646L8.29311 1.46261", stroke: "#000000", "stroke-width": "2" }))), h("ul", null, this.tabHeadings.map(tab => (h("li", { onClick: event => this.clickTabHandler(event) }, tab)))), h("div", { class: "button next", onClick: () => this.clickNextHandler(), title: "Next" }, h("svg", { width: "9", height: "16", viewBox: "0 0 9 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.739117 1.46094L7.29297 8.01479L0.739118 14.5686", stroke: "#000000", "stroke-width": "2" })))), h("div", { class: "entry-wrap" }, this.children.map(entry => (h("div", { class: "entry", "data-date": entry.date }, h("div", { class: "date" }, entry.date), h("h4", { class: "title" }, entry.heading), h("div", { class: "content", innerHTML: entry.innerHTML })))))));
+        this.entryTextColour }, h("div", { class: "navigation" }, h("div", { class: "button prev", onClick: () => this.clickPrevHandler(), title: "Previous" }, h("svg", { width: "9", height: "16", viewBox: "0 0 9 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M8.29311 14.5703L1.73926 8.01646L8.29311 1.46261", stroke: "#000000", "stroke-width": "2" }))), h("div", { class: "sleeve" }, h("ul", null, this.tabHeadings.map(tab => (h("li", { onClick: event => this.clickTabHandler(event) }, tab))))), h("div", { class: "button next", onClick: () => this.clickNextHandler(), title: "Next" }, h("svg", { width: "9", height: "16", viewBox: "0 0 9 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.739117 1.46094L7.29297 8.01479L0.739118 14.5686", stroke: "#000000", "stroke-width": "2" })))), h("div", { class: "entry-wrap" }, this.children.map(entry => (h("div", { class: "entry", "data-date": entry.date }, h("h4", { class: "title" }, entry.heading), h("div", { class: "content", innerHTML: entry.innerHTML })))))));
   }
   static get is() { return "biggive-timeline"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/biggive-tipping-slider/biggive-tipping-slider.css

@@ -51,7 +51,7 @@ a:hover {
 
 .background-colour-hover-brand-6:hover,
 .background-colour-brand-6 {
-  background-color: #CBC8C8;
+  background-color: #62CFC9;
 }
 
 .background-colour-hover-white:hover,

package/dist/collection/components/biggive-tipping-slider/biggive-tipping-slider.js

@@ -43,7 +43,7 @@ export class BiggiveTippingSlider {
           // a truthy window.TouchEvent - see https://stackoverflow.com/a/32882849/2803757
           pageX = e.pageX;
         }
-        if (typeof pageX != 'undefined') {
+        if (pageX) {
           const mousePos = pageX - bar.offsetLeft - handle.offsetWidth / 2;
           const position = mousePos > max ? max : mousePos < 0 ? 0 : mousePos;
           const percentage = (position / max) * this.percentageEnd;

package/dist/collection/components/biggive-totalizer/biggive-totalizer.css

@@ -51,7 +51,7 @@ a:hover {
 
 .background-colour-hover-brand-6:hover,
 .background-colour-brand-6 {
-  background-color: #CBC8C8;
+  background-color: #62CFC9;
 }
 
 .background-colour-hover-white:hover,

package/dist/components/biggive-accordion.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 
-const biggiveAccordionCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.text-colour-hover-grey-extra-light:hover,.text-colour-grey-extra-light{color:#D7D7D7}.text-colour-hover-grey-light:hover,.text-colour-grey-light{color:#E8E8E8}.text-colour-hover-grey-medium:hover,.text-colour-grey-medium{color:#8A8A8A}.text-colour-hover-grey-dark:hover,.text-colour-grey-dark{color:#4A4A4A}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative}.container .entry h3.heading{position:relative;margin:15px 0 0 0;padding:10px 60px 10px 20px;border-bottom:1px solid #000000;cursor:pointer}.container .entry h3.heading span.arrow{display:block;position:absolute;right:20px;top:10px;width:40px;height:20px;text-align:center}.container .entry .content{overflow:hidden;max-height:0;padding:0 20px;transition:max-height 0.5s ease-in-out}.container .entry.expanded .content{max-height:100%}.container .entry.expanded span.arrow{transform:rotate(-180deg)}.container.heading-colour-primary .entry h3.heading svg path{stroke:#2C089B}.container.heading-colour-primary h3.heading{color:#2C089B}.container.text-colour-primary .content{color:#2C089B}.container.heading-colour-secondary .entry h3.heading svg path{stroke:#2AF135}.container.heading-colour-secondary h3.heading{color:#2AF135}.container.text-colour-secondary .content{color:#2AF135}.container.heading-colour-tertiary .entry h3.heading svg path{stroke:#FF7272}.container.heading-colour-tertiary h3.heading{color:#FF7272}.container.text-colour-tertiary .content{color:#FF7272}.container.heading-colour-brand-1 .entry h3.heading svg path{stroke:#B30510}.container.heading-colour-brand-1 h3.heading{color:#B30510}.container.text-colour-brand-1 .content{color:#B30510}.container.heading-colour-brand-2 .entry h3.heading svg path{stroke:#6E0887}.container.heading-colour-brand-2 h3.heading{color:#6E0887}.container.text-colour-brand-2 .content{color:#6E0887}.container.heading-colour-brand-3 .entry h3.heading svg path{stroke:#50B400}.container.heading-colour-brand-3 h3.heading{color:#50B400}.container.text-colour-brand-3 .content{color:#50B400}.container.heading-colour-brand-4 .entry h3.heading svg path{stroke:#FFE500}.container.heading-colour-brand-4 h3.heading{color:#FFE500}.container.text-colour-brand-4 .content{color:#FFE500}.container.heading-colour-brand-5 .entry h3.heading svg path{stroke:#F07D00}.container.heading-colour-brand-5 h3.heading{color:#F07D00}.container.text-colour-brand-5 .content{color:#F07D00}.container.heading-colour-brand-6 .entry h3.heading svg path{stroke:#62CFC9}.container.heading-colour-brand-6 h3.heading{color:#62CFC9}.container.text-colour-brand-6 .content{color:#62CFC9}.container.heading-colour-white .entry h3.heading svg path{stroke:#FFFFFF}.container.heading-colour-white h3.heading{color:#FFFFFF}.container.text-colour-white .content{color:#FFFFFF}.container.heading-colour-black .entry h3.heading svg path{stroke:#000000}.container.heading-colour-black h3.heading{color:#000000}.container.text-colour-black .content{color:#000000}.container.heading-colour-grey-extra-light .entry h3.heading svg path{stroke:#D7D7D7}.container.heading-colour-grey-extra-light h3.heading{color:#D7D7D7}.container.text-colour-grey-extra-light .content{color:#D7D7D7}.container.heading-colour-grey-light .entry h3.heading svg path{stroke:#E8E8E8}.container.heading-colour-grey-light h3.heading{color:#E8E8E8}.container.text-colour-grey-light .content{color:#E8E8E8}.container.heading-colour-grey-medium .entry h3.heading svg path{stroke:#8A8A8A}.container.heading-colour-grey-medium h3.heading{color:#8A8A8A}.container.text-colour-grey-medium .content{color:#8A8A8A}.container.heading-colour-grey-dark .entry h3.heading svg path{stroke:#4A4A4A}.container.heading-colour-grey-dark h3.heading{color:#4A4A4A}.container.text-colour-grey-dark .content{color:#4A4A4A}";
+const biggiveAccordionCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.text-colour-hover-grey-extra-light:hover,.text-colour-grey-extra-light{color:#D7D7D7}.text-colour-hover-grey-light:hover,.text-colour-grey-light{color:#E8E8E8}.text-colour-hover-grey-medium:hover,.text-colour-grey-medium{color:#8A8A8A}.text-colour-hover-grey-dark:hover,.text-colour-grey-dark{color:#4A4A4A}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative}.container .entry h3.heading{position:relative;margin:25px 0 0 0;padding:15px 60px 10px 20px;border-bottom:1px solid #000000;cursor:pointer}.container .entry h3.heading span.arrow{display:block;position:absolute;right:20px;top:10px;width:40px;height:20px;text-align:center}.container .entry .content{overflow:hidden;max-height:0;padding:0 20px;transition:max-height 0.5s ease-in-out}.container .entry.expanded .content{max-height:100%}.container .entry.expanded span.arrow{transform:rotate(-180deg)}.container.heading-colour-primary .entry h3.heading svg path{stroke:#2C089B}.container.heading-colour-primary h3.heading{color:#2C089B}.container.text-colour-primary .content{color:#2C089B}.container.heading-colour-secondary .entry h3.heading svg path{stroke:#2AF135}.container.heading-colour-secondary h3.heading{color:#2AF135}.container.text-colour-secondary .content{color:#2AF135}.container.heading-colour-tertiary .entry h3.heading svg path{stroke:#FF7272}.container.heading-colour-tertiary h3.heading{color:#FF7272}.container.text-colour-tertiary .content{color:#FF7272}.container.heading-colour-brand-1 .entry h3.heading svg path{stroke:#B30510}.container.heading-colour-brand-1 h3.heading{color:#B30510}.container.text-colour-brand-1 .content{color:#B30510}.container.heading-colour-brand-2 .entry h3.heading svg path{stroke:#6E0887}.container.heading-colour-brand-2 h3.heading{color:#6E0887}.container.text-colour-brand-2 .content{color:#6E0887}.container.heading-colour-brand-3 .entry h3.heading svg path{stroke:#50B400}.container.heading-colour-brand-3 h3.heading{color:#50B400}.container.text-colour-brand-3 .content{color:#50B400}.container.heading-colour-brand-4 .entry h3.heading svg path{stroke:#FFE500}.container.heading-colour-brand-4 h3.heading{color:#FFE500}.container.text-colour-brand-4 .content{color:#FFE500}.container.heading-colour-brand-5 .entry h3.heading svg path{stroke:#F07D00}.container.heading-colour-brand-5 h3.heading{color:#F07D00}.container.text-colour-brand-5 .content{color:#F07D00}.container.heading-colour-brand-6 .entry h3.heading svg path{stroke:#62CFC9}.container.heading-colour-brand-6 h3.heading{color:#62CFC9}.container.text-colour-brand-6 .content{color:#62CFC9}.container.heading-colour-white .entry h3.heading svg path{stroke:#FFFFFF}.container.heading-colour-white h3.heading{color:#FFFFFF}.container.text-colour-white .content{color:#FFFFFF}.container.heading-colour-black .entry h3.heading svg path{stroke:#000000}.container.heading-colour-black h3.heading{color:#000000}.container.text-colour-black .content{color:#000000}.container.heading-colour-grey-extra-light .entry h3.heading svg path{stroke:#D7D7D7}.container.heading-colour-grey-extra-light h3.heading{color:#D7D7D7}.container.text-colour-grey-extra-light .content{color:#D7D7D7}.container.heading-colour-grey-light .entry h3.heading svg path{stroke:#E8E8E8}.container.heading-colour-grey-light h3.heading{color:#E8E8E8}.container.text-colour-grey-light .content{color:#E8E8E8}.container.heading-colour-grey-medium .entry h3.heading svg path{stroke:#8A8A8A}.container.heading-colour-grey-medium h3.heading{color:#8A8A8A}.container.text-colour-grey-medium .content{color:#8A8A8A}.container.heading-colour-grey-dark .entry h3.heading svg path{stroke:#4A4A4A}.container.heading-colour-grey-dark h3.heading{color:#4A4A4A}.container.text-colour-grey-dark .content{color:#4A4A4A}";
 
 const BiggiveAccordion$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {

package/dist/components/biggive-article-card.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { d as defineCustomElement$2 } from './biggive-button2.js';
 
-const biggiveArticleCardCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#CBC8C8}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}.image-wrap img{width:100%;height:auto}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.text-colour-hover-grey-extra-light:hover,.text-colour-grey-extra-light{color:#D7D7D7}.text-colour-hover-grey-light:hover,.text-colour-grey-light{color:#E8E8E8}.text-colour-hover-grey-medium:hover,.text-colour-grey-medium{color:#8A8A8A}.text-colour-hover-grey-dark:hover,.text-colour-grey-dark{color:#4A4A4A}:host{display:contents}.align-right{text-align:right}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative;text-align:left;padding:30px}.container .sleeve{padding:30px 30px 0 30px;clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0, 100% 100%, 100% 100%, 50px 100%, 0 calc(100% - 50px))}.container .slug{margin-bottom:5px}.container .date{font-size:13px;line-height:17px;margin-bottom:15px}.container h3{font-size:20px;line-height:24px;font-weight:bold;margin-bottom:15px}.container h3 a,.container h3 a:hover{text-decoration:none}.container .image-group{margin-bottom:15px}.container .image-group .image-wrap{border-radius:50%;width:60px;height:60px;background-size:cover;background-position:center center;margin-bottom:5px}.container .image-group .image-wrap img{display:none}.container .image-group .image-label{font-size:13px;line-height:17px}";
+const biggiveArticleCardCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#62CFC9}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}.image-wrap img{width:100%;height:auto}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.text-colour-hover-grey-extra-light:hover,.text-colour-grey-extra-light{color:#D7D7D7}.text-colour-hover-grey-light:hover,.text-colour-grey-light{color:#E8E8E8}.text-colour-hover-grey-medium:hover,.text-colour-grey-medium{color:#8A8A8A}.text-colour-hover-grey-dark:hover,.text-colour-grey-dark{color:#4A4A4A}:host{display:contents}.align-right{text-align:right}.container{height:100%;width:100%;font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative;text-align:left}.container .sleeve{height:100%;box-sizing:border-box;background-size:cover;padding:15px 15px 10px 15px}.container .sleeve .content-wrap{height:100%;display:flex;flex-direction:column}.container .slug{font-size:13px;line-height:17px}.container .date{font-size:11px;line-height:14px;margin-bottom:15px}.container h3{font-size:20px;line-height:24px;font-weight:bold;padding-bottom:15px;margin-bottom:auto}.container h3 a,.container h3 a:hover{text-decoration:none}.container .image-group{display:flex;margin-bottom:15px}.container .image-group .image-container{margin-right:15px}.container .image-group .image-container .image-wrap{border-radius:50%;width:60px;height:60px;background-size:cover;background-position:center center;margin-bottom:5px}.container .image-group .image-container .image-wrap img{display:none}.container .image-label{font-size:11px;line-height:14px}.container .clip-bottom-left-corner-false.clip-top-right-corner-true{clip-path:polygon(0% 0%, 0% 0%, calc(100% - 50px) 0%, 100% 50px, 100% 100%, 100% 100%, 0% 100%, 0 100%)}.container .clip-bottom-left-corner-true.clip-top-right-corner-false{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0, 100% 100%, 100% 100%, 50px 100%, 0 calc(100% - 50px))}.container .clip-bottom-left-corner-true.clip-top-right-corner-true{clip-path:polygon(0% 0%, 0% 0%, calc(100% - 50px) 0%, 100% 50px, 100% 100%, 100% 100%, 50px 100%, 0 calc(100% - 50px))}";
 
 const BiggiveArticleCard$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -10,34 +10,69 @@ const BiggiveArticleCard$1 = /*@__PURE__*/ proxyCustomElement(class extends HTML
     this.__attachShadow();
     this.spaceBelow = 0;
     this.backgroundColour = 'white';
-    this.backgroundColourHover = 'tertiary';
+    this.backgroundImageUrl = '';
     this.textColour = 'black';
     this.slug = undefined;
+    this.slugColour = 'black';
     this.date = undefined;
+    this.dateColour = 'black';
     this.mainTitle = undefined;
-    this.imageUrl = undefined;
-    this.imageAltText = undefined;
+    this.mainTitleColour = 'black';
+    this.image1Url = undefined;
+    this.image1AltText = undefined;
+    this.image2Url = undefined;
+    this.image2AltText = undefined;
     this.imageLabel = undefined;
+    this.imageLabelColour = 'black';
     this.buttonLabel = undefined;
     this.buttonUrl = undefined;
+    this.buttonColour = 'black';
+    this.clipBottomLeftCorner = true;
+    this.clipTopRightCorner = true;
   }
   render() {
-    return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: 'sleeve background-colour-' + this.backgroundColour + ' background-colour-hover-' + this.backgroundColourHover + ' text-colour-' + this.textColour }, h("div", { class: "content-wrap" }, this.slug != '' ? h("div", { class: "slug text-colour-primary" }, this.slug) : null, this.date != '' ? h("div", { class: "date" }, this.date) : null, h("h3", { class: "title" }, h("a", { href: this.buttonUrl }, this.mainTitle)), this.imageUrl != '' ? (h("div", { class: "image-group" }, h("div", { class: "image-wrap", style: { 'background-image': "url('" + this.imageUrl + "')" } }, h("img", { src: this.imageUrl, alt: this.imageAltText, title: this.imageAltText })), h("div", { class: "image-label" }, this.imageLabel))) : null, this.buttonLabel != null && this.buttonUrl != null ? (h("div", { class: "button-wrap align-right" }, h("biggive-button", { "colour-scheme": 'clear-primary', url: this.buttonUrl, label: this.buttonLabel }))) : null))));
+    return (h("div", { class: 'container space-below-' + this.spaceBelow }, h("div", { class: 'sleeve background-colour-' +
+        this.backgroundColour +
+        ' text-colour-' +
+        this.textColour +
+        ' slug-colour-' +
+        this.slugColour +
+        ' date-colour-' +
+        this.dateColour +
+        ' main-title-colour-' +
+        this.mainTitleColour +
+        ' image-label-colour-' +
+        this.imageLabelColour +
+        ' button-colour' +
+        this.buttonColour +
+        ' clip-bottom-left-corner-' +
+        this.clipBottomLeftCorner +
+        ' clip-top-right-corner-' +
+        this.clipTopRightCorner, style: { 'background-image': "url('" + this.backgroundImageUrl + "')" } }, h("div", { class: "content-wrap" }, this.slug != '' ? h("div", { class: "slug text-colour-primary" }, this.slug) : null, this.date != '' ? h("div", { class: "date" }, this.date) : null, h("h3", { class: "title" }, h("a", { href: this.buttonUrl }, this.mainTitle)), this.image1Url != '' || this.image2Url != '' ? (h("div", { class: "image-group" }, this.image1Url != '' ? (h("div", { class: "image-container" }, h("div", { class: "image-wrap", style: { 'background-image': "url('" + this.image1Url + "')" } }, h("img", { src: this.image1Url, alt: this.image1AltText, title: this.image1AltText })))) : null, this.image2Url != '' ? (h("div", { class: "image-container" }, h("div", { class: "image-wrap", style: { 'background-image': "url('" + this.image2Url + "')" } }, h("img", { src: this.image2Url, alt: this.image2AltText, title: this.image2AltText })))) : null)) : null, this.imageLabel != '' ? h("div", { class: "image-label" }, this.imageLabel) : null, this.buttonLabel != null && this.buttonUrl != null ? (h("div", { class: "button-wrap align-right" }, h("biggive-button", { "colour-scheme": 'clear-' + this.buttonColour, url: this.buttonUrl, label: this.buttonLabel }))) : null))));
   }
   static get style() { return biggiveArticleCardCss; }
 }, [1, "biggive-article-card", {
     "spaceBelow": [2, "space-below"],
     "backgroundColour": [1, "background-colour"],
-    "backgroundColourHover": [1, "background-colour-hover"],
+    "backgroundImageUrl": [1, "background-image-url"],
     "textColour": [1, "text-colour"],
     "slug": [1],
+    "slugColour": [1, "slug-colour"],
     "date": [1],
+    "dateColour": [1, "date-colour"],
     "mainTitle": [1, "main-title"],
-    "imageUrl": [1, "image-url"],
-    "imageAltText": [1, "image-alt-text"],
+    "mainTitleColour": [1, "main-title-colour"],
+    "image1Url": [1, "image-1-url"],
+    "image1AltText": [1, "image-1-alt-text"],
+    "image2Url": [1, "image-2-url"],
+    "image2AltText": [1, "image-2-alt-text"],
     "imageLabel": [1, "image-label"],
+    "imageLabelColour": [1, "image-label-colour"],
     "buttonLabel": [1, "button-label"],
-    "buttonUrl": [1, "button-url"]
+    "buttonUrl": [1, "button-url"],
+    "buttonColour": [1, "button-colour"],
+    "clipBottomLeftCorner": [4, "clip-bottom-left-corner"],
+    "clipTopRightCorner": [4, "clip-top-right-corner"]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {

package/dist/components/biggive-basic-card.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { d as defineCustomElement$2 } from './biggive-button2.js';
 
-const biggiveBasicCardCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#CBC8C8}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-brand-1{fill:#B30510}.fill-brand-2{fill:#6E0887}.fill-brand-3{fill:#50B400}.fill-brand-4{fill:#FFE500}.fill-brand-5{fill:#F07D00}.fill-brand-6{fill:#CBC8C8}.fill-brand-mhf-turquoise{fill:#62CFC9}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.fill-grey-extra-light{fill:#D7D7D7}.fill-grey-light{fill:#E8E8E8}.fill-grey-medium{fill:#8A8A8A}.fill-grey-dark{fill:#4A4A4A}.fill-red{fill:red}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.text-colour-hover-grey-extra-light:hover,.text-colour-grey-extra-light{color:#D7D7D7}.text-colour-hover-grey-light:hover,.text-colour-grey-light{color:#E8E8E8}.text-colour-hover-grey-medium:hover,.text-colour-grey-medium{color:#8A8A8A}.text-colour-hover-grey-dark:hover,.text-colour-grey-dark{color:#4A4A4A}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative;text-align:center;background-size:cover;background-position:center center;padding:30px;height:100%;white-space:pre-wrap}.container a,.container a:hover{text-decoration:none}.container .sleeve{padding:30px;height:100%;box-sizing:border-box;transition:all 1s ease-in-out}.container.add-animation-true:hover .sleeve{margin:-30px;padding:60px}.container.clip-bottom-left-corner-false.clip-top-right-corner-true .sleeve{clip-path:polygon(0% 0%, 0% 0%, calc(100% - 50px) 0%, 100% 50px, 100% 100%, 100% 100%, 0% 100%, 0 100%)}.container.clip-bottom-left-corner-true.clip-top-right-corner-false .sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0, 100% 100%, 100% 100%, 50px 100%, 0 calc(100% - 50px))}.container.clip-bottom-left-corner-true.clip-top-right-corner-true .sleeve{clip-path:polygon(0% 0%, 0% 0%, calc(100% - 50px) 0%, 100% 50px, 100% 100%, 100% 100%, 50px 100%, 0 calc(100% - 50px))}.container .icon svg{width:50px;height:auto}.container .title{font-size:25px;line-height:32px;font-weight:bold;margin-bottom:15px}.container .subtitle{margin-bottom:15px}";
+const biggiveBasicCardCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#62CFC9}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-brand-1{fill:#B30510}.fill-brand-2{fill:#6E0887}.fill-brand-3{fill:#50B400}.fill-brand-4{fill:#FFE500}.fill-brand-5{fill:#F07D00}.fill-brand-6{fill:#CBC8C8}.fill-brand-mhf-turquoise{fill:#62CFC9}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.fill-grey-extra-light{fill:#D7D7D7}.fill-grey-light{fill:#E8E8E8}.fill-grey-medium{fill:#8A8A8A}.fill-grey-dark{fill:#4A4A4A}.fill-red{fill:red}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.text-colour-hover-grey-extra-light:hover,.text-colour-grey-extra-light{color:#D7D7D7}.text-colour-hover-grey-light:hover,.text-colour-grey-light{color:#E8E8E8}.text-colour-hover-grey-medium:hover,.text-colour-grey-medium{color:#8A8A8A}.text-colour-hover-grey-dark:hover,.text-colour-grey-dark{color:#4A4A4A}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative;text-align:center;background-size:cover;background-position:center center;padding:30px;height:100%;white-space:pre-wrap}.container a,.container a:hover{text-decoration:none}.container .sleeve{padding:30px;height:100%;box-sizing:border-box;transition:all 1s ease-in-out}.container.add-animation-true:hover .sleeve{margin:-30px;padding:60px}.container.clip-bottom-left-corner-false.clip-top-right-corner-true .sleeve{clip-path:polygon(0% 0%, 0% 0%, calc(100% - 50px) 0%, 100% 50px, 100% 100%, 100% 100%, 0% 100%, 0 100%)}.container.clip-bottom-left-corner-true.clip-top-right-corner-false .sleeve{clip-path:polygon(0% 0%, 0% 0%, 100% 0%, 100% 0, 100% 100%, 100% 100%, 50px 100%, 0 calc(100% - 50px))}.container.clip-bottom-left-corner-true.clip-top-right-corner-true .sleeve{clip-path:polygon(0% 0%, 0% 0%, calc(100% - 50px) 0%, 100% 50px, 100% 100%, 100% 100%, 50px 100%, 0 calc(100% - 50px))}.container .icon svg{width:50px;height:auto}.container .title{font-size:25px;line-height:32px;font-weight:bold;margin-bottom:15px}.container .subtitle{margin-bottom:15px}";
 
 const BiggiveBasicCard$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {

package/dist/components/biggive-beneficiary-icon.js

@@ -1,7 +1,7 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { F as FontAwesomeIconsService } from './fontawesome-icons.js';
 
-const biggiveBeneficiaryIconCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#CBC8C8}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-brand-1{fill:#B30510}.fill-brand-2{fill:#6E0887}.fill-brand-3{fill:#50B400}.fill-brand-4{fill:#FFE500}.fill-brand-5{fill:#F07D00}.fill-brand-6{fill:#CBC8C8}.fill-brand-mhf-turquoise{fill:#62CFC9}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.fill-grey-extra-light{fill:#D7D7D7}.fill-grey-light{fill:#E8E8E8}.fill-grey-medium{fill:#8A8A8A}.fill-grey-dark{fill:#4A4A4A}.fill-red{fill:red}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;display:flex;justify-content:flex-start}.container .label{padding-left:15px;font-size:11px;line-height:14px;width:60px;margin-top:auto;margin-bottom:auto}.beneficiary-icon-item{width:40px;height:40px;border-radius:50%;text-align:center;transition:all ease-in-out 0.5s;display:inline-block;margin-right:10px;width:30px;height:30px}.beneficiary-icon-item.colour-scheme-primary{background-color:#2C089B}.beneficiary-icon-item.colour-scheme-primary svg{fill:#FFFFFF}.beneficiary-icon-item.colour-scheme-secondary{background-color:#2AF135}.beneficiary-icon-item.colour-scheme-secondary svg{fill:#000000}.beneficiary-icon-item.colour-scheme-tertiary{background-color:#FF7272}.beneficiary-icon-item.colour-scheme-tertiary svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-1{background-color:#B30510}.beneficiary-icon-item.colour-scheme-brand-1 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-2{background-color:#6E0887}.beneficiary-icon-item.colour-scheme-brand-2 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-3{background-color:#50B400}.beneficiary-icon-item.colour-scheme-brand-3 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-4{background-color:#FFE500}.beneficiary-icon-item.colour-scheme-brand-4 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-5{background-color:#F07D00}.beneficiary-icon-item.colour-scheme-brand-5 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-6{background-color:#CBC8C8}.beneficiary-icon-item.colour-scheme-brand-6 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-white{background-color:#FFFFFF}.beneficiary-icon-item.colour-scheme-white svg{fill:#000000}.beneficiary-icon-item.colour-scheme-black{background-color:#000000}.beneficiary-icon-item.colour-scheme-black svg{fill:#FFFFFF}.beneficiary-icon-item.colour-scheme-black{background-color:#D7D7D7}.beneficiary-icon-item.colour-scheme-black svg{fill:#D7D7D7}.beneficiary-icon-item.colour-scheme-black{background-color:#E8E8E8}.beneficiary-icon-item.colour-scheme-black svg{fill:#E8E8E8}.beneficiary-icon-item.colour-scheme-black{background-color:#8A8A8A}.beneficiary-icon-item.colour-scheme-black svg{fill:#8A8A8A}.beneficiary-icon-item.colour-scheme-black{background-color:#4A4A4A}.beneficiary-icon-item.colour-scheme-black svg{fill:#4A4A4A}.beneficiary-icon-item:hover{background-color:#FFFFFF}.beneficiary-icon-item:hover svg{fill:#000000}.beneficiary-icon-item a{display:grid;position:relative;padding:10px;box-sizing:border-box;height:100%}.beneficiary-icon-item a svg{width:100%;height:100%}.beneficiary-icon-item a{padding:6px}";
+const biggiveBeneficiaryIconCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#62CFC9}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}.fill-primary{fill:#2C089B}.fill-secondary{fill:#2AF135}.fill-tertiary{fill:#FF7272}.fill-brand-1{fill:#B30510}.fill-brand-2{fill:#6E0887}.fill-brand-3{fill:#50B400}.fill-brand-4{fill:#FFE500}.fill-brand-5{fill:#F07D00}.fill-brand-6{fill:#CBC8C8}.fill-brand-mhf-turquoise{fill:#62CFC9}.fill-white{fill:#FFFFFF}.fill-black{fill:#000000}.fill-grey-extra-light{fill:#D7D7D7}.fill-grey-light{fill:#E8E8E8}.fill-grey-medium{fill:#8A8A8A}.fill-grey-dark{fill:#4A4A4A}.fill-red{fill:red}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;display:flex;justify-content:flex-start}.container .label{padding-left:15px;font-size:11px;line-height:14px;width:60px;margin-top:auto;margin-bottom:auto}.beneficiary-icon-item{width:40px;height:40px;border-radius:50%;text-align:center;transition:all ease-in-out 0.5s;display:inline-block;margin-right:10px;width:30px;height:30px}.beneficiary-icon-item.colour-scheme-primary{background-color:#2C089B}.beneficiary-icon-item.colour-scheme-primary svg{fill:#FFFFFF}.beneficiary-icon-item.colour-scheme-secondary{background-color:#2AF135}.beneficiary-icon-item.colour-scheme-secondary svg{fill:#000000}.beneficiary-icon-item.colour-scheme-tertiary{background-color:#FF7272}.beneficiary-icon-item.colour-scheme-tertiary svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-1{background-color:#B30510}.beneficiary-icon-item.colour-scheme-brand-1 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-2{background-color:#6E0887}.beneficiary-icon-item.colour-scheme-brand-2 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-3{background-color:#50B400}.beneficiary-icon-item.colour-scheme-brand-3 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-4{background-color:#FFE500}.beneficiary-icon-item.colour-scheme-brand-4 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-5{background-color:#F07D00}.beneficiary-icon-item.colour-scheme-brand-5 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-brand-6{background-color:#CBC8C8}.beneficiary-icon-item.colour-scheme-brand-6 svg{fill:#000000}.beneficiary-icon-item.colour-scheme-white{background-color:#FFFFFF}.beneficiary-icon-item.colour-scheme-white svg{fill:#000000}.beneficiary-icon-item.colour-scheme-black{background-color:#000000}.beneficiary-icon-item.colour-scheme-black svg{fill:#FFFFFF}.beneficiary-icon-item.colour-scheme-black{background-color:#D7D7D7}.beneficiary-icon-item.colour-scheme-black svg{fill:#D7D7D7}.beneficiary-icon-item.colour-scheme-black{background-color:#E8E8E8}.beneficiary-icon-item.colour-scheme-black svg{fill:#E8E8E8}.beneficiary-icon-item.colour-scheme-black{background-color:#8A8A8A}.beneficiary-icon-item.colour-scheme-black svg{fill:#8A8A8A}.beneficiary-icon-item.colour-scheme-black{background-color:#4A4A4A}.beneficiary-icon-item.colour-scheme-black svg{fill:#4A4A4A}.beneficiary-icon-item:hover{background-color:#FFFFFF}.beneficiary-icon-item:hover svg{fill:#000000}.beneficiary-icon-item a{display:grid;position:relative;padding:10px;box-sizing:border-box;height:100%}.beneficiary-icon-item a svg{width:100%;height:100%}.beneficiary-icon-item a{padding:6px}";
 
 const BiggiveBeneficiaryIcon$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {

package/dist/components/biggive-biography-card.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 
-const biggiveBiographyCardCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.image-wrap img{width:100%;height:auto}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}:host{display:block}.container{background-size:contain;background-position:center center}";
+const biggiveBiographyCardCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.image-wrap img{width:100%;height:auto}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#62CFC9}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.text-colour-hover-grey-extra-light:hover,.text-colour-grey-extra-light{color:#D7D7D7}.text-colour-hover-grey-light:hover,.text-colour-grey-light{color:#E8E8E8}.text-colour-hover-grey-medium:hover,.text-colour-grey-medium{color:#8A8A8A}.text-colour-hover-grey-dark:hover,.text-colour-grey-dark{color:#4A4A4A}:host{display:block}.container{text-align:left}.container.background-colour-primary .image-wrap{background-color:#2C089B}.container.background-colour-secondary .image-wrap{background-color:#2AF135}.container.background-colour-tertiary .image-wrap{background-color:#FF7272}.container.background-colour-brand-1 .image-wrap{background-color:#B30510}.container.background-colour-brand-2 .image-wrap{background-color:#6E0887}.container.background-colour-brand-3 .image-wrap{background-color:#50B400}.container.background-colour-brand-4 .image-wrap{background-color:#FFE500}.container.background-colour-brand-5 .image-wrap{background-color:#F07D00}.container.background-colour-brand-6 .image-wrap{background-color:#62CFC9}.container.background-colour-white .image-wrap{background-color:#FFFFFF}.container.background-colour-black .image-wrap{background-color:#000000}.container.background-colour-grey-extra-light .image-wrap{background-color:#D7D7D7}.container.background-colour-grey-light .image-wrap{background-color:#E8E8E8}.container.background-colour-grey-medium .image-wrap{background-color:#8A8A8A}.container.background-colour-grey-dark .image-wrap{background-color:#4A4A4A}.container.text-align-center{text-align:center}.container.text-align-right{text-align:right}.container a{text-decoration:none}.container h3.full-name{font-size:font-size-medium();margin:0}.container div.job-title{font-size:font-size-small();margin:0}.container .sleeve{margin-bottom:10px}.container .sleeve.border-width-1.border-colour-primary{border:5px solid #2C089B}.container .sleeve.border-width-2.border-colour-primary{border:10px solid #2C089B}.container .sleeve.border-width-3.border-colour-primary{border:15px solid #2C089B}.container .sleeve.border-width-4.border-colour-primary{border:30px solid #2C089B}.container .sleeve.border-width-5.border-colour-primary{border:45px solid #2C089B}.container .sleeve.border-width-6.border-colour-primary{border:60px solid #2C089B}.container .sleeve.border-width-1.border-colour-secondary{border:5px solid #2AF135}.container .sleeve.border-width-2.border-colour-secondary{border:10px solid #2AF135}.container .sleeve.border-width-3.border-colour-secondary{border:15px solid #2AF135}.container .sleeve.border-width-4.border-colour-secondary{border:30px solid #2AF135}.container .sleeve.border-width-5.border-colour-secondary{border:45px solid #2AF135}.container .sleeve.border-width-6.border-colour-secondary{border:60px solid #2AF135}.container .sleeve.border-width-1.border-colour-tertiary{border:5px solid #FF7272}.container .sleeve.border-width-2.border-colour-tertiary{border:10px solid #FF7272}.container .sleeve.border-width-3.border-colour-tertiary{border:15px solid #FF7272}.container .sleeve.border-width-4.border-colour-tertiary{border:30px solid #FF7272}.container .sleeve.border-width-5.border-colour-tertiary{border:45px solid #FF7272}.container .sleeve.border-width-6.border-colour-tertiary{border:60px solid #FF7272}.container .sleeve.border-width-1.border-colour-brand-1{border:5px solid #B30510}.container .sleeve.border-width-2.border-colour-brand-1{border:10px solid #B30510}.container .sleeve.border-width-3.border-colour-brand-1{border:15px solid #B30510}.container .sleeve.border-width-4.border-colour-brand-1{border:30px solid #B30510}.container .sleeve.border-width-5.border-colour-brand-1{border:45px solid #B30510}.container .sleeve.border-width-6.border-colour-brand-1{border:60px solid #B30510}.container .sleeve.border-width-1.border-colour-brand-2{border:5px solid #6E0887}.container .sleeve.border-width-2.border-colour-brand-2{border:10px solid #6E0887}.container .sleeve.border-width-3.border-colour-brand-2{border:15px solid #6E0887}.container .sleeve.border-width-4.border-colour-brand-2{border:30px solid #6E0887}.container .sleeve.border-width-5.border-colour-brand-2{border:45px solid #6E0887}.container .sleeve.border-width-6.border-colour-brand-2{border:60px solid #6E0887}.container .sleeve.border-width-1.border-colour-brand-3{border:5px solid #50B400}.container .sleeve.border-width-2.border-colour-brand-3{border:10px solid #50B400}.container .sleeve.border-width-3.border-colour-brand-3{border:15px solid #50B400}.container .sleeve.border-width-4.border-colour-brand-3{border:30px solid #50B400}.container .sleeve.border-width-5.border-colour-brand-3{border:45px solid #50B400}.container .sleeve.border-width-6.border-colour-brand-3{border:60px solid #50B400}.container .sleeve.border-width-1.border-colour-brand-4{border:5px solid #FFE500}.container .sleeve.border-width-2.border-colour-brand-4{border:10px solid #FFE500}.container .sleeve.border-width-3.border-colour-brand-4{border:15px solid #FFE500}.container .sleeve.border-width-4.border-colour-brand-4{border:30px solid #FFE500}.container .sleeve.border-width-5.border-colour-brand-4{border:45px solid #FFE500}.container .sleeve.border-width-6.border-colour-brand-4{border:60px solid #FFE500}.container .sleeve.border-width-1.border-colour-brand-5{border:5px solid #F07D00}.container .sleeve.border-width-2.border-colour-brand-5{border:10px solid #F07D00}.container .sleeve.border-width-3.border-colour-brand-5{border:15px solid #F07D00}.container .sleeve.border-width-4.border-colour-brand-5{border:30px solid #F07D00}.container .sleeve.border-width-5.border-colour-brand-5{border:45px solid #F07D00}.container .sleeve.border-width-6.border-colour-brand-5{border:60px solid #F07D00}.container .sleeve.border-width-1.border-colour-brand-6{border:5px solid #62CFC9}.container .sleeve.border-width-2.border-colour-brand-6{border:10px solid #62CFC9}.container .sleeve.border-width-3.border-colour-brand-6{border:15px solid #62CFC9}.container .sleeve.border-width-4.border-colour-brand-6{border:30px solid #62CFC9}.container .sleeve.border-width-5.border-colour-brand-6{border:45px solid #62CFC9}.container .sleeve.border-width-6.border-colour-brand-6{border:60px solid #62CFC9}.container .sleeve.border-width-1.border-colour-white{border:5px solid #FFFFFF}.container .sleeve.border-width-2.border-colour-white{border:10px solid #FFFFFF}.container .sleeve.border-width-3.border-colour-white{border:15px solid #FFFFFF}.container .sleeve.border-width-4.border-colour-white{border:30px solid #FFFFFF}.container .sleeve.border-width-5.border-colour-white{border:45px solid #FFFFFF}.container .sleeve.border-width-6.border-colour-white{border:60px solid #FFFFFF}.container .sleeve.border-width-1.border-colour-black{border:5px solid #000000}.container .sleeve.border-width-2.border-colour-black{border:10px solid #000000}.container .sleeve.border-width-3.border-colour-black{border:15px solid #000000}.container .sleeve.border-width-4.border-colour-black{border:30px solid #000000}.container .sleeve.border-width-5.border-colour-black{border:45px solid #000000}.container .sleeve.border-width-6.border-colour-black{border:60px solid #000000}.container .sleeve.border-width-1.border-colour-grey-extra-light{border:5px solid #D7D7D7}.container .sleeve.border-width-2.border-colour-grey-extra-light{border:10px solid #D7D7D7}.container .sleeve.border-width-3.border-colour-grey-extra-light{border:15px solid #D7D7D7}.container .sleeve.border-width-4.border-colour-grey-extra-light{border:30px solid #D7D7D7}.container .sleeve.border-width-5.border-colour-grey-extra-light{border:45px solid #D7D7D7}.container .sleeve.border-width-6.border-colour-grey-extra-light{border:60px solid #D7D7D7}.container .sleeve.border-width-1.border-colour-grey-light{border:5px solid #E8E8E8}.container .sleeve.border-width-2.border-colour-grey-light{border:10px solid #E8E8E8}.container .sleeve.border-width-3.border-colour-grey-light{border:15px solid #E8E8E8}.container .sleeve.border-width-4.border-colour-grey-light{border:30px solid #E8E8E8}.container .sleeve.border-width-5.border-colour-grey-light{border:45px solid #E8E8E8}.container .sleeve.border-width-6.border-colour-grey-light{border:60px solid #E8E8E8}.container .sleeve.border-width-1.border-colour-grey-medium{border:5px solid #8A8A8A}.container .sleeve.border-width-2.border-colour-grey-medium{border:10px solid #8A8A8A}.container .sleeve.border-width-3.border-colour-grey-medium{border:15px solid #8A8A8A}.container .sleeve.border-width-4.border-colour-grey-medium{border:30px solid #8A8A8A}.container .sleeve.border-width-5.border-colour-grey-medium{border:45px solid #8A8A8A}.container .sleeve.border-width-6.border-colour-grey-medium{border:60px solid #8A8A8A}.container .sleeve.border-width-1.border-colour-grey-dark{border:5px solid #4A4A4A}.container .sleeve.border-width-2.border-colour-grey-dark{border:10px solid #4A4A4A}.container .sleeve.border-width-3.border-colour-grey-dark{border:15px solid #4A4A4A}.container .sleeve.border-width-4.border-colour-grey-dark{border:30px solid #4A4A4A}.container .sleeve.border-width-5.border-colour-grey-dark{border:45px solid #4A4A4A}.container .sleeve.border-width-6.border-colour-grey-dark{border:60px solid #4A4A4A}.container .sleeve.circle-true{overflow:hidden;border-radius:50%}.container .sleeve .image-wrap{position:relative;background-position:center center;background-size:cover;background-repeat:no-repeat}.container .sleeve .image-wrap.image-style-cover{background-size:cover}.container .sleeve .image-wrap.image-style-contain{background-size:contain}.container .sleeve .image-wrap[data-ratio=\"1,1\"]{padding-bottom:100%}.container .sleeve .image-wrap[data-ratio=\"1,1\"].border-width-1{padding-bottom:calc(100% - 10px)}.container .sleeve .image-wrap[data-ratio=\"1,1\"].border-width-2{padding-bottom:calc(100% - 20px)}.container .sleeve .image-wrap[data-ratio=\"1,1\"].border-width-3{padding-bottom:calc(100% - 30px)}.container .sleeve .image-wrap[data-ratio=\"1,1\"].border-width-4{padding-bottom:calc(100% - 60px)}.container .sleeve .image-wrap[data-ratio=\"1,1\"].border-width-5{padding-bottom:calc(100% - 90px)}.container .sleeve .image-wrap[data-ratio=\"1,1\"].border-width-6{padding-bottom:calc(100% - 120px)}.container .sleeve .image-wrap[data-ratio=\"1,1.5\"]{padding-bottom:150%}.container .sleeve .image-wrap[data-ratio=\"1,1.5\"].border-width-1{padding-bottom:calc(150% - 10px)}.container .sleeve .image-wrap[data-ratio=\"1,1.5\"].border-width-2{padding-bottom:calc(150% - 20px)}.container .sleeve .image-wrap[data-ratio=\"1,1.5\"].border-width-3{padding-bottom:calc(150% - 30px)}.container .sleeve .image-wrap[data-ratio=\"1,1.5\"].border-width-4{padding-bottom:calc(150% - 60px)}.container .sleeve .image-wrap[data-ratio=\"1,1.5\"].border-width-5{padding-bottom:calc(150% - 90px)}.container .sleeve .image-wrap[data-ratio=\"1,1.5\"].border-width-6{padding-bottom:calc(150% - 120px)}.container .sleeve .image-wrap[data-ratio=\"1,2\"]{padding-bottom:200%}.container .sleeve .image-wrap[data-ratio=\"1,2\"].border-width-1{padding-bottom:calc(200% - 10px)}.container .sleeve .image-wrap[data-ratio=\"1,2\"].border-width-2{padding-bottom:calc(200% - 20px)}.container .sleeve .image-wrap[data-ratio=\"1,2\"].border-width-3{padding-bottom:calc(200% - 30px)}.container .sleeve .image-wrap[data-ratio=\"1,2\"].border-width-4{padding-bottom:calc(200% - 60px)}.container .sleeve .image-wrap[data-ratio=\"1,2\"].border-width-5{padding-bottom:calc(200% - 90px)}.container .sleeve .image-wrap[data-ratio=\"1,2\"].border-width-6{padding-bottom:calc(200% - 120px)}.container .sleeve .image-wrap.rounded-true{overflow:hidden;border-radius:10px}.container .sleeve .image-wrap .circle{position:absolute;width:30px;height:30px;background-color:#FFFFFF;bottom:15px;right:15px;border-radius:50%;text-align:center;padding:6.5px;box-sizing:border-box}.container .sleeve .image-wrap .circle svg{height:15px;width:15px}.container .sleeve .image-wrap img{display:none}";
 
 const BiggiveBiographyCard$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {
@@ -8,19 +8,56 @@ const BiggiveBiographyCard$1 = /*@__PURE__*/ proxyCustomElement(class extends HT
     this.__registerHost();
     this.__attachShadow();
     this.spaceBelow = 0;
+    this.borderWidth = 0;
     this.imageUrl = '';
+    this.imageStyle = 'cover';
+    this.textColour = 'black';
+    this.backgroundColour = 'white';
     this.fullName = '';
     this.jobTitle = '';
+    this.textAlign = 'left';
+    this.ratio = '1,1.5';
+    this.circle = false;
+    this.rounded = false;
+    this.url = '';
   }
   render() {
-    return (h("div", { class: 'container space-below-' + this.spaceBelow }, this.imageUrl != '' ? (h("div", { class: "image-wrap", style: { 'background-image': "url('" + this.imageUrl + "')" } }, h("img", { src: this.imageUrl, alt: this.fullName, title: this.fullName }))) : null, h("h3", { class: "full-name" }, this.fullName), h("div", { class: "job-title" }, this.jobTitle)));
+    if (this.url != '') {
+      return (h("div", { class: 'container space-below-' + this.spaceBelow + ' text-colour-' + this.textColour + ' text-align-' + this.textAlign }, h("a", { href: this.url }, h("div", { class: 'sleeve circle-' +
+          this.circle.toString() +
+          ' border-colour-' +
+          this.backgroundColour +
+          ' background-colour-' +
+          this.backgroundColour +
+          ' border-width-' +
+          this.borderWidth }, this.imageUrl != '' ? (h("div", { "data-ratio": this.ratio, class: 'image-wrap image-style-' + this.imageStyle + ' rounded-' + this.rounded.toString(), style: { 'background-image': "url('" + this.imageUrl + "')" } }, h("img", { src: this.imageUrl, alt: this.fullName, title: this.fullName }), h("div", { class: "circle" }, h("svg", { width: "24", height: "24", viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M11 11v-11h1v11h11v1h-11v11h-1v-11h-11v-1h11z" }))))) : null), h("h3", { class: "full-name" }, this.fullName), h("div", { class: "job-title" }, this.jobTitle))));
+    }
+    else {
+      return (h("div", { class: 'container space-below-' + this.spaceBelow + ' text-colour-' + this.textColour + ' text-align-' + this.textAlign }, h("div", { class: 'sleeve circle-' +
+          this.circle.toString() +
+          ' border-colour-' +
+          this.backgroundColour +
+          ' background-colour-' +
+          this.backgroundColour +
+          ' border-width-' +
+          this.borderWidth }, this.imageUrl != '' ? (h("div", { "data-ratio": this.ratio, class: 'image-wrap image-style-' + this.imageStyle + ' rounded-' + this.rounded.toString(), style: { 'background-image': "url('" + this.imageUrl + "')" } }, h("img", { src: this.imageUrl, alt: this.fullName, title: this.fullName }))) : null), h("h3", { class: "full-name" }, this.fullName), h("div", { class: "job-title" }, this.jobTitle)));
+    }
   }
   static get style() { return biggiveBiographyCardCss; }
 }, [1, "biggive-biography-card", {
     "spaceBelow": [2, "space-below"],
+    "borderWidth": [2, "border-width"],
     "imageUrl": [1, "image-url"],
+    "imageStyle": [1, "image-style"],
+    "textColour": [1, "text-colour"],
+    "backgroundColour": [1, "background-colour"],
     "fullName": [1, "full-name"],
-    "jobTitle": [1, "job-title"]
+    "jobTitle": [1, "job-title"],
+    "textAlign": [1, "text-align"],
+    "ratio": [1],
+    "circle": [4],
+    "rounded": [4],
+    "url": [1]
   }]);
 function defineCustomElement$1() {
   if (typeof customElements === "undefined") {

package/dist/components/biggive-boxed-content.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 
-const biggiveBoxedContentCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#CBC8C8}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}:host{display:content}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}";
+const biggiveBoxedContentCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.background-colour-hover-primary:hover,.background-colour-primary{background-color:#2C089B}.background-colour-hover-secondary:hover,.background-colour-secondary{background-color:#2AF135}.background-colour-hover-tertiary:hover,.background-colour-tertiary{background-color:#FF7272}.background-colour-hover-brand-1:hover,.background-colour-brand-1{background-color:#B30510}.background-colour-hover-brand-2:hover,.background-colour-brand-2{background-color:#6E0887}.background-colour-hover-brand-3:hover,.background-colour-brand-3{background-color:#50B400}.background-colour-hover-brand-4:hover,.background-colour-brand-4{background-color:#FFE500}.background-colour-hover-brand-5:hover,.background-colour-brand-5{background-color:#F07D00}.background-colour-hover-brand-6:hover,.background-colour-brand-6{background-color:#62CFC9}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-black:hover,.background-colour-black{background-color:#000000}.background-colour-hover-white:hover,.background-colour-white{background-color:#FFFFFF}.background-colour-hover-grey-extra-light:hover,.background-colour-grey-extra-light{background-color:#D7D7D7}.background-colour-hover-grey-light:hover,.background-colour-grey-light{background-color:#E8E8E8}.background-colour-hover-grey-medium:hover,.background-colour-grey-medium{background-color:#8A8A8A}.background-colour-hover-grey-dark:hover,.background-colour-grey-dark{background-color:#4A4A4A}:host{display:content}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px}.horizontal-padding-1{padding-left:5px;padding-right:5px}.horizontal-padding-2{padding-left:10px;padding-right:10px}.horizontal-padding-3{padding-left:15px;padding-right:15px}.horizontal-padding-4{padding-left:30px;padding-right:30px}.horizontal-padding-5{padding-left:45px;padding-right:45px}.horizontal-padding-6{padding-left:60px;padding-right:60px}.vertical-padding-1{padding-top:5px;padding-bottom:5px}.vertical-padding-2{padding-top:10px;padding-bottom:10px}.vertical-padding-3{padding-top:15px;padding-bottom:15px}.vertical-padding-4{padding-top:30px;padding-bottom:30px}.vertical-padding-5{padding-top:45px;padding-bottom:45px}.vertical-padding-6{padding-top:60px;padding-bottom:60px}";
 
 const BiggiveBoxedContent$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {

package/dist/components/biggive-button2.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 
-const biggiveButtonCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px}.container a{display:inline-block}.container a.full-width-true{display:block}.container.centered-true{text-align:center}.button{font-size:17px;line-height:24px;padding:10px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button.size-small{font-size:13px;line-height:17px;padding:5px 15px}.button.button.rounded-true{border-radius:27.5px}.button.button.rounded-true.size-small{border-radius:20px}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#000000;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF;border-color:#000000}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-brand-1{color:#FFFFFF;background-color:#B30510;border-color:#B30510}.button-brand-1:hover{background-color:#FFFFFF}.button-brand-2{color:#FFFFFF;background-color:#6E0887;border-color:#6E0887}.button-brand-2:hover{background-color:#FFFFFF}.button-brand-3{color:#FFFFFF;background-color:#50B400;border-color:#50B400}.button-brand-3:hover{background-color:#FFFFFF}.button-brand-4{color:#FFFFFF;background-color:#FFE500;border-color:#FFE500}.button-brand-4:hover{background-color:#000000}.button-brand-mhf-turquoise{color:#FFFFFF;background-color:#62CFC9;border-color:#62CFC9}.button-brand-mhf-turquoise:hover{background-color:#000000}.button-brand-5{color:#FFFFFF;background-color:#F07D00;border-color:#F07D00}.button-brand-5:hover{background-color:#FFFFFF}.button-brand-6{color:#FFFFFF;background-color:#CBC8C8;border-color:#CBC8C8}.button-brand-6:hover{background-color:#000000}.button-white{color:#2C089B;background-color:#FFFFFF;border-color:#FFFFFF}.button-white:hover{color:#000000;background-color:#2AF135}.button-black{color:#FFFFFF;background-color:#000000;border-color:#000000}.button-black:hover{color:#000000;background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-brand-1{color:#B30510;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-1:hover{text-decoration:none;background-color:transparent}.button-clear-brand-2{color:#6E0887;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-2:hover{text-decoration:none;background-color:transparent}.button-clear-brand-3{color:#50B400;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-3:hover{text-decoration:none;background-color:transparent}.button-clear-brand-4{color:#FFE500;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-4:hover{text-decoration:none;background-color:transparent}.button-clear-brand-5{color:#F07D00;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-5:hover{text-decoration:none;background-color:transparent}.button-clear-brand-6{color:#CBC8C8;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-6:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-rounded{border-radius:27.5px}.button-rounded.size-small{border-radius:20px}";
+const biggiveButtonCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px}.container a{display:inline-block}.container a.full-width-true{display:block}.container.centered-true{text-align:center}.button{font-size:17px;line-height:24px;padding:10px 30px;border-radius:5px;border:1px solid #000000;background-color:#000000;color:#FFFFFF;display:inline-block;text-decoration:none;text-align:center;transition:all ease-in-out 0.5s;cursor:pointer}.button:hover{background-color:#FFFFFF;color:#000000}.button.size-small{font-size:13px;line-height:17px;padding:5px 15px}.button.button.rounded-true{border-radius:27.5px}.button.button.rounded-true.size-small{border-radius:20px}.button-primary{color:#FFFFFF;background-color:#2C089B;border-color:#2C089B}.button-primary:hover{color:#2C089B;background-color:#FFFFFF}.button-secondary{color:#000000;background-color:#2AF135;border-color:#2AF135}.button-secondary:hover{background-color:#FFFFFF;border-color:#000000}.button-tertiary{color:#FFFFFF;background-color:#FF7272;border-color:#FF7272}.button-tertiary:hover{background-color:#FFFFFF}.button-brand-1{color:#FFFFFF;background-color:#B30510;border-color:#B30510}.button-brand-1:hover{background-color:#FFFFFF}.button-brand-2{color:#FFFFFF;background-color:#6E0887;border-color:#6E0887}.button-brand-2:hover{background-color:#FFFFFF}.button-brand-3{color:#FFFFFF;background-color:#50B400;border-color:#50B400}.button-brand-3:hover{background-color:#FFFFFF}.button-brand-4{color:#FFFFFF;background-color:#FFE500;border-color:#FFE500}.button-brand-4:hover{background-color:#000000}.button-brand-mhf-turquoise{color:#FFFFFF;background-color:#62CFC9;border-color:#62CFC9}.button-brand-mhf-turquoise:hover{background-color:#000000}.button-brand-5{color:#FFFFFF;background-color:#F07D00;border-color:#F07D00}.button-brand-5:hover{background-color:#FFFFFF}.button-brand-6{color:#FFFFFF;background-color:#CBC8C8;border-color:#CBC8C8}.button-brand-6:hover{background-color:#000000}.button-white{color:#2C089B;background-color:#FFFFFF;border-color:#FFFFFF}.button-white:hover{color:#000000;background-color:#2AF135}.button-black{color:#FFFFFF;background-color:#000000;border-color:#000000}.button-black:hover{color:#000000;background-color:#FFFFFF}.button-grey-extra-light{color:#000000;background-color:#D7D7D7;border-color:#D7D7D7}.button-grey-extra-light:hover{color:#D7D7D7;background-color:#000000}.button-grey-light{color:#000000;background-color:#E8E8E8;border-color:#E8E8E8}.button-grey-light:hover{color:#E8E8E8;background-color:#000000}.button-grey-medium{color:#FFFFFF;background-color:#8A8A8A;border-color:#8A8A8A}.button-grey-medium:hover{color:#8A8A8A;background-color:#FFFFFF}.button-grey-dark{color:#FFFFFF;background-color:#4A4A4A;border-color:#4A4A4A}.button-grey-dark:hover{color:#4A4A4A;background-color:#FFFFFF}.button-clear-primary{color:#2C089B;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-primary:hover{text-decoration:none;background-color:transparent}.button-clear-secondary{color:#2AF135;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-secondary:hover{text-decoration:none;background-color:transparent}.button-clear-tertiary{color:#FF7272;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-tertiary:hover{text-decoration:none;background-color:transparent}.button-clear-brand-1{color:#B30510;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-1:hover{text-decoration:none;background-color:transparent}.button-clear-brand-2{color:#6E0887;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-2:hover{text-decoration:none;background-color:transparent}.button-clear-brand-3{color:#50B400;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-3:hover{text-decoration:none;background-color:transparent}.button-clear-brand-4{color:#FFE500;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-4:hover{text-decoration:none;background-color:transparent}.button-clear-brand-5{color:#F07D00;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-5:hover{text-decoration:none;background-color:transparent}.button-clear-brand-6{color:#CBC8C8;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-brand-6:hover{text-decoration:none;background-color:transparent}.button-clear-white{color:#FFFFFF;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-white:hover{color:#FFFFFF;text-decoration:none;background-color:transparent}.button-clear-black{color:#000000;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-black:hover{color:#000000;text-decoration:none;background-color:transparent}.button-clear-grey-extra-light{color:#D7D7D7;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-grey-extra-light:hover{color:#D7D7D7;text-decoration:none;background-color:transparent}.button-clear-grey-light{color:#E8E8E8;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-grey-light:hover{color:#E8E8E8;text-decoration:none;background-color:transparent}.button-clear-grey-medium{color:#8A8A8A;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-grey-medium:hover{color:#8A8A8A;text-decoration:none;background-color:transparent}.button-clear-grey-dark{color:#4A4A4A;background-color:transparent;text-decoration:underline;border:0;padding-left:0;padding-right:0}.button-clear-grey-dark:hover{color:#4A4A4A;text-decoration:none;background-color:transparent}.button-rounded{border-radius:27.5px}.button-rounded.size-small{border-radius:20px}";
 
 const BiggiveButton = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
   constructor() {

package/dist/components/biggive-carousel.js

@@ -1,86 +1,4 @@
-import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
-
-const biggiveCarouselCss = "a{color:inherit;text-decoration:underline}a:hover{text-decoration:none}.space-above-0{margin-top:0}.space-above-1{margin-top:5px}.space-above-2{margin-top:10px}.space-above-3{margin-top:15px}.space-above-4{margin-top:30px}.space-above-5{margin-top:45px}.space-above-6{margin-top:60px}.space-below-0{margin-bottom:0}.space-below-1{margin-bottom:5px}.space-below-2{margin-bottom:10px}.space-below-3{margin-bottom:15px}.space-below-4{margin-bottom:30px}.space-below-5{margin-bottom:45px}.space-below-6{margin-bottom:60px}.text-colour-hover-primary:hover,.text-colour-primary{color:#2C089B}.text-colour-hover-secondary:hover,.text-colour-secondary{color:#2AF135}.text-colour-hover-tertiary:hover,.text-colour-tertiary{color:#FF7272}.text-colour-hover-brand-1:hover,.text-colour-brand-1{color:#B30510}.text-colour-hover-brand-2:hover,.text-colour-brand-2{color:#6E0887}.text-colour-hover-brand-3:hover,.text-colour-brand-3{color:#50B400}.text-colour-hover-brand-4:hover,.text-colour-brand-4{color:#FFE500}.text-colour-hover-brand-5:hover,.text-colour-brand-5{color:#F07D00}.text-colour-hover-brand-6:hover,.text-colour-brand-6{color:#CBC8C8}.text-colour-hover-white:hover,.text-colour-white{color:#FFFFFF}.text-colour-hover-black:hover,.text-colour-black{color:#000000}.text-colour-hover-grey-extra-light:hover,.text-colour-grey-extra-light{color:#D7D7D7}.text-colour-hover-grey-light:hover,.text-colour-grey-light{color:#E8E8E8}.text-colour-hover-grey-medium:hover,.text-colour-grey-medium{color:#8A8A8A}.text-colour-hover-grey-dark:hover,.text-colour-grey-dark{color:#4A4A4A}:host{display:contents}.container{font-family:\"Euclid Triangle\", sans-serif;font-size:17px;line-height:24px;position:relative}.container .items{overflow:hidden}.container .items .sleeve{display:flex;flex-flow:row wrap}.container .navigation{padding:10px 0;text-align:right;display:flex;justify-content:end;position:relative;z-index:1}.container .navigation .button{margin-left:15px;display:block;width:30px;height:30px;padding:2.5px 10px;box-sizing:border-box;background-color:#FFFFFF;box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.25);border-radius:50%;cursor:pointer;text-align:center}.container .navigation .button.prev{left:0}.container .navigation .button.next{right:0}.container .navigation .button svg{width:10px;height:10px}.column-count-4 ::slotted(*){width:25%;display:flex;flex-direction:column}.column-count-3 ::slotted(*){width:33.3333333333%;display:flex;flex-direction:column}.column-count-2 ::slotted(*){width:50%;display:flex;flex-direction:column}@media screen and (max-width: 768px){.column-count-2 ::slotted(*),.column-count-3 ::slotted(*),.column-count-4 ::slotted(*){width:calc(50% - 15px)}}@media screen and (max-width: 576px){.column-count-2 ::slotted(*),.column-count-3 ::slotted(*),.column-count-4 ::slotted(*){width:100%}}";
-
-const BiggiveCarousel$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
-  constructor() {
-    super();
-    this.__registerHost();
-    this.__attachShadow();
-    this.currentTab = 0;
-    this.itemCount = 0;
-    this.itemWidthPx = 0;
-    this.spaceBelow = 4;
-    this.columnCount = 3;
-    this.buttonBackgroundColour = 'white';
-    this.buttonIconColour = 'primary';
-  }
-  componentDidRender() {
-    var _a;
-    this.sleeve = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.sleeve');
-    let children = Array.from(this.host.children);
-    this.itemCount = children.length;
-    if (children.length > 0) {
-      // Item widths are set in CSS so we know they will all be the same.
-      this.itemWidthPx = children[0].offsetWidth;
-      this.sleeve.style.width = this.itemWidthPx * children.length + 'px';
-      children.forEach(function (el) {
-        el.style.width = 'calc( 100% / ' + children.length + ' )';
-      });
-    }
-  }
-  /*
-   * Animates a transition to show the NEXT or PREVIOUS element in the carousel.
-   * Does nothing if there is no next or previous element.
-   */
-  showTab(direction) {
-    const newTab = this.currentTab + (direction === 'PREV' ? -1 : 1);
-    if (newTab < 0 || newTab > this.itemCount - 1) {
-      return;
-    }
-    const pos = 0 - this.itemWidthPx * newTab;
-    this.sleeve.style.transitionDuration = '0.3s';
-    this.sleeve.style.transitionTimingFunction = 'ease-out';
-    this.sleeve.style.transform = 'translate3d(' + pos + 'px, 0, 0)';
-    this.currentTab = newTab;
-  }
-  clickPrevHandler() {
-    this.showTab('PREV');
-  }
-  clickNextHandler() {
-    this.showTab('NEXT');
-  }
-  render() {
-    return (h("div", { class: 'container column-count-' +
-        this.columnCount +
-        ' space-below-' +
-        this.spaceBelow +
-        ' button-background-colour-' +
-        this.buttonBackgroundColour +
-        ' button-icon-colour-' +
-        this.buttonIconColour }, h("div", { class: "items" }, h("div", { class: "sleeve" }, h("slot", null))), h("div", { class: "navigation" }, h("div", { class: "button prev", onClick: () => this.clickPrevHandler(), title: "Previous" }, h("svg", { width: "9", height: "16", viewBox: "0 0 9 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M8.29311 14.5703L1.73926 8.01646L8.29311 1.46261", stroke: "#000000", "stroke-width": "2" }))), h("div", { class: "button next", onClick: () => this.clickNextHandler(), title: "Next" }, h("svg", { width: "9", height: "16", viewBox: "0 0 9 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.739117 1.46094L7.29297 8.01479L0.739118 14.5686", stroke: "#000000", "stroke-width": "2" }))))));
-  }
-  get host() { return this; }
-  static get style() { return biggiveCarouselCss; }
-}, [1, "biggive-carousel", {
-    "spaceBelow": [2, "space-below"],
-    "columnCount": [2, "column-count"],
-    "buttonBackgroundColour": [1, "button-background-colour"],
-    "buttonIconColour": [1, "button-icon-colour"]
-  }]);
-function defineCustomElement$1() {
-  if (typeof customElements === "undefined") {
-    return;
-  }
-  const components = ["biggive-carousel"];
-  components.forEach(tagName => { switch (tagName) {
-    case "biggive-carousel":
-      if (!customElements.get(tagName)) {
-        customElements.define(tagName, BiggiveCarousel$1);
-      }
-      break;
-  } });
-}
+import { B as BiggiveCarousel$1, d as defineCustomElement$1 } from './biggive-carousel2.js';
 
 const BiggiveCarousel = BiggiveCarousel$1;
 const defineCustomElement = defineCustomElement$1;