@uoguelph/web-components 1.1.3 → 1.2.0-rc.0

package/dist/collection/components/uofg-back-to-top/uofg-back-to-top.js

@@ -2,67 +2,70 @@ import { h } from "@stencil/core";
 import { FontAwesomeIcon } from "../../utils/font-awesome-icon";
 import { faChevronUp } from "@fortawesome/free-solid-svg-icons";
 export class UofgBackToTop {
-  constructor() {
-    this.threshold = 50;
-    this.isVisible = false;
-  }
-  connectedCallback() {
-    this.onScroll();
-  }
-  onScroll() {
-    this.isVisible = window.scrollY >= this.threshold;
-  }
-  render() {
-    return (h("button", { id: "uofg-back-to-top", "aria-label": "Go back to the top", class: { visible: this.isVisible }, onClick: () => {
-        window.scrollTo({ top: 0, behavior: 'smooth' });
-      } }, h(FontAwesomeIcon, { icon: faChevronUp })));
-  }
-  static get is() { return "uofg-back-to-top"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["uofg-back-to-top.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["uofg-back-to-top.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "threshold": {
-        "type": "number",
-        "mutable": false,
-        "complexType": {
-          "original": "number",
-          "resolved": "number",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The number of pixels the user has to scroll down before the button appears."
-        },
-        "attribute": "threshold",
-        "reflect": false,
-        "defaultValue": "50"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "isVisible": {}
-    };
-  }
-  static get listeners() {
-    return [{
-        "name": "scroll",
-        "method": "onScroll",
-        "target": "window",
-        "capture": false,
-        "passive": true
-      }];
-  }
+    constructor() {
+        this.threshold = 50;
+        this.isVisible = false;
+    }
+    connectedCallback() {
+        this.onScroll();
+    }
+    onScroll() {
+        this.isVisible = window.scrollY >= this.threshold;
+    }
+    render() {
+        return (h("button", { key: '5224240c1039f7484aca93cc6e7014d9cfb06702', "aria-label": "Go back to the top", class: {
+                'tw-opacity-100': this.isVisible,
+                'tw-fixed tw-bottom-0 tw-right-0 tw-z-[1000] tw-m-4 tw-flex tw-h-[3.5rem] tw-w-[3.5rem] tw-cursor-pointer tw-items-center tw-justify-center tw-rounded-[50%] tw-border tw-border-solid tw-border-white tw-bg-black tw-text-white tw-opacity-0 tw-transition hocus:tw-bg-uofg-red [&>svg]:tw-h-[1em] [&>svg]:tw-fill-current': true,
+            }, onClick: () => {
+                window.scrollTo({ top: 0, behavior: 'smooth' });
+            } }, h(FontAwesomeIcon, { key: '5674c3ab4da096c466e75aeaf446c8335a569ffd', icon: faChevronUp })));
+    }
+    static get is() { return "uofg-back-to-top"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["uofg-back-to-top.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["uofg-back-to-top.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "threshold": {
+                "type": "number",
+                "mutable": false,
+                "complexType": {
+                    "original": "number",
+                    "resolved": "number",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The number of pixels the user has to scroll down before the button appears."
+                },
+                "attribute": "threshold",
+                "reflect": false,
+                "defaultValue": "50"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "isVisible": {}
+        };
+    }
+    static get listeners() {
+        return [{
+                "name": "scroll",
+                "method": "onScroll",
+                "target": "window",
+                "capture": false,
+                "passive": true
+            }];
+    }
 }

package/dist/collection/components/uofg-card/uofg-card.css

@@ -1,95 +1 @@
-* {
-  box-sizing: border-box;
-}
-
-button {
-  border: none;
-  background-color: transparent;
-  cursor: pointer;
-}
-
-a {
-  color: inherit;
-  text-decoration: none;
-}
-
-ul {
-  list-style: none;
-  padding: 0;
-  margin: unset;
-}
-ul > li {
-  display: contents;
-}
-
-:focus-visible {
-  outline: 2px solid #ffc72a;
-  outline-offset: 0.5rem;
-}
-
-:host {
-  display: block;
-  width: 300px;
-  margin: 1rem;
-}
-
-#uofg-card {
-  display: flex;
-  flex-direction: column;
-  background-color: #f1f8fa;
-  font-size: 1.6rem;
-  border-radius: 5px;
-  overflow: hidden;
-}
-
-a#uofg-card {
-  border: 1px solid transparent;
-  transition-property: border-color;
-  transition-duration: 0.2s;
-  transition-timing-function: ease-in-out;
-}
-a#uofg-card:hover, a#uofg-card:focus, a#uofg-card:focus-within {
-  border-color: #69a3b9;
-}
-
-#uofg-card-img {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  overflow: hidden;
-}
-#uofg-card-img > slot::slotted(img) {
-  width: 100%;
-  object-fit: cover;
-  transition-property: transform;
-  transition-duration: 0.2s;
-  transition-timing-function: ease-in-out;
-}
-a#uofg-card:hover #uofg-card-img > slot::slotted(img), a#uofg-card:focus #uofg-card-img > slot::slotted(img), a#uofg-card:focus-within #uofg-card-img > slot::slotted(img) {
-  transform: scale(1.1);
-}
-
-#uofg-card-content {
-  padding: 1rem;
-}
-#uofg-card-content > slot[name=title]::slotted(*) {
-  font-size: 2.25rem;
-  font-weight: normal;
-  margin: 0;
-  padding: 1rem 0;
-}
-#uofg-card-content > slot[name=subtitle]::slotted(*) {
-  font-size: 1.8rem;
-  font-weight: normal;
-  margin: 0;
-  padding: 1rem 0;
-}
-#uofg-card-content > slot[name=body]::slotted(*) {
-  font-size: 1.6rem;
-  font-weight: normal;
-  margin: 0;
-}
-
-#uofg-card-footer {
-  background-color: #bedae3;
-}
+  :host {    display: block;    width: 300px;    margin: 1rem;  }  * {    box-sizing: border-box;  }  a {    text-decoration: none;    color: inherit;  }  button {    border: none;    background: none;    cursor: pointer;    font-size: inherit;    font-family: inherit;    color: inherit;    line-height: inherit;    word-spacing: inherit;    letter-spacing: inherit;  }  ul {    list-style: none;    padding: 0;    margin: 0;  }@defaults border-spacing {    --tw-border-spacing-x: 0;    --tw-border-spacing-y: 0;}@defaults transform {    --tw-translate-x: 0;    --tw-translate-y: 0;    --tw-rotate: 0;    --tw-skew-x: 0;    --tw-skew-y: 0;    --tw-scale-x: 1;    --tw-scale-y: 1;}@defaults touch-action {    --tw-pan-x:  ;    --tw-pan-y:  ;    --tw-pinch-zoom:  ;}@defaults scroll-snap-type {    --tw-scroll-snap-strictness: proximity;}@defaults gradient-color-stops {    --tw-gradient-from-position:  ;    --tw-gradient-via-position:  ;    --tw-gradient-to-position:  ;}@defaults font-variant-numeric {    --tw-ordinal:  ;    --tw-slashed-zero:  ;    --tw-numeric-figure:  ;    --tw-numeric-spacing:  ;    --tw-numeric-fraction:  ;}@defaults box-shadow {    --tw-ring-offset-shadow: 0 0 #0000;    --tw-ring-shadow: 0 0 #0000;    --tw-shadow: 0 0 #0000;    --tw-shadow-colored: 0 0 #0000;}@defaults ring-width {    --tw-ring-inset:  ;    --tw-ring-offset-width: 0px;    --tw-ring-offset-color: #fff;    --tw-ring-color: rgb(59 130 246 / 0.5);    --tw-ring-offset-shadow: 0 0 #0000;    --tw-ring-shadow: 0 0 #0000;    --tw-shadow: 0 0 #0000;    --tw-shadow-colored: 0 0 #0000;}@defaults filter {    --tw-blur:  ;    --tw-brightness:  ;    --tw-contrast:  ;    --tw-grayscale:  ;    --tw-hue-rotate:  ;    --tw-invert:  ;    --tw-saturate:  ;    --tw-sepia:  ;    --tw-drop-shadow:  ;}@defaults backdrop-filter {    --tw-backdrop-blur:  ;    --tw-backdrop-brightness:  ;    --tw-backdrop-contrast:  ;    --tw-backdrop-grayscale:  ;    --tw-backdrop-hue-rotate:  ;    --tw-backdrop-invert:  ;    --tw-backdrop-opacity:  ;    --tw-backdrop-saturate:  ;    --tw-backdrop-sepia:  ;}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x:;--tw-pan-y:;--tw-pinch-zoom:;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position:;--tw-gradient-via-position:;--tw-gradient-to-position:;--tw-ordinal:;--tw-slashed-zero:;--tw-numeric-figure:;--tw-numeric-spacing:;--tw-numeric-fraction:;--tw-ring-inset:;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur:;--tw-brightness:;--tw-contrast:;--tw-grayscale:;--tw-hue-rotate:;--tw-invert:;--tw-saturate:;--tw-sepia:;--tw-drop-shadow:;--tw-backdrop-blur:;--tw-backdrop-brightness:;--tw-backdrop-contrast:;--tw-backdrop-grayscale:;--tw-backdrop-hue-rotate:;--tw-backdrop-invert:;--tw-backdrop-opacity:;--tw-backdrop-saturate:;--tw-backdrop-sepia:}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x:;--tw-pan-y:;--tw-pinch-zoom:;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position:;--tw-gradient-via-position:;--tw-gradient-to-position:;--tw-ordinal:;--tw-slashed-zero:;--tw-numeric-figure:;--tw-numeric-spacing:;--tw-numeric-fraction:;--tw-ring-inset:;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur:;--tw-brightness:;--tw-contrast:;--tw-grayscale:;--tw-hue-rotate:;--tw-invert:;--tw-saturate:;--tw-sepia:;--tw-drop-shadow:;--tw-backdrop-blur:;--tw-backdrop-brightness:;--tw-backdrop-contrast:;--tw-backdrop-grayscale:;--tw-backdrop-hue-rotate:;--tw-backdrop-invert:;--tw-backdrop-opacity:;--tw-backdrop-saturate:;--tw-backdrop-sepia:}.tw-flex{display:flex!important}.tw-flex-col{flex-direction:column!important}.tw-items-center{align-items:center!important}.tw-justify-center{justify-content:center!important}.tw-overflow-hidden{overflow:hidden!important}.tw-rounded{border-radius:.25rem!important}.tw-border{border-width:1px!important}.tw-border-solid{border-style:solid!important}.tw-border-transparent{border-color:transparent!important}.tw-bg-uofg-blue-200{--tw-bg-opacity:1!important;background-color:rgb(190 218 227/var(--tw-bg-opacity))!important}.tw-bg-uofg-blue-50{--tw-bg-opacity:1!important;background-color:rgb(241 248 250/var(--tw-bg-opacity))!important}.tw-p-4{padding:1rem!important}.tw-px-4{padding-left:1rem!important;padding-right:1rem!important}.tw-py-2{padding-bottom:.5rem!important;padding-top:.5rem!important}.tw-text-2xl{font-size:1.5rem!important;line-height:2rem!important}.tw-transition-colors{transition-duration:.15s!important;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.focus-within\:tw-border-uofg-blue-400:focus-within{--tw-border-opacity:1!important;border-color:rgb(105 163 185/var(--tw-border-opacity))!important}.hocus\:tw-border-uofg-blue-400:focus,.hocus\:tw-border-uofg-blue-400:hover{--tw-border-opacity:1!important;border-color:rgb(105 163 185/var(--tw-border-opacity))!important}.\[\&\>div\>slot\:\:slotted\(img\)\]\:hocus\:tw-scale-110:hover>div>slot::slotted(img){--tw-scale-x:1.1!important;--tw-scale-y:1.1!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.\[\&\>div\>slot\:\:slotted\(img\)\]\:hocus\:tw-transform:hover>div>slot::slotted(img){transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.\[\&\>div\>slot\:\:slotted\(img\)\]\:hocus\:tw-transition-transform:hover>div>slot::slotted(img){transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.\[\&\>div\>slot\:\:slotted\(img\)\]\:hocus\:tw-scale-110:focus>div>slot::slotted(img){--tw-scale-x:1.1!important;--tw-scale-y:1.1!important;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.\[\&\>div\>slot\:\:slotted\(img\)\]\:hocus\:tw-transform:focus>div>slot::slotted(img){transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))!important}.\[\&\>div\>slot\:\:slotted\(img\)\]\:hocus\:tw-transition-transform:focus>div>slot::slotted(img){transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.\[\&\>slot\:\:slotted\(img\)\]\:tw-w-full>slot::slotted(img){width:100%!important}.\[\&\>slot\:\:slotted\(img\)\]\:tw-object-cover>slot::slotted(img){object-fit:cover!important}.\[\&\>slot\:\:slotted\(img\)\]\:tw-transition-transform>slot::slotted(img){transition-duration:.15s!important;transition-property:transform!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.\[\&\>slot\[name\=\"body\"\]\:\:slotted\(\*\)\]\:tw-m-0>slot[name=body]::slotted(*){margin:0!important}.\[\&\>slot\[name\=\"body\"\]\:\:slotted\(\*\)\]\:tw-text-xl>slot[name=body]::slotted(*){font-size:1.25rem!important;line-height:1.75rem!important}.\[\&\>slot\[name\=\"body\"\]\:\:slotted\(\*\)\]\:tw-font-normal>slot[name=body]::slotted(*){font-weight:400!important}.\[\&\>slot\[name\=\"subtitle\"\]\:\:slotted\(\*\)\]\:tw-m-0>slot[name=subtitle]::slotted(*){margin:0!important}.\[\&\>slot\[name\=\"subtitle\"\]\:\:slotted\(\*\)\]\:tw-py-4>slot[name=subtitle]::slotted(*){padding-bottom:1rem!important;padding-top:1rem!important}.\[\&\>slot\[name\=\"subtitle\"\]\:\:slotted\(\*\)\]\:tw-text-2xl>slot[name=subtitle]::slotted(*){font-size:1.5rem!important;line-height:2rem!important}.\[\&\>slot\[name\=\"subtitle\"\]\:\:slotted\(\*\)\]\:tw-font-normal>slot[name=subtitle]::slotted(*){font-weight:400!important}.\[\&\>slot\[name\=\"title\"\]\:\:slotted\(\*\)\]\:tw-m-0>slot[name=title]::slotted(*){margin:0!important}.\[\&\>slot\[name\=\"title\"\]\:\:slotted\(\*\)\]\:tw-py-4>slot[name=title]::slotted(*){padding-bottom:1rem!important;padding-top:1rem!important}.\[\&\>slot\[name\=\"title\"\]\:\:slotted\(\*\)\]\:tw-text-4xl>slot[name=title]::slotted(*){font-size:2.25rem!important;line-height:2.5rem!important}.\[\&\>slot\[name\=\"title\"\]\:\:slotted\(\*\)\]\:tw-font-normal>slot[name=title]::slotted(*){font-weight:400!important}

package/dist/collection/components/uofg-card/uofg-card.js

@@ -1,43 +1,45 @@
 import { Fragment, h } from "@stencil/core";
 export class UofgCard {
-  constructor() {
-    this.href = undefined;
-  }
-  render() {
-    const Body = () => (h(Fragment, null, h("div", { id: "uofg-card-img" }, h("slot", { name: "img" })), h("div", { id: "uofg-card-content" }, h("slot", { name: "title" }), h("slot", { name: "subtitle" }), h("slot", { name: "body" })), h("div", { id: "uofg-card-footer" }, h("slot", { name: "footer" }))));
-    return this.href ? (h("a", { href: this.href, id: "uofg-card" }, h(Body, null))) : (h("div", { id: "uofg-card" }, h(Body, null)));
-  }
-  static get is() { return "uofg-card"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["uofg-card.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["uofg-card.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "href": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": "The URL the card should link to. If this property is set, the card will be rendered as an anchor (\"a\" tag)."
-        },
-        "attribute": "href",
-        "reflect": false
-      }
-    };
-  }
+    constructor() {
+        this.href = undefined;
+    }
+    render() {
+        var _a;
+        const Body = () => (h(Fragment, { key: '8eb35c1aaeb19f187b7dbcb9be2990a947128c06' }, h("div", { key: '6812c189df6d70a5495db38d14fb37f656892603', class: "tw-flex tw-items-center tw-justify-center tw-overflow-hidden [&>slot::slotted(img)]:tw-w-full [&>slot::slotted(img)]:tw-object-cover [&>slot::slotted(img)]:tw-transition-transform" }, h("slot", { key: '65a609cdbc7b3e5bf9364bef31f6e063932568cf', name: "img" })), h("div", { key: '3d936244cb22e8b74e24745a059b8decdcd7868c', class: 'tw-flex tw-p-4 tw-flex-col [&>slot[name="body"]::slotted(*)]:tw-m-0 [&>slot[name="body"]::slotted(*)]:tw-text-xl [&>slot[name="body"]::slotted(*)]:tw-font-normal [&>slot[name="subtitle"]::slotted(*)]:tw-m-0 [&>slot[name="subtitle"]::slotted(*)]:tw-py-4 [&>slot[name="subtitle"]::slotted(*)]:tw-text-2xl [&>slot[name="subtitle"]::slotted(*)]:tw-font-normal [&>slot[name="title"]::slotted(*)]:tw-m-0 [&>slot[name="title"]::slotted(*)]:tw-py-4 [&>slot[name="title"]::slotted(*)]:tw-text-4xl [&>slot[name="title"]::slotted(*)]:tw-font-normal' }, h("slot", { key: '4db7245929e655f4acbeab7f603b22464caf096e', name: "title" }), h("slot", { key: 'b0482adba0ca4a994f6d3f100e1c483cb6a72452', name: "subtitle" }), h("slot", { key: '083146dd845200f2356c88535a8127f65f7ab229', name: "body" })), h("div", { key: 'fa7c4af274ad6865bd2e12d291f45469cb40952f', class: "tw-bg-uofg-blue-200 tw-px-4 tw-py-2" }, h("slot", { key: '8197a63f9551f979b8f7426370c098ec8aa8f37b', name: "footer" }))));
+        const classes = 'tw-flex tw-flex-col tw-bg-uofg-blue-50 tw-text-2xl tw-rounded tw-overflow-hidden';
+        return ((_a = this === null || this === void 0 ? void 0 : this.href) !== null && _a !== void 0 ? _a : '') != '' ? (h("a", { href: this.href, class: `${classes} tw-border tw-border-solid tw-border-transparent tw-transition-colors focus-within:tw-border-uofg-blue-400 hocus:tw-border-uofg-blue-400 [&>div>slot::slotted(img)]:hocus:tw-scale-110 [&>div>slot::slotted(img)]:hocus:tw-transform [&>div>slot::slotted(img)]:hocus:tw-transition-transform` }, h(Body, null))) : (h("div", { class: classes }, h(Body, null)));
+    }
+    static get is() { return "uofg-card"; }
+    static get encapsulation() { return "shadow"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["uofg-card.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["uofg-card.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "href": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "The URL the card should link to. If this property is set, the card will be rendered as an anchor (\"a\" tag)."
+                },
+                "attribute": "href",
+                "reflect": false
+            }
+        };
+    }
 }

