@kompasid/lit-web-components 0.9.52 → 0.9.53
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.js +10 -3
- package/dist/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.js.map +1 -1
- package/dist/tailwind/tailwind.js +45 -0
- package/dist/tailwind/tailwind.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.ts +10 -3
- package/tailwind/tailwind.css +45 -0
- package/tailwind/tailwind.ts +45 -0
|
@@ -166,14 +166,14 @@ let KompasHeaderAccountProfile = class KompasHeaderAccountProfile extends LitEle
|
|
|
166
166
|
* Kompeni Element
|
|
167
167
|
*/
|
|
168
168
|
const kompeniTemplate = () => html ` <div
|
|
169
|
-
class="flex relative group bg-[#FFF8D6] text-yellow-700 gap-1 p-2 mt-2 rounded items-center justify-center text-xs
|
|
169
|
+
class="flex relative group bg-[#FFF8D6] text-yellow-700 gap-1 p-2 mt-2 rounded items-center justify-center text-xs font-sans leading-none w-full"
|
|
170
170
|
>
|
|
171
171
|
<div class="w-5 h-5 flex items-center justify-center flex-shrink-0">
|
|
172
172
|
${unsafeSVG(getFontAwesomeIcon('fa', 'building-circle-check', 13, 10))}
|
|
173
173
|
</div>
|
|
174
|
-
<p class="truncate">${this.company_name}</p>
|
|
174
|
+
<p class="break-all multi-line-truncate w-full">${this.company_name}</p>
|
|
175
175
|
<div
|
|
176
|
-
class="absolute px-2 top-full -right-[5%] w-max max-w-[300px] mt-1 hidden group-hover:block"
|
|
176
|
+
class="absolute px-2 top-full -right-[5%] w-max max-w-[300px] mt-1 hidden group-hover:block z-10"
|
|
177
177
|
>
|
|
178
178
|
<div
|
|
179
179
|
class="bg-grey-600 text-white text-sm font-sans p-4 rounded-lg relative leading-5"
|
|
@@ -285,6 +285,13 @@ let KompasHeaderAccountProfile = class KompasHeaderAccountProfile extends LitEle
|
|
|
285
285
|
};
|
|
286
286
|
KompasHeaderAccountProfile.styles = [
|
|
287
287
|
css `
|
|
288
|
+
.multi-line-truncate {
|
|
289
|
+
display: -webkit-box;
|
|
290
|
+
-webkit-box-orient: vertical;
|
|
291
|
+
-webkit-line-clamp: 1; /* Number of lines to show */
|
|
292
|
+
overflow: hidden;
|
|
293
|
+
}
|
|
294
|
+
|
|
288
295
|
.header-account--membership-icon {
|
|
289
296
|
position: absolute;
|
|
290
297
|
bottom: -2px;
|
package/dist/src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"KompasHeaderAccountProfile.js","sourceRoot":"","sources":["../../../../src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css, nothing } from 'lit'\nimport { format, addDays, differenceInDays } from 'date-fns'\nimport { id } from 'date-fns/locale/id'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { User } from '../kompasid-header-account/types.js'\nimport { getFontAwesomeIcon } from '../../utils/fontawesome-setup.js'\nimport '../kompasid-grace-period/KompasGracePeriod.js'\n\n@customElement('kompasid-header-account-profile')\nexport class KompasHeaderAccountProfile extends LitElement {\n static styles = [\n css`\n .header-account--membership-icon {\n position: absolute;\n bottom: -2px;\n right: -2px;\n }\n\n .tooltip::after {\n content: '';\n position: absolute;\n width: 24px;\n height: 16px;\n background-color: #333333;\n /* Memotong kotak menjadi segitiga */\n clip-path: polygon(50% 0%, 0% 100%, 100% 100%);\n /* Menghaluskan sudut potongan */\n border-radius: 4px;\n }\n `,\n TWStyles,\n ]\n\n /**\n * Props\n */\n @property({ type: String }) userInitialName = ''\n @property({ type: Object }) userData = {} as User\n @property({ type: String }) subscriptionUrl = ''\n @property({ type: String }) company_name = ''\n @property({ type: String }) manage_account_url = ''\n @property({ type: String }) openFrom = ''\n /**\n * Props For Grace Period Tracker\n */\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: Number }) paywall_subscription_id = 0\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n\n /**\n * State\n */\n @state() private maxGracePeriod = 7\n\n formatDate(date: Date | string) {\n return format(new Date(date), 'dd MMM yyyy', { locale: id })\n }\n\n private renderSkeletonLoading() {\n return html`\n <div>\n <div class=\"flex flex-row mb-5 items-center gap-4 leading-none\">\n <div\n class=\"bg-grey-300 py-5 rounded-full h-16 w-16 animate-pulse\"\n ></div>\n <div class=\"flex flex-col text-left w-40 gap-y-2\">\n <div class=\"h-3 rounded-sm w-full bg-grey-300 animate-pulse\"></div>\n <div class=\"h-3 rounded-sm w-full bg-grey-300 animate-pulse\"></div>\n <div class=\"h-3 rounded-sm w-full bg-grey-300 animate-pulse\"></div>\n </div>\n </div>\n <div>\n <div class=\"h-6 rounded-sm w-full bg-grey-300 animate-pulse\"></div>\n </div>\n </div>\n `\n }\n\n private renderProfileContent() {\n /**\n * Subs Button Element\n */\n const subscribeButton = () => {\n if (this.userData.isMembership) {\n return html``\n }\n const handleSubscribe = () => {\n const openFromValue = this.openFrom || 'Sidebar_Menu'\n window.location.href = `${this.subscriptionUrl}?open_from=${openFromValue}`\n }\n\n return html`\n <div class=\"w-full\">\n <button\n @click=${handleSubscribe}\n class=\"w-full rounded-lg px-4 py-3 mt-4 h-10 flex justify-center items-center bg-brand-1 text-grey-100 font-bold text-base focus:outline-none\"\n >\n Berlangganan Sekarang\n </button>\n </div>\n `\n }\n /**\n * membership icon element, show if isMebership has truthy value\n */\n const membershipIcon = () => {\n if (!this.userData?.isMembership) {\n return html``\n }\n\n return html`\n <div>\n <img\n class=\"header-account--membership-icon h-6 w-6\"\n src=\"https://cdn-www.kompas.id/global-header/crown-royal-blue-60.svg\"\n alt=\"membership-crown-icon\"\n />\n </div>\n `\n }\n\n /**\n * Active Info Element\n */\n\n const activeInfoTemplate = () => {\n const { isGracePeriod, totalGracePeriod, expired } = this.userData\n\n let result = html`Tidak Berlangganan` // default\n let endGracePeriodDate = ''\n\n const nowDate = new Date()\n const isoDateString = expired.replace(' ', 'T')\n const expiredDate = new Date(isoDateString)\n const subsDaysLeft: number = differenceInDays(expiredDate, nowDate) + 1 // differenceInDays + 1 jika tanggal bertepatan di hari yang sama\n\n const gracePeriodCard = () => {\n if (isGracePeriod) {\n const totalGraceSubs =\n this.maxGracePeriod - Math.max(totalGracePeriod, 0)\n endGracePeriodDate = this.formatDate(\n addDays(\n new Date(),\n totalGracePeriod > this.maxGracePeriod ? 0 : totalGraceSubs\n )\n )\n }\n const label = 'Periode Masa Tenggang'\n return html`\n <div class=\"text-orange-500 gracePeriodCard\">\n <span>${label}</span>\n <p class=\"font-bold\">hingga ${endGracePeriodDate}</p>\n </div>\n `\n }\n\n const lessThan3daysCard = () => {\n const label = 'Aktif Berlangganan'\n return html`\n <div class=\"lessThan3daysCard\">\n <span> ${label} </span>\n <p class=\"font-bold\">Berakhir ${subsDaysLeft} hari lagi</p>\n </div>\n `\n }\n\n const moreThan3daysCard = () => {\n const formattedExpired = this.formatDate(expired)\n const label = 'Aktif Berlangganan'\n return html`\n <div class=\"moreThan3daysCard\">\n <span>${label}</span>\n <p class=\"font-bold\">hingga ${formattedExpired}</p>\n </div>\n `\n }\n\n if (isGracePeriod && totalGracePeriod > 0) {\n result = gracePeriodCard()\n } else if (subsDaysLeft >= 0 && subsDaysLeft <= 3) {\n result = lessThan3daysCard()\n } else if (subsDaysLeft > 3) {\n result = moreThan3daysCard()\n }\n\n return html`<p class=\"text-sm text-grey-600 ${subsDaysLeft}-days-left\">\n ${result}\n </p>`\n }\n\n /**\n * Kompeni Element\n */\n const kompeniTemplate = () => html` <div\n class=\"flex relative group bg-[#FFF8D6] text-yellow-700 gap-1 p-2 mt-2 rounded items-center justify-center text-xs max-w-[190px] font-sans leading-none\"\n >\n <div class=\"w-5 h-5 flex items-center justify-center flex-shrink-0\">\n ${unsafeSVG(getFontAwesomeIcon('fa', 'building-circle-check', 13, 10))}\n </div>\n <p class=\"truncate\">${this.company_name}</p>\n <div\n class=\"absolute px-2 top-full -right-[5%] w-max max-w-[300px] mt-1 hidden group-hover:block\"\n >\n <div\n class=\"bg-grey-600 text-white text-sm font-sans p-4 rounded-lg relative leading-5\"\n >\n ${this.company_name}\n <svg\n width=\"16\"\n height=\"12\"\n viewBox=\"0 0 24 13\"\n class=\"text-grey-600 absolute left-[80%] -top-[11px]\"\n >\n <polygon\n points=\"3,15 12,3 21,15\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n stroke-width=\"4\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n </div>\n </div>`\n\n return html`\n <div\n class=\"active-info flex flex-col items-start leading-none text-left font-sans\"\n >\n <div class=\"flex flex-row items-center gap-4\">\n <div\n @click=${() => this.clickToManageAccount()}\n @keydown=${() => this.clickToManageAccount()}\n class=\"flex bg-brand-1 flex-shrink-0 p-5 rounded-full h-16 w-16 items-center justify-center relative select-none ${this\n .manage_account_url\n ? 'cursor-pointer'\n : ''}\"\n >\n <span class=\"capitalize text-2xl text-grey-100 font-bold\">\n ${this.userInitialName}\n </span>\n ${membershipIcon()}\n </div>\n\n <div class=\"flex flex-col text-left\">\n <div\n @click=${() => this.clickToManageAccount()}\n @keydown=${() => this.clickToManageAccount()}\n class=\"select-none\"\n >\n <p\n class=\"capitalize font-bold text-base ${this.manage_account_url\n ? 'text-blue-600 cursor-pointer'\n : 'text-grey-600'}\"\n >\n ${this.userData.userName}\n </p>\n ${activeInfoTemplate()}\n </div>\n ${this.company_name ? kompeniTemplate() : nothing}\n </div>\n </div>\n\n ${this.userData?.isGracePeriod\n ? html` <div class=\"mt-4 kompasid-grace-period\">\n <kompasid-grace-period\n totalGracePeriod=${this.userData.totalGracePeriod}\n isColumn=\"true\"\n isShowButton=\"true\"\n isBackgroundOnContentOnly=\"true\"\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this\n .paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_content_type=${this.tracker_content_type}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_metered_wall_balance=${this\n .tracker_metered_wall_balance}\n ></kompasid-grace-period>\n </div>`\n : subscribeButton()}\n </div>\n `\n }\n clickToManageAccount() {\n if (this.manage_account_url) {\n window.location.href = this.manage_account_url\n }\n }\n\n override async connectedCallback() {\n super.connectedCallback()\n }\n\n render() {\n return html`\n <div class=\"flex flex-shrink-0 flex-col p-4\">\n ${!this.userData\n ? this.renderSkeletonLoading()\n : this.renderProfileContent()}\n </div>\n <hr class=\"border-grey-300 mx-4\" />\n `\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"KompasHeaderAccountProfile.js","sourceRoot":"","sources":["../../../../src/components/kompasid-header-account-profile/KompasHeaderAccountProfile.ts"],"names":[],"mappings":"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","sourcesContent":["import { LitElement, html, css, nothing } from 'lit'\nimport { format, addDays, differenceInDays } from 'date-fns'\nimport { id } from 'date-fns/locale/id'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { unsafeSVG } from 'lit/directives/unsafe-svg.js'\nimport { TWStyles } from '../../../tailwind/tailwind.js'\nimport { User } from '../kompasid-header-account/types.js'\nimport { getFontAwesomeIcon } from '../../utils/fontawesome-setup.js'\nimport '../kompasid-grace-period/KompasGracePeriod.js'\n\n@customElement('kompasid-header-account-profile')\nexport class KompasHeaderAccountProfile extends LitElement {\n static styles = [\n css`\n .multi-line-truncate {\n display: -webkit-box;\n -webkit-box-orient: vertical;\n -webkit-line-clamp: 1; /* Number of lines to show */\n overflow: hidden;\n }\n\n .header-account--membership-icon {\n position: absolute;\n bottom: -2px;\n right: -2px;\n }\n\n .tooltip::after {\n content: '';\n position: absolute;\n width: 24px;\n height: 16px;\n background-color: #333333;\n /* Memotong kotak menjadi segitiga */\n clip-path: polygon(50% 0%, 0% 100%, 100% 100%);\n /* Menghaluskan sudut potongan */\n border-radius: 4px;\n }\n `,\n TWStyles,\n ]\n\n /**\n * Props\n */\n @property({ type: String }) userInitialName = ''\n @property({ type: Object }) userData = {} as User\n @property({ type: String }) subscriptionUrl = ''\n @property({ type: String }) company_name = ''\n @property({ type: String }) manage_account_url = ''\n @property({ type: String }) openFrom = ''\n /**\n * Props For Grace Period Tracker\n */\n @property({ type: String }) paywall_location = ''\n @property({ type: String }) paywall_subscription_package = ''\n @property({ type: Number }) paywall_subscription_id = 0\n @property({ type: Number }) paywall_subscription_price = 0\n @property({ type: Number }) paywall_position = 0\n @property({ type: String }) tracker_page_type = ''\n @property({ type: String }) tracker_content_id = ''\n @property({ type: String }) tracker_content_title = ''\n @property({ type: String }) tracker_content_categories = ''\n @property({ type: String }) tracker_content_type = ''\n @property({ type: String }) tracker_user_type = ''\n @property({ type: String }) tracker_subscription_status = ''\n @property({ type: String }) tracker_page_domain = ''\n @property({ type: String }) tracker_metered_wall_type = ''\n @property({ type: Number }) tracker_metered_wall_balance = 0\n\n /**\n * State\n */\n @state() private maxGracePeriod = 7\n\n formatDate(date: Date | string) {\n return format(new Date(date), 'dd MMM yyyy', { locale: id })\n }\n\n private renderSkeletonLoading() {\n return html`\n <div>\n <div class=\"flex flex-row mb-5 items-center gap-4 leading-none\">\n <div\n class=\"bg-grey-300 py-5 rounded-full h-16 w-16 animate-pulse\"\n ></div>\n <div class=\"flex flex-col text-left w-40 gap-y-2\">\n <div class=\"h-3 rounded-sm w-full bg-grey-300 animate-pulse\"></div>\n <div class=\"h-3 rounded-sm w-full bg-grey-300 animate-pulse\"></div>\n <div class=\"h-3 rounded-sm w-full bg-grey-300 animate-pulse\"></div>\n </div>\n </div>\n <div>\n <div class=\"h-6 rounded-sm w-full bg-grey-300 animate-pulse\"></div>\n </div>\n </div>\n `\n }\n\n private renderProfileContent() {\n /**\n * Subs Button Element\n */\n const subscribeButton = () => {\n if (this.userData.isMembership) {\n return html``\n }\n const handleSubscribe = () => {\n const openFromValue = this.openFrom || 'Sidebar_Menu'\n window.location.href = `${this.subscriptionUrl}?open_from=${openFromValue}`\n }\n\n return html`\n <div class=\"w-full\">\n <button\n @click=${handleSubscribe}\n class=\"w-full rounded-lg px-4 py-3 mt-4 h-10 flex justify-center items-center bg-brand-1 text-grey-100 font-bold text-base focus:outline-none\"\n >\n Berlangganan Sekarang\n </button>\n </div>\n `\n }\n /**\n * membership icon element, show if isMebership has truthy value\n */\n const membershipIcon = () => {\n if (!this.userData?.isMembership) {\n return html``\n }\n\n return html`\n <div>\n <img\n class=\"header-account--membership-icon h-6 w-6\"\n src=\"https://cdn-www.kompas.id/global-header/crown-royal-blue-60.svg\"\n alt=\"membership-crown-icon\"\n />\n </div>\n `\n }\n\n /**\n * Active Info Element\n */\n\n const activeInfoTemplate = () => {\n const { isGracePeriod, totalGracePeriod, expired } = this.userData\n\n let result = html`Tidak Berlangganan` // default\n let endGracePeriodDate = ''\n\n const nowDate = new Date()\n const isoDateString = expired.replace(' ', 'T')\n const expiredDate = new Date(isoDateString)\n const subsDaysLeft: number = differenceInDays(expiredDate, nowDate) + 1 // differenceInDays + 1 jika tanggal bertepatan di hari yang sama\n\n const gracePeriodCard = () => {\n if (isGracePeriod) {\n const totalGraceSubs =\n this.maxGracePeriod - Math.max(totalGracePeriod, 0)\n endGracePeriodDate = this.formatDate(\n addDays(\n new Date(),\n totalGracePeriod > this.maxGracePeriod ? 0 : totalGraceSubs\n )\n )\n }\n const label = 'Periode Masa Tenggang'\n return html`\n <div class=\"text-orange-500 gracePeriodCard\">\n <span>${label}</span>\n <p class=\"font-bold\">hingga ${endGracePeriodDate}</p>\n </div>\n `\n }\n\n const lessThan3daysCard = () => {\n const label = 'Aktif Berlangganan'\n return html`\n <div class=\"lessThan3daysCard\">\n <span> ${label} </span>\n <p class=\"font-bold\">Berakhir ${subsDaysLeft} hari lagi</p>\n </div>\n `\n }\n\n const moreThan3daysCard = () => {\n const formattedExpired = this.formatDate(expired)\n const label = 'Aktif Berlangganan'\n return html`\n <div class=\"moreThan3daysCard\">\n <span>${label}</span>\n <p class=\"font-bold\">hingga ${formattedExpired}</p>\n </div>\n `\n }\n\n if (isGracePeriod && totalGracePeriod > 0) {\n result = gracePeriodCard()\n } else if (subsDaysLeft >= 0 && subsDaysLeft <= 3) {\n result = lessThan3daysCard()\n } else if (subsDaysLeft > 3) {\n result = moreThan3daysCard()\n }\n\n return html`<p class=\"text-sm text-grey-600 ${subsDaysLeft}-days-left\">\n ${result}\n </p>`\n }\n\n /**\n * Kompeni Element\n */\n const kompeniTemplate = () => html` <div\n class=\"flex relative group bg-[#FFF8D6] text-yellow-700 gap-1 p-2 mt-2 rounded items-center justify-center text-xs font-sans leading-none w-full\"\n >\n <div class=\"w-5 h-5 flex items-center justify-center flex-shrink-0\">\n ${unsafeSVG(getFontAwesomeIcon('fa', 'building-circle-check', 13, 10))}\n </div>\n <p class=\"break-all multi-line-truncate w-full\">${this.company_name}</p>\n <div\n class=\"absolute px-2 top-full -right-[5%] w-max max-w-[300px] mt-1 hidden group-hover:block z-10\"\n >\n <div\n class=\"bg-grey-600 text-white text-sm font-sans p-4 rounded-lg relative leading-5\"\n >\n ${this.company_name}\n <svg\n width=\"16\"\n height=\"12\"\n viewBox=\"0 0 24 13\"\n class=\"text-grey-600 absolute left-[80%] -top-[11px]\"\n >\n <polygon\n points=\"3,15 12,3 21,15\"\n fill=\"currentColor\"\n stroke=\"currentColor\"\n stroke-width=\"4\"\n stroke-linejoin=\"round\"\n />\n </svg>\n </div>\n </div>\n </div>`\n\n return html`\n <div\n class=\"active-info flex flex-col items-start leading-none text-left font-sans\"\n >\n <div class=\"flex flex-row items-center gap-4\">\n <div\n @click=${() => this.clickToManageAccount()}\n @keydown=${() => this.clickToManageAccount()}\n class=\"flex bg-brand-1 flex-shrink-0 p-5 rounded-full h-16 w-16 items-center justify-center relative select-none ${this\n .manage_account_url\n ? 'cursor-pointer'\n : ''}\"\n >\n <span class=\"capitalize text-2xl text-grey-100 font-bold\">\n ${this.userInitialName}\n </span>\n ${membershipIcon()}\n </div>\n\n <div class=\"flex flex-col text-left\">\n <div\n @click=${() => this.clickToManageAccount()}\n @keydown=${() => this.clickToManageAccount()}\n class=\"select-none\"\n >\n <p\n class=\"capitalize font-bold text-base ${this.manage_account_url\n ? 'text-blue-600 cursor-pointer'\n : 'text-grey-600'}\"\n >\n ${this.userData.userName}\n </p>\n ${activeInfoTemplate()}\n </div>\n ${this.company_name ? kompeniTemplate() : nothing}\n </div>\n </div>\n\n ${this.userData?.isGracePeriod\n ? html` <div class=\"mt-4 kompasid-grace-period\">\n <kompasid-grace-period\n totalGracePeriod=${this.userData.totalGracePeriod}\n isColumn=\"true\"\n isShowButton=\"true\"\n isBackgroundOnContentOnly=\"true\"\n paywall_location=${this.paywall_location}\n paywall_subscription_package=${this\n .paywall_subscription_package}\n paywall_subscription_id=${this.paywall_subscription_id}\n paywall_subscription_price=${this.paywall_subscription_price}\n paywall_position=${this.paywall_position}\n tracker_page_type=${this.tracker_page_type}\n tracker_content_id=${this.tracker_content_id}\n tracker_content_title=${this.tracker_content_title}\n tracker_content_categories=${this.tracker_content_categories}\n tracker_content_type=${this.tracker_content_type}\n tracker_user_type=${this.tracker_user_type}\n tracker_subscription_status=${this.tracker_subscription_status}\n tracker_page_domain=${this.tracker_page_domain}\n tracker_metered_wall_type=${this.tracker_metered_wall_type}\n tracker_metered_wall_balance=${this\n .tracker_metered_wall_balance}\n ></kompasid-grace-period>\n </div>`\n : subscribeButton()}\n </div>\n `\n }\n clickToManageAccount() {\n if (this.manage_account_url) {\n window.location.href = this.manage_account_url\n }\n }\n\n override async connectedCallback() {\n super.connectedCallback()\n }\n\n render() {\n return html`\n <div class=\"flex flex-shrink-0 flex-col p-4\">\n ${!this.userData\n ? this.renderSkeletonLoading()\n : this.renderProfileContent()}\n </div>\n <hr class=\"border-grey-300 mx-4\" />\n `\n }\n}\n"]}
|
|
@@ -1145,6 +1145,10 @@ Constrain images and videos to the parent width and preserve their intrinsic asp
|
|
|
1145
1145
|
width: 100vw;
|
|
1146
1146
|
}
|
|
1147
1147
|
|
|
1148
|
+
.min-w-0 {
|
|
1149
|
+
min-width: 0px;
|
|
1150
|
+
}
|
|
1151
|
+
|
|
1148
1152
|
.max-w-4xl {
|
|
1149
1153
|
max-width: 56rem;
|
|
1150
1154
|
}
|
|
@@ -1205,10 +1209,31 @@ Constrain images and videos to the parent width and preserve their intrinsic asp
|
|
|
1205
1209
|
max-width: 20rem;
|
|
1206
1210
|
}
|
|
1207
1211
|
|
|
1212
|
+
.max-w-full {
|
|
1213
|
+
max-width: 100%;
|
|
1214
|
+
}
|
|
1215
|
+
|
|
1216
|
+
.max-w-fit {
|
|
1217
|
+
max-width: -moz-fit-content;
|
|
1218
|
+
max-width: fit-content;
|
|
1219
|
+
}
|
|
1220
|
+
|
|
1221
|
+
.max-w-\\[200px\\] {
|
|
1222
|
+
max-width: 200px;
|
|
1223
|
+
}
|
|
1224
|
+
|
|
1225
|
+
.flex-1 {
|
|
1226
|
+
flex: 1 1 0%;
|
|
1227
|
+
}
|
|
1228
|
+
|
|
1208
1229
|
.flex-shrink-0 {
|
|
1209
1230
|
flex-shrink: 0;
|
|
1210
1231
|
}
|
|
1211
1232
|
|
|
1233
|
+
.flex-shrink {
|
|
1234
|
+
flex-shrink: 1;
|
|
1235
|
+
}
|
|
1236
|
+
|
|
1212
1237
|
.shrink-0 {
|
|
1213
1238
|
flex-shrink: 0;
|
|
1214
1239
|
}
|
|
@@ -1217,6 +1242,10 @@ Constrain images and videos to the parent width and preserve their intrinsic asp
|
|
|
1217
1242
|
flex-grow: 1;
|
|
1218
1243
|
}
|
|
1219
1244
|
|
|
1245
|
+
.flex-grow-0 {
|
|
1246
|
+
flex-grow: 0;
|
|
1247
|
+
}
|
|
1248
|
+
|
|
1220
1249
|
.rotate-180 {
|
|
1221
1250
|
--tw-rotate: 180deg;
|
|
1222
1251
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y))
|
|
@@ -1455,6 +1484,10 @@ Constrain images and videos to the parent width and preserve their intrinsic asp
|
|
|
1455
1484
|
white-space: nowrap;
|
|
1456
1485
|
}
|
|
1457
1486
|
|
|
1487
|
+
.overflow-ellipsis {
|
|
1488
|
+
text-overflow: ellipsis;
|
|
1489
|
+
}
|
|
1490
|
+
|
|
1458
1491
|
.whitespace-nowrap {
|
|
1459
1492
|
white-space: nowrap;
|
|
1460
1493
|
}
|
|
@@ -1463,10 +1496,18 @@ Constrain images and videos to the parent width and preserve their intrinsic asp
|
|
|
1463
1496
|
text-wrap: wrap;
|
|
1464
1497
|
}
|
|
1465
1498
|
|
|
1499
|
+
.text-nowrap {
|
|
1500
|
+
text-wrap: nowrap;
|
|
1501
|
+
}
|
|
1502
|
+
|
|
1466
1503
|
.break-words {
|
|
1467
1504
|
overflow-wrap: break-word;
|
|
1468
1505
|
}
|
|
1469
1506
|
|
|
1507
|
+
.break-all {
|
|
1508
|
+
word-break: break-all;
|
|
1509
|
+
}
|
|
1510
|
+
|
|
1470
1511
|
.rounded {
|
|
1471
1512
|
border-radius: 0.25rem;
|
|
1472
1513
|
}
|
|
@@ -2617,6 +2658,10 @@ Constrain images and videos to the parent width and preserve their intrinsic asp
|
|
|
2617
2658
|
align-self: flex-end;
|
|
2618
2659
|
}
|
|
2619
2660
|
|
|
2661
|
+
.md\\:whitespace-normal {
|
|
2662
|
+
white-space: normal;
|
|
2663
|
+
}
|
|
2664
|
+
|
|
2620
2665
|
.md\\:rounded {
|
|
2621
2666
|
border-radius: 0.25rem;
|
|
2622
2667
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tailwind.js","sourceRoot":"","sources":["../../tailwind/tailwind.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAm9F1B,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport const TWStyles = css`\n *,\n ::before,\n ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(4 104 203 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n }\n\n ::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(4 104 203 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n }\n\n /*\n! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com\n*/\n\n /*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n *,\n ::before,\n ::after {\n box-sizing: border-box;\n /* 1 */\n border-width: 0;\n /* 2 */\n border-style: solid;\n /* 2 */\n border-color: currentColor;\n /* 2 */\n }\n\n ::before,\n ::after {\n --tw-content: '';\n }\n\n /*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured sans font-family by default.\n5. Use the user's configured sans font-feature-settings by default.\n6. Use the user's configured sans font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\n html,\n :host {\n line-height: 1.5;\n /* 1 */\n -webkit-text-size-adjust: 100%;\n /* 2 */\n -moz-tab-size: 4;\n /* 3 */\n -o-tab-size: 4;\n tab-size: 4;\n /* 3 */\n font-family: 'PT Sans', Arial, Verdana, Helvetica, sans-serif;\n /* 4 */\n font-feature-settings: normal;\n /* 5 */\n font-variation-settings: normal;\n /* 6 */\n -webkit-tap-highlight-color: transparent;\n /* 7 */\n }\n\n /*\n1. Remove the margin in all browsers.\n2. Inherit line-height from html so users can set them as a class directly on the html element.\n*/\n\n body {\n margin: 0;\n /* 1 */\n line-height: inherit;\n /* 2 */\n }\n\n /*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\n hr {\n height: 0;\n /* 1 */\n color: inherit;\n /* 2 */\n border-top-width: 1px;\n /* 3 */\n }\n\n /*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n /*\nRemove the default font size and weight for headings.\n*/\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n /*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\n a {\n color: inherit;\n text-decoration: inherit;\n }\n\n /*\nAdd the correct font weight in Edge and Safari.\n*/\n\n b,\n strong {\n font-weight: bolder;\n }\n\n /*\n1. Use the user's configured mono font-family by default.\n2. Use the user's configured mono font-feature-settings by default.\n3. Use the user's configured mono font-variation-settings by default.\n4. Correct the odd em font sizing in all browsers.\n*/\n\n code,\n kbd,\n samp,\n pre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,\n 'Liberation Mono', 'Courier New', monospace;\n /* 1 */\n font-feature-settings: normal;\n /* 2 */\n font-variation-settings: normal;\n /* 3 */\n font-size: 1em;\n /* 4 */\n }\n\n /*\nAdd the correct font size in all browsers.\n*/\n\n small {\n font-size: 80%;\n }\n\n /*\nPrevent sub and sup elements from affecting the line height in all browsers.\n*/\n\n sub,\n sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n\n sub {\n bottom: -0.25em;\n }\n\n sup {\n top: -0.5em;\n }\n\n /*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\n table {\n text-indent: 0;\n /* 1 */\n border-color: inherit;\n /* 2 */\n border-collapse: collapse;\n /* 3 */\n }\n\n /*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\n button,\n input,\n optgroup,\n select,\n textarea {\n font-family: inherit;\n /* 1 */\n font-feature-settings: inherit;\n /* 1 */\n font-variation-settings: inherit;\n /* 1 */\n font-size: 100%;\n /* 1 */\n font-weight: inherit;\n /* 1 */\n line-height: inherit;\n /* 1 */\n letter-spacing: inherit;\n /* 1 */\n color: inherit;\n /* 1 */\n margin: 0;\n /* 2 */\n padding: 0;\n /* 3 */\n }\n\n /*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\n button,\n select {\n text-transform: none;\n }\n\n /*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\n button,\n input:where([type='button']),\n input:where([type='reset']),\n input:where([type='submit']) {\n -webkit-appearance: button;\n /* 1 */\n background-color: transparent;\n /* 2 */\n background-image: none;\n /* 2 */\n }\n\n /*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n :-moz-focusring {\n outline: auto;\n }\n\n /*\nRemove the additional :invalid styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n /*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\n progress {\n vertical-align: baseline;\n }\n\n /*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n ::-webkit-inner-spin-button,\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n /*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n [type='search'] {\n -webkit-appearance: textfield;\n /* 1 */\n outline-offset: -2px;\n /* 2 */\n }\n\n /*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n /*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to inherit in Safari.\n*/\n\n ::-webkit-file-upload-button {\n -webkit-appearance: button;\n /* 1 */\n font: inherit;\n /* 2 */\n }\n\n /*\nAdd the correct display in Chrome and Safari.\n*/\n\n summary {\n display: list-item;\n }\n\n /*\nRemoves the default spacing and border for appropriate elements.\n*/\n\n blockquote,\n dl,\n dd,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n hr,\n figure,\n p,\n pre {\n margin: 0;\n }\n\n fieldset {\n margin: 0;\n padding: 0;\n }\n\n legend {\n padding: 0;\n }\n\n ol,\n ul,\n menu {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n\n /*\nReset default styling for dialogs.\n*/\n\n dialog {\n padding: 0;\n }\n\n /*\nPrevent resizing textareas horizontally by default.\n*/\n\n textarea {\n resize: vertical;\n }\n\n /*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\n input::-moz-placeholder,\n textarea::-moz-placeholder {\n opacity: 1;\n /* 1 */\n color: #9ca3af;\n /* 2 */\n }\n\n input::placeholder,\n textarea::placeholder {\n opacity: 1;\n /* 1 */\n color: #9ca3af;\n /* 2 */\n }\n\n /*\nSet the default cursor for buttons.\n*/\n\n button,\n [role='button'] {\n cursor: pointer;\n }\n\n /*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n\n :disabled {\n cursor: default;\n }\n\n /*\n1. Make replaced elements display: block by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add vertical-align: middle to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\n img,\n svg,\n video,\n canvas,\n audio,\n iframe,\n embed,\n object {\n display: block;\n /* 1 */\n vertical-align: middle;\n /* 2 */\n }\n\n /*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\n img,\n video {\n max-width: 100%;\n height: auto;\n }\n\n /* Make elements with the HTML hidden attribute stay hidden by default */\n\n [hidden]:where(:not([hidden='until-found'])) {\n display: none;\n }\n\n .collapse {\n visibility: collapse;\n }\n\n .static {\n position: static;\n }\n\n .fixed {\n position: fixed;\n }\n\n .absolute {\n position: absolute;\n }\n\n .relative {\n position: relative;\n }\n\n .sticky {\n position: sticky;\n }\n\n .inset-0 {\n inset: 0px;\n }\n\n .-bottom-6 {\n bottom: -1.5rem;\n }\n\n .-right-\\\\[5\\\\%\\\\] {\n right: -5%;\n }\n\n .-top-1\\\\.5 {\n top: -0.375rem;\n }\n\n .-top-2 {\n top: -0.5rem;\n }\n\n .-top-\\\\[11px\\\\] {\n top: -11px;\n }\n\n .-top-\\\\[12px\\\\] {\n top: -12px;\n }\n\n .bottom-0 {\n bottom: 0px;\n }\n\n .left-0 {\n left: 0px;\n }\n\n .left-2\\\\.5 {\n left: 0.625rem;\n }\n\n .left-4 {\n left: 1rem;\n }\n\n .left-\\\\[80\\\\%\\\\] {\n left: 80%;\n }\n\n .right-0 {\n right: 0px;\n }\n\n .right-4 {\n right: 1rem;\n }\n\n .top-0 {\n top: 0px;\n }\n\n .top-4 {\n top: 1rem;\n }\n\n .top-full {\n top: 100%;\n }\n\n .z-0 {\n z-index: 0;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .z-20 {\n z-index: 20;\n }\n\n .z-50 {\n z-index: 50;\n }\n\n .z-\\\\[100\\\\] {\n z-index: 100;\n }\n\n .z-\\\\[999\\\\] {\n z-index: 999;\n }\n\n .order-1 {\n order: 1;\n }\n\n .order-2 {\n order: 2;\n }\n\n .col-span-2 {\n grid-column: span 2 / span 2;\n }\n\n .col-span-4 {\n grid-column: span 4 / span 4;\n }\n\n .m-auto {\n margin: auto;\n }\n\n .mx-1 {\n margin-left: 0.25rem;\n margin-right: 0.25rem;\n }\n\n .mx-2 {\n margin-left: 0.5rem;\n margin-right: 0.5rem;\n }\n\n .mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n }\n\n .mx-6 {\n margin-left: 1.5rem;\n margin-right: 1.5rem;\n }\n\n .mx-auto {\n margin-left: auto;\n margin-right: auto;\n }\n\n .my-1 {\n margin-top: 0.25rem;\n margin-bottom: 0.25rem;\n }\n\n .my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n }\n\n .my-5 {\n margin-top: 1.25rem;\n margin-bottom: 1.25rem;\n }\n\n .my-6 {\n margin-top: 1.5rem;\n margin-bottom: 1.5rem;\n }\n\n .-ml-2 {\n margin-left: -0.5rem;\n }\n\n .-mt-24 {\n margin-top: -6rem;\n }\n\n .-mt-7 {\n margin-top: -1.75rem;\n }\n\n .-mt-\\\\[72px\\\\] {\n margin-top: -72px;\n }\n\n .mb-0 {\n margin-bottom: 0px;\n }\n\n .mb-1 {\n margin-bottom: 0.25rem;\n }\n\n .mb-2 {\n margin-bottom: 0.5rem;\n }\n\n .mb-3 {\n margin-bottom: 0.75rem;\n }\n\n .mb-4 {\n margin-bottom: 1rem;\n }\n\n .mb-5 {\n margin-bottom: 1.25rem;\n }\n\n .mb-6 {\n margin-bottom: 1.5rem;\n }\n\n .mb-8 {\n margin-bottom: 2rem;\n }\n\n .ml-1 {\n margin-left: 0.25rem;\n }\n\n .ml-2 {\n margin-left: 0.5rem;\n }\n\n .ml-3 {\n margin-left: 0.75rem;\n }\n\n .ml-4 {\n margin-left: 1rem;\n }\n\n .ml-6 {\n margin-left: 1.5rem;\n }\n\n .ml-8 {\n margin-left: 2rem;\n }\n\n .ml-auto {\n margin-left: auto;\n }\n\n .mr-1 {\n margin-right: 0.25rem;\n }\n\n .mr-10 {\n margin-right: 2.5rem;\n }\n\n .mr-2 {\n margin-right: 0.5rem;\n }\n\n .mr-3 {\n margin-right: 0.75rem;\n }\n\n .mr-4 {\n margin-right: 1rem;\n }\n\n .mr-6 {\n margin-right: 1.5rem;\n }\n\n .mt-0\\\\.5 {\n margin-top: 0.125rem;\n }\n\n .mt-1 {\n margin-top: 0.25rem;\n }\n\n .mt-10 {\n margin-top: 2.5rem;\n }\n\n .mt-2 {\n margin-top: 0.5rem;\n }\n\n .mt-3 {\n margin-top: 0.75rem;\n }\n\n .mt-4 {\n margin-top: 1rem;\n }\n\n .mt-5 {\n margin-top: 1.25rem;\n }\n\n .mt-6 {\n margin-top: 1.5rem;\n }\n\n .mt-8 {\n margin-top: 2rem;\n }\n\n .block {\n display: block;\n }\n\n .flex {\n display: flex;\n }\n\n .inline-flex {\n display: inline-flex;\n }\n\n .grid {\n display: grid;\n }\n\n .hidden {\n display: none;\n }\n\n .aspect-video {\n aspect-ratio: 16 / 9;\n }\n\n .h-10 {\n height: 2.5rem;\n }\n\n .h-12 {\n height: 3rem;\n }\n\n .h-14 {\n height: 3.5rem;\n }\n\n .h-16 {\n height: 4rem;\n }\n\n .h-2 {\n height: 0.5rem;\n }\n\n .h-20 {\n height: 5rem;\n }\n\n .h-3 {\n height: 0.75rem;\n }\n\n .h-4 {\n height: 1rem;\n }\n\n .h-5 {\n height: 1.25rem;\n }\n\n .h-6 {\n height: 1.5rem;\n }\n\n .h-8 {\n height: 2rem;\n }\n\n .h-9 {\n height: 2.25rem;\n }\n\n .h-\\\\[17px\\\\] {\n height: 17px;\n }\n\n .h-\\\\[300px\\\\] {\n height: 300px;\n }\n\n .h-\\\\[68px\\\\] {\n height: 68px;\n }\n\n .h-auto {\n height: auto;\n }\n\n .h-full {\n height: 100%;\n }\n\n .h-max {\n height: -moz-max-content;\n height: max-content;\n }\n\n .h-screen {\n height: 100vh;\n }\n\n .max-h-40 {\n max-height: 10rem;\n }\n\n .max-h-\\\\[116px\\\\] {\n max-height: 116px;\n }\n\n .max-h-\\\\[150px\\\\] {\n max-height: 150px;\n }\n\n .max-h-\\\\[577px\\\\] {\n max-height: 577px;\n }\n\n .max-h-fit {\n max-height: -moz-fit-content;\n max-height: fit-content;\n }\n\n .max-h-full {\n max-height: 100%;\n }\n\n .min-h-\\\\[68px\\\\] {\n min-height: 68px;\n }\n\n .min-h-\\\\[76px\\\\] {\n min-height: 76px;\n }\n\n .w-1\\\\/2 {\n width: 50%;\n }\n\n .w-1\\\\/3 {\n width: 33.333333%;\n }\n\n .w-1\\\\/4 {\n width: 25%;\n }\n\n .w-10 {\n width: 2.5rem;\n }\n\n .w-11\\\\/12 {\n width: 91.666667%;\n }\n\n .w-14 {\n width: 3.5rem;\n }\n\n .w-16 {\n width: 4rem;\n }\n\n .w-2 {\n width: 0.5rem;\n }\n\n .w-2\\\\/3 {\n width: 66.666667%;\n }\n\n .w-20 {\n width: 5rem;\n }\n\n .w-3 {\n width: 0.75rem;\n }\n\n .w-3\\\\/4 {\n width: 75%;\n }\n\n .w-32 {\n width: 8rem;\n }\n\n .w-4 {\n width: 1rem;\n }\n\n .w-40 {\n width: 10rem;\n }\n\n .w-5 {\n width: 1.25rem;\n }\n\n .w-6 {\n width: 1.5rem;\n }\n\n .w-60 {\n width: 15rem;\n }\n\n .w-76 {\n width: 19rem;\n }\n\n .w-8 {\n width: 2rem;\n }\n\n .w-9 {\n width: 2.25rem;\n }\n\n .w-\\\\[112px\\\\] {\n width: 112px;\n }\n\n .w-\\\\[120px\\\\] {\n width: 120px;\n }\n\n .w-\\\\[138px\\\\] {\n width: 138px;\n }\n\n .w-\\\\[216px\\\\] {\n width: 216px;\n }\n\n .w-\\\\[276px\\\\] {\n width: 276px;\n }\n\n .w-\\\\[296px\\\\] {\n width: 296px;\n }\n\n .w-\\\\[328px\\\\] {\n width: 328px;\n }\n\n .w-auto {\n width: auto;\n }\n\n .w-fit {\n width: -moz-fit-content;\n width: fit-content;\n }\n\n .w-full {\n width: 100%;\n }\n\n .w-max {\n width: -moz-max-content;\n width: max-content;\n }\n\n .w-screen {\n width: 100vw;\n }\n\n .max-w-4xl {\n max-width: 56rem;\n }\n\n .max-w-5xl {\n max-width: 64rem;\n }\n\n .max-w-7xl {\n max-width: 80rem;\n }\n\n .max-w-\\\\[1200px\\\\] {\n max-width: 1200px;\n }\n\n .max-w-\\\\[190px\\\\] {\n max-width: 190px;\n }\n\n .max-w-\\\\[214px\\\\] {\n max-width: 214px;\n }\n\n .max-w-\\\\[242px\\\\] {\n max-width: 242px;\n }\n\n .max-w-\\\\[300px\\\\] {\n max-width: 300px;\n }\n\n .max-w-\\\\[460px\\\\] {\n max-width: 460px;\n }\n\n .max-w-\\\\[492px\\\\] {\n max-width: 492px;\n }\n\n .max-w-\\\\[624px\\\\] {\n max-width: 624px;\n }\n\n .max-w-screen-md {\n max-width: 768px;\n }\n\n .max-w-screen-sm {\n max-width: 640px;\n }\n\n .max-w-xl {\n max-width: 36rem;\n }\n\n .max-w-xs {\n max-width: 20rem;\n }\n\n .flex-shrink-0 {\n flex-shrink: 0;\n }\n\n .shrink-0 {\n flex-shrink: 0;\n }\n\n .flex-grow {\n flex-grow: 1;\n }\n\n .rotate-180 {\n --tw-rotate: 180deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n }\n\n .transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n }\n\n @keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n }\n\n .animate-pulse {\n animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n }\n\n @keyframes spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .select-none {\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n\n .snap-x {\n scroll-snap-type: x var(--tw-scroll-snap-strictness);\n }\n\n .snap-start {\n scroll-snap-align: start;\n }\n\n .scroll-mx-4 {\n scroll-margin-left: 1rem;\n scroll-margin-right: 1rem;\n }\n\n .grid-flow-row {\n grid-auto-flow: row;\n }\n\n .grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .grid-cols-5 {\n grid-template-columns: repeat(5, minmax(0, 1fr));\n }\n\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n\n .flex-row {\n flex-direction: row;\n }\n\n .flex-col {\n flex-direction: column;\n }\n\n .flex-col-reverse {\n flex-direction: column-reverse;\n }\n\n .flex-wrap {\n flex-wrap: wrap;\n }\n\n .flex-nowrap {\n flex-wrap: nowrap;\n }\n\n .place-items-center {\n place-items: center;\n }\n\n .items-start {\n align-items: flex-start;\n }\n\n .items-end {\n align-items: flex-end;\n }\n\n .items-center {\n align-items: center;\n }\n\n .items-baseline {\n align-items: baseline;\n }\n\n .justify-start {\n justify-content: flex-start;\n }\n\n .justify-end {\n justify-content: flex-end;\n }\n\n .justify-center {\n justify-content: center;\n }\n\n .justify-between {\n justify-content: space-between;\n }\n\n .justify-evenly {\n justify-content: space-evenly;\n }\n\n .gap-1 {\n gap: 0.25rem;\n }\n\n .gap-2 {\n gap: 0.5rem;\n }\n\n .gap-3 {\n gap: 0.75rem;\n }\n\n .gap-4 {\n gap: 1rem;\n }\n\n .gap-6 {\n gap: 1.5rem;\n }\n\n .gap-8 {\n gap: 2rem;\n }\n\n .gap-y-2 {\n row-gap: 0.5rem;\n }\n\n .gap-y-4 {\n row-gap: 1rem;\n }\n\n .space-x-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.5rem * var(--tw-space-x-reverse));\n margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .space-x-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.75rem * var(--tw-space-x-reverse));\n margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .space-x-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(1rem * var(--tw-space-x-reverse));\n margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .space-y-1 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));\n }\n\n .space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n }\n\n .space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n }\n\n .self-center {\n align-self: center;\n }\n\n .overflow-auto {\n overflow: auto;\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .overflow-x-scroll {\n overflow-x: scroll;\n }\n\n .overflow-y-scroll {\n overflow-y: scroll;\n }\n\n .truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-wrap {\n text-wrap: wrap;\n }\n\n .break-words {\n overflow-wrap: break-word;\n }\n\n .rounded {\n border-radius: 0.25rem;\n }\n\n .rounded-\\\\[10px\\\\] {\n border-radius: 10px;\n }\n\n .rounded-full {\n border-radius: 9999px;\n }\n\n .rounded-lg {\n border-radius: 0.5rem;\n }\n\n .rounded-md {\n border-radius: 0.375rem;\n }\n\n .rounded-sm {\n border-radius: 0.125rem;\n }\n\n .rounded-xl {\n border-radius: 0.75rem;\n }\n\n .rounded-b-xl {\n border-bottom-right-radius: 0.75rem;\n border-bottom-left-radius: 0.75rem;\n }\n\n .border {\n border-width: 1px;\n }\n\n .border-2 {\n border-width: 2px;\n }\n\n .border-b {\n border-bottom-width: 1px;\n }\n\n .border-b-2 {\n border-bottom-width: 2px;\n }\n\n .border-t {\n border-top-width: 1px;\n }\n\n .border-\\\\[\\\\#DDD\\\\] {\n --tw-border-opacity: 1;\n border-color: rgb(221 221 221 / var(--tw-border-opacity, 1));\n }\n\n .border-blue-200 {\n --tw-border-opacity: 1;\n border-color: rgb(147 200 253 / var(--tw-border-opacity, 1));\n }\n\n .border-brand-1 {\n --tw-border-opacity: 1;\n border-color: rgb(0 85 154 / var(--tw-border-opacity, 1));\n }\n\n .border-dark-6 {\n --tw-border-opacity: 1;\n border-color: rgb(46 46 46 / var(--tw-border-opacity, 1));\n }\n\n .border-dark-8 {\n --tw-border-opacity: 1;\n border-color: rgb(136 136 136 / var(--tw-border-opacity, 1));\n }\n\n .border-dark-9 {\n --tw-border-opacity: 1;\n border-color: rgb(35 35 35 / var(--tw-border-opacity, 1));\n }\n\n .border-green-400 {\n --tw-border-opacity: 1;\n border-color: rgb(106 195 34 / var(--tw-border-opacity, 1));\n }\n\n .border-green-500 {\n --tw-border-opacity: 1;\n border-color: rgb(80 167 24 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-100 {\n --tw-border-opacity: 1;\n border-color: rgb(244 244 244 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-200 {\n --tw-border-opacity: 1;\n border-color: rgb(238 238 238 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-300 {\n --tw-border-opacity: 1;\n border-color: rgb(221 221 221 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-400 {\n --tw-border-opacity: 1;\n border-color: rgb(153 153 153 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-500 {\n --tw-border-opacity: 1;\n border-color: rgb(102 102 102 / var(--tw-border-opacity, 1));\n }\n\n .border-white {\n --tw-border-opacity: 1;\n border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n }\n\n .border-yellow-400 {\n --tw-border-opacity: 1;\n border-color: rgb(255 204 0 / var(--tw-border-opacity, 1));\n }\n\n .bg-\\\\[\\\\#00000066\\\\] {\n background-color: #00000066;\n }\n\n .bg-\\\\[\\\\#2C2C2C\\\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(44 44 44 / var(--tw-bg-opacity, 1));\n }\n\n .bg-\\\\[\\\\#D71920\\\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(215 25 32 / var(--tw-bg-opacity, 1));\n }\n\n .bg-\\\\[\\\\#FFF8D6\\\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 248 214 / var(--tw-bg-opacity, 1));\n }\n\n .bg-\\\\[\\\\#FFFFFF\\\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n }\n\n .bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n }\n\n .bg-blue-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(225 240 255 / var(--tw-bg-opacity, 1));\n }\n\n .bg-blue-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(147 200 253 / var(--tw-bg-opacity, 1));\n }\n\n .bg-blue-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(3 86 168 / var(--tw-bg-opacity, 1));\n }\n\n .bg-brand-1 {\n --tw-bg-opacity: 1;\n background-color: rgb(0 85 154 / var(--tw-bg-opacity, 1));\n }\n\n .bg-dark-3 {\n --tw-bg-opacity: 1;\n background-color: rgb(37 37 37 / var(--tw-bg-opacity, 1));\n }\n\n .bg-dark-4 {\n --tw-bg-opacity: 1;\n background-color: rgb(30 30 30 / var(--tw-bg-opacity, 1));\n }\n\n .bg-dark-5 {\n --tw-bg-opacity: 1;\n background-color: rgb(18 18 18 / var(--tw-bg-opacity, 1));\n }\n\n .bg-dark-6 {\n --tw-bg-opacity: 1;\n background-color: rgb(46 46 46 / var(--tw-bg-opacity, 1));\n }\n\n .bg-green-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(238 252 210 / var(--tw-bg-opacity, 1));\n }\n\n .bg-green-300 {\n --tw-bg-opacity: 1;\n background-color: rgb(151 219 83 / var(--tw-bg-opacity, 1));\n }\n\n .bg-green-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(80 167 24 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(238 238 238 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-300 {\n --tw-bg-opacity: 1;\n background-color: rgb(221 221 221 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(102 102 102 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(51 51 51 / var(--tw-bg-opacity, 1));\n }\n\n .bg-orange-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 238 204 / var(--tw-bg-opacity, 1));\n }\n\n .bg-orange-400 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 122 0 / var(--tw-bg-opacity, 1));\n }\n\n .bg-red-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 225 207 / var(--tw-bg-opacity, 1));\n }\n\n .bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n }\n\n .bg-yellow-300 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 220 63 / var(--tw-bg-opacity, 1));\n }\n\n .bg-yellow-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(219 170 0 / var(--tw-bg-opacity, 1));\n }\n\n .bg-opacity-75 {\n --tw-bg-opacity: 0.75;\n }\n\n .object-cover {\n -o-object-fit: cover;\n object-fit: cover;\n }\n\n .object-scale-down {\n -o-object-fit: scale-down;\n object-fit: scale-down;\n }\n\n .p-1 {\n padding: 0.25rem;\n }\n\n .p-1\\\\.5 {\n padding: 0.375rem;\n }\n\n .p-2 {\n padding: 0.5rem;\n }\n\n .p-3 {\n padding: 0.75rem;\n }\n\n .p-4 {\n padding: 1rem;\n }\n\n .p-5 {\n padding: 1.25rem;\n }\n\n .p-6 {\n padding: 1.5rem;\n }\n\n .px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n\n .px-1\\\\.5 {\n padding-left: 0.375rem;\n padding-right: 0.375rem;\n }\n\n .px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n }\n\n .px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n }\n\n .px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n\n .px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n }\n\n .px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n }\n\n .px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n }\n\n .px-\\\\[10px\\\\] {\n padding-left: 10px;\n padding-right: 10px;\n }\n\n .px-\\\\[22px\\\\] {\n padding-left: 22px;\n padding-right: 22px;\n }\n\n .py-0\\\\.5 {\n padding-top: 0.125rem;\n padding-bottom: 0.125rem;\n }\n\n .py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n }\n\n .py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n }\n\n .py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n }\n\n .py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n }\n\n .py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n }\n\n .py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n }\n\n .py-\\\\[5\\\\.6px\\\\] {\n padding-top: 5.6px;\n padding-bottom: 5.6px;\n }\n\n .pb-1 {\n padding-bottom: 0.25rem;\n }\n\n .pb-2 {\n padding-bottom: 0.5rem;\n }\n\n .pb-20 {\n padding-bottom: 5rem;\n }\n\n .pb-3 {\n padding-bottom: 0.75rem;\n }\n\n .pb-32 {\n padding-bottom: 8rem;\n }\n\n .pb-4 {\n padding-bottom: 1rem;\n }\n\n .pb-5 {\n padding-bottom: 1.25rem;\n }\n\n .pb-6 {\n padding-bottom: 1.5rem;\n }\n\n .pb-8 {\n padding-bottom: 2rem;\n }\n\n .pl-0\\\\.5 {\n padding-left: 0.125rem;\n }\n\n .pl-1 {\n padding-left: 0.25rem;\n }\n\n .pl-14 {\n padding-left: 3.5rem;\n }\n\n .pl-2 {\n padding-left: 0.5rem;\n }\n\n .pl-4 {\n padding-left: 1rem;\n }\n\n .pl-px {\n padding-left: 1px;\n }\n\n .pr-1 {\n padding-right: 0.25rem;\n }\n\n .pr-2 {\n padding-right: 0.5rem;\n }\n\n .pr-3 {\n padding-right: 0.75rem;\n }\n\n .pt-0 {\n padding-top: 0px;\n }\n\n .pt-1 {\n padding-top: 0.25rem;\n }\n\n .pt-10 {\n padding-top: 2.5rem;\n }\n\n .pt-2 {\n padding-top: 0.5rem;\n }\n\n .pt-3 {\n padding-top: 0.75rem;\n }\n\n .pt-4 {\n padding-top: 1rem;\n }\n\n .pt-6 {\n padding-top: 1.5rem;\n }\n\n .pt-\\\\[5px\\\\] {\n padding-top: 5px;\n }\n\n .text-left {\n text-align: left;\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-start {\n text-align: start;\n }\n\n .align-baseline {\n vertical-align: baseline;\n }\n\n .font-sans {\n font-family: 'PT Sans', Arial, Verdana, Helvetica, sans-serif;\n }\n\n .font-serif {\n font-family: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;\n }\n\n .text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n }\n\n .text-\\\\[11px\\\\] {\n font-size: 11px;\n }\n\n .text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n .text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n }\n\n .text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n }\n\n .text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n }\n\n .text-xxs {\n font-size: 0.625rem;\n }\n\n .font-bold {\n font-weight: 700;\n }\n\n .font-medium {\n font-weight: 500;\n }\n\n .font-normal {\n font-weight: 400;\n }\n\n .uppercase {\n text-transform: uppercase;\n }\n\n .capitalize {\n text-transform: capitalize;\n }\n\n .leading-4 {\n line-height: 1rem;\n }\n\n .leading-5 {\n line-height: 1.25rem;\n }\n\n .leading-6 {\n line-height: 1.5rem;\n }\n\n .leading-\\\\[150\\\\%\\\\] {\n line-height: 150%;\n }\n\n .leading-\\\\[18px\\\\] {\n line-height: 18px;\n }\n\n .leading-\\\\[22px\\\\] {\n line-height: 22px;\n }\n\n .leading-\\\\[30px\\\\] {\n line-height: 30px;\n }\n\n .leading-none {\n line-height: 1;\n }\n\n .leading-normal {\n line-height: 1.5;\n }\n\n .leading-tight {\n line-height: 1.25;\n }\n\n .tracking-normal {\n letter-spacing: 0em;\n }\n\n .tracking-wide {\n letter-spacing: 0.025em;\n }\n\n .text-\\\\[\\\\#00559a\\\\] {\n --tw-text-opacity: 1;\n color: rgb(0 85 154 / var(--tw-text-opacity, 1));\n }\n\n .text-\\\\[\\\\#666666\\\\] {\n --tw-text-opacity: 1;\n color: rgb(102 102 102 / var(--tw-text-opacity, 1));\n }\n\n .text-\\\\[\\\\#F57A7A\\\\] {\n --tw-text-opacity: 1;\n color: rgb(245 122 122 / var(--tw-text-opacity, 1));\n }\n\n .text-\\\\[\\\\#FFFFFF\\\\] {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n }\n\n .text-black {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity, 1));\n }\n\n .text-blue-200 {\n --tw-text-opacity: 1;\n color: rgb(147 200 253 / var(--tw-text-opacity, 1));\n }\n\n .text-blue-300 {\n --tw-text-opacity: 1;\n color: rgb(90 171 252 / var(--tw-text-opacity, 1));\n }\n\n .text-blue-500 {\n --tw-text-opacity: 1;\n color: rgb(4 104 203 / var(--tw-text-opacity, 1));\n }\n\n .text-blue-600 {\n --tw-text-opacity: 1;\n color: rgb(3 86 168 / var(--tw-text-opacity, 1));\n }\n\n .text-brand-1 {\n --tw-text-opacity: 1;\n color: rgb(0 85 154 / var(--tw-text-opacity, 1));\n }\n\n .text-dark-5 {\n --tw-text-opacity: 1;\n color: rgb(18 18 18 / var(--tw-text-opacity, 1));\n }\n\n .text-dark-6 {\n --tw-text-opacity: 1;\n color: rgb(46 46 46 / var(--tw-text-opacity, 1));\n }\n\n .text-dark-7 {\n --tw-text-opacity: 1;\n color: rgb(224 224 224 / var(--tw-text-opacity, 1));\n }\n\n .text-green-300 {\n --tw-text-opacity: 1;\n color: rgb(151 219 83 / var(--tw-text-opacity, 1));\n }\n\n .text-green-400 {\n --tw-text-opacity: 1;\n color: rgb(106 195 34 / var(--tw-text-opacity, 1));\n }\n\n .text-green-500 {\n --tw-text-opacity: 1;\n color: rgb(80 167 24 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-100 {\n --tw-text-opacity: 1;\n color: rgb(244 244 244 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-200 {\n --tw-text-opacity: 1;\n color: rgb(238 238 238 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-300 {\n --tw-text-opacity: 1;\n color: rgb(221 221 221 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-400 {\n --tw-text-opacity: 1;\n color: rgb(153 153 153 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-500 {\n --tw-text-opacity: 1;\n color: rgb(102 102 102 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-600 {\n --tw-text-opacity: 1;\n color: rgb(51 51 51 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-700 {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity, 1));\n }\n\n .text-orange-400 {\n --tw-text-opacity: 1;\n color: rgb(255 122 0 / var(--tw-text-opacity, 1));\n }\n\n .text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(219 93 0 / var(--tw-text-opacity, 1));\n }\n\n .text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(208 13 18 / var(--tw-text-opacity, 1));\n }\n\n .text-red-600 {\n --tw-text-opacity: 1;\n color: rgb(174 9 27 / var(--tw-text-opacity, 1));\n }\n\n .text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n }\n\n .text-yellow-700 {\n --tw-text-opacity: 1;\n color: rgb(122 87 0 / var(--tw-text-opacity, 1));\n }\n\n .underline {\n text-decoration-line: underline;\n }\n\n .line-through {\n text-decoration-line: line-through;\n }\n\n .no-underline {\n text-decoration-line: none;\n }\n\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color),\n 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n }\n\n .shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n }\n\n .outline {\n outline-style: solid;\n }\n\n .outline-2 {\n outline-width: 2px;\n }\n\n .outline-yellow-400 {\n outline-color: #ffcc00;\n }\n\n .filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)\n var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)\n var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n }\n\n .transition {\n transition-property: color, background-color, border-color,\n text-decoration-color, fill, stroke, opacity, box-shadow, transform,\n filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color,\n text-decoration-color, fill, stroke, opacity, box-shadow, transform,\n filter, backdrop-filter;\n transition-property: color, background-color, border-color,\n text-decoration-color, fill, stroke, opacity, box-shadow, transform,\n filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n }\n\n .transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n }\n\n .hover\\\\:bg-\\\\[\\\\#f4f4f4\\\\]:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));\n }\n\n .hover\\\\:text-\\\\[\\\\#222222\\\\]:hover {\n --tw-text-opacity: 1;\n color: rgb(34 34 34 / var(--tw-text-opacity, 1));\n }\n\n .hover\\\\:underline:hover {\n text-decoration-line: underline;\n }\n\n .focus\\\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n .group:hover .group-hover\\\\:block {\n display: block;\n }\n\n @media (min-width: 640px) {\n .sm\\\\:block {\n display: block;\n }\n\n .sm\\\\:inline {\n display: inline;\n }\n\n .sm\\\\:w-3\\\\/4 {\n width: 75%;\n }\n\n .sm\\\\:max-w-lg {\n max-width: 32rem;\n }\n\n .sm\\\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .sm\\\\:justify-center {\n justify-content: center;\n }\n\n .sm\\\\:gap-6 {\n gap: 1.5rem;\n }\n\n .sm\\\\:px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n\n @media (min-width: 768px) {\n .md\\\\:mx-0 {\n margin-left: 0px;\n margin-right: 0px;\n }\n\n .md\\\\:my-8 {\n margin-top: 2rem;\n margin-bottom: 2rem;\n }\n\n .md\\\\:my-auto {\n margin-top: auto;\n margin-bottom: auto;\n }\n\n .md\\\\:mb-0 {\n margin-bottom: 0px;\n }\n\n .md\\\\:mb-5 {\n margin-bottom: 1.25rem;\n }\n\n .md\\\\:ml-6 {\n margin-left: 1.5rem;\n }\n\n .md\\\\:mr-6 {\n margin-right: 1.5rem;\n }\n\n .md\\\\:mt-10 {\n margin-top: 2.5rem;\n }\n\n .md\\\\:mt-2 {\n margin-top: 0.5rem;\n }\n\n .md\\\\:mt-3 {\n margin-top: 0.75rem;\n }\n\n .md\\\\:mt-4 {\n margin-top: 1rem;\n }\n\n .md\\\\:mt-5 {\n margin-top: 1.25rem;\n }\n\n .md\\\\:mt-7 {\n margin-top: 1.75rem;\n }\n\n .md\\\\:block {\n display: block;\n }\n\n .md\\\\:flex {\n display: flex;\n }\n\n .md\\\\:hidden {\n display: none;\n }\n\n .md\\\\:h-12 {\n height: 3rem;\n }\n\n .md\\\\:h-5 {\n height: 1.25rem;\n }\n\n .md\\\\:h-6 {\n height: 1.5rem;\n }\n\n .md\\\\:max-h-\\\\[220px\\\\] {\n max-height: 220px;\n }\n\n .md\\\\:min-h-\\\\[244px\\\\] {\n min-height: 244px;\n }\n\n .md\\\\:min-h-\\\\[68px\\\\] {\n min-height: 68px;\n }\n\n .md\\\\:w-1\\\\/2 {\n width: 50%;\n }\n\n .md\\\\:w-3\\\\/5 {\n width: 60%;\n }\n\n .md\\\\:w-40 {\n width: 10rem;\n }\n\n .md\\\\:w-5 {\n width: 1.25rem;\n }\n\n .md\\\\:w-5\\\\/12 {\n width: 41.666667%;\n }\n\n .md\\\\:w-52 {\n width: 13rem;\n }\n\n .md\\\\:w-6 {\n width: 1.5rem;\n }\n\n .md\\\\:w-\\\\[350px\\\\] {\n width: 350px;\n }\n\n .md\\\\:w-\\\\[370px\\\\] {\n width: 370px;\n }\n\n .md\\\\:w-\\\\[374px\\\\] {\n width: 374px;\n }\n\n .md\\\\:w-\\\\[400px\\\\] {\n width: 400px;\n }\n\n .md\\\\:w-\\\\[580px\\\\] {\n width: 580px;\n }\n\n .md\\\\:w-auto {\n width: auto;\n }\n\n .md\\\\:w-full {\n width: 100%;\n }\n\n .md\\\\:max-w-\\\\[137px\\\\] {\n max-width: 137px;\n }\n\n .md\\\\:max-w-\\\\[200px\\\\] {\n max-width: 200px;\n }\n\n .md\\\\:max-w-\\\\[321px\\\\] {\n max-width: 321px;\n }\n\n .md\\\\:max-w-\\\\[492px\\\\] {\n max-width: 492px;\n }\n\n .md\\\\:max-w-\\\\[737px\\\\] {\n max-width: 737px;\n }\n\n .md\\\\:max-w-sm {\n max-width: 24rem;\n }\n\n .md\\\\:grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .md\\\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .md\\\\:flex-row {\n flex-direction: row;\n }\n\n .md\\\\:flex-col {\n flex-direction: column;\n }\n\n .md\\\\:items-start {\n align-items: flex-start;\n }\n\n .md\\\\:items-center {\n align-items: center;\n }\n\n .md\\\\:justify-start {\n justify-content: flex-start;\n }\n\n .md\\\\:justify-center {\n justify-content: center;\n }\n\n .md\\\\:justify-between {\n justify-content: space-between;\n }\n\n .md\\\\:gap-3 {\n gap: 0.75rem;\n }\n\n .md\\\\:gap-8 {\n gap: 2rem;\n }\n\n .md\\\\:space-x-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(1rem * var(--tw-space-x-reverse));\n margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .md\\\\:space-x-5 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(1.25rem * var(--tw-space-x-reverse));\n margin-left: calc(1.25rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .md\\\\:space-y-0 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0px * var(--tw-space-y-reverse));\n }\n\n .md\\\\:space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n }\n\n .md\\\\:self-start {\n align-self: flex-start;\n }\n\n .md\\\\:self-end {\n align-self: flex-end;\n }\n\n .md\\\\:rounded {\n border-radius: 0.25rem;\n }\n\n .md\\\\:rounded-lg {\n border-radius: 0.5rem;\n }\n\n .md\\\\:p-10 {\n padding: 2.5rem;\n }\n\n .md\\\\:p-16 {\n padding: 4rem;\n }\n\n .md\\\\:p-5 {\n padding: 1.25rem;\n }\n\n .md\\\\:px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n\n .md\\\\:px-10 {\n padding-left: 2.5rem;\n padding-right: 2.5rem;\n }\n\n .md\\\\:px-20 {\n padding-left: 5rem;\n padding-right: 5rem;\n }\n\n .md\\\\:px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n\n .md\\\\:px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n }\n\n .md\\\\:px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n }\n\n .md\\\\:px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n }\n\n .md\\\\:py-1\\\\.5 {\n padding-top: 0.375rem;\n padding-bottom: 0.375rem;\n }\n\n .md\\\\:py-16 {\n padding-top: 4rem;\n padding-bottom: 4rem;\n }\n\n .md\\\\:py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n }\n\n .md\\\\:py-3\\\\.5 {\n padding-top: 0.875rem;\n padding-bottom: 0.875rem;\n }\n\n .md\\\\:py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n }\n\n .md\\\\:pb-4 {\n padding-bottom: 1rem;\n }\n\n .md\\\\:pb-7 {\n padding-bottom: 1.75rem;\n }\n\n .md\\\\:pt-0 {\n padding-top: 0px;\n }\n\n .md\\\\:pt-3 {\n padding-top: 0.75rem;\n }\n\n .md\\\\:pt-8 {\n padding-top: 2rem;\n }\n\n .md\\\\:text-left {\n text-align: left;\n }\n\n .md\\\\:text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n }\n\n .md\\\\:text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n .md\\\\:text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n }\n\n .md\\\\:text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .md\\\\:text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n }\n\n .md\\\\:text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n }\n\n .md\\\\:leading-5 {\n line-height: 1.25rem;\n }\n\n .md\\\\:leading-6 {\n line-height: 1.5rem;\n }\n }\n\n @media (min-width: 1024px) {\n .lg\\\\:static {\n position: static;\n }\n\n .lg\\\\:order-2 {\n order: 2;\n }\n\n .lg\\\\:col-span-2 {\n grid-column: span 2 / span 2;\n }\n\n .lg\\\\:col-span-3 {\n grid-column: span 3 / span 3;\n }\n\n .lg\\\\:col-span-5 {\n grid-column: span 5 / span 5;\n }\n\n .lg\\\\:col-start-10 {\n grid-column-start: 10;\n }\n\n .lg\\\\:mx-auto {\n margin-left: auto;\n margin-right: auto;\n }\n\n .lg\\\\:mb-0 {\n margin-bottom: 0px;\n }\n\n .lg\\\\:mb-2 {\n margin-bottom: 0.5rem;\n }\n\n .lg\\\\:mb-4 {\n margin-bottom: 1rem;\n }\n\n .lg\\\\:ml-6 {\n margin-left: 1.5rem;\n }\n\n .lg\\\\:mt-0 {\n margin-top: 0px;\n }\n\n .lg\\\\:mt-5 {\n margin-top: 1.25rem;\n }\n\n .lg\\\\:block {\n display: block;\n }\n\n .lg\\\\:flex {\n display: flex;\n }\n\n .lg\\\\:hidden {\n display: none;\n }\n\n .lg\\\\:h-10 {\n height: 2.5rem;\n }\n\n .lg\\\\:h-8 {\n height: 2rem;\n }\n\n .lg\\\\:max-h-fit {\n max-height: -moz-fit-content;\n max-height: fit-content;\n }\n\n .lg\\\\:max-h-none {\n max-height: none;\n }\n\n .lg\\\\:min-h-\\\\[220px\\\\] {\n min-height: 220px;\n }\n\n .lg\\\\:w-1\\\\/2 {\n width: 50%;\n }\n\n .lg\\\\:w-1\\\\/3 {\n width: 33.333333%;\n }\n\n .lg\\\\:w-8 {\n width: 2rem;\n }\n\n .lg\\\\:w-\\\\[202px\\\\] {\n width: 202px;\n }\n\n .lg\\\\:w-\\\\[410px\\\\] {\n width: 410px;\n }\n\n .lg\\\\:w-auto {\n width: auto;\n }\n\n .lg\\\\:max-w-7xl {\n max-width: 80rem;\n }\n\n .lg\\\\:max-w-\\\\[515px\\\\] {\n max-width: 515px;\n }\n\n .lg\\\\:grid-cols-12 {\n grid-template-columns: repeat(12, minmax(0, 1fr));\n }\n\n .lg\\\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .lg\\\\:flex-row {\n flex-direction: row;\n }\n\n .lg\\\\:flex-col {\n flex-direction: column;\n }\n\n .lg\\\\:items-start {\n align-items: flex-start;\n }\n\n .lg\\\\:items-center {\n align-items: center;\n }\n\n .lg\\\\:justify-end {\n justify-content: flex-end;\n }\n\n .lg\\\\:justify-between {\n justify-content: space-between;\n }\n\n .lg\\\\:gap-0 {\n gap: 0px;\n }\n\n .lg\\\\:gap-8 {\n gap: 2rem;\n }\n\n .lg\\\\:gap-x-6 {\n -moz-column-gap: 1.5rem;\n column-gap: 1.5rem;\n }\n\n .lg\\\\:overflow-auto {\n overflow: auto;\n }\n\n .lg\\\\:overflow-hidden {\n overflow: hidden;\n }\n\n .lg\\\\:px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n\n .lg\\\\:px-24 {\n padding-left: 6rem;\n padding-right: 6rem;\n }\n\n .lg\\\\:px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n\n .lg\\\\:px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n }\n\n .lg\\\\:px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n }\n\n .lg\\\\:py-10 {\n padding-top: 2.5rem;\n padding-bottom: 2.5rem;\n }\n\n .lg\\\\:py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n }\n\n .lg\\\\:py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n }\n\n .lg\\\\:py-8 {\n padding-top: 2rem;\n padding-bottom: 2rem;\n }\n\n .lg\\\\:py-9 {\n padding-top: 2.25rem;\n padding-bottom: 2.25rem;\n }\n\n .lg\\\\:pb-0 {\n padding-bottom: 0px;\n }\n\n .lg\\\\:pb-6 {\n padding-bottom: 1.5rem;\n }\n\n .lg\\\\:pt-9 {\n padding-top: 2.25rem;\n }\n\n .lg\\\\:text-start {\n text-align: start;\n }\n\n .lg\\\\:text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n }\n\n .lg\\\\:text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n .lg\\\\:text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n }\n }\n\n @media (min-width: 1280px) {\n .xl\\\\:px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n\n @media (min-width: 1536px) {\n .\\\\32xl\\\\:w-1\\\\/4 {\n width: 25%;\n }\n }\n`\n"]}
|
|
1
|
+
{"version":3,"file":"tailwind.js","sourceRoot":"","sources":["../../tailwind/tailwind.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,KAAK,CAAA;AAEzB,MAAM,CAAC,MAAM,QAAQ,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAggG1B,CAAA","sourcesContent":["import { css } from 'lit'\n\nexport const TWStyles = css`\n *,\n ::before,\n ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(4 104 203 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n }\n\n ::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(4 104 203 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n }\n\n /*\n! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com\n*/\n\n /*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n\n *,\n ::before,\n ::after {\n box-sizing: border-box;\n /* 1 */\n border-width: 0;\n /* 2 */\n border-style: solid;\n /* 2 */\n border-color: currentColor;\n /* 2 */\n }\n\n ::before,\n ::after {\n --tw-content: '';\n }\n\n /*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user's configured sans font-family by default.\n5. Use the user's configured sans font-feature-settings by default.\n6. Use the user's configured sans font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\n\n html,\n :host {\n line-height: 1.5;\n /* 1 */\n -webkit-text-size-adjust: 100%;\n /* 2 */\n -moz-tab-size: 4;\n /* 3 */\n -o-tab-size: 4;\n tab-size: 4;\n /* 3 */\n font-family: 'PT Sans', Arial, Verdana, Helvetica, sans-serif;\n /* 4 */\n font-feature-settings: normal;\n /* 5 */\n font-variation-settings: normal;\n /* 6 */\n -webkit-tap-highlight-color: transparent;\n /* 7 */\n }\n\n /*\n1. Remove the margin in all browsers.\n2. Inherit line-height from html so users can set them as a class directly on the html element.\n*/\n\n body {\n margin: 0;\n /* 1 */\n line-height: inherit;\n /* 2 */\n }\n\n /*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\n\n hr {\n height: 0;\n /* 1 */\n color: inherit;\n /* 2 */\n border-top-width: 1px;\n /* 3 */\n }\n\n /*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\n\n abbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n }\n\n /*\nRemove the default font size and weight for headings.\n*/\n\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n font-size: inherit;\n font-weight: inherit;\n }\n\n /*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\n\n a {\n color: inherit;\n text-decoration: inherit;\n }\n\n /*\nAdd the correct font weight in Edge and Safari.\n*/\n\n b,\n strong {\n font-weight: bolder;\n }\n\n /*\n1. Use the user's configured mono font-family by default.\n2. Use the user's configured mono font-feature-settings by default.\n3. Use the user's configured mono font-variation-settings by default.\n4. Correct the odd em font sizing in all browsers.\n*/\n\n code,\n kbd,\n samp,\n pre {\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,\n 'Liberation Mono', 'Courier New', monospace;\n /* 1 */\n font-feature-settings: normal;\n /* 2 */\n font-variation-settings: normal;\n /* 3 */\n font-size: 1em;\n /* 4 */\n }\n\n /*\nAdd the correct font size in all browsers.\n*/\n\n small {\n font-size: 80%;\n }\n\n /*\nPrevent sub and sup elements from affecting the line height in all browsers.\n*/\n\n sub,\n sup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n }\n\n sub {\n bottom: -0.25em;\n }\n\n sup {\n top: -0.5em;\n }\n\n /*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\n\n table {\n text-indent: 0;\n /* 1 */\n border-color: inherit;\n /* 2 */\n border-collapse: collapse;\n /* 3 */\n }\n\n /*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\n\n button,\n input,\n optgroup,\n select,\n textarea {\n font-family: inherit;\n /* 1 */\n font-feature-settings: inherit;\n /* 1 */\n font-variation-settings: inherit;\n /* 1 */\n font-size: 100%;\n /* 1 */\n font-weight: inherit;\n /* 1 */\n line-height: inherit;\n /* 1 */\n letter-spacing: inherit;\n /* 1 */\n color: inherit;\n /* 1 */\n margin: 0;\n /* 2 */\n padding: 0;\n /* 3 */\n }\n\n /*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\n\n button,\n select {\n text-transform: none;\n }\n\n /*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\n\n button,\n input:where([type='button']),\n input:where([type='reset']),\n input:where([type='submit']) {\n -webkit-appearance: button;\n /* 1 */\n background-color: transparent;\n /* 2 */\n background-image: none;\n /* 2 */\n }\n\n /*\nUse the modern Firefox focus style for all focusable elements.\n*/\n\n :-moz-focusring {\n outline: auto;\n }\n\n /*\nRemove the additional :invalid styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n\n :-moz-ui-invalid {\n box-shadow: none;\n }\n\n /*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\n\n progress {\n vertical-align: baseline;\n }\n\n /*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n\n ::-webkit-inner-spin-button,\n ::-webkit-outer-spin-button {\n height: auto;\n }\n\n /*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n\n [type='search'] {\n -webkit-appearance: textfield;\n /* 1 */\n outline-offset: -2px;\n /* 2 */\n }\n\n /*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n\n ::-webkit-search-decoration {\n -webkit-appearance: none;\n }\n\n /*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to inherit in Safari.\n*/\n\n ::-webkit-file-upload-button {\n -webkit-appearance: button;\n /* 1 */\n font: inherit;\n /* 2 */\n }\n\n /*\nAdd the correct display in Chrome and Safari.\n*/\n\n summary {\n display: list-item;\n }\n\n /*\nRemoves the default spacing and border for appropriate elements.\n*/\n\n blockquote,\n dl,\n dd,\n h1,\n h2,\n h3,\n h4,\n h5,\n h6,\n hr,\n figure,\n p,\n pre {\n margin: 0;\n }\n\n fieldset {\n margin: 0;\n padding: 0;\n }\n\n legend {\n padding: 0;\n }\n\n ol,\n ul,\n menu {\n list-style: none;\n margin: 0;\n padding: 0;\n }\n\n /*\nReset default styling for dialogs.\n*/\n\n dialog {\n padding: 0;\n }\n\n /*\nPrevent resizing textareas horizontally by default.\n*/\n\n textarea {\n resize: vertical;\n }\n\n /*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user's configured gray 400 color.\n*/\n\n input::-moz-placeholder,\n textarea::-moz-placeholder {\n opacity: 1;\n /* 1 */\n color: #9ca3af;\n /* 2 */\n }\n\n input::placeholder,\n textarea::placeholder {\n opacity: 1;\n /* 1 */\n color: #9ca3af;\n /* 2 */\n }\n\n /*\nSet the default cursor for buttons.\n*/\n\n button,\n [role='button'] {\n cursor: pointer;\n }\n\n /*\nMake sure disabled buttons don't get the pointer cursor.\n*/\n\n :disabled {\n cursor: default;\n }\n\n /*\n1. Make replaced elements display: block by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add vertical-align: middle to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\n\n img,\n svg,\n video,\n canvas,\n audio,\n iframe,\n embed,\n object {\n display: block;\n /* 1 */\n vertical-align: middle;\n /* 2 */\n }\n\n /*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\n\n img,\n video {\n max-width: 100%;\n height: auto;\n }\n\n /* Make elements with the HTML hidden attribute stay hidden by default */\n\n [hidden]:where(:not([hidden='until-found'])) {\n display: none;\n }\n\n .collapse {\n visibility: collapse;\n }\n\n .static {\n position: static;\n }\n\n .fixed {\n position: fixed;\n }\n\n .absolute {\n position: absolute;\n }\n\n .relative {\n position: relative;\n }\n\n .sticky {\n position: sticky;\n }\n\n .inset-0 {\n inset: 0px;\n }\n\n .-bottom-6 {\n bottom: -1.5rem;\n }\n\n .-right-\\\\[5\\\\%\\\\] {\n right: -5%;\n }\n\n .-top-1\\\\.5 {\n top: -0.375rem;\n }\n\n .-top-2 {\n top: -0.5rem;\n }\n\n .-top-\\\\[11px\\\\] {\n top: -11px;\n }\n\n .-top-\\\\[12px\\\\] {\n top: -12px;\n }\n\n .bottom-0 {\n bottom: 0px;\n }\n\n .left-0 {\n left: 0px;\n }\n\n .left-2\\\\.5 {\n left: 0.625rem;\n }\n\n .left-4 {\n left: 1rem;\n }\n\n .left-\\\\[80\\\\%\\\\] {\n left: 80%;\n }\n\n .right-0 {\n right: 0px;\n }\n\n .right-4 {\n right: 1rem;\n }\n\n .top-0 {\n top: 0px;\n }\n\n .top-4 {\n top: 1rem;\n }\n\n .top-full {\n top: 100%;\n }\n\n .z-0 {\n z-index: 0;\n }\n\n .z-10 {\n z-index: 10;\n }\n\n .z-20 {\n z-index: 20;\n }\n\n .z-50 {\n z-index: 50;\n }\n\n .z-\\\\[100\\\\] {\n z-index: 100;\n }\n\n .z-\\\\[999\\\\] {\n z-index: 999;\n }\n\n .order-1 {\n order: 1;\n }\n\n .order-2 {\n order: 2;\n }\n\n .col-span-2 {\n grid-column: span 2 / span 2;\n }\n\n .col-span-4 {\n grid-column: span 4 / span 4;\n }\n\n .m-auto {\n margin: auto;\n }\n\n .mx-1 {\n margin-left: 0.25rem;\n margin-right: 0.25rem;\n }\n\n .mx-2 {\n margin-left: 0.5rem;\n margin-right: 0.5rem;\n }\n\n .mx-4 {\n margin-left: 1rem;\n margin-right: 1rem;\n }\n\n .mx-6 {\n margin-left: 1.5rem;\n margin-right: 1.5rem;\n }\n\n .mx-auto {\n margin-left: auto;\n margin-right: auto;\n }\n\n .my-1 {\n margin-top: 0.25rem;\n margin-bottom: 0.25rem;\n }\n\n .my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n }\n\n .my-5 {\n margin-top: 1.25rem;\n margin-bottom: 1.25rem;\n }\n\n .my-6 {\n margin-top: 1.5rem;\n margin-bottom: 1.5rem;\n }\n\n .-ml-2 {\n margin-left: -0.5rem;\n }\n\n .-mt-24 {\n margin-top: -6rem;\n }\n\n .-mt-7 {\n margin-top: -1.75rem;\n }\n\n .-mt-\\\\[72px\\\\] {\n margin-top: -72px;\n }\n\n .mb-0 {\n margin-bottom: 0px;\n }\n\n .mb-1 {\n margin-bottom: 0.25rem;\n }\n\n .mb-2 {\n margin-bottom: 0.5rem;\n }\n\n .mb-3 {\n margin-bottom: 0.75rem;\n }\n\n .mb-4 {\n margin-bottom: 1rem;\n }\n\n .mb-5 {\n margin-bottom: 1.25rem;\n }\n\n .mb-6 {\n margin-bottom: 1.5rem;\n }\n\n .mb-8 {\n margin-bottom: 2rem;\n }\n\n .ml-1 {\n margin-left: 0.25rem;\n }\n\n .ml-2 {\n margin-left: 0.5rem;\n }\n\n .ml-3 {\n margin-left: 0.75rem;\n }\n\n .ml-4 {\n margin-left: 1rem;\n }\n\n .ml-6 {\n margin-left: 1.5rem;\n }\n\n .ml-8 {\n margin-left: 2rem;\n }\n\n .ml-auto {\n margin-left: auto;\n }\n\n .mr-1 {\n margin-right: 0.25rem;\n }\n\n .mr-10 {\n margin-right: 2.5rem;\n }\n\n .mr-2 {\n margin-right: 0.5rem;\n }\n\n .mr-3 {\n margin-right: 0.75rem;\n }\n\n .mr-4 {\n margin-right: 1rem;\n }\n\n .mr-6 {\n margin-right: 1.5rem;\n }\n\n .mt-0\\\\.5 {\n margin-top: 0.125rem;\n }\n\n .mt-1 {\n margin-top: 0.25rem;\n }\n\n .mt-10 {\n margin-top: 2.5rem;\n }\n\n .mt-2 {\n margin-top: 0.5rem;\n }\n\n .mt-3 {\n margin-top: 0.75rem;\n }\n\n .mt-4 {\n margin-top: 1rem;\n }\n\n .mt-5 {\n margin-top: 1.25rem;\n }\n\n .mt-6 {\n margin-top: 1.5rem;\n }\n\n .mt-8 {\n margin-top: 2rem;\n }\n\n .block {\n display: block;\n }\n\n .flex {\n display: flex;\n }\n\n .inline-flex {\n display: inline-flex;\n }\n\n .grid {\n display: grid;\n }\n\n .hidden {\n display: none;\n }\n\n .aspect-video {\n aspect-ratio: 16 / 9;\n }\n\n .h-10 {\n height: 2.5rem;\n }\n\n .h-12 {\n height: 3rem;\n }\n\n .h-14 {\n height: 3.5rem;\n }\n\n .h-16 {\n height: 4rem;\n }\n\n .h-2 {\n height: 0.5rem;\n }\n\n .h-20 {\n height: 5rem;\n }\n\n .h-3 {\n height: 0.75rem;\n }\n\n .h-4 {\n height: 1rem;\n }\n\n .h-5 {\n height: 1.25rem;\n }\n\n .h-6 {\n height: 1.5rem;\n }\n\n .h-8 {\n height: 2rem;\n }\n\n .h-9 {\n height: 2.25rem;\n }\n\n .h-\\\\[17px\\\\] {\n height: 17px;\n }\n\n .h-\\\\[300px\\\\] {\n height: 300px;\n }\n\n .h-\\\\[68px\\\\] {\n height: 68px;\n }\n\n .h-auto {\n height: auto;\n }\n\n .h-full {\n height: 100%;\n }\n\n .h-max {\n height: -moz-max-content;\n height: max-content;\n }\n\n .h-screen {\n height: 100vh;\n }\n\n .max-h-40 {\n max-height: 10rem;\n }\n\n .max-h-\\\\[116px\\\\] {\n max-height: 116px;\n }\n\n .max-h-\\\\[150px\\\\] {\n max-height: 150px;\n }\n\n .max-h-\\\\[577px\\\\] {\n max-height: 577px;\n }\n\n .max-h-fit {\n max-height: -moz-fit-content;\n max-height: fit-content;\n }\n\n .max-h-full {\n max-height: 100%;\n }\n\n .min-h-\\\\[68px\\\\] {\n min-height: 68px;\n }\n\n .min-h-\\\\[76px\\\\] {\n min-height: 76px;\n }\n\n .w-1\\\\/2 {\n width: 50%;\n }\n\n .w-1\\\\/3 {\n width: 33.333333%;\n }\n\n .w-1\\\\/4 {\n width: 25%;\n }\n\n .w-10 {\n width: 2.5rem;\n }\n\n .w-11\\\\/12 {\n width: 91.666667%;\n }\n\n .w-14 {\n width: 3.5rem;\n }\n\n .w-16 {\n width: 4rem;\n }\n\n .w-2 {\n width: 0.5rem;\n }\n\n .w-2\\\\/3 {\n width: 66.666667%;\n }\n\n .w-20 {\n width: 5rem;\n }\n\n .w-3 {\n width: 0.75rem;\n }\n\n .w-3\\\\/4 {\n width: 75%;\n }\n\n .w-32 {\n width: 8rem;\n }\n\n .w-4 {\n width: 1rem;\n }\n\n .w-40 {\n width: 10rem;\n }\n\n .w-5 {\n width: 1.25rem;\n }\n\n .w-6 {\n width: 1.5rem;\n }\n\n .w-60 {\n width: 15rem;\n }\n\n .w-76 {\n width: 19rem;\n }\n\n .w-8 {\n width: 2rem;\n }\n\n .w-9 {\n width: 2.25rem;\n }\n\n .w-\\\\[112px\\\\] {\n width: 112px;\n }\n\n .w-\\\\[120px\\\\] {\n width: 120px;\n }\n\n .w-\\\\[138px\\\\] {\n width: 138px;\n }\n\n .w-\\\\[216px\\\\] {\n width: 216px;\n }\n\n .w-\\\\[276px\\\\] {\n width: 276px;\n }\n\n .w-\\\\[296px\\\\] {\n width: 296px;\n }\n\n .w-\\\\[328px\\\\] {\n width: 328px;\n }\n\n .w-auto {\n width: auto;\n }\n\n .w-fit {\n width: -moz-fit-content;\n width: fit-content;\n }\n\n .w-full {\n width: 100%;\n }\n\n .w-max {\n width: -moz-max-content;\n width: max-content;\n }\n\n .w-screen {\n width: 100vw;\n }\n\n .min-w-0 {\n min-width: 0px;\n }\n\n .max-w-4xl {\n max-width: 56rem;\n }\n\n .max-w-5xl {\n max-width: 64rem;\n }\n\n .max-w-7xl {\n max-width: 80rem;\n }\n\n .max-w-\\\\[1200px\\\\] {\n max-width: 1200px;\n }\n\n .max-w-\\\\[190px\\\\] {\n max-width: 190px;\n }\n\n .max-w-\\\\[214px\\\\] {\n max-width: 214px;\n }\n\n .max-w-\\\\[242px\\\\] {\n max-width: 242px;\n }\n\n .max-w-\\\\[300px\\\\] {\n max-width: 300px;\n }\n\n .max-w-\\\\[460px\\\\] {\n max-width: 460px;\n }\n\n .max-w-\\\\[492px\\\\] {\n max-width: 492px;\n }\n\n .max-w-\\\\[624px\\\\] {\n max-width: 624px;\n }\n\n .max-w-screen-md {\n max-width: 768px;\n }\n\n .max-w-screen-sm {\n max-width: 640px;\n }\n\n .max-w-xl {\n max-width: 36rem;\n }\n\n .max-w-xs {\n max-width: 20rem;\n }\n\n .max-w-full {\n max-width: 100%;\n }\n\n .max-w-fit {\n max-width: -moz-fit-content;\n max-width: fit-content;\n }\n\n .max-w-\\\\[200px\\\\] {\n max-width: 200px;\n }\n\n .flex-1 {\n flex: 1 1 0%;\n }\n\n .flex-shrink-0 {\n flex-shrink: 0;\n }\n\n .flex-shrink {\n flex-shrink: 1;\n }\n\n .shrink-0 {\n flex-shrink: 0;\n }\n\n .flex-grow {\n flex-grow: 1;\n }\n\n .flex-grow-0 {\n flex-grow: 0;\n }\n\n .rotate-180 {\n --tw-rotate: 180deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n }\n\n .transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y))\n rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y))\n scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n }\n\n @keyframes pulse {\n 50% {\n opacity: 0.5;\n }\n }\n\n .animate-pulse {\n animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n }\n\n @keyframes spin {\n to {\n transform: rotate(360deg);\n }\n }\n\n .animate-spin {\n animation: spin 1s linear infinite;\n }\n\n .cursor-pointer {\n cursor: pointer;\n }\n\n .select-none {\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n }\n\n .snap-x {\n scroll-snap-type: x var(--tw-scroll-snap-strictness);\n }\n\n .snap-start {\n scroll-snap-align: start;\n }\n\n .scroll-mx-4 {\n scroll-margin-left: 1rem;\n scroll-margin-right: 1rem;\n }\n\n .grid-flow-row {\n grid-auto-flow: row;\n }\n\n .grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .grid-cols-5 {\n grid-template-columns: repeat(5, minmax(0, 1fr));\n }\n\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n\n .flex-row {\n flex-direction: row;\n }\n\n .flex-col {\n flex-direction: column;\n }\n\n .flex-col-reverse {\n flex-direction: column-reverse;\n }\n\n .flex-wrap {\n flex-wrap: wrap;\n }\n\n .flex-nowrap {\n flex-wrap: nowrap;\n }\n\n .place-items-center {\n place-items: center;\n }\n\n .items-start {\n align-items: flex-start;\n }\n\n .items-end {\n align-items: flex-end;\n }\n\n .items-center {\n align-items: center;\n }\n\n .items-baseline {\n align-items: baseline;\n }\n\n .justify-start {\n justify-content: flex-start;\n }\n\n .justify-end {\n justify-content: flex-end;\n }\n\n .justify-center {\n justify-content: center;\n }\n\n .justify-between {\n justify-content: space-between;\n }\n\n .justify-evenly {\n justify-content: space-evenly;\n }\n\n .gap-1 {\n gap: 0.25rem;\n }\n\n .gap-2 {\n gap: 0.5rem;\n }\n\n .gap-3 {\n gap: 0.75rem;\n }\n\n .gap-4 {\n gap: 1rem;\n }\n\n .gap-6 {\n gap: 1.5rem;\n }\n\n .gap-8 {\n gap: 2rem;\n }\n\n .gap-y-2 {\n row-gap: 0.5rem;\n }\n\n .gap-y-4 {\n row-gap: 1rem;\n }\n\n .space-x-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.5rem * var(--tw-space-x-reverse));\n margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .space-x-3 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(0.75rem * var(--tw-space-x-reverse));\n margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .space-x-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(1rem * var(--tw-space-x-reverse));\n margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .space-y-1 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));\n }\n\n .space-y-2 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));\n }\n\n .space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n }\n\n .self-center {\n align-self: center;\n }\n\n .overflow-auto {\n overflow: auto;\n }\n\n .overflow-hidden {\n overflow: hidden;\n }\n\n .overflow-y-auto {\n overflow-y: auto;\n }\n\n .overflow-x-scroll {\n overflow-x: scroll;\n }\n\n .overflow-y-scroll {\n overflow-y: scroll;\n }\n\n .truncate {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n\n .overflow-ellipsis {\n text-overflow: ellipsis;\n }\n\n .whitespace-nowrap {\n white-space: nowrap;\n }\n\n .text-wrap {\n text-wrap: wrap;\n }\n\n .text-nowrap {\n text-wrap: nowrap;\n }\n\n .break-words {\n overflow-wrap: break-word;\n }\n\n .break-all {\n word-break: break-all;\n }\n\n .rounded {\n border-radius: 0.25rem;\n }\n\n .rounded-\\\\[10px\\\\] {\n border-radius: 10px;\n }\n\n .rounded-full {\n border-radius: 9999px;\n }\n\n .rounded-lg {\n border-radius: 0.5rem;\n }\n\n .rounded-md {\n border-radius: 0.375rem;\n }\n\n .rounded-sm {\n border-radius: 0.125rem;\n }\n\n .rounded-xl {\n border-radius: 0.75rem;\n }\n\n .rounded-b-xl {\n border-bottom-right-radius: 0.75rem;\n border-bottom-left-radius: 0.75rem;\n }\n\n .border {\n border-width: 1px;\n }\n\n .border-2 {\n border-width: 2px;\n }\n\n .border-b {\n border-bottom-width: 1px;\n }\n\n .border-b-2 {\n border-bottom-width: 2px;\n }\n\n .border-t {\n border-top-width: 1px;\n }\n\n .border-\\\\[\\\\#DDD\\\\] {\n --tw-border-opacity: 1;\n border-color: rgb(221 221 221 / var(--tw-border-opacity, 1));\n }\n\n .border-blue-200 {\n --tw-border-opacity: 1;\n border-color: rgb(147 200 253 / var(--tw-border-opacity, 1));\n }\n\n .border-brand-1 {\n --tw-border-opacity: 1;\n border-color: rgb(0 85 154 / var(--tw-border-opacity, 1));\n }\n\n .border-dark-6 {\n --tw-border-opacity: 1;\n border-color: rgb(46 46 46 / var(--tw-border-opacity, 1));\n }\n\n .border-dark-8 {\n --tw-border-opacity: 1;\n border-color: rgb(136 136 136 / var(--tw-border-opacity, 1));\n }\n\n .border-dark-9 {\n --tw-border-opacity: 1;\n border-color: rgb(35 35 35 / var(--tw-border-opacity, 1));\n }\n\n .border-green-400 {\n --tw-border-opacity: 1;\n border-color: rgb(106 195 34 / var(--tw-border-opacity, 1));\n }\n\n .border-green-500 {\n --tw-border-opacity: 1;\n border-color: rgb(80 167 24 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-100 {\n --tw-border-opacity: 1;\n border-color: rgb(244 244 244 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-200 {\n --tw-border-opacity: 1;\n border-color: rgb(238 238 238 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-300 {\n --tw-border-opacity: 1;\n border-color: rgb(221 221 221 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-400 {\n --tw-border-opacity: 1;\n border-color: rgb(153 153 153 / var(--tw-border-opacity, 1));\n }\n\n .border-grey-500 {\n --tw-border-opacity: 1;\n border-color: rgb(102 102 102 / var(--tw-border-opacity, 1));\n }\n\n .border-white {\n --tw-border-opacity: 1;\n border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n }\n\n .border-yellow-400 {\n --tw-border-opacity: 1;\n border-color: rgb(255 204 0 / var(--tw-border-opacity, 1));\n }\n\n .bg-\\\\[\\\\#00000066\\\\] {\n background-color: #00000066;\n }\n\n .bg-\\\\[\\\\#2C2C2C\\\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(44 44 44 / var(--tw-bg-opacity, 1));\n }\n\n .bg-\\\\[\\\\#D71920\\\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(215 25 32 / var(--tw-bg-opacity, 1));\n }\n\n .bg-\\\\[\\\\#FFF8D6\\\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 248 214 / var(--tw-bg-opacity, 1));\n }\n\n .bg-\\\\[\\\\#FFFFFF\\\\] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n }\n\n .bg-black {\n --tw-bg-opacity: 1;\n background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));\n }\n\n .bg-blue-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(225 240 255 / var(--tw-bg-opacity, 1));\n }\n\n .bg-blue-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(147 200 253 / var(--tw-bg-opacity, 1));\n }\n\n .bg-blue-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(3 86 168 / var(--tw-bg-opacity, 1));\n }\n\n .bg-brand-1 {\n --tw-bg-opacity: 1;\n background-color: rgb(0 85 154 / var(--tw-bg-opacity, 1));\n }\n\n .bg-dark-3 {\n --tw-bg-opacity: 1;\n background-color: rgb(37 37 37 / var(--tw-bg-opacity, 1));\n }\n\n .bg-dark-4 {\n --tw-bg-opacity: 1;\n background-color: rgb(30 30 30 / var(--tw-bg-opacity, 1));\n }\n\n .bg-dark-5 {\n --tw-bg-opacity: 1;\n background-color: rgb(18 18 18 / var(--tw-bg-opacity, 1));\n }\n\n .bg-dark-6 {\n --tw-bg-opacity: 1;\n background-color: rgb(46 46 46 / var(--tw-bg-opacity, 1));\n }\n\n .bg-green-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(238 252 210 / var(--tw-bg-opacity, 1));\n }\n\n .bg-green-300 {\n --tw-bg-opacity: 1;\n background-color: rgb(151 219 83 / var(--tw-bg-opacity, 1));\n }\n\n .bg-green-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(80 167 24 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-200 {\n --tw-bg-opacity: 1;\n background-color: rgb(238 238 238 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-300 {\n --tw-bg-opacity: 1;\n background-color: rgb(221 221 221 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(102 102 102 / var(--tw-bg-opacity, 1));\n }\n\n .bg-grey-600 {\n --tw-bg-opacity: 1;\n background-color: rgb(51 51 51 / var(--tw-bg-opacity, 1));\n }\n\n .bg-orange-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 238 204 / var(--tw-bg-opacity, 1));\n }\n\n .bg-orange-400 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 122 0 / var(--tw-bg-opacity, 1));\n }\n\n .bg-red-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 225 207 / var(--tw-bg-opacity, 1));\n }\n\n .bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n }\n\n .bg-yellow-300 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 220 63 / var(--tw-bg-opacity, 1));\n }\n\n .bg-yellow-500 {\n --tw-bg-opacity: 1;\n background-color: rgb(219 170 0 / var(--tw-bg-opacity, 1));\n }\n\n .bg-opacity-75 {\n --tw-bg-opacity: 0.75;\n }\n\n .object-cover {\n -o-object-fit: cover;\n object-fit: cover;\n }\n\n .object-scale-down {\n -o-object-fit: scale-down;\n object-fit: scale-down;\n }\n\n .p-1 {\n padding: 0.25rem;\n }\n\n .p-1\\\\.5 {\n padding: 0.375rem;\n }\n\n .p-2 {\n padding: 0.5rem;\n }\n\n .p-3 {\n padding: 0.75rem;\n }\n\n .p-4 {\n padding: 1rem;\n }\n\n .p-5 {\n padding: 1.25rem;\n }\n\n .p-6 {\n padding: 1.5rem;\n }\n\n .px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n\n .px-1\\\\.5 {\n padding-left: 0.375rem;\n padding-right: 0.375rem;\n }\n\n .px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n }\n\n .px-3 {\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n }\n\n .px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n\n .px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n }\n\n .px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n }\n\n .px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n }\n\n .px-\\\\[10px\\\\] {\n padding-left: 10px;\n padding-right: 10px;\n }\n\n .px-\\\\[22px\\\\] {\n padding-left: 22px;\n padding-right: 22px;\n }\n\n .py-0\\\\.5 {\n padding-top: 0.125rem;\n padding-bottom: 0.125rem;\n }\n\n .py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n }\n\n .py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n }\n\n .py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n }\n\n .py-4 {\n padding-top: 1rem;\n padding-bottom: 1rem;\n }\n\n .py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n }\n\n .py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n }\n\n .py-\\\\[5\\\\.6px\\\\] {\n padding-top: 5.6px;\n padding-bottom: 5.6px;\n }\n\n .pb-1 {\n padding-bottom: 0.25rem;\n }\n\n .pb-2 {\n padding-bottom: 0.5rem;\n }\n\n .pb-20 {\n padding-bottom: 5rem;\n }\n\n .pb-3 {\n padding-bottom: 0.75rem;\n }\n\n .pb-32 {\n padding-bottom: 8rem;\n }\n\n .pb-4 {\n padding-bottom: 1rem;\n }\n\n .pb-5 {\n padding-bottom: 1.25rem;\n }\n\n .pb-6 {\n padding-bottom: 1.5rem;\n }\n\n .pb-8 {\n padding-bottom: 2rem;\n }\n\n .pl-0\\\\.5 {\n padding-left: 0.125rem;\n }\n\n .pl-1 {\n padding-left: 0.25rem;\n }\n\n .pl-14 {\n padding-left: 3.5rem;\n }\n\n .pl-2 {\n padding-left: 0.5rem;\n }\n\n .pl-4 {\n padding-left: 1rem;\n }\n\n .pl-px {\n padding-left: 1px;\n }\n\n .pr-1 {\n padding-right: 0.25rem;\n }\n\n .pr-2 {\n padding-right: 0.5rem;\n }\n\n .pr-3 {\n padding-right: 0.75rem;\n }\n\n .pt-0 {\n padding-top: 0px;\n }\n\n .pt-1 {\n padding-top: 0.25rem;\n }\n\n .pt-10 {\n padding-top: 2.5rem;\n }\n\n .pt-2 {\n padding-top: 0.5rem;\n }\n\n .pt-3 {\n padding-top: 0.75rem;\n }\n\n .pt-4 {\n padding-top: 1rem;\n }\n\n .pt-6 {\n padding-top: 1.5rem;\n }\n\n .pt-\\\\[5px\\\\] {\n padding-top: 5px;\n }\n\n .text-left {\n text-align: left;\n }\n\n .text-center {\n text-align: center;\n }\n\n .text-start {\n text-align: start;\n }\n\n .align-baseline {\n vertical-align: baseline;\n }\n\n .font-sans {\n font-family: 'PT Sans', Arial, Verdana, Helvetica, sans-serif;\n }\n\n .font-serif {\n font-family: ui-serif, Georgia, Cambria, 'Times New Roman', Times, serif;\n }\n\n .text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n }\n\n .text-\\\\[11px\\\\] {\n font-size: 11px;\n }\n\n .text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n .text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n }\n\n .text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n }\n\n .text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n }\n\n .text-xxs {\n font-size: 0.625rem;\n }\n\n .font-bold {\n font-weight: 700;\n }\n\n .font-medium {\n font-weight: 500;\n }\n\n .font-normal {\n font-weight: 400;\n }\n\n .uppercase {\n text-transform: uppercase;\n }\n\n .capitalize {\n text-transform: capitalize;\n }\n\n .leading-4 {\n line-height: 1rem;\n }\n\n .leading-5 {\n line-height: 1.25rem;\n }\n\n .leading-6 {\n line-height: 1.5rem;\n }\n\n .leading-\\\\[150\\\\%\\\\] {\n line-height: 150%;\n }\n\n .leading-\\\\[18px\\\\] {\n line-height: 18px;\n }\n\n .leading-\\\\[22px\\\\] {\n line-height: 22px;\n }\n\n .leading-\\\\[30px\\\\] {\n line-height: 30px;\n }\n\n .leading-none {\n line-height: 1;\n }\n\n .leading-normal {\n line-height: 1.5;\n }\n\n .leading-tight {\n line-height: 1.25;\n }\n\n .tracking-normal {\n letter-spacing: 0em;\n }\n\n .tracking-wide {\n letter-spacing: 0.025em;\n }\n\n .text-\\\\[\\\\#00559a\\\\] {\n --tw-text-opacity: 1;\n color: rgb(0 85 154 / var(--tw-text-opacity, 1));\n }\n\n .text-\\\\[\\\\#666666\\\\] {\n --tw-text-opacity: 1;\n color: rgb(102 102 102 / var(--tw-text-opacity, 1));\n }\n\n .text-\\\\[\\\\#F57A7A\\\\] {\n --tw-text-opacity: 1;\n color: rgb(245 122 122 / var(--tw-text-opacity, 1));\n }\n\n .text-\\\\[\\\\#FFFFFF\\\\] {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n }\n\n .text-black {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity, 1));\n }\n\n .text-blue-200 {\n --tw-text-opacity: 1;\n color: rgb(147 200 253 / var(--tw-text-opacity, 1));\n }\n\n .text-blue-300 {\n --tw-text-opacity: 1;\n color: rgb(90 171 252 / var(--tw-text-opacity, 1));\n }\n\n .text-blue-500 {\n --tw-text-opacity: 1;\n color: rgb(4 104 203 / var(--tw-text-opacity, 1));\n }\n\n .text-blue-600 {\n --tw-text-opacity: 1;\n color: rgb(3 86 168 / var(--tw-text-opacity, 1));\n }\n\n .text-brand-1 {\n --tw-text-opacity: 1;\n color: rgb(0 85 154 / var(--tw-text-opacity, 1));\n }\n\n .text-dark-5 {\n --tw-text-opacity: 1;\n color: rgb(18 18 18 / var(--tw-text-opacity, 1));\n }\n\n .text-dark-6 {\n --tw-text-opacity: 1;\n color: rgb(46 46 46 / var(--tw-text-opacity, 1));\n }\n\n .text-dark-7 {\n --tw-text-opacity: 1;\n color: rgb(224 224 224 / var(--tw-text-opacity, 1));\n }\n\n .text-green-300 {\n --tw-text-opacity: 1;\n color: rgb(151 219 83 / var(--tw-text-opacity, 1));\n }\n\n .text-green-400 {\n --tw-text-opacity: 1;\n color: rgb(106 195 34 / var(--tw-text-opacity, 1));\n }\n\n .text-green-500 {\n --tw-text-opacity: 1;\n color: rgb(80 167 24 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-100 {\n --tw-text-opacity: 1;\n color: rgb(244 244 244 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-200 {\n --tw-text-opacity: 1;\n color: rgb(238 238 238 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-300 {\n --tw-text-opacity: 1;\n color: rgb(221 221 221 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-400 {\n --tw-text-opacity: 1;\n color: rgb(153 153 153 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-500 {\n --tw-text-opacity: 1;\n color: rgb(102 102 102 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-600 {\n --tw-text-opacity: 1;\n color: rgb(51 51 51 / var(--tw-text-opacity, 1));\n }\n\n .text-grey-700 {\n --tw-text-opacity: 1;\n color: rgb(0 0 0 / var(--tw-text-opacity, 1));\n }\n\n .text-orange-400 {\n --tw-text-opacity: 1;\n color: rgb(255 122 0 / var(--tw-text-opacity, 1));\n }\n\n .text-orange-500 {\n --tw-text-opacity: 1;\n color: rgb(219 93 0 / var(--tw-text-opacity, 1));\n }\n\n .text-red-500 {\n --tw-text-opacity: 1;\n color: rgb(208 13 18 / var(--tw-text-opacity, 1));\n }\n\n .text-red-600 {\n --tw-text-opacity: 1;\n color: rgb(174 9 27 / var(--tw-text-opacity, 1));\n }\n\n .text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n }\n\n .text-yellow-700 {\n --tw-text-opacity: 1;\n color: rgb(122 87 0 / var(--tw-text-opacity, 1));\n }\n\n .underline {\n text-decoration-line: underline;\n }\n\n .line-through {\n text-decoration-line: line-through;\n }\n\n .no-underline {\n text-decoration-line: none;\n }\n\n .shadow-lg {\n --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1),\n 0 4px 6px -4px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color),\n 0 4px 6px -4px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n }\n\n .shadow-sm {\n --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);\n --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000),\n var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n }\n\n .outline {\n outline-style: solid;\n }\n\n .outline-2 {\n outline-width: 2px;\n }\n\n .outline-yellow-400 {\n outline-color: #ffcc00;\n }\n\n .filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast)\n var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert)\n var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n }\n\n .transition {\n transition-property: color, background-color, border-color,\n text-decoration-color, fill, stroke, opacity, box-shadow, transform,\n filter, -webkit-backdrop-filter;\n transition-property: color, background-color, border-color,\n text-decoration-color, fill, stroke, opacity, box-shadow, transform,\n filter, backdrop-filter;\n transition-property: color, background-color, border-color,\n text-decoration-color, fill, stroke, opacity, box-shadow, transform,\n filter, backdrop-filter, -webkit-backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n }\n\n .transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n }\n\n .hover\\\\:bg-\\\\[\\\\#f4f4f4\\\\]:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(244 244 244 / var(--tw-bg-opacity, 1));\n }\n\n .hover\\\\:text-\\\\[\\\\#222222\\\\]:hover {\n --tw-text-opacity: 1;\n color: rgb(34 34 34 / var(--tw-text-opacity, 1));\n }\n\n .hover\\\\:underline:hover {\n text-decoration-line: underline;\n }\n\n .focus\\\\:outline-none:focus {\n outline: 2px solid transparent;\n outline-offset: 2px;\n }\n\n .group:hover .group-hover\\\\:block {\n display: block;\n }\n\n @media (min-width: 640px) {\n .sm\\\\:block {\n display: block;\n }\n\n .sm\\\\:inline {\n display: inline;\n }\n\n .sm\\\\:w-3\\\\/4 {\n width: 75%;\n }\n\n .sm\\\\:max-w-lg {\n max-width: 32rem;\n }\n\n .sm\\\\:grid-cols-4 {\n grid-template-columns: repeat(4, minmax(0, 1fr));\n }\n\n .sm\\\\:justify-center {\n justify-content: center;\n }\n\n .sm\\\\:gap-6 {\n gap: 1.5rem;\n }\n\n .sm\\\\:px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n\n @media (min-width: 768px) {\n .md\\\\:mx-0 {\n margin-left: 0px;\n margin-right: 0px;\n }\n\n .md\\\\:my-8 {\n margin-top: 2rem;\n margin-bottom: 2rem;\n }\n\n .md\\\\:my-auto {\n margin-top: auto;\n margin-bottom: auto;\n }\n\n .md\\\\:mb-0 {\n margin-bottom: 0px;\n }\n\n .md\\\\:mb-5 {\n margin-bottom: 1.25rem;\n }\n\n .md\\\\:ml-6 {\n margin-left: 1.5rem;\n }\n\n .md\\\\:mr-6 {\n margin-right: 1.5rem;\n }\n\n .md\\\\:mt-10 {\n margin-top: 2.5rem;\n }\n\n .md\\\\:mt-2 {\n margin-top: 0.5rem;\n }\n\n .md\\\\:mt-3 {\n margin-top: 0.75rem;\n }\n\n .md\\\\:mt-4 {\n margin-top: 1rem;\n }\n\n .md\\\\:mt-5 {\n margin-top: 1.25rem;\n }\n\n .md\\\\:mt-7 {\n margin-top: 1.75rem;\n }\n\n .md\\\\:block {\n display: block;\n }\n\n .md\\\\:flex {\n display: flex;\n }\n\n .md\\\\:hidden {\n display: none;\n }\n\n .md\\\\:h-12 {\n height: 3rem;\n }\n\n .md\\\\:h-5 {\n height: 1.25rem;\n }\n\n .md\\\\:h-6 {\n height: 1.5rem;\n }\n\n .md\\\\:max-h-\\\\[220px\\\\] {\n max-height: 220px;\n }\n\n .md\\\\:min-h-\\\\[244px\\\\] {\n min-height: 244px;\n }\n\n .md\\\\:min-h-\\\\[68px\\\\] {\n min-height: 68px;\n }\n\n .md\\\\:w-1\\\\/2 {\n width: 50%;\n }\n\n .md\\\\:w-3\\\\/5 {\n width: 60%;\n }\n\n .md\\\\:w-40 {\n width: 10rem;\n }\n\n .md\\\\:w-5 {\n width: 1.25rem;\n }\n\n .md\\\\:w-5\\\\/12 {\n width: 41.666667%;\n }\n\n .md\\\\:w-52 {\n width: 13rem;\n }\n\n .md\\\\:w-6 {\n width: 1.5rem;\n }\n\n .md\\\\:w-\\\\[350px\\\\] {\n width: 350px;\n }\n\n .md\\\\:w-\\\\[370px\\\\] {\n width: 370px;\n }\n\n .md\\\\:w-\\\\[374px\\\\] {\n width: 374px;\n }\n\n .md\\\\:w-\\\\[400px\\\\] {\n width: 400px;\n }\n\n .md\\\\:w-\\\\[580px\\\\] {\n width: 580px;\n }\n\n .md\\\\:w-auto {\n width: auto;\n }\n\n .md\\\\:w-full {\n width: 100%;\n }\n\n .md\\\\:max-w-\\\\[137px\\\\] {\n max-width: 137px;\n }\n\n .md\\\\:max-w-\\\\[200px\\\\] {\n max-width: 200px;\n }\n\n .md\\\\:max-w-\\\\[321px\\\\] {\n max-width: 321px;\n }\n\n .md\\\\:max-w-\\\\[492px\\\\] {\n max-width: 492px;\n }\n\n .md\\\\:max-w-\\\\[737px\\\\] {\n max-width: 737px;\n }\n\n .md\\\\:max-w-sm {\n max-width: 24rem;\n }\n\n .md\\\\:grid-cols-1 {\n grid-template-columns: repeat(1, minmax(0, 1fr));\n }\n\n .md\\\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .md\\\\:flex-row {\n flex-direction: row;\n }\n\n .md\\\\:flex-col {\n flex-direction: column;\n }\n\n .md\\\\:items-start {\n align-items: flex-start;\n }\n\n .md\\\\:items-center {\n align-items: center;\n }\n\n .md\\\\:justify-start {\n justify-content: flex-start;\n }\n\n .md\\\\:justify-center {\n justify-content: center;\n }\n\n .md\\\\:justify-between {\n justify-content: space-between;\n }\n\n .md\\\\:gap-3 {\n gap: 0.75rem;\n }\n\n .md\\\\:gap-8 {\n gap: 2rem;\n }\n\n .md\\\\:space-x-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(1rem * var(--tw-space-x-reverse));\n margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .md\\\\:space-x-5 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-x-reverse: 0;\n margin-right: calc(1.25rem * var(--tw-space-x-reverse));\n margin-left: calc(1.25rem * calc(1 - var(--tw-space-x-reverse)));\n }\n\n .md\\\\:space-y-0 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(0px * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(0px * var(--tw-space-y-reverse));\n }\n\n .md\\\\:space-y-4 > :not([hidden]) ~ :not([hidden]) {\n --tw-space-y-reverse: 0;\n margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));\n margin-bottom: calc(1rem * var(--tw-space-y-reverse));\n }\n\n .md\\\\:self-start {\n align-self: flex-start;\n }\n\n .md\\\\:self-end {\n align-self: flex-end;\n }\n\n .md\\\\:whitespace-normal {\n white-space: normal;\n }\n\n .md\\\\:rounded {\n border-radius: 0.25rem;\n }\n\n .md\\\\:rounded-lg {\n border-radius: 0.5rem;\n }\n\n .md\\\\:p-10 {\n padding: 2.5rem;\n }\n\n .md\\\\:p-16 {\n padding: 4rem;\n }\n\n .md\\\\:p-5 {\n padding: 1.25rem;\n }\n\n .md\\\\:px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n\n .md\\\\:px-10 {\n padding-left: 2.5rem;\n padding-right: 2.5rem;\n }\n\n .md\\\\:px-20 {\n padding-left: 5rem;\n padding-right: 5rem;\n }\n\n .md\\\\:px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n\n .md\\\\:px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n }\n\n .md\\\\:px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n }\n\n .md\\\\:px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n }\n\n .md\\\\:py-1\\\\.5 {\n padding-top: 0.375rem;\n padding-bottom: 0.375rem;\n }\n\n .md\\\\:py-16 {\n padding-top: 4rem;\n padding-bottom: 4rem;\n }\n\n .md\\\\:py-2 {\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n }\n\n .md\\\\:py-3\\\\.5 {\n padding-top: 0.875rem;\n padding-bottom: 0.875rem;\n }\n\n .md\\\\:py-6 {\n padding-top: 1.5rem;\n padding-bottom: 1.5rem;\n }\n\n .md\\\\:pb-4 {\n padding-bottom: 1rem;\n }\n\n .md\\\\:pb-7 {\n padding-bottom: 1.75rem;\n }\n\n .md\\\\:pt-0 {\n padding-top: 0px;\n }\n\n .md\\\\:pt-3 {\n padding-top: 0.75rem;\n }\n\n .md\\\\:pt-8 {\n padding-top: 2rem;\n }\n\n .md\\\\:text-left {\n text-align: left;\n }\n\n .md\\\\:text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n }\n\n .md\\\\:text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n .md\\\\:text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n }\n\n .md\\\\:text-sm {\n font-size: 0.875rem;\n line-height: 1.25rem;\n }\n\n .md\\\\:text-xl {\n font-size: 1.25rem;\n line-height: 1.75rem;\n }\n\n .md\\\\:text-xs {\n font-size: 0.75rem;\n line-height: 1rem;\n }\n\n .md\\\\:leading-5 {\n line-height: 1.25rem;\n }\n\n .md\\\\:leading-6 {\n line-height: 1.5rem;\n }\n }\n\n @media (min-width: 1024px) {\n .lg\\\\:static {\n position: static;\n }\n\n .lg\\\\:order-2 {\n order: 2;\n }\n\n .lg\\\\:col-span-2 {\n grid-column: span 2 / span 2;\n }\n\n .lg\\\\:col-span-3 {\n grid-column: span 3 / span 3;\n }\n\n .lg\\\\:col-span-5 {\n grid-column: span 5 / span 5;\n }\n\n .lg\\\\:col-start-10 {\n grid-column-start: 10;\n }\n\n .lg\\\\:mx-auto {\n margin-left: auto;\n margin-right: auto;\n }\n\n .lg\\\\:mb-0 {\n margin-bottom: 0px;\n }\n\n .lg\\\\:mb-2 {\n margin-bottom: 0.5rem;\n }\n\n .lg\\\\:mb-4 {\n margin-bottom: 1rem;\n }\n\n .lg\\\\:ml-6 {\n margin-left: 1.5rem;\n }\n\n .lg\\\\:mt-0 {\n margin-top: 0px;\n }\n\n .lg\\\\:mt-5 {\n margin-top: 1.25rem;\n }\n\n .lg\\\\:block {\n display: block;\n }\n\n .lg\\\\:flex {\n display: flex;\n }\n\n .lg\\\\:hidden {\n display: none;\n }\n\n .lg\\\\:h-10 {\n height: 2.5rem;\n }\n\n .lg\\\\:h-8 {\n height: 2rem;\n }\n\n .lg\\\\:max-h-fit {\n max-height: -moz-fit-content;\n max-height: fit-content;\n }\n\n .lg\\\\:max-h-none {\n max-height: none;\n }\n\n .lg\\\\:min-h-\\\\[220px\\\\] {\n min-height: 220px;\n }\n\n .lg\\\\:w-1\\\\/2 {\n width: 50%;\n }\n\n .lg\\\\:w-1\\\\/3 {\n width: 33.333333%;\n }\n\n .lg\\\\:w-8 {\n width: 2rem;\n }\n\n .lg\\\\:w-\\\\[202px\\\\] {\n width: 202px;\n }\n\n .lg\\\\:w-\\\\[410px\\\\] {\n width: 410px;\n }\n\n .lg\\\\:w-auto {\n width: auto;\n }\n\n .lg\\\\:max-w-7xl {\n max-width: 80rem;\n }\n\n .lg\\\\:max-w-\\\\[515px\\\\] {\n max-width: 515px;\n }\n\n .lg\\\\:grid-cols-12 {\n grid-template-columns: repeat(12, minmax(0, 1fr));\n }\n\n .lg\\\\:grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n\n .lg\\\\:flex-row {\n flex-direction: row;\n }\n\n .lg\\\\:flex-col {\n flex-direction: column;\n }\n\n .lg\\\\:items-start {\n align-items: flex-start;\n }\n\n .lg\\\\:items-center {\n align-items: center;\n }\n\n .lg\\\\:justify-end {\n justify-content: flex-end;\n }\n\n .lg\\\\:justify-between {\n justify-content: space-between;\n }\n\n .lg\\\\:gap-0 {\n gap: 0px;\n }\n\n .lg\\\\:gap-8 {\n gap: 2rem;\n }\n\n .lg\\\\:gap-x-6 {\n -moz-column-gap: 1.5rem;\n column-gap: 1.5rem;\n }\n\n .lg\\\\:overflow-auto {\n overflow: auto;\n }\n\n .lg\\\\:overflow-hidden {\n overflow: hidden;\n }\n\n .lg\\\\:px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n\n .lg\\\\:px-24 {\n padding-left: 6rem;\n padding-right: 6rem;\n }\n\n .lg\\\\:px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n }\n\n .lg\\\\:px-6 {\n padding-left: 1.5rem;\n padding-right: 1.5rem;\n }\n\n .lg\\\\:px-8 {\n padding-left: 2rem;\n padding-right: 2rem;\n }\n\n .lg\\\\:py-10 {\n padding-top: 2.5rem;\n padding-bottom: 2.5rem;\n }\n\n .lg\\\\:py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n }\n\n .lg\\\\:py-5 {\n padding-top: 1.25rem;\n padding-bottom: 1.25rem;\n }\n\n .lg\\\\:py-8 {\n padding-top: 2rem;\n padding-bottom: 2rem;\n }\n\n .lg\\\\:py-9 {\n padding-top: 2.25rem;\n padding-bottom: 2.25rem;\n }\n\n .lg\\\\:pb-0 {\n padding-bottom: 0px;\n }\n\n .lg\\\\:pb-6 {\n padding-bottom: 1.5rem;\n }\n\n .lg\\\\:pt-9 {\n padding-top: 2.25rem;\n }\n\n .lg\\\\:text-start {\n text-align: start;\n }\n\n .lg\\\\:text-2xl {\n font-size: 1.5rem;\n line-height: 2rem;\n }\n\n .lg\\\\:text-base {\n font-size: 1rem;\n line-height: 1.5rem;\n }\n\n .lg\\\\:text-lg {\n font-size: 1.125rem;\n line-height: 1.75rem;\n }\n }\n\n @media (min-width: 1280px) {\n .xl\\\\:px-0 {\n padding-left: 0px;\n padding-right: 0px;\n }\n }\n\n @media (min-width: 1536px) {\n .\\\\32xl\\\\:w-1\\\\/4 {\n width: 25%;\n }\n }\n`\n"]}
|