package/dist/collection/components/uofg-footer/uofg-footer.css

@@ -1,249 +1 @@
-:focus-visible {
-  outline: 2px solid #ffc72a;
-  outline-offset: 0.5rem;
-}
-
-* {
-  box-sizing: border-box;
-}
-
-button {
-  border: none;
-  background-color: transparent;
-  cursor: pointer;
-}
-
-a {
-  color: inherit;
-  text-decoration: none;
-}
-
-ul {
-  list-style: none;
-  padding: 0;
-  margin: unset;
-}
-ul > li {
-  display: contents;
-}
-
-:host {
-  display: block;
-  width: 100%;
-  font-size: 1.6rem;
-  font-family: sans-serif;
-}
-
-a {
-  display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  border-bottom: 2px dotted transparent;
-  width: fit-content;
-  width: -moz-max-content;
-  color: inherit;
-  white-space: nowrap;
-  padding-bottom: 0.2rem;
-  transition-property: border-color;
-  transition-duration: 0.2s;
-  transition-timing-function: ease-in-out;
-}
-a:hover, a:focus {
-  border-color: currentColor;
-}
-
-svg {
-  fill: currentColor;
-  height: 1.6rem;
-}
-
-li {
-  display: contents;
-}
-
-#uofg-footer {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  align-items: center;
-  background-color: #000;
-  color: #fff;
-  line-height: 1.2;
-}
-
-#uofg-footer-extra-links-container {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  width: 100%;
-  background-color: #f5f7fa;
-}
-
-#uofg-footer-extra-links {
-  display: flex;
-  flex-direction: column;
-  width: 85%;
-  align-items: center;
-  justify-content: center;
-  padding: 1.25rem 1rem;
-  color: #0074c1;
-}
-#uofg-footer-extra-links > li > a {
-  display: flex;
-  justify-content: center;
-  padding: 1rem 0;
-  width: 100%;
-  transition-property: color;
-  transition-duration: 0.2s;
-  transition-timing-function: ease-in-out;
-  border-bottom: 2px solid transparent;
-}
-#uofg-footer-extra-links > li > a:hover, #uofg-footer-extra-links > li > a:focus {
-  color: black;
-}
-#uofg-footer-extra-links > li:not(:last-child) > a {
-  border-bottom: 2px solid #bdc8ca;
-}
-
-#uofg-footer-content {
-  display: grid;
-  grid-template-columns: 1fr;
-  gap: 2rem;
-  width: 100%;
-  padding: 2rem;
-  max-width: 1320px;
-}
-
-.uofg-footer-content-separator {
-  display: flex;
-  flex-direction: column;
-  gap: 0.75rem;
-  justify-content: space-between;
-}
-
-#uofg-footer-improve-life {
-  transition-property: opacity;
-  transition-duration: 0.2s;
-  transition-timing-function: ease-in-out;
-  border: 0;
-}
-#uofg-footer-improve-life > svg {
-  height: 2.5rem;
-}
-#uofg-footer-improve-life:hover, #uofg-footer-improve-life:focus {
-  opacity: 0.8;
-}
-
-#uofg-footer-social-links {
-  display: flex;
-  align-items: center;
-  list-style: none;
-  padding: 0;
-  margin-left: 0;
-  gap: 0 0.75rem;
-}
-#uofg-footer-social-links a {
-  transition-property: color;
-  transition-duration: 0.2s;
-  transition-timing-function: ease-in-out;
-  border: 0;
-}
-#uofg-footer-social-links a:hover, #uofg-footer-social-links a:focus {
-  color: #ffc72a;
-}
-#uofg-footer-social-links a:hover[aria-label=Twitter], #uofg-footer-social-links a:focus[aria-label=Twitter] {
-  color: #1da1f2;
-}
-#uofg-footer-social-links a:hover[aria-label=Facebook], #uofg-footer-social-links a:focus[aria-label=Facebook] {
-  color: #4267b2;
-}
-#uofg-footer-social-links a:hover[aria-label=Instagram], #uofg-footer-social-links a:focus[aria-label=Instagram] {
-  color: #e1306c;
-}
-#uofg-footer-social-links a:hover[aria-label=Youtube], #uofg-footer-social-links a:focus[aria-label=Youtube] {
-  color: #f00;
-}
-#uofg-footer-social-links a:hover[aria-label=LinkedIn], #uofg-footer-social-links a:focus[aria-label=LinkedIn] {
-  color: #0077b5;
-}
-#uofg-footer-social-links a:hover[aria-label=TikTok], #uofg-footer-social-links a:focus[aria-label=TikTok] {
-  color: #f00;
-}
-#uofg-footer-social-links svg {
-  height: 2rem;
-}
-
-#uofg-footer-links-container {
-  display: flex;
-}
-
-#uofg-footer-links {
-  display: grid;
-  height: 100%;
-  grid-template-columns: 1fr;
-}
-#uofg-footer-links svg {
-  color: #ffc72a;
-}
-
-#uofg-footer-address {
-  font-style: normal;
-  white-space: nowrap;
-}
-#uofg-footer-address a {
-  color: #69a3b9;
-}
-@media (min-width: 570px) {
-  #uofg-footer-extra-links {
-    flex-direction: row;
-    flex-wrap: wrap;
-    width: 100%;
-    max-width: 1320px;
-    padding: 2rem 1rem;
-    gap: 1rem;
-  }
-  #uofg-footer-extra-links > li > a {
-    width: auto;
-    padding: 0 1rem 0 0;
-    border-bottom: none !important;
-  }
-  #uofg-footer-extra-links > li:not(:last-child) > a {
-    border-right: 2px solid rgba(0, 0, 0, 0.15);
-  }
-  #uofg-footer-content {
-    grid-template-columns: 1fr 1fr;
-  }
-  #uofg-footer-links-container {
-    grid-column-start: 1;
-    grid-column-end: 3;
-  }
-  #uofg-footer-links {
-    grid-template-columns: 1fr 1fr;
-    width: 100%;
-  }
-  #uofg-footer-address {
-    grid-row: 1;
-    grid-column: 2;
-  }
-}
-@media (min-width: 962px) {
-  #uofg-footer-content {
-    grid-template-columns: 0.5fr 1fr 0.5fr;
-    justify-items: center;
-    gap: 2rem 2rem;
-  }
-  #uofg-footer-links-container {
-    grid-row: unset;
-    grid-column: unset;
-    justify-content: center;
-    gap: 0;
-  }
-  #uofg-footer-links {
-    gap: 0 8rem;
-    width: auto;
-  }
-  #uofg-footer-address {
-    grid-row: unset;
-    grid-column: unset;
-  }
-}
+  :host {    display: block;    width: 100%;    font-size: 1.6rem;    font-family: sans-serif;  }  * {    box-sizing: border-box;  }  a {    text-decoration: none;    color: inherit;  }  button {    border: none;    background: none;    cursor: pointer;    font-size: inherit;    font-family: inherit;    color: inherit;    line-height: inherit;    word-spacing: inherit;    letter-spacing: inherit;  }  ul {    list-style: none;    padding: 0;    margin: 0;  }  svg {    height: 1em;  }@defaults border-spacing {    --tw-border-spacing-x: 0;    --tw-border-spacing-y: 0;}@defaults transform {    --tw-translate-x: 0;    --tw-translate-y: 0;    --tw-rotate: 0;    --tw-skew-x: 0;    --tw-skew-y: 0;    --tw-scale-x: 1;    --tw-scale-y: 1;}@defaults touch-action {    --tw-pan-x:  ;    --tw-pan-y:  ;    --tw-pinch-zoom:  ;}@defaults scroll-snap-type {    --tw-scroll-snap-strictness: proximity;}@defaults gradient-color-stops {    --tw-gradient-from-position:  ;    --tw-gradient-via-position:  ;    --tw-gradient-to-position:  ;}@defaults font-variant-numeric {    --tw-ordinal:  ;    --tw-slashed-zero:  ;    --tw-numeric-figure:  ;    --tw-numeric-spacing:  ;    --tw-numeric-fraction:  ;}@defaults box-shadow {    --tw-ring-offset-shadow: 0 0 #0000;    --tw-ring-shadow: 0 0 #0000;    --tw-shadow: 0 0 #0000;    --tw-shadow-colored: 0 0 #0000;}@defaults ring-width {    --tw-ring-inset:  ;    --tw-ring-offset-width: 0px;    --tw-ring-offset-color: #fff;    --tw-ring-color: rgb(59 130 246 / 0.5);    --tw-ring-offset-shadow: 0 0 #0000;    --tw-ring-shadow: 0 0 #0000;    --tw-shadow: 0 0 #0000;    --tw-shadow-colored: 0 0 #0000;}@defaults filter {    --tw-blur:  ;    --tw-brightness:  ;    --tw-contrast:  ;    --tw-grayscale:  ;    --tw-hue-rotate:  ;    --tw-invert:  ;    --tw-saturate:  ;    --tw-sepia:  ;    --tw-drop-shadow:  ;}@defaults backdrop-filter {    --tw-backdrop-blur:  ;    --tw-backdrop-brightness:  ;    --tw-backdrop-contrast:  ;    --tw-backdrop-grayscale:  ;    --tw-backdrop-hue-rotate:  ;    --tw-backdrop-invert:  ;    --tw-backdrop-opacity:  ;    --tw-backdrop-saturate:  ;    --tw-backdrop-sepia:  ;}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x:;--tw-pan-y:;--tw-pinch-zoom:;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position:;--tw-gradient-via-position:;--tw-gradient-to-position:;--tw-ordinal:;--tw-slashed-zero:;--tw-numeric-figure:;--tw-numeric-spacing:;--tw-numeric-fraction:;--tw-ring-inset:;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur:;--tw-brightness:;--tw-contrast:;--tw-grayscale:;--tw-hue-rotate:;--tw-invert:;--tw-saturate:;--tw-sepia:;--tw-drop-shadow:;--tw-backdrop-blur:;--tw-backdrop-brightness:;--tw-backdrop-contrast:;--tw-backdrop-grayscale:;--tw-backdrop-hue-rotate:;--tw-backdrop-invert:;--tw-backdrop-opacity:;--tw-backdrop-saturate:;--tw-backdrop-sepia:}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x:;--tw-pan-y:;--tw-pinch-zoom:;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position:;--tw-gradient-via-position:;--tw-gradient-to-position:;--tw-ordinal:;--tw-slashed-zero:;--tw-numeric-figure:;--tw-numeric-spacing:;--tw-numeric-fraction:;--tw-ring-inset:;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur:;--tw-brightness:;--tw-contrast:;--tw-grayscale:;--tw-hue-rotate:;--tw-invert:;--tw-saturate:;--tw-sepia:;--tw-drop-shadow:;--tw-backdrop-blur:;--tw-backdrop-brightness:;--tw-backdrop-contrast:;--tw-backdrop-grayscale:;--tw-backdrop-hue-rotate:;--tw-backdrop-invert:;--tw-backdrop-opacity:;--tw-backdrop-saturate:;--tw-backdrop-sepia:}.tw-flex{display:flex!important}.tw-w-fit{width:fit-content!important}.tw-flex-col{flex-direction:column!important}.tw-flex-wrap{flex-wrap:wrap!important}.tw-content-center{align-content:center!important}.tw-items-center{align-items:center!important}.tw-justify-center{justify-content:center!important}.tw-justify-between{justify-content:space-between!important}.tw-gap-2{gap:.5rem!important}.tw-gap-3{gap:.75rem!important}.tw-gap-4{gap:1rem!important}.tw-gap-8{gap:2rem!important}.tw-border-0{border-width:0!important}.tw-border-b-2{border-bottom-width:2px!important}.tw-border-r-2{border-right-width:2px!important}.tw-border-solid{border-style:solid!important}.tw-border-dotted{border-style:dotted!important}.tw-border-transparent{border-color:transparent!important}.tw-border-uofg-blue-100{--tw-border-opacity:1!important;border-color:rgb(221 236 240/var(--tw-border-opacity))!important}.tw-bg-black{--tw-bg-opacity:1!important;background-color:rgb(0 0 0/var(--tw-bg-opacity))!important}.tw-bg-uofg-blue-50{--tw-bg-opacity:1!important;background-color:rgb(241 248 250/var(--tw-bg-opacity))!important}.tw-p-2{padding:.5rem!important}.tw-p-6{padding:1.5rem!important}.tw-px-\[max\(calc\(\(100\%-1320px\)\/2\)\,2rem\)\]{padding-left:max(calc(50% - 660px),2rem)!important;padding-right:max(calc(50% - 660px),2rem)!important}.tw-py-8{padding-bottom:2rem!important;padding-top:2rem!important}.tw-text-4xl{font-size:2.25rem!important;line-height:2.5rem!important}.tw-not-italic{font-style:normal!important}.tw-text-uofg-blue{--tw-text-opacity:1!important;color:rgb(105 163 185/var(--tw-text-opacity))!important}.tw-text-uofg-blue-500{--tw-text-opacity:1!important;color:rgb(65 127 153/var(--tw-text-opacity))!important}.tw-text-white{--tw-text-opacity:1!important;color:rgb(255 255 255/var(--tw-text-opacity))!important}.tw-transition-colors{transition-duration:.15s!important;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.tw-transition-opacity{transition-duration:.15s!important;transition-property:opacity!important;transition-timing-function:cubic-bezier(.4,0,.2,1)!important}.first\:tw-border-l-2:first-child{border-left-width:2px!important}.hocus\:tw-border-current:hover{border-color:currentColor!important}.hocus\:tw-border-white:hover{--tw-border-opacity:1!important;border-color:rgb(255 255 255/var(--tw-border-opacity))!important}.hocus\:tw-text-\[\#0077b5\]:hover{--tw-text-opacity:1!important;color:rgb(0 119 181/var(--tw-text-opacity))!important}.hocus\:tw-text-\[\#1da1f2\]:hover{--tw-text-opacity:1!important;color:rgb(29 161 242/var(--tw-text-opacity))!important}.hocus\:tw-text-\[\#4267b2\]:hover{--tw-text-opacity:1!important;color:rgb(66 103 178/var(--tw-text-opacity))!important}.hocus\:tw-text-\[\#e1306c\]:hover{--tw-text-opacity:1!important;color:rgb(225 48 108/var(--tw-text-opacity))!important}.hocus\:tw-text-\[\#f00\]:hover{--tw-text-opacity:1!important;color:rgb(255 0 0/var(--tw-text-opacity))!important}.hocus\:tw-text-uofg-blue-950:hover{--tw-text-opacity:1!important;color:rgb(25 40 51/var(--tw-text-opacity))!important}.hocus\:tw-opacity-75:hover{opacity:.75!important}.hocus\:tw-border-current:focus{border-color:currentColor!important}.hocus\:tw-border-white:focus{--tw-border-opacity:1!important;border-color:rgb(255 255 255/var(--tw-border-opacity))!important}.hocus\:tw-text-\[\#0077b5\]:focus{--tw-text-opacity:1!important;color:rgb(0 119 181/var(--tw-text-opacity))!important}.hocus\:tw-text-\[\#1da1f2\]:focus{--tw-text-opacity:1!important;color:rgb(29 161 242/var(--tw-text-opacity))!important}.hocus\:tw-text-\[\#4267b2\]:focus{--tw-text-opacity:1!important;color:rgb(66 103 178/var(--tw-text-opacity))!important}.hocus\:tw-text-\[\#e1306c\]:focus{--tw-text-opacity:1!important;color:rgb(225 48 108/var(--tw-text-opacity))!important}.hocus\:tw-text-\[\#f00\]:focus{--tw-text-opacity:1!important;color:rgb(255 0 0/var(--tw-text-opacity))!important}.hocus\:tw-text-uofg-blue-950:focus{--tw-text-opacity:1!important;color:rgb(25 40 51/var(--tw-text-opacity))!important}.hocus\:tw-opacity-75:focus{opacity:.75!important}@media (min-width:768px){.md\:tw-col-span-2{grid-column:span 2/span 2!important}.md\:tw-row-start-2{grid-row-start:2!important}.md\:tw-grid{display:grid!important}.md\:tw-grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}}@media (min-width:1024px){.lg\:tw-row-auto{grid-row:auto!important}.lg\:tw-grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))!important}}.\[\&\>li\]\:tw-contents>li{display:contents!important}.\[\&\>svg\]\:tw-h-\[1\.6em\]>svg{height:1.6em!important}.\[\&\>svg\]\:tw-h-\[1em\]>svg{height:1em!important}.\[\&\>svg\]\:tw-fill-current>svg{fill:currentColor!important}.\[\&\>svg\]\:tw-fill-uofg-yellow>svg{fill:#ffc72a!important}*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x:;--tw-pan-y:;--tw-pinch-zoom:;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position:;--tw-gradient-via-position:;--tw-gradient-to-position:;--tw-ordinal:;--tw-slashed-zero:;--tw-numeric-figure:;--tw-numeric-spacing:;--tw-numeric-fraction:;--tw-ring-inset:;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur:;--tw-brightness:;--tw-contrast:;--tw-grayscale:;--tw-hue-rotate:;--tw-invert:;--tw-saturate:;--tw-sepia:;--tw-drop-shadow:;--tw-backdrop-blur:;--tw-backdrop-brightness:;--tw-backdrop-contrast:;--tw-backdrop-grayscale:;--tw-backdrop-hue-rotate:;--tw-backdrop-invert:;--tw-backdrop-opacity:;--tw-backdrop-saturate:;--tw-backdrop-sepia:}::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x:;--tw-pan-y:;--tw-pinch-zoom:;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position:;--tw-gradient-via-position:;--tw-gradient-to-position:;--tw-ordinal:;--tw-slashed-zero:;--tw-numeric-figure:;--tw-numeric-spacing:;--tw-numeric-fraction:;--tw-ring-inset:;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur:;--tw-brightness:;--tw-contrast:;--tw-grayscale:;--tw-hue-rotate:;--tw-invert:;--tw-saturate:;--tw-sepia:;--tw-drop-shadow:;--tw-backdrop-blur:;--tw-backdrop-brightness:;--tw-backdrop-contrast:;--tw-backdrop-grayscale:;--tw-backdrop-hue-rotate:;--tw-backdrop-invert:;--tw-backdrop-opacity:;--tw-backdrop-saturate:;--tw-backdrop-sepia:}