/*Text color classes*/

.text-white {
	color: var(--text-white);
}

.text-black {
	color: var(--text-black);
}

.text-grey {
	color: var(--text-grey);
}

.text-blue {
	color: var(--blue-active);
}

.text-red {
	color: var(--text-red);
}

.text-green {
	color: var(--text-green);
}

.text-always-dark,
.text-always-dark a{
	color: rgba(38, 40, 42, 1);
}

.text-always-dark a {
	font-weight: 500;
}

.text-always-light {
	color: #fff;
}

.text-always-light label,
.text-always-light span,
.text-always-light i {
	color: #fff;
}


/* Inbuilt accent colors*/

.accent-clr--purple {
	color: #9f70fd;
}

.accent-clr--blue {
	color: rgba(22, 110, 232, 1);
}

.accent-clr--green {
	color: #2ED19E;
}

/* Background Color */
.bg-blue {
	background-color: #007bff;
}

.bg-green {
	background-color: #28a745;
}

.bg-red {
	background-color: #dc3545;
}

.bg-yellow {
	background-color: #ffc107;
}

.bg-gray {
	background-color: #6c757d;
}

/* Bootstrap-like naming */

.bg-primary {
	background-color: #007bff;
}

.bg-success {
	background-color: #28a745;
}

.bg-danger {
	background-color: #dc3545;
}

.bg-warning {
	background-color: #ffc107;
}

.bg-secondary {
	background-color: #6c757d;
}

/* Text Utility Classes */
.text-xs {
  font-size: var(--text-xs, 0.75rem); /* 12px */
  line-height: var(--text-xs--line-height, calc(1 / 0.75));
}

.text-sm {
  font-size: var(--text-sm, 0.875rem); /* 14px */
  line-height: var(--text-sm--line-height, calc(1.25 / 0.875));
}

.text-base {
  font-size: var(--text-base, 1rem); /* 16px */
  line-height: var(--text-base--line-height, calc(1.5 / 1));
}

.text-lg {
  font-size: var(--text-lg); /* 18px */
  line-height: var(--text-lg--line-height, calc(1.75 / 1.125));
}

.text-xl {
  font-size: var(--text-xl, 1.25rem); /* 20px */
  line-height: var(--text-xl--line-height, calc(1.75 / 1.25));
}

.text-2xl {
  font-size: var(--text-2xl, 1.5rem); /* 24px */
  line-height: var(--text-2xl--line-height, calc(2 / 1.5));
}

.text-3xl {
  font-size: var(--text-3xl, 1.875rem); /* 30px */
  line-height: var(--text-3xl--line-height, calc(2.25 / 1.875));
}

.text-4xl {
  font-size: var(--text-4xl, 2.25rem); /* 36px */
  line-height: var(--text-4xl--line-height, calc(2.5 / 2.25));
}

.text-5xl {
  font-size: var(--text-5xl, 3rem); /* 48px */
  line-height: var(--text-5xl--line-height, 1);
}

.text-6xl {
  font-size: var(--text-6xl, 3.75rem); /* 60px */
  line-height: var(--text-6xl--line-height, 1);
}

.text-7xl {
  font-size: var(--text-7xl, 4.5rem); /* 72px */
  line-height: var(--text-7xl--line-height, 1);
}

.text-8xl {
  font-size: var(--text-8xl, 6rem); /* 96px */
  line-height: var(--text-8xl--line-height, 1);
}

.text-9xl {
  font-size: var(--text-9xl, 8rem); /* 128px */
  line-height: var(--text-9xl--line-height, 1);
}

/* Typography Scale */
.font-xs {
	font-size: 0.75rem;
	/* 12px */
	line-height: 1rem;
}

.font-sm {
	font-size: 0.875rem;
	/* 14px */
	line-height: 1.25rem;
}

.font-md {
	font-size: 1rem;
	/* 16px */
	line-height: 1.5rem;
}

.font-lg {
	font-size: 1.125rem;
	/* 18px */
	line-height: 1.75rem;
}

.font-xl {
	font-size: 1.25rem;
	/* 20px */
	line-height: 2rem;
}

.font-2xl {
	font-size: 1.5rem;
	/* 24px */
	line-height: 2rem;
}

.font-3xl {
	font-size: 1.875rem;
	/* 30px */
	line-height: 2.5rem;
}

.font-4xl {
	font-size: 2.25rem;
	/* 36px */
	line-height: 3rem;
}

.font-5xl {
	font-size: 3rem;
	/* 48px */
	line-height: 4rem;
}

.font-6xl {
	font-size: 4rem;
	/* 64px */
	line-height: 5rem;
}

/* Font-weight, font-style */

.font-bold {
	font-weight: bold;
}

.font-italic {
	font-style: italic;
}

/* Border radius */

.rounded {
	border-radius: 100%;
}

.rounded-sm {
	border-radius: 4px;
}

.rounded-lg {
	border-radius: 8px;
}

/* Text alignment */
.text-right {
	text-align: right;
}

.text-left {
	text-align: left;
}

.text-center {
	text-align: center;
}

.text-underline {
	text-decoration: underline;
}

.text-uppercase {
	text-transform: uppercase;
}

th.text-center {
    text-align: center !important;
}


/* Links */
.link {
	display: flex;
	flex-wrap: nowrap;
	font-size: inherit;
	line-height: inherit;
	font-weight: 600;
	text-decoration: none;
}

.logo__link-left {
	align-items: center;
	flex-wrap: nowrap;
	font-size: 18px;
	line-height: 1.25rem;
	text-decoration: none;
}

.link--secondary {
	color: var(--link-sec-clr);
}

.link--primary {
	color: var(--link-main-clr);
}

.link i {
	color: currentColor;
}

.link__underlined {
	text-decoration: underline;
	text-underline-offset: 4px;
}

/* Borders */

.border {
	border: 1px solid var(--border-main-clr);
}

.border-dashed {
	border: 1px dashed var(--border-main-clr);
}

.border-r-1 {
	border-right: 1px solid var(--border-main-clr);
}

.border-l-1 {
	border-left: 1px solid var(--border-main-clr);
}

.border-t-1 {
	border-top: 1px solid var(--border-main-clr);
}

.border-t-1-dashed {
	border-top: 1px dashed var(--border-main-clr);
}


.border-b-1 {
	border-bottom: 1px solid var(--border-main-clr);
}

.border-b-1-dashed {
	border-bottom: 1px dashed var(--border-main-clr);
}

/*Remove border*/

.border-none {
	border: none;
}

/* ================ LAYOUT 
==========================*/

/* Base Container Style */
.container {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
}

@media (min-width: 576px) {
	.container {
		max-width: 540px;
	}
}

@media (min-width: 768px) {
	.container {
		max-width: 720px;
	}
}

@media (min-width: 992px) {
	.container {
		max-width: 960px;
	}
}

@media (min-width: 1200px) {
	.container {
		max-width: 1140px;
	}
}

@media (min-width: 1400px) {
	.container {
		max-width: 1320px;
	}
}

/* Column Width Classes for Multi-column Layouts */

.columns-1 {
	columns: 1;
}

.columns-2 {
	columns: 2;
}

.columns-3 {
	columns: 3;
}

.columns-4 {
	columns: 4;
}

.columns-5 {
	columns: 5;
}

.columns-6 {
	columns: 6;
}

.columns-7 {
	columns: 7;
}

.columns-8 {
	columns: 8;
}

.columns-9 {
	columns: 9;
}

.columns-10 {
	columns: 10;
}

.columns-11 {
	columns: 11;
}

.columns-12 {
	columns: 12;
}

.columns-auto {
	columns: auto;
}

.columns-3xs {
	columns: 16rem;
	/* 256px */
}

.columns-2xs {
	columns: 18rem;
	/* 288px */
}

.columns-xs {
	columns: 20rem;
	/* 320px */
}

.columns-sm {
	columns: 24rem;
	/* 384px */
}

.columns-md {
	columns: 28rem;
	/* 448px */
}

.columns-lg {
	columns: 32rem;
	/* 512px */
}

.columns-xl {
	columns: 36rem;
	/* 576px */
}

.columns-2xl {
	columns: 42rem;
	/* 672px */
}

.columns-3xl {
	columns: 48rem;
	/* 768px */
}

.columns-4xl {
	columns: 56rem;
	/* 896px */
}

.columns-5xl {
	columns: 64rem;
	/* 1024px */
}

.columns-6xl {
	columns: 72rem;
	/* 1152px */
}

.columns-7xl {
	columns: 80rem;
	/* 1280px */
}

/* Mobile views for columns */
@media (max-width: 768px) {

	.columns-1,
	.columns-2,
	.columns-3,
	.columns-4,
	.columns-5,
	.columns-6,
	.columns-7,
	.columns-8,
	.columns-9,
	.columns-10,
	.columns-11,
	.columns-12,
	.columns-auto,
	.columns-3xs,
	.columns-2xs,
	.columns-xs,
	.columns-sm,
	.columns-md,
	.columns-lg,
	.columns-xl,
	.columns-2xl,
	.columns-3xl,
	.columns-4xl,
	.columns-5xl,
	.columns-6xl,
	.columns-7xl {
		columns: 1;
	}
}

/* Box-Sizing */

.box-border {
	box-sizing: border-box;
}

.box-content {
	box-sizing: content-box;
}

/* Display */

.inline {
	display: inline;
}

.inline-table {
	display: inline-table;
}

.table-caption {
	display: table-caption;
}

.table-cell {
	display: table-cell;
}

.table-column {
	display: table-column;
}

.table-column-group {
	display: table-column-group;
}

.table-footer-group {
	display: table-footer-group;
}

.table-header-group {
	display: table-header-group;
}

.table-row-group {
	display: table-row-group;
}

.table-row {
	display: table-row;
}

.flow-root {
	display: flow-root;
}


.inline-grid {
	display: inline-grid;
}

.contents {
	display: contents;
}

.list-item {
	display: list-item;
}

/* Mobile views */
@media (max-width: 768px) {
	
	.inline-table {
		display: block;
	}

	.inline-grid {
		display: block;
	}

}

/* Floats*/

.float-start {
	float: inline-start;
}

.float-end {
	float: inline-end;
}

.float-right {
	float: right;
}

.float-left {
	float: left;
}

.float-none {
	float: none;
}

/* Mobile views */
@media (max-width: 768px) {

	.float-start,
	.float-end,
	.float-right,
	.float-left {
		float: none;
	}
}

/* Base styles for list */
.list {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

.list__item--no-style {
	list-style: none;
}

.list--no-style {
	list-style: none;

}

/* Clear */
/* Controlling the wrapping of content around an element */

.clear-start {
	clear: inline-start;
}

.clear-end {
	clear: inline-end;
}

.clear-left {
	clear: left;
}

.clear-right {
	clear: right;
}

.clear-both {
	clear: both;
}

.clear-none {
	clear: none;
}

/*Isolation*/

.isolate {
	isolation: isolate;
	/* Creates a new stacking context, useful for managing overlapping content */
}

.isolation-auto {
	isolation: auto;

}

/*Object Fit*/


.object-contain {
	object-fit: contain;
}


.object-cover {
	object-fit: cover;
}


.object-fill {
	object-fit: fill;
}


.object-none {
	object-fit: none;
}

.object-scale-down {
	object-fit: scale-down;
}

/* Object fit mobile views */
@media (max-width: 768px) {
	.object-contain {
		object-fit: contain;
	}

	.object-cover {
		object-fit: cover;
	}

	.object-fill {
		object-fit: fill;
	}

	.object-none {
		object-fit: none;
	}

	.object-scale-down {
		object-fit: scale-down;
	}
}

/*Object position*/

/* Position of content within a container with object-fit */

.object-bottom {
	object-position: bottom;
}

.object-center {
	object-position: center;
}

.object-left {
	object-position: left;
}

.object-left-bottom {
	object-position: left bottom;
}

.object-left-top {
	object-position: left top;
}

.object-right {
	object-position: right;
}

.object-right-bottom {
	object-position: right bottom;
}

.object-right-top {
	object-position: right top;
}

.object-top {
	object-position: top;
}

/* Object position mobile views */
@media (max-width: 768px) {
	.object-bottom {
		object-position: bottom;
	}

	.object-center {
		object-position: center;
	}

	.object-left {
		object-position: left;
	}

	.object-left-bottom {
		object-position: left bottom;
	}

	.object-left-top {
		object-position: left top;
	}

	.object-right {
		object-position: right;
	}

	.object-right-bottom {
		object-position: right bottom;
	}

	.object-right-top {
		object-position: right top;
	}

	.object-top {
		object-position: top;
	}
}


/* Overflow */

.overflow-auto {
	overflow: auto;
}

.overflow-hidden {
	overflow: hidden;
}

.overflow-clip {
	overflow: clip;
}

.overflow-visible {
	overflow: visible;
}

.overflow-scroll {
	overflow: scroll;
}

.overflow-x-auto {
	overflow-x: auto;
}

.overflow-y-auto {
	overflow-y: auto;
}

.overflow-x-hidden {
	overflow-x: hidden;
}

.scrollable {
	overflow-x: scroll;
}

.scrollable-y {
	overflow-y: scroll;
}

/* Overflow mobile views */
@media (max-width: 768px) {
	.overflow-auto {
		overflow: auto;
	}

	.overflow-hidden {
		overflow: hidden;
	}

	.overflow-clip {
		overflow: clip;
	}

	.overflow-visible {
		overflow: visible;
	}

	.overflow-scroll {
		overflow: scroll;
	}

	.overflow-x-auto {
		overflow-x: auto;
	}

	.overflow-y-auto {
		overflow-y: auto;
	}

	.overflow-x-hidden {
		overflow-x: hidden;
	}

	.scrollable {
		overflow-x: scroll;
	}

	.scrollable-y {
		overflow-y: scroll;
	}
}

/* Position */

.static {
	position: static;

}

.fixed {
	position: fixed;
}

.absolute {
	position: absolute;
	/* The element is positioned relative to its nearest positioned ancestor (instead of positioned relative to the viewport, like fixed) */
}

.relative {
	position: relative;
	/* The element is positioned relative to its normal position */
}

.sticky {
	position: sticky;
	/* The element is based on the user's scroll position. It toggles between relative and fixed, depending on the scroll position */
}

/* Position mobile */
@media (max-width: 768px) {
	.static {
		position: static;
	}

	.fixed {
		position: fixed;
	}

	.absolute {
		position: absolute;
	}

	.relative {
		position: relative;
	}

	.sticky {
		position: sticky;
	}
}

/* Visibility*/

.hidden {
	display: none;
}

.visible {
	visibility: visible;
}

.invisible {
	visibility: hidden;
}

.collapse {
	visibility: collapse;
}

/* Mobile visibility  */
@media (max-width: 768px) {
	.hidden {
		display: none;
	}

	.visible {
		visibility: visible;
	}

	.invisible {
		visibility: hidden;
	}

	.collapse {
		visibility: collapse;
	}

	/* Mobile specific visibility classes */
	.mobile-hidden {
		display: none;
	}

	.mobile-visible {
		display: block;
		visibility: visible;
	}
}

/* Z-index */

.z-0 {
	z-index: 0;
}

.z-10 {
	z-index: 10;
}

.z-20 {
	z-index: 20;
}

.z-30 {
	z-index: 30;
}

.z-40 {
	z-index: 40;
}

.z-50 {
	z-index: 50;
}

.z-auto {
	z-index: auto;
}

/* Z-index mobile views */
@media (max-width: 768px) {
	.z-0 {
		z-index: 0;
	}

	.z-10 {
		z-index: 10;
	}

	.z-20 {
		z-index: 20;
	}

	.z-30 {
		z-index: 30;
	}

	.z-40 {
		z-index: 40;
	}

	.z-50 {
		z-index: 50;
	}

	.z-auto {
		z-index: auto;
	}

	/* Specific class for mobile */
	.z-mobile-top {
		z-index: 9999;
	}
}

/* =========== Flexbox & Grid
==========================*/

/* Flexbox */

/* Flex Direction */
.flex {
	display: flex;
}

.inline-flex {
	display: inline-flex;
}

.flex-col {
	display: flex;
	flex-direction: column;
}

.flex-col-reverse {
	flex-direction: column-reverse;
}

.flex-row {
	display: flex;
	flex-direction: row;
}

.flex-row-reverse {
	flex-direction: row-reverse;
}

.flex-1 {
	flex: 1 1 0%;
}

.flex-none {
	flex: none;
}

/* Flex direction mobile */
@media (max-width: 768px) {
	.flex {
		display: flex;
	}

	.inline-flex {
		display: inline-flex;
	}

	.flex-col {
		display: flex;
		flex-direction: column;
	}

	.flex-col-reverse {
		display: flex;
		flex-direction: column-reverse;
	}

	.flex-row {
		display: flex;
		flex-direction: column;
	}

	.flex-row-reverse {
		display: flex;
		flex-direction: column-reverse;
	}

	.flex-1 {
		flex: 1 1 100%;
	}

	.flex-none {
		flex: none;
	}
}

/* Flex Wrap*/

.flex-wrap {
	flex-wrap: wrap;
}

.flex-wrap-reverse {
	flex-wrap: wrap-reverse;
}

.flex-nowrap {
	flex-wrap: nowrap;
}

/* Flex wrap mobile */
@media (max-width: 768px) {
	.flex-wrap {
		flex-wrap: wrap;
	}

	.flex-wrap-reverse {
		flex-wrap: wrap-reverse;
	}

	.flex-nowrap {
		flex-wrap: wrap;
	}
}

/* Flex Grow*/

.grow {
	flex-grow: 1;
}

.grow-0 {
	flex-grow: 0;
}

/* Flex grow mobile */
@media (max-width: 768px) {
	.grow {
		flex-grow: 1;
	}

	.grow-0 {
		flex-grow: 0;
	}

	.grow-mobile {
		flex-grow: 1;
		/* Only grows on mobile */
	}
}

/* Flex Shrink*/

.shrink {
	flex-shrink: 1;
}

.shrink-0 {
	flex-shrink: 0;
}

/* Flex shrink mobile */
@media (max-width: 768px) {
	.shrink {
		flex-shrink: 1;
	}

	.shrink-0 {
		flex-shrink: 0;
	}

	.shrink-mobile {
		flex-shrink: 1;
		/* Only shrinks on mobile */
	}
}

/* Wrapping */
.no-wrap {
	white-space: nowrap;
}

.wrap {
	white-space: normal;
}

.ellipsis {
	text-overflow: ellipsis;
}

/* Mobile */
@media (max-width: 768px) {
	.no-wrap {
		white-space: normal;
	}

	.wrap {
		white-space: normal;
	}

	.ellipsis {
		text-overflow: ellipsis;
		overflow: hidden;
		white-space: nowrap;
	}
}

/* Flexbox Wrapping */
.flex-wrap {
	flex-wrap: wrap;
}

.flex-nowrap {
	flex-wrap: nowrap;
}

/* Flexbox Growth */
.flex-grow {
	flex-grow: 1;
}

.flex-shrink {
	flex-shrink: 1;
}

.flex-no-grow {
	flex-grow: 0;
}

.flex-no-shrink {
	flex-shrink: 0;
}

/* Mobile views */
@media (max-width: 768px) {
	.flex-wrap {
		flex-wrap: wrap;
	}

	.flex-nowrap {
		flex-wrap: wrap;
		/* Allow wrapping on mobile */
	}

	.flex-grow {
		flex-grow: 1;
	}

	.flex-shrink {
		flex-shrink: 1;
	}

	.flex-no-grow {
		flex-grow: 0;
	}

	.flex-no-shrink {
		flex-shrink: 0;
	}

	.flex-mobile-grow {
		flex-grow: 1;
		/* Only grows on mobile */
	}

	.flex-mobile-no-shrink {
		flex-shrink: 0;
		/* Prevent shrinking on mobile */
	}
}

/* Flex-basis */

.basis-0 {
	flex-basis: 0px;
}

.basis-px {
	flex-basis: 1px;
}

.basis-0-5 {
	flex-basis: 0.125rem;
	/* 2px */
}

.basis-1 {
	flex-basis: 0.25rem;
	/* 4px */
}

.basis-1-5 {
	flex-basis: 0.375rem;
	/* 6px */
}

.basis-2 {
	flex-basis: 0.5rem;
	/* 8px */
}

.basis-2-5 {
	flex-basis: 0.625rem;
	/* 10px */
}

.basis-3 {
	flex-basis: 0.75rem;
	/* 12px */
}

.basis-3-5 {
	flex-basis: 0.875rem;
	/* 14px */
}

.basis-4 {
	flex-basis: 1rem;
	/* 16px */
}

.basis-5 {
	flex-basis: 1.25rem;
	/* 20px */
}

.basis-6 {
	flex-basis: 1.5rem;
	/* 24px */
}

.basis-7 {
	flex-basis: 1.75rem;
	/* 28px */
}

.basis-8 {
	flex-basis: 2rem;
	/* 32px */
}

.basis-9 {
	flex-basis: 2.25rem;
	/* 36px */
}

.basis-10 {
	flex-basis: 2.5rem;
	/* 40px */
}

.basis-11 {
	flex-basis: 2.75rem;
	/* 44px */
}

.basis-12 {
	flex-basis: 3rem;
	/* 48px */
}

.basis-14 {
	flex-basis: 3.5rem;
	/* 56px */
}

.basis-16 {
	flex-basis: 4rem;
	/* 64px */
}

.basis-20 {
	flex-basis: 5rem;
	/* 80px */
}

.basis-24 {
	flex-basis: 6rem;
	/* 96px */
}

.basis-28 {
	flex-basis: 7rem;
	/* 112px */
}

.basis-32 {
	flex-basis: 8rem;
	/* 128px */
}

.basis-36 {
	flex-basis: 9rem;
	/* 144px */
}

.basis-40 {
	flex-basis: 10rem;
	/* 160px */
}

.basis-44 {
	flex-basis: 11rem;
	/* 176px */
}

.basis-48 {
	flex-basis: 12rem;
	/* 192px */
}

.basis-52 {
	flex-basis: 13rem;
	/* 208px */
}

.basis-56 {
	flex-basis: 14rem;
	/* 224px */
}

.basis-60 {
	flex-basis: 15rem;
	/* 240px */
}

.basis-64 {
	flex-basis: 16rem;
	/* 256px */
}

.basis-72 {
	flex-basis: 18rem;
	/* 288px */
}

.basis-80 {
	flex-basis: 20rem;
	/* 320px */
}

.basis-96 {
	flex-basis: 24rem;
	/* 384px */
}

.basis-auto {
	flex-basis: auto;
}

/* Flex basis precent*/

.basis-1-2 {
	flex-basis: 50%;
}

.basis-1-3 {
	flex-basis: 33.333333%;
}

.basis-2-3 {
	flex-basis: 66.666667%;
}

.basis-1-4 {
	flex-basis: 25%;
}

.basis-2-4 {
	flex-basis: 50%;
}

.basis-3-4 {
	flex-basis: 75%;
}

.basis-1-5 {
	flex-basis: 20%;
}

.basis-2-5 {
	flex-basis: 40%;
}

.basis-3-5 {
	flex-basis: 60%;
}

.basis-4-5 {
	flex-basis: 80%;
}

.basis-1-6 {
	flex-basis: 16.666667%;
}

.basis-2-6 {
	flex-basis: 33.333333%;
}

.basis-3-6 {
	flex-basis: 50%;
}

.basis-4-6 {
	flex-basis: 66.666667%;
}

.basis-5-6 {
	flex-basis: 83.333333%;
}

.basis-1-12 {
	flex-basis: 8.333333%;
}

.basis-2-12 {
	flex-basis: 16.666667%;
}

.basis-3-12 {
	flex-basis: 25%;
}

.basis-4-12 {
	flex-basis: 33.333333%;
}

.basis-5-12 {
	flex-basis: 41.666667%;
}

.basis-6-12 {
	flex-basis: 50%;
}

.basis-7-12 {
	flex-basis: 58.333333%;
}

.basis-8-12 {
	flex-basis: 66.666667%;
}

.basis-9-12 {
	flex-basis: 75%;
}

.basis-10-12 {
	flex-basis: 83.333333%;
}

.basis-11-12 {
	flex-basis: 91.666667%;
}

.basis-full {
	flex-basis: 100%;
}

/* Flex basis mobile */
@media (max-width: 768px) {
	.basis-0 {
		flex-basis: 0px;
	}

	.basis-px {
		flex-basis: 1px;
	}

	.basis-0-5 {
		flex-basis: 0.125rem;
		/* 2px */
	}

	.basis-1 {
		flex-basis: 0.25rem;
		/* 4px */
	}

	.basis-1-5 {
		flex-basis: 0.375rem;
		/* 6px */
	}

	.basis-2 {
		flex-basis: 0.5rem;
		/* 8px */
	}

	.basis-2-5 {
		flex-basis: 0.625rem;
		/* 10px */
	}

	.basis-3 {
		flex-basis: 0.75rem;
		/* 12px */
	}

	.basis-3-5 {
		flex-basis: 0.875rem;
		/* 14px */
	}

	.basis-4 {
		flex-basis: 1rem;
		/* 16px */
	}

	.basis-5 {
		flex-basis: 1.25rem;
		/* 20px */
	}

	.basis-6 {
		flex-basis: 1.5rem;
		/* 24px */
	}

	.basis-7 {
		flex-basis: 1.75rem;
		/* 28px */
	}

	.basis-8 {
		flex-basis: 2rem;
		/* 32px */
	}

	.basis-9 {
		flex-basis: 2.25rem;
		/* 36px */
	}

	.basis-10 {
		flex-basis: 2.5rem;
		/* 40px */
	}

	.basis-11 {
		flex-basis: 2.75rem;
		/* 44px */
	}

	.basis-12 {
		flex-basis: 3rem;
		/* 48px */
	}

	.basis-14 {
		flex-basis: 3.5rem;
		/* 56px */
	}

	.basis-16 {
		flex-basis: 4rem;
		/* 64px */
	}

	.basis-20 {
		flex-basis: 5rem;
		/* 80px */
	}

	.basis-24 {
		flex-basis: 6rem;
		/* 96px */
	}

	.basis-28 {
		flex-basis: 7rem;
		/* 112px */
	}

	.basis-32 {
		flex-basis: 8rem;
		/* 128px */
	}

	.basis-36 {
		flex-basis: 9rem;
		/* 144px */
	}

	.basis-40 {
		flex-basis: 10rem;
		/* 160px */
	}

	.basis-44 {
		flex-basis: 11rem;
		/* 176px */
	}

	.basis-48 {
		flex-basis: 12rem;
		/* 192px */
	}

	.basis-52 {
		flex-basis: 13rem;
		/* 208px */
	}

	.basis-56 {
		flex-basis: 14rem;
		/* 224px */
	}

	.basis-60 {
		flex-basis: 15rem;
		/* 240px */
	}

	.basis-64 {
		flex-basis: 16rem;
		/* 256px */
	}

	.basis-72 {
		flex-basis: 18rem;
		/* 288px */
	}

	.basis-80 {
		flex-basis: 20rem;
		/* 320px */
	}

	.basis-96 {
		flex-basis: 24rem;
		/* 384px */
	}

	.basis-auto {
		flex-basis: auto;
	}

	.basis-1-2 {
		flex-basis: 50%;
	}

	.basis-1-3 {
		flex-basis: 33.333333%;
	}

	.basis-2-3 {
		flex-basis: 66.666667%;
	}

	.basis-1-4 {
		flex-basis: 25%;
	}

	.basis-2-4 {
		flex-basis: 50%;
	}

	.basis-3-4 {
		flex-basis: 75%;
	}

	.basis-1-5 {
		flex-basis: 20%;
	}

	.basis-2-5 {
		flex-basis: 40%;
	}

	.basis-3-5 {
		flex-basis: 60%;
	}

	.basis-4-5 {
		flex-basis: 80%;
	}

	.basis-1-6 {
		flex-basis: 16.666667%;
	}

	.basis-2-6 {
		flex-basis: 33.333333%;
	}

	.basis-3-6 {
		flex-basis: 50%;
	}

	.basis-4-6 {
		flex-basis: 66.666667%;
	}

	.basis-5-6 {
		flex-basis: 83.333333%;
	}

	.basis-1-12 {
		flex-basis: 8.333333%;
	}

	.basis-2-12 {
		flex-basis: 16.666667%;
	}

	.basis-3-12 {
		flex-basis: 25%;
	}

	.basis-4-12 {
		flex-basis: 33.333333%;
	}

	.basis-5-12 {
		flex-basis: 41.666667%;
	}

	.basis-6-12 {
		flex-basis: 50%;
	}

	.basis-7-12 {
		flex-basis: 58.333333%;
	}

	.basis-8-12 {
		flex-basis: 66.666667%;
	}

	.basis-9-12 {
		flex-basis: 75%;
	}

	.basis-10-12 {
		flex-basis: 83.333333%;
	}

	.basis-11-12 {
		flex-basis: 91.666667%;
	}

	.basis-full {
		flex-basis: 100%;
	}
}

/* Grid Layout */
.grid {
	display: grid;
}

/* Grid column */
.grid-cols-1 {
	grid-template-columns: repeat(1, minmax(0, 1fr));
}

.grid-cols-2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.grid-cols-3 {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.grid-cols-4 {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.grid-cols-5 {
	grid-template-columns: repeat(5, minmax(0, 1fr));
}

.grid-cols-6 {
	grid-template-columns: repeat(6, minmax(0, 1fr));
}

.grid-cols-12 {
	grid-template-columns: repeat(12, minmax(0, 1fr));
}

/* Grid column mobile*/
@media (max-width: 768px) {
	.grid-cols-1 {
			grid-template-columns: repeat(1, minmax(0, 1fr));
		}
	
		.grid-cols-2 {
			grid-template-columns: repeat(1, minmax(0, 1fr));
		}
	
		.grid-cols-3 {
			grid-template-columns: repeat(1, minmax(0, 1fr));
		}
	
		.grid-cols-4 {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
	
		.grid-cols-5 {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
	
		.grid-cols-6 {
			grid-template-columns: repeat(2, minmax(0, 1fr));
		}
	
		.grid-cols-12 {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
}

/* Grid row */
.grid-rows-1 {
	grid-template-rows: repeat(1, minmax(0, 1fr));
}

.grid-rows-2 {
	grid-template-rows: repeat(2, minmax(0, 1fr));
}

.grid-rows-3 {
	grid-template-rows: repeat(3, minmax(0, 1fr));
}

.grid-rows-4 {
	grid-template-rows: repeat(4, minmax(0, 1fr));
}

.grid-rows-5 {
	grid-template-rows: repeat(5, minmax(0, 1fr));
}

.grid-rows-6 {
	grid-template-rows: repeat(6, minmax(0, 1fr));
}

/* Grid row mobile */
@media (max-width: 768px) {
	.grid-rows-1 {
		grid-template-rows: repeat(1, minmax(0, 1fr));
		}
	
		.grid-rows-2 {
			grid-template-rows: repeat(1, minmax(0, 1fr));
		}
	
		.grid-rows-3 {
			grid-template-rows: repeat(1, minmax(0, 1fr));
		}
	
		.grid-rows-4 {
			grid-template-rows: repeat(2, minmax(0, 1fr));
		}
	
		.grid-rows-5 {
			grid-template-rows: repeat(2, minmax(0, 1fr));
		}
	
		.grid-rows-6 {
			grid-template-rows: repeat(2, minmax(0, 1fr));
		}
}

/* Grid Gap */
.grid-gap-1 {
	gap: 0.25rem;
	/* 4px */
}

.grid-gap-2 {
	gap: 0.5rem;
	/* 8px */
}

.grid-gap-3 {
	gap: 0.75rem;
	/* 12px */
}

.grid-gap-4 {
	gap: 1rem;
	/* 16px */
}

.grid-gap-5 {
	gap: 1.25rem;
	/* 20px */
}

.grid-gap-6 {
	gap: 1.5rem;
	/* 24px */
}

.grid-gap-7 {
	gap: 1.75rem;
	/* 28px */
}

.grid-gap-8 {
	gap: 2rem;
	/* 32px */
}

.grid-gap-9 {
	gap: 2.25rem;
	/* 36px */
}

.grid-gap-10 {
	gap: 2.5rem;
	/* 40px */
}

.grid-gap-11 {
	gap: 2.75rem;
	/* 44px */
}

.grid-gap-12 {
	gap: 3rem;
	/* 48px */
}

/* Grid gap mobile*/
@media (max-width: 768px) {
	.grid-gap-1 {
		gap: 0.125rem;
		/* 2px */
	}

	.grid-gap-2 {
		gap: 0.25rem;
		/* 4px */
	}

	.grid-gap-3 {
		gap: 0.375rem;
		/* 6px */
	}

	.grid-gap-4 {
		gap: 0.5rem;
		/* 8px */
	}

	.grid-gap-5 {
		gap: 0.625rem;
		/* 10px */
	}

	.grid-gap-6 {
		gap: 0.75rem;
		/* 12px */
	}

	.grid-gap-7 {
		gap: 0.875rem;
		/* 14px */
	}

	.grid-gap-8 {
		gap: 1rem;
		/* 16px */
	}

	.grid-gap-9 {
		gap: 1.125rem;
		/* 18px */
	}

	.grid-gap-10 {
		gap: 1.25rem;
		/* 20px */
	}

	.grid-gap-11 {
		gap: 1.375rem;
		/* 22px */
	}

	.grid-gap-12 {
		gap: 1.5rem;
		/* 24px */
	}
}

/*FLEX*/

/* Flexbox Justify Content */
.justify-normal {
	justify-content: normal;
}

.justify-start {
	justify-content: flex-start;
}

.justify-end {
	justify-content: flex-end;
}

.justify-center {
	justify-content: center;
}

.justify-between {
	justify-content: space-between;
}

.justify-around {
	justify-content: space-around;
}

.justify-evenly {
	justify-content: space-evenly;
}



/* Flexbox Align Items */
.align-start {
	align-items: flex-start;
}

.align-end {
	align-items: flex-end;
}

.align-center {
	align-items: center;
}

.align-stretch {
	align-items: stretch;
}

.align-baseline {
	align-items: baseline;
}

/* Flexbox Align Content (only has an effect on multi-line flex containers) */
.content-normal {
	align-content: normal;
}

.content-center {
	align-content: center;
}

.content-start {
	align-content: flex-start;
}

.content-end {
	align-content: flex-end;
}

.content-between {
	align-content: space-between;
}

.content-around {
	align-content: space-around;
}

.content-evenly {
	align-content: space-evenly;
}

/* Flexbox Align Self (allows individual flex items to override the container's align-items property) */
.self-auto {
	align-self: auto;
}

.self-start {
	align-self: flex-start;
}

.self-end {
	align-self: flex-end;
}

.self-center {
	align-self: center;
}

.self-stretch {
	align-self: stretch;
}

.self-baseline {
	align-self: baseline;
}

/*GRID*/

/* Grid Place Content -shorthand for align-content and justify-content */
.place-content-center {
	place-content: center;
}

.place-content-start {
	place-content: start;
}

.place-content-end {
	place-content: end;
}

.place-content-between {
	place-content: space-between;
}

.place-content-around {
	place-content: space-around;
}

.place-content-evenly {
	place-content: space-evenly;
}

.place-content-stretch {
	place-content: stretch;
}

/* Grid Place Items - shorthand for align-items and justify-items */
.place-items-start {
	place-items: start;
}

.place-items-end {
	place-items: end;
}

.place-items-center {
	place-items: center;
}

.place-items-baseline {
	place-items: baseline;
}

.place-items-stretch {
	place-items: stretch;
}

/* Grid Place Self - allows an individual grid item to align itself independently on both axes */
.place-self-auto {
	place-self: auto;
}

.place-self-start {
	place-self: start;
}

.place-self-end {
	place-self: end;
}

.place-self-center {
	place-self: center;
}

.place-self-stretch {
	place-self: stretch;
}

/* Dimension */
.w-half {
	width: 50%;
}

.w-third {
	width: 33.3333%;
}

.w-quarter {
	width: 25%;
}

.w-full {
	width: 100%;
}

/* Added by AS, july 19 */
.h-full {
	height: 100%;
}

.h-screen {
	height: 100vh;
}

.h-half {
	height: 50vh;
}

/* Dimension mobile  */
@media (max-width: 768px) {
	.w-half {
		width: 100%;
	}

	.w-third {
		width: 100%;
	}

	.w-quarter {
		width: 100%;
	}

	.w-full {
		width: 100%;
	}

	.h-screen {
		height: auto;
	}

	.h-half {
		height: auto;
	}
}

/* =============== SPACING
==========================*/

/* Margin and Padding */

.p-horizontal-4 {
	padding-left: 1rem;
	padding-right: 1rem;
}

.m-vertical-4 {
	margin-top: 1rem;
	margin-bottom: 1rem;
}

/* Responsive */
@media (min-width: 600px) {
	.sm-mt-4 {
		margin-top: 1rem;
	}

	.sm-w-full {
		width: 100%;
	}
}

@media (min-width: 900px) {
	.md-flex {
		display: flex;
	}
}

@media (min-width: 1200px) {
	.lg-grid {
		display: grid;
	}
}

/* Gap */

/* General, Column, and Row Gaps with consistent increments x-column y-row */
.gap-1 {
	gap: 0.25rem;
	/* 4px */
}

.gap-x-1 {
	column-gap: 0.25rem;
	/* 4px */
}

.gap-y-1 {
	row-gap: 0.25rem;
	/* 4px */
}

.gap-1_5 {
	gap: 0.375rem;
	/* 6px */
}

.gap-x-1_5 {
	column-gap: 0.375rem;
	/* 6px */
}

.gap-y-1_5 {
	row-gap: 0.375rem;
	/* 6px */
}

.gap-2 {
	gap: 0.5rem;
	/* 8px */
}

.gap-x-2 {
	column-gap: 0.5rem;
	/* 8px */
}

.gap-y-2 {
	row-gap: 0.5rem;
	/* 8px */
}

.gap-2_5 {
	gap: 0.625rem;
	/* 10px */
}

.gap-x-2_5 {
	column-gap: 0.625rem;
	/* 10px */
}

.gap-y-2_5 {
	row-gap: 0.625rem;
	/* 10px */
}

.gap-3 {
	gap: 0.75rem;
	/* 12px */
}

.gap-x-3 {
	column-gap: 0.75rem;
	/* 12px */
}

.gap-y-3 {
	row-gap: 0.75rem;
	/* 12px */
}

.gap-3_5 {
	gap: 0.875rem;
	/* 14px */
}

.gap-x-3_5 {
	column-gap: 0.875rem;
	/* 14px */
}

.gap-y-3_5 {
	row-gap: 0.875rem;
	/* 14px */
}

.gap-4 {
	gap: 1rem;
	/* 16px */
}

.gap-x-4 {
	column-gap: 1rem;
	/* 16px */
}

.gap-y-4 {
	row-gap: 1rem;
	/* 16px */
}

.gap-5 {
	gap: 1.25rem;
	/* 20px */
}

.gap-x-5 {
	column-gap: 1.25rem;
	/* 20px */
}

.gap-y-5 {
	row-gap: 1.25rem;
	/* 20px */
}

.gap-6 {
	gap: 1.5rem;
	/* 24px */
}

.gap-x-6 {
	column-gap: 1.5rem;
	/* 24px */
}

.gap-y-6 {
	row-gap: 1.5rem;
	/* 24px */
}

.gap-7 {
	gap: 1.75rem;
	/* 28px */
}

.gap-x-7 {
	column-gap: 1.75rem;
	/* 28px */
}

.gap-y-7 {
	row-gap: 1.75rem;
	/* 28px */
}

.gap-8 {
	gap: 2rem;
	/* 32px */
}

.gap-x-8 {
	column-gap: 2rem;
	/* 32px */
}

.gap-y-8 {
	row-gap: 2rem;
	/* 32px */
}

.gap-9 {
	gap: 2.25rem;
	/* 36px */
}

.gap-x-9 {
	column-gap: 2.25rem;
	/* 36px */
}

.gap-y-9 {
	row-gap: 2.25rem;
	/* 36px */
}

.gap-10 {
	gap: 2.5rem;
	/* 40px */
}

.gap-x-10 {
	column-gap: 2.5rem;
	/* 40px */
}

.gap-y-10 {
	row-gap: 2.5rem;
	/* 40px */
}

.gap-11 {
	gap: 2.75rem;
	/* 44px */
}

.gap-x-11 {
	column-gap: 2.75rem;
	/* 44px */
}

.gap-y-11 {
	row-gap: 2.75rem;
	/* 44px */
}

.gap-12 {
	gap: 3rem;
	/* 48px */
}

.gap-x-12 {
	column-gap: 3rem;
	/* 48px */
}

.gap-y-12 {
	row-gap: 3rem;
	/* 48px */
}

.gap-14 {
	gap: 3.5rem;
	/* 56px */
}

.gap-x-14 {
	column-gap: 3.5rem;
	/* 56px */
}

.gap-y-14 {
	row-gap: 3.5rem;
	/* 56px */
}

.gap-16 {
	gap: 4rem;
	/* 64px */
}

.gap-x-16 {
	column-gap: 4rem;
	/* 64px */
}

.gap-y-16 {
	row-gap: 4rem;
	/* 64px */
}

.gap-20 {
	gap: 5rem;
	/* 80px */
}

.gap-x-20 {
	column-gap: 5rem;
	/* 80px */
}

.gap-y-20 {
	row-gap: 5rem;
	/* 80px */
}

.gap-24 {
	gap: 6rem;
	/* 96px */
}

.gap-x-24 {
	column-gap: 6rem;
	/* 96px */
}

.gap-y-24 {
	row-gap: 6rem;
	/* 96px */
}

.gap-28 {
	gap: 7rem;
	/* 112px */
}

.gap-x-28 {
	column-gap: 7rem;
	/* 112px */
}

.gap-y-28 {
	row-gap: 7rem;
	/* 112px */
}

.gap-32 {
	gap: 8rem;
	/* 128px */
}

.gap-x-32 {
	column-gap: 8rem;
	/* 128px */
}

.gap-y-32 {
	row-gap: 8rem;
	/* 128px */
}

.gap-36 {
	gap: 9rem;
	/* 144px */
}

.gap-x-36 {
	column-gap: 9rem;
	/* 144px */
}

.gap-y-36 {
	row-gap: 9rem;
	/* 144px */
}

.gap-40 {
	gap: 10rem;
	/* 160px */
}

.gap-x-40 {
	column-gap: 10rem;
	/* 160px */
}

.gap-y-40 {
	row-gap: 10rem;
	/* 160px */
}

/* Gap mobile */
@media (max-width: 768px) {
	.gap-1 {
		gap: 0.25rem;
		/* 4px */
	}

	.gap-x-1 {
		column-gap: 0.25rem;
		/* 4px */
	}

	.gap-y-1 {
		row-gap: 0.25rem;
		/* 4px */
	}

	.gap-1_5 {
		gap: 0.375rem;
		/* 6px */
	}

	.gap-x-1_5 {
		column-gap: 0.375rem;
		/* 6px */
	}

	.gap-y-1_5 {
		row-gap: 0.375rem;
		/* 6px */
	}

	.gap-2 {
		gap: 0.5rem;
		/* 8px */
	}

	.gap-x-2 {
		column-gap: 0.5rem;
		/* 8px */
	}

	.gap-y-2 {
		row-gap: 0.5rem;
		/* 8px */
	}

	.gap-2_5 {
		gap: 0.625rem;
		/* 10px */
	}

	.gap-x-2_5 {
		column-gap: 0.625rem;
		/* 10px */
	}

	.gap-y-2_5 {
		row-gap: 0.625rem;
		/* 10px */
	}

	.gap-3 {
		gap: 0.75rem;
		/* 12px */
	}

	.gap-x-3 {
		column-gap: 0.75rem;
		/* 12px */
	}

	.gap-y-3 {
		row-gap: 0.75rem;
		/* 12px */
	}

	.gap-3_5 {
		gap: 0.875rem;
		/* 14px */
	}

	.gap-x-3_5 {
		column-gap: 0.875rem;
		/* 14px */
	}

	.gap-y-3_5 {
		row-gap: 0.875rem;
		/* 14px */
	}

	.gap-4 {
		gap: 1rem;
		/* 16px */
	}

	.gap-x-4 {
		column-gap: 1rem;
		/* 16px */
	}

	.gap-y-4 {
		row-gap: 1rem;
		/* 16px */
	}

	.gap-5 {
		gap: 1.25rem;
		/* 20px */
	}

	.gap-x-5 {
		column-gap: 1.25rem;
		/* 20px */
	}

	.gap-y-5 {
		row-gap: 1.25rem;
		/* 20px */
	}

	.gap-6 {
		gap: 1.5rem;
		/* 24px */
	}

	.gap-x-6 {
		column-gap: 1.5rem;
		/* 24px */
	}

	.gap-y-6 {
		row-gap: 1.5rem;
		/* 24px */
	}

	.gap-7 {
		gap: 1.75rem;
		/* 28px */
	}

	.gap-x-7 {
		column-gap: 1.75rem;
		/* 28px */
	}

	.gap-y-7 {
		row-gap: 1.75rem;
		/* 28px */
	}

	.gap-8 {
		gap: 2rem;
		/* 32px */
	}

	.gap-x-8 {
		column-gap: 2rem;
		/* 32px */
	}

	.gap-y-8 {
		row-gap: 2rem;
		/* 32px */
	}

	.gap-9 {
		gap: 2.25rem;
		/* 36px */
	}

	.gap-x-9 {
		column-gap: 2.25rem;
		/* 36px */
	}

	.gap-y-9 {
		row-gap: 2.25rem;
		/* 36px */
	}

	.gap-10 {
		gap: 2.5rem;
		/* 40px */
	}

	.gap-x-10 {
		column-gap: 2.5rem;
		/* 40px */
	}

	.gap-y-10 {
		row-gap: 2.5rem;
		/* 40px */
	}

	.gap-11 {
		gap: 2.75rem;
		/* 44px */
	}

	.gap-x-11 {
		column-gap: 2.75rem;
		/* 44px */
	}

	.gap-y-11 {
		row-gap: 2.75rem;
		/* 44px */
	}

	.gap-12 {
		gap: 3rem;
		/* 48px */
	}

	.gap-x-12 {
		column-gap: 3rem;
		/* 48px */
	}

	.gap-y-12 {
		row-gap: 3rem;
		/* 48px */
	}

	.gap-14 {
		gap: 3.5rem;
		/* 56px */
	}

	.gap-x-14 {
		column-gap: 3.5rem;
		/* 56px */
	}

	.gap-y-14 {
		row-gap: 3.5rem;
		/* 56px */
	}

	.gap-16 {
		gap: 4rem;
		/* 64px */
	}

	.gap-x-16 {
		column-gap: 4rem;
		/* 64px */
	}

	.gap-y-16 {
		row-gap: 4rem;
		/* 64px */
	}

	.gap-20 {
		gap: 5rem;
		/* 80px */
	}

	.gap-x-20 {
		column-gap: 5rem;
		/* 80px */
	}

	.gap-y-20 {
		row-gap: 5rem;
		/* 80px */
	}

	.gap-24 {
		gap: 6rem;
		/* 96px */
	}

	.gap-x-24 {
		column-gap: 6rem;
		/* 96px */
	}

	.gap-y-24 {
		row-gap: 6rem;
		/* 96px */
	}

	.gap-28 {
		gap: 7rem;
		/* 112px */
	}

	.gap-x-28 {
		column-gap: 7rem;
		/* 112px */
	}

	.gap-y-28 {
		row-gap: 7rem;
		/* 112px */
	}

	.gap-32 {
		gap: 8rem;
		/* 128px */
	}

	.gap-x-32 {
		column-gap: 8rem;
		/* 128px */
	}

	.gap-y-32 {
		row-gap: 8rem;
		/* 128px */
	}

	.gap-36 {
		gap: 9rem;
		/* 144px */
	}

	.gap-x-36 {
		column-gap: 9rem;
		/* 144px */
	}

	.gap-y-36 {
		row-gap: 9rem;
		/* 144px */
	}

	.gap-40 {
		gap: 10rem;
		/* 160px */
	}

	.gap-x-40 {
		column-gap: 10rem;
		/* 160px */
	}

	.gap-y-40 {
		row-gap: 10rem;
		/* 160px */
	}
}

/* Margin and Padding Classes with consistent 0.125rem (2px) step increments using underscores up to 10rem */

/* Margins */
.m-0 {
	margin: 0px;
}

.me-0 {
	margin-inline-end: 0px;
}

.ms-0 {
	margin-inline-start: 0px;
}

.m-0_5 {
	margin: 0.125rem;
	/* 2px */
}

.m-1 {
	margin: 0.25rem;
	/* 4px */
}

.m-1_5 {
	margin: 0.375rem;
	/* 6px */
}

.m-2 {
	margin: 0.5rem;
	/* 8px */
}

.m-2_5 {
	margin: 0.625rem;
	/* 10px */
}

.m-3 {
	margin: 0.75rem;
	/* 12px */
}

.m-3_5 {
	margin: 0.875rem;
	/* 14px */
}

.m-4 {
	margin: 1rem;
	/* 16px */
}

.m-4_5 {
	margin: 1.125rem;
	/* 18px */
}

.m-5 {
	margin: 1.25rem;
	/* 20px */
}

.m-5_5 {
	margin: 1.375rem;
	/* 22px */
}

.m-6 {
	margin: 1.5rem;
	/* 24px */
}

.m-6_5 {
	margin: 1.625rem;
	/* 26px */
}

.m-7 {
	margin: 1.75rem;
	/* 28px */
}

.m-7_5 {
	margin: 1.875rem;
	/* 30px */
}

.m-8 {
	margin: 2rem;
	/* 32px */
}

.m-8_5 {
	margin: 2.125rem;
	/* 34px */
}

.m-9 {
	margin: 2.25rem;
	/* 36px */
}

.m-9_5 {
	margin: 2.375rem;
	/* 38px */
}

.m-10 {
	margin: 2.5rem;
	/* 40px */
}

/* Margin Top Classes */
.mt-0 {
	margin-top: 0;
}

.mt-0_5 {
	margin-top: 0.125rem;
	/* 2px */
}

.mt-1 {
	margin-top: 0.25rem;
	/* 4px */
}

.mt-1_5 {
	margin-top: 0.375rem;
	/* 6px */
}

.mt-2 {
	margin-top: 0.5rem;
	/* 8px */
}

.mt-2_5 {
	margin-top: 0.625rem;
	/* 10px */
}

.mt-3 {
	margin-top: 0.75rem;
	/* 12px */
}

.mt-3_5 {
	margin-top: 0.875rem;
	/* 14px */
}

.mt-4 {
	margin-top: 1rem;
	/* 16px */
}

.mt-4_5 {
	margin-top: 1.125rem;
	/* 18px */
}

.mt-5 {
	margin-top: 1.25rem;
	/* 20px */
}

.mt-5_5 {
	margin-top: 1.375rem;
	/* 22px */
}

.mt-6 {
	margin-top: 1.5rem;
	/* 24px */
}

.mt-6_5 {
	margin-top: 1.625rem;
	/* 26px */
}

.mt-7 {
	margin-top: 1.75rem;
	/* 28px */
}

.mt-7_5 {
	margin-top: 1.875rem;
	/* 30px */
}

.mt-8 {
	margin-top: 2rem;
	/* 32px */
}

.mt-8_5 {
	margin-top: 2.125rem;
	/* 34px */
}

.mt-9 {
	margin-top: 2.25rem;
	/* 36px */
}

.mt-9_5 {
	margin-top: 2.375rem;
	/* 38px */
}

.mt-10 {
	margin-top: 2.5rem;
	/* 40px */
}

/* Margin Bottom Classes */
.mb-0 {
	margin-bottom: 0;
}

.mb-0_5 {
	margin-bottom: 0.125rem;
	/* 2px */
}

.mb-1 {
	margin-bottom: 0.25rem;
	/* 4px */
}

.mb-1_5 {
	margin-bottom: 0.375rem;
	/* 6px */
}

.mb-2 {
	margin-bottom: 0.5rem;
	/* 8px */
}

.mb-2_5 {
	margin-bottom: 0.625rem;
	/* 10px */
}

.mb-3 {
	margin-bottom: 0.75rem;
	/* 12px */
}

.mb-3_5 {
	margin-bottom: 0.875rem;
	/* 14px */
}

.mb-4 {
	margin-bottom: 1rem;
	/* 16px */
}

.mb-4_5 {
	margin-bottom: 1.125rem;
	/* 18px */
}

.mb-5 {
	margin-bottom: 1.25rem;
	/* 20px */
}

.mb-5_5 {
	margin-bottom: 1.375rem;
	/* 22px */
}

.mb-6 {
	margin-bottom: 1.5rem;
	/* 24px */
}

.mb-6_5 {
	margin-bottom: 1.625rem;
	/* 26px */
}

.mb-7 {
	margin-bottom: 1.75rem;
	/* 28px */
}

.mb-7_5 {
	margin-bottom: 1.875rem;
	/* 30px */
}

.mb-8 {
	margin-bottom: 2rem;
	/* 32px */
}

.mb-8_5 {
	margin-bottom: 2.125rem;
	/* 34px */
}

.mb-9 {
	margin-bottom: 2.25rem;
	/* 36px */
}

.mb-9_5 {
	margin-bottom: 2.375rem;
	/* 38px */
}

.mb-10 {
	margin-bottom: 2.5rem;
	/* 40px */
}

/* Margin Left Classes */
.ml-0 {
	margin-left: 0;
}

.ml-0_5 {
	margin-left: 0.125rem;
	/* 2px */
}

.ml-1 {
	margin-left: 0.25rem;
	/* 4px */
}

.ml-1_5 {
	margin-left: 0.375rem;
	/* 6px */
}

.ml-2 {
	margin-left: 0.5rem;
	/* 8px */
}

.ml-2_5 {
	margin-left: 0.625rem;
	/* 10px */
}

.ml-3 {
	margin-left: 0.75rem;
	/* 12px */
}

.ml-3_5 {
	margin-left: 0.875rem;
	/* 14px */
}

.ml-4 {
	margin-left: 1rem;
	/* 16px */
}

.ml-4_5 {
	margin-left: 1.125rem;
	/* 18px */
}

.ml-5 {
	margin-left: 1.25rem;
	/* 20px */
}

.ml-5_5 {
	margin-left: 1.375rem;
	/* 22px */
}

.ml-6 {
	margin-left: 1.5rem;
	/* 24px */
}

.ml-6_5 {
	margin-left: 1.625rem;
	/* 26px */
}

.ml-7 {
	margin-left: 1.75rem;
	/* 28px */
}

.ml-7_5 {
	margin-left: 1.875rem;
	/* 30px */
}

.ml-8 {
	margin-left: 2rem;
	/* 32px */
}

.ml-8_5 {
	margin-left: 2.125rem;
	/* 34px */
}

.ml-9 {
	margin-left: 2.25rem;
	/* 36px */
}

.ml-9_5 {
	margin-left: 2.375rem;
	/* 38px */
}

.ml-10 {
	margin-left: 2.5rem;
	/* 40px */
}

/* Margin Right Classes */
.mr-0 {
	margin-right: 0;
}

.mr-0_5 {
	margin-right: 0.125rem;
	/* 2px */
}

.mr-1 {
	margin-right: 0.25rem;
	/* 4px */
}

.mr-1_5 {
	margin-right: 0.375rem;
	/* 6px */
}

.mr-2 {
	margin-right: 0.5rem;
	/* 8px */
}

.mr-2_5 {
	margin-right: 0.625rem;
	/* 10px */
}

.mr-3 {
	margin-right: 0.75rem;
	/* 12px */
}

.mr-3_5 {
	margin-right: 0.875rem;
	/* 14px */
}

.mr-4 {
	margin-right: 1rem;
	/* 16px */
}

.mr-4_5 {
	margin-right: 1.125rem;
	/* 18px */
}

.mr-5 {
	margin-right: 1.25rem;
	/* 20px */
}

.mr-5_5 {
	margin-right: 1.375rem;
	/* 22px */
}

.mr-6 {
	margin-right: 1.5rem;
	/* 24px */
}

.mr-6_5 {
	margin-right: 1.625rem;
	/* 26px */
}

.mr-7 {
	margin-right: 1.75rem;
	/* 28px */
}

.mr-7_5 {
	margin-right: 1.875rem;
	/* 30px */
}

.mr-8 {
	margin-right: 2rem;
	/* 32px */
}

.mr-8_5 {
	margin-right: 2.125rem;
	/* 34px */
}

.mr-9 {
	margin-right: 2.25rem;
	/* 36px */
}

.mr-9_5 {
	margin-right: 2.375rem;
	/* 38px */
}

.mr-10 {
	margin-right: 2.5rem;
	/* 40px */
}
/* Horizontal and vertical classes added by AS, july 19 */
/* Margin Horizontal Classes */
.mx-0 {
	margin-left: 0;
	margin-right: 0;
}

.mx-0_5 {
	margin-left: 0.125rem;
	margin-right: 0.125rem;
	/* 2px */
}

.mx-1 {
	margin-left: 0.25rem;
	margin-right: 0.25rem;
	/* 4px */
}

.mx-1_5 {
	margin-left: 0.375rem;
	margin-right: 0.375rem;
	/* 6px */
}

.mx-2 {
	margin-left: 0.5rem;
	margin-right: 0.5rem;
	/* 8px */
}

.mx-2_5 {
	margin-left: 0.625rem;
	margin-right: 0.625rem;
	/* 10px */
}

.mx-3 {
	margin-left: 0.75rem;
	margin-right: 0.75rem;
	/* 12px */
}

.mx-3_5 {
	margin-right: 0.875rem;
	margin-left: 0.875rem;
	/* 14px */
}

.mx-4 {
	margin-right: 1rem;
	margin-left: 1rem;
	/* 16px */
}

.mx-4_5 {
	margin-right: 1.125rem;
	margin-left: 1.125rem;
	/* 18px */
}

.mx-5 {
	margin-right: 1.25rem;
	margin-left: 1.25rem;
	/* 20px */
}

.mx-5_5 {
	margin-right: 1.375rem;
	margin-left: 1.375rem;
	/* 22px */
}

.mx-6 {
	margin-right: 1.5rem;
	margin-left: 1.5rem;
	/* 24px */
}

.mx-6_5 {
	margin-right: 1.625rem;
	margin-left: 1.625rem;
	/* 26px */
}

.mx-7 {
	margin-right: 1.75rem;
	margin-left: 1.75rem;
	/* 28px */
}

.mx-7_5 {
	margin-right: 1.875rem;
	margin-left: 1.875rem;
	/* 30px */
}

.mx-8 {
	margin-right: 2rem;
	margin-left: 2rem;
	/* 32px */
}

.mx-8_5 {
	margin-right: 2.125rem;
	margin-left: 2.125rem;
	/* 34px */
}

.mx-9 {
	margin-right: 2.25rem;
	margin-left: 2.25rem;
	/* 36px */
}

.mx-9_5 {
	margin-right: 2.375rem;
	margin-left: 2.375rem;
	/* 38px */
}

.mx-10 {
	margin-left: 2.5rem;
	margin-right: 2.5rem;
	/* 40px */
}

/* Margin Vertical Classes */
.my-0 {
	margin-top: 0;
	margin-bottom: 0;
}

.my-0_5 {
	margin-top: 0.125rem;
	margin-bottom: 0.125rem;
	/* 2px */
}

.my-1 {
	margin-top: 0.25rem;
	margin-bottom: 0.25rem;
	/* 4px */
}

.my-1_5 {
	margin-top: 0.375rem;
	margin-bottom: 0.375rem;
	/* 6px */
}

.my-2 {
	margin-top: 0.5rem;
	margin-bottom: 0.5rem;
	/* 8px */
}

.my-2_5 {
	margin-top: 0.625rem;
	margin-bottom: 0.625rem;
	/* 10px */
}

.my-3 {
	margin-top: 0.75rem;
	margin-bottom: 0.75rem;
	/* 12px */
}

.my-3_5 {
	margin-bottom: 0.875rem;
	margin-top: 0.875rem;
	/* 14px */
}

.my-4 {
	margin-bottom: 1rem;
	margin-top: 1rem;
	/* 16px */
}

.my-4_5 {
	margin-bottom: 1.125rem;
	margin-top: 1.125rem;
	/* 18px */
}

.my-5 {
	margin-bottom: 1.25rem;
	margin-top: 1.25rem;
	/* 20px */
}

.my-5_5 {
	margin-bottom: 1.375rem;
	margin-top: 1.375rem;
	/* 22px */
}

.my-6 {
	margin-bottom: 1.5rem;
	margin-top: 1.5rem;
	/* 24px */
}

.my-6_5 {
	margin-bottom: 1.625rem;
	margin-top: 1.625rem;
	/* 26px */
}

.my-7 {
	margin-bottom: 1.75rem;
	margin-top: 1.75rem;
	/* 28px */
}

.my-7_5 {
	margin-bottom: 1.875rem;
	margin-top: 1.875rem;
	/* 30px */
}

.my-8 {
	margin-bottom: 2rem;
	margin-top: 2rem;
	/* 32px */
}

.my-8_5 {
	margin-bottom: 2.125rem;
	margin-top: 2.125rem;
	/* 34px */
}

.my-9 {
	margin-bottom: 2.25rem;
	margin-top: 2.25rem;
	/* 36px */
}

.my-9_5 {
	margin-bottom: 2.375rem;
	margin-top: 2.375rem;
	/* 38px */
}

.my-10 {
	margin-top: 2.5rem;
	margin-bottom: 2.5rem;
	/* 40px */
}

/* Auto margins */
.m-auto {
	margin: auto;
}

.ml-auto {
	margin-left: auto;
}

.mr-auto {
	margin-right: auto;
}

.mt-auto {
	margin-top: auto;
}

.mb-auto {
	margin-bottom: auto;
}

.me-auto {
	margin-inline-end: auto;
}

.ms-auto {
	margin-inline-start: auto;
}

/* Paddings */
.p-0 {
	padding: 0px;
}

.pe-0 {
	padding-inline-end: 0px;
}

.ps-0 {
	padding-inline-start: 0px;
}

.p-0_5 {
	padding: 0.125rem;
	/* 2px */
}

.p-1 {
	padding: 0.25rem;
	/* 4px */
}

.p-1_5 {
	padding: 0.375rem;
	/* 6px */
}

.p-2 {
	padding: 0.5rem;
	/* 8px */
}

.p-2_5 {
	padding: 0.625rem;
	/* 10px */
}

.p-3 {
	padding: 0.75rem;
	/* 12px */
}

.p-3_5 {
	padding: 0.875rem;
	/* 14px */
}

.p-4 {
	padding: 1rem;
	/* 16px */
}

.p-4_5 {
	padding: 1.125rem;
	/* 18px */
}

.p-5 {
	padding: 1.25rem;
	/* 20px */
}

.p-5_5 {
	padding: 1.375rem;
	/* 22px */
}

.p-6 {
	padding: 1.5rem;
	/* 24px */
}

.p-6_5 {
	padding: 1.625rem;
	/* 26px */
}

.p-7 {
	padding: 1.75rem;
	/* 28px */
}

.p-7_5 {
	padding: 1.875rem;
	/* 30px */
}

.p-8 {
	padding: 2rem;
	/* 32px */
}

.p-8_5 {
	padding: 2.125rem;
	/* 34px */
}

.p-9 {
	padding: 2.25rem;
	/* 36px */
}

.p-9_5 {
	padding: 2.375rem;
	/* 38px */
}

.p-10 {
	padding: 2.5rem;
	/* 40px */
}

/* Padding Top Classes */
.pt-0 {
	padding-top: 0;
}

.pt-0_5 {
	padding-top: 0.125rem;
	/* 2px */
}

.pt-1 {
	padding-top: 0.25rem;
	/* 4px */
}

.pt-1_5 {
	padding-top: 0.375rem;
	/* 6px */
}

.pt-2 {
	padding-top: 0.5rem;
	/* 8px */
}

.pt-2_5 {
	padding-top: 0.625rem;
	/* 10px */
}

.pt-3 {
	padding-top: 0.75rem;
	/* 12px */
}

.pt-3_5 {
	padding-top: 0.875rem;
	/* 14px */
}

.pt-4 {
	padding-top: 1rem;
	/* 16px */
}

.pt-4_5 {
	padding-top: 1.125rem;
	/* 18px */
}

.pt-5 {
	padding-top: 1.25rem;
	/* 20px */
}

.pt-5_5 {
	padding-top: 1.375rem;
	/* 22px */
}

.pt-6 {
	padding-top: 1.5rem;
	/* 24px */
}

.pt-6_5 {
	padding-top: 1.625rem;
	/* 26px */
}

.pt-7 {
	padding-top: 1.75rem;
	/* 28px */
}

.pt-7_5 {
	padding-top: 1.875rem;
	/* 30px */
}

.pt-8 {
	padding-top: 2rem;
	/* 32px */
}

.pt-8_5 {
	padding-top: 2.125rem;
	/* 34px */
}

.pt-9 {
	padding-top: 2.25rem;
	/* 36px */
}

.pt-9_5 {
	padding-top: 2.375rem;
	/* 38px */
}

.pt-10 {
	padding-top: 2.5rem;
	/* 40px */
}

/* Padding Bottom Classes */
.pb-0 {
	padding-bottom: 0;
}

.pb-0_5 {
	padding-bottom: 0.125rem;
	/* 2px */
}

.pb-1 {
	padding-bottom: 0.25rem;
	/* 4px */
}

.pb-1_5 {
	padding-bottom: 0.375rem;
	/* 6px */
}

.pb-2 {
	padding-bottom: 0.5rem;
	/* 8px */
}

.pb-2_5 {
	padding-bottom: 0.625rem;
	/* 10px */
}

.pb-3 {
	padding-bottom: 0.75rem;
	/* 12px */
}

.pb-3_5 {
	padding-bottom: 0.875rem;
	/* 14px */
}

.pb-4 {
	padding-bottom: 1rem;
	/* 16px */
}

.pb-4_5 {
	padding-bottom: 1.125rem;
	/* 18px */
}

.pb-5 {
	padding-bottom: 1.25rem;
	/* 20px */
}

.pb-5_5 {
	padding-bottom: 1.375rem;
	/* 22px */
}

.pb-6 {
	padding-bottom: 1.5rem;
	/* 24px */
}

.pb-6_5 {
	padding-bottom: 1.625rem;
	/* 26px */
}

.pb-7 {
	padding-bottom: 1.75rem;
	/* 28px */
}

.pb-7_5 {
	padding-bottom: 1.875rem;
	/* 30px */
}

.pb-8 {
	padding-bottom: 2rem;
	/* 32px */
}

.pb-8_5 {
	padding-bottom: 2.125rem;
	/* 34px */
}

.pb-9 {
	padding-bottom: 2.25rem;
	/* 36px */
}

.pb-9_5 {
	padding-bottom: 2.375rem;
	/* 38px */
}

.pb-10 {
	padding-bottom: 2.5rem;
	/* 40px */
}

/* Padding Left Classes */
.pl-0 {
	padding-left: 0;
}

.pl-0_5 {
	padding-left: 0.125rem;
	/* 2px */
}

.pl-1 {
	padding-left: 0.25rem;
	/* 4px */
}

.pl-1_5 {
	padding-left: 0.375rem;
	/* 6px */
}

.pl-2 {
	padding-left: 0.5rem;
	/* 8px */
}

.pl-2_5 {
	padding-left: 0.625rem;
	/* 10px */
}

.pl-3 {
	padding-left: 0.75rem;
	/* 12px */
}

.pl-3_5 {
	padding-left: 0.875rem;
	/* 14px */
}

.pl-4 {
	padding-left: 1rem;
	/* 16px */
}

.pl-4_5 {
	padding-left: 1.125rem;
	/* 18px */
}

.pl-5 {
	padding-left: 1.25rem;
	/* 20px */
}

.pl-5_5 {
	padding-left: 1.375rem;
	/* 22px */
}

.pl-6 {
	padding-left: 1.5rem;
	/* 24px */
}

.pl-6_5 {
	padding-left: 1.625rem;
	/* 26px */
}

.pl-7 {
	padding-left: 1.75rem;
	/* 28px */
}

.pl-7_5 {
	padding-left: 1.875rem;
	/* 30px */
}

.pl-8 {
	padding-left: 2rem;
	/* 32px */
}

.pl-8_5 {
	padding-left: 2.125rem;
	/* 34px */
}

.pl-9 {
	padding-left: 2.25rem;
	/* 36px */
}

.pl-9_5 {
	padding-left: 2.375rem;
	/* 38px */
}

.pl-10 {
	padding-left: 2.5rem;
	/* 40px */
}

/* Padding Right Classes */
.pr-0 {
	padding-right: 0;
}

.pr-0_5 {
	padding-right: 0.125rem;
	/* 2px */
}

.pr-1 {
	padding-right: 0.25rem;
	/* 4px */
}

.pr-1_5 {
	padding-right: 0.375rem;
	/* 6px */
}

.pr-2 {
	padding-right: 0.5rem;
	/* 8px */
}

.pr-2_5 {
	padding-right: 0.625rem;
	/* 10px */
}

.pr-3 {
	padding-right: 0.75rem;
	/* 12px */
}

.pr-3_5 {
	padding-right: 0.875rem;
	/* 14px */
}

.pr-4 {
	padding-right: 1rem;
	/* 16px */
}

.pr-4_5 {
	padding-right: 1.125rem;
	/* 18px */
}

.pr-5 {
	padding-right: 1.25rem;
	/* 20px */
}

.pr-5_5 {
	padding-right: 1.375rem;
	/* 22px */
}

.pr-6 {
	padding-right: 1.5rem;
	/* 24px */
}

.pr-6_5 {
	padding-right: 1.625rem;
	/* 26px */
}

.pr-7 {
	padding-right: 1.75rem;
	/* 28px */
}

.pr-7_5 {
	padding-right: 1.875rem;
	/* 30px */
}

.pr-8 {
	padding-right: 2rem;
	/* 32px */
}

.pr-8_5 {
	padding-right: 2.125rem;
	/* 34px */
}

.pr-9 {
	padding-right: 2.25rem;
	/* 36px */
}

.pr-9_5 {
	padding-right: 2.375rem;
	/* 38px */
}

.pr-10 {
	padding-right: 2.5rem;
	/* 40px */
}

/* Padding X-axis (left and right) */
.px-0 {
	padding-left: 0;
	padding-right: 0;
}

.px-0_5 {
	padding-left: 0.125rem;
	/* 2px */
	padding-right: 0.125rem;
	/* 2px */
}

.px-1 {
	padding-left: 0.25rem;
	/* 4px */
	padding-right: 0.25rem;
	/* 4px */
}

.px-1_5 {
	padding-left: 0.375rem;
	/* 6px */
	padding-right: 0.375rem;
	/* 6px */
}

.px-2 {
	padding-left: 0.5rem;
	/* 8px */
	padding-right: 0.5rem;
	/* 8px */
}

.px-2_5 {
	padding-left: 0.625rem;
	/* 10px */
	padding-right: 0.625rem;
	/* 10px */
}

.px-3 {
	padding-left: 0.75rem;
	/* 12px */
	padding-right: 0.75rem;
	/* 12px */
}

.px-3_5 {
	padding-left: 0.875rem;
	/* 14px */
	padding-right: 0.875rem;
	/* 14px */
}

.px-4 {
	padding-left: 1rem;
	/* 16px */
	padding-right: 1rem;
	/* 16px */
}

.px-4_5 {
	padding-left: 1.125rem;
	/* 18px */
	padding-right: 1.125rem;
	/* 18px */
}

.px-5 {
	padding-left: 1.25rem;
	/* 20px */
	padding-right: 1.25rem;
	/* 20px */
}

.px-5_5 {
	padding-left: 1.375rem;
	/* 22px */
	padding-right: 1.375rem;
	/* 22px */
}

.px-6 {
	padding-left: 1.5rem;
	/* 24px */
	padding-right: 1.5rem;
	/* 24px */
}

.px-6_5 {
	padding-left: 1.625rem;
	/* 26px */
	padding-right: 1.625rem;
	/* 26px */
}

.px-7 {
	padding-left: 1.75rem;
	/* 28px */
	padding-right: 1.75rem;
	/* 28px */
}

.px-7_5 {
	padding-left: 1.875rem;
	/* 30px */
	padding-right: 1.875rem;
	/* 30px */
}

.px-8 {
	padding-left: 2rem;
	/* 32px */
	padding-right: 2rem;
	/* 32px */
}

.px-8_5 {
	padding-left: 2.125rem;
	/* 34px */
	padding-right: 2.125rem;
	/* 34px */
}

.px-9 {
	padding-left: 2.25rem;
	/* 36px */
	padding-right: 2.25rem;
	/* 36px */
}

.px-9_5 {
	padding-left: 2.375rem;
	/* 38px */
	padding-right: 2.375rem;
	/* 38px */
}

.px-10 {
	padding-left: 2.5rem;
	/* 40px */
	padding-right: 2.5rem;
	/* 40px */
}

/* Padding Y-axis (top and bottom) */
.py-0 {
	padding-top: 0;
	padding-bottom: 0;
}

.py-0_5 {
	padding-top: 0.125rem;
	/* 2px */
	padding-bottom: 0.125rem;
	/* 2px */
}

.py-1 {
	padding-top: 0.25rem;
	/* 4px */
	padding-bottom: 0.25rem;
	/* 4px */
}

.py-1_5 {
	padding-top: 0.375rem;
	/* 6px */
	padding-bottom: 0.375rem;
	/* 6px */
}

.py-2 {
	padding-top: 0.5rem;
	/* 8px */
	padding-bottom: 0.5rem;
	/* 8px */
}

.py-2_5 {
	padding-top: 0.625rem;
	/* 10px */
	padding-bottom: 0.625rem;
	/* 10px */
}

.py-3 {
	padding-top: 0.75rem;
	/* 12px */
	padding-bottom: 0.75rem;
	/* 12px */
}

.py-3_5 {
	padding-top: 0.875rem;
	/* 14px */
	padding-bottom: 0.875rem;
	/* 14px */
}

.py-4 {
	padding-top: 1rem;
	/* 16px */
	padding-bottom: 1rem;
	/* 16px */
}

.py-4_5 {
	padding-top: 1.125rem;
	/* 18px */
	padding-bottom: 1.125rem;
	/* 18px */
}

.py-5 {
	padding-top: 1.25rem;
	/* 20px */
	padding-bottom: 1.25rem;
	/* 20px */
}

.py-5_5 {
	padding-top: 1.375rem;
	/* 22px */
	padding-bottom: 1.375rem;
	/* 22px */
}

.py-6 {
	padding-top: 1.5rem;
	/* 24px */
	padding-bottom: 1.5rem;
	/* 24px */
}

.py-6_5 {
	padding-top: 1.625rem;
	/* 26px */
	padding-bottom: 1.625rem;
	/* 26px */
}

.py-7 {
	padding-top: 1.75rem;
	/* 28px */
	padding-bottom: 1.75rem;
	/* 28px */
}

.py-7_5 {
	padding-top: 1.875rem;
	/* 30px */
	padding-bottom: 1.875rem;
	/* 30px */
}

.py-8 {
	padding-top: 2rem;
	/* 32px */
	padding-bottom: 2rem;
	/* 32px */
}

.py-8_5 {
	padding-top: 2.125rem;
	/* 34px */
	padding-bottom: 2.125rem;
	/* 34px */
}

.py-9 {
	padding-top: 2.25rem;
	/* 36px */
	padding-bottom: 2.25rem;
	/* 36px */
}

.py-9_5 {
	padding-top: 2.375rem;
	/* 38px */
	padding-bottom: 2.375rem;
	/* 38px */
}

.py-10 {
	padding-top: 2.5rem;
	/* 40px */
	padding-bottom: 2.5rem;
	/* 40px */
}

/* Space */

.space-y-2>*+* {
	margin-top: 0.5rem;
	/* 8px */
}

.space-x-2-5>*+* {
	margin-left: 0.625rem;
	/* 10px */
}

.space-y-2-5>*+* {
	margin-top: 0.625rem;
	/* 10px */
}

.space-x-3>*+* {
	margin-left: 0.75rem;
	/* 12px */
}

.space-y-3>*+* {
	margin-top: 0.75rem;
	/* 12px */
}

.space-x-3-5>*+* {
	margin-left: 0.875rem;
	/* 14px */
}

.space-y-3-5>*+* {
	margin-top: 0.875rem;
	/* 14px */
}

.space-x-4>*+* {
	margin-left: 1rem;
	/* 16px */
}

.space-y-4>*+* {
	margin-top: 1rem;
	/* 16px */
}

.space-x-5>*+* {
	margin-left: 1.25rem;
	/* 20px */
}

.space-y-5>*+* {
	margin-top: 1.25rem;
	/* 20px */
}

.space-x-6>*+* {
	margin-left: 1.5rem;
	/* 24px */
}

.space-y-6>*+* {
	margin-top: 1.5rem;
	/* 24px */
}

.space-x-7>*+* {
	margin-left: 1.75rem;
	/* 28px */
}

.space-y-7>*+* {
	margin-top: 1.75rem;
	/* 28px */
}

.space-x-8>*+* {
	margin-left: 2rem;
	/* 32px */
}

.space-y-8>*+* {
	margin-top: 2rem;
	/* 32px */
}

.space-x-9>*+* {
	margin-left: 2.25rem;
	/* 36px */
}

.space-y-9>*+* {
	margin-top: 2.25rem;
	/* 36px */
}

.space-x-10>*+* {
	margin-left: 2.5rem;
	/* 40px */
}

.space-y-10>*+* {
	margin-top: 2.5rem;
	/* 40px */
}

.space-x-11>*+* {
	margin-left: 2.75rem;
	/* 44px */
}

.space-y-11>*+* {
	margin-top: 2.75rem;
	/* 44px */
}

.space-x-12>*+* {
	margin-left: 3rem;
	/* 48px */
}

.space-y-12>*+* {
	margin-top: 3rem;
	/* 48px */
}

.space-x-14>*+* {
	margin-left: 3.5rem;
	/* 56px */
}

.space-y-14>*+* {
	margin-top: 3.5rem;
	/* 56px */
}

.space-x-16>*+* {
	margin-left: 4rem;
	/* 64px */
}

.space-y-16>*+* {
	margin-top: 4rem;
	/* 64px */
}

.space-x-20>*+* {
	margin-left: 5rem;
	/* 80px */
}

.space-y-20>*+* {
	margin-top: 5rem;
	/* 80px */
}

.space-x-24>*+* {
	margin-left: 6rem;
	/* 96px */
}

.space-y-24>*+* {
	margin-top: 6rem;
	/* 96px */
}

.space-x-28>*+* {
	margin-left: 7rem;
	/* 112px */
}

.space-y-28>*+* {
	margin-top: 7rem;
	/* 112px */
}

.space-x-32>*+* {
	margin-left: 8rem;
	/* 128px */
}

.space-y-32>*+* {
	margin-top: 8rem;
	/* 128px */
}

.space-x-36>*+* {
	margin-left: 9rem;
	/* 144px */
}

.space-y-36>*+* {
	margin-top: 9rem;
	/* 144px */
}

.space-x-40>*+* {
	margin-left: 10rem;
	/* 160px */
}

.space-y-40>*+* {
	margin-top: 10rem;
	/* 160px */
}

.space-x-44>*+* {
	margin-left: 11rem;
	/* 176px */
}

.space-y-44>*+* {
	margin-top: 11rem;
	/* 176px */
}

.space-x-48>*+* {
	margin-left: 12rem;
	/* 192px */
}

.space-y-48>*+* {
	margin-top: 12rem;
	/* 192px */
}

.space-x-52>*+* {
	margin-left: 13rem;
	/* 208px */
}

.space-y-52>*+* {
	margin-top: 13rem;
	/* 208px */
}

.space-x-56>*+* {
	margin-left: 14rem;
	/* 224px */
}

.space-y-56>*+* {
	margin-top: 14rem;
	/* 224px */
}

.space-x-60>*+* {
	margin-left: 15rem;
	/* 240px */
}

.space-y-60>*+* {
	margin-top: 15rem;
	/* 240px */
}

.space-x-64>*+* {
	margin-left: 16rem;
	/* 256px */
}

.space-y-64>*+* {
	margin-top: 16rem;
	/* 256px */
}

.space-x-72>*+* {
	margin-left: 18rem;
	/* 288px */
}

.space-y-72>*+* {
	margin-top: 18rem;
	/* 288px */
}

.space-x-80>*+* {
	margin-left: 20rem;
	/* 320px */
}

.space-y-80>*+* {
	margin-top: 20rem;
	/* 320px */
}

.space-x-96>*+* {
	margin-left: 24rem;
	/* 384px */
}

.space-y-96>*+* {
	margin-top: 24rem;
	/* 384px */
}

.space-x-px>*+* {
	margin-left: 1px;
}

.space-y-px>*+* {
	margin-top: 1px;
}

.space-y-reverse>*+* {
	--tw-space-y-reverse: 1;
}

.space-x-reverse>*+* {
	--tw-space-x-reverse: 1;
}

/* Whitespace property*/

.whitespace-normal {
	white-space: normal;
}

.whitespace-nowrap {
	white-space: nowrap;
}

.whitespace-pre {
	white-space: pre;
}

.whitespace-pre-line {
	white-space: pre-line;
}

.whitespace-pre-wrap {
	white-space: pre-wrap;
}

.whitespace-break-spaces {
	white-space: break-spaces;
}

/* Usage:
   Apply these classes to control the white-space behavior of elements.
   .whitespace-normal: Allows text to wrap to the next line.
   .whitespace-nowrap: Prevents text from wrapping to the next line.
   .whitespace-pre: Preserves both spaces and line breaks.
   .whitespace-pre-line: Preserves line breaks but not spaces.
   .whitespace-pre-wrap: Preserves spaces and line breaks.
   .whitespace-break-spaces: Preserves spaces and breaks lines.
*/

/*Size*/

.size-2 {
	width: 0.5rem;
	height: 0.5rem;
	/* 8px */
}

.size-2-5 {
	width: 0.625rem;
	height: 0.625rem;
	/* 10px */
}

.size-3 {
	width: 0.75rem;
	height: 0.75rem;
	/* 12px */
}

.size-3-5 {
	width: 0.875rem;
	height: 0.875rem;
	/* 14px */
}

.size-4 {
	width: 1rem;
	height: 1rem;
	/* 16px */
}

.size-5 {
	width: 1.25rem;
	height: 1.25rem;
	/* 20px */
}

.size-6 {
	width: 1.5rem;
	height: 1.5rem;
	/* 24px */
}

.size-7 {
	width: 1.75rem;
	height: 1.75rem;
	/* 28px */
}

.size-8 {
	width: 2rem;
	height: 2rem;
	/* 32px */
}

.size-9 {
	width: 2.25rem;
	height: 2.25rem;
	/* 36px */
}

.size-10 {
	width: 2.5rem;
	height: 2.5rem;
	/* 40px */
}

.size-11 {
	width: 2.75rem;
	height: 2.75rem;
	/* 44px */
}

.size-12 {
	width: 3rem;
	height: 3rem;
	/* 48px */
}

.size-14 {
	width: 3.5rem;
	height: 3.5rem;
	/* 56px */
}

.size-16 {
	width: 4rem;
	height: 4rem;
	/* 64px */
}

.size-20 {
	width: 5rem;
	height: 5rem;
	/* 80px */
}

.size-24 {
	width: 6rem;
	height: 6rem;
	/* 96px */
}

.size-28 {
	width: 7rem;
	height: 7rem;
	/* 112px */
}

.size-32 {
	width: 8rem;
	height: 8rem;
	/* 128px */
}

.size-36 {
	width: 9rem;
	height: 9rem;
	/* 144px */
}

.size-40 {
	width: 10rem;
	height: 10rem;
	/* 160px */
}

.size-44 {
	width: 11rem;
	height: 11rem;
	/* 176px */
}

.size-48 {
	width: 12rem;
	height: 12rem;
	/* 192px */
}

.size-52 {
	width: 13rem;
	height: 13rem;
	/* 208px */
}

.size-56 {
	width: 14rem;
	height: 14rem;
	/* 224px */
}

.size-60 {
	width: 15rem;
	height: 15rem;
	/* 240px */
}

.size-64 {
	width: 16rem;
	height: 16rem;
	/* 256px */
}

.size-72 {
	width: 18rem;
	height: 18rem;
	/* 288px */
}

.size-80 {
	width: 20rem;
	height: 20rem;
	/* 320px */
}

.size-96 {
	width: 24rem;
	height: 24rem;
	/* 384px */
}

.size-px {
	width: 1px;
	height: 1px;
	/* 1px */
}

.size-1-2 {
	width: 50%;
	height: 50%;
	/* 50% */
}

.size-1-3 {
	width: 33.333333%;
	height: 33.333333%;
	/* 33.33% */
}

.size-2-3 {
	width: 66.666667%;
	height: 66.666667%;
	/* 66.67% */
}

.size-1-4 {
	width: 25%;
	height: 25%;
	/* 25% */
}

.size-2-4 {
	width: 50%;
	height: 50%;
	/* 50% */
}

.size-3-4 {
	width: 75%;
	height: 75%;
	/* 75% */
}

.size-1-5 {
	width: 20%;
	height: 20%;
	/* 20% */
}

.size-2-5 {
	width: 40%;
	height: 40%;
	/* 40% */
}

.size-3-5 {
	width: 60%;
	height: 60%;
	/* 60% */
}

.size-4-5 {
	width: 80%;
	height: 80%;
	/* 80% */
}

.size-1-6 {
	width: 16.666667%;
	height: 16.666667%;
	/* 16.67% */
}

.size-2-6 {
	width: 33.333333%;
	height: 33.333333%;
	/* 33.33% */
}

.size-3-6 {
	width: 50%;
	height: 50%;
	/* 50% */
}

.size-4-6 {
	width: 66.666667%;
	height: 66.666667%;
	/* 66.67% */
}

.size-5-6 {
	width: 83.333333%;
	height: 83.333333%;
	/* 83.33% */
}

.size-1-12 {
	width: 8.333333%;
	height: 8.333333%;
	/* 8.33% */
}

.size-2-12 {
	width: 16.666667%;
	height: 16.666667%;
	/* 16.67% */
}

.size-3-12 {
	width: 25%;
	height: 25%;
	/* 25% */
}

.size-4-12 {
	width: 33.333333%;
	height: 33.333333%;
	/* 33.33% */
}

.size-5-12 {
	width: 41.666667%;
	height: 41.666667%;
	/* 41.67% */
}

/* Word Wrapping and Breaking */
.break-normal {
	overflow-wrap: normal;
	word-break: normal;
}

.break-words {
	overflow-wrap: break-word;
}

.break-all {
	word-break: break-all;
}

.break-keep {
	word-break: keep-all;
}

/* Usage:
   .break-normal: Uses default line breaking rules.
   .break-words: Breaks words to prevent overflow.
   .break-all: Allows unbreakable words to be broken.
   .break-keep: Prevents word breaks for languages like Japanese and Chinese.
*/

.hyphens-none {
	hyphens: none;
}

.hyphens-manual {
	hyphens: manual;
}

.hyphens-auto {
	hyphens: auto;
}

/* Usage:
   .hyphens-none: Prevents hyphenation of text.
   .hyphens-manual: Hyphenates text at manual break points or hyphenation points.
   .hyphens-auto: Automatically hyphenates text where appropriate.
*/


/* Paragraph Styling */
/* Classes for max-width */
.max-w-sm {
	max-width: 576px;
}

.max-w-md {
	max-width: 768px;
}

.max-w-lg {
	max-width: 992px;
}

.max-w-xl {
	max-width: 1200px;
}

p {
	line-height: var(--line-height-base);
	font-size: var(--text-base);
	/*text-align: justify;*/
}

b {
	font-weight: bold;
}

/* Add extra class for paddings and margings or use quick option padded-p*/
.padded-p {
	padding: 0 15px;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.padded-p h3 {
	padding-bottom: 0.5rem;
	padding-top: 0.5rem;
}

/* Media Queries for responsiveness */
@media (max-width: 768px) {
	p {
		font-size: 14px;
	}
}

.required {
	color: var(--red-clr);
}

/*Line height*/

.line-h-n {
	line-height: normal;
}

.line-h-1_5 {
	line-height: 1.5;
}

/*Uncklickable*/ 

.unclickable {
	pointer-events: none;
}

/* Base width classes */
.width-10 {
	width: 10%;
}

.width-20 {
	width: 20%;
}

.width-30 {
	width: 30%;
}

.width-40 {
	width: 40%;
}

.width-50 {
	width: 50%;
}

.width-60 {
	width: 60%;
}

.width-70 {
	width: 70%;
}

.width-80 {
	width: 80%;
}

.width-90 {
	width: 90%;
}

.width-100 {
	width: 100%;
}

/* CURSOR CLASSES*/

.cursor-default {
    cursor: default;
}

.cursor-pointer {
    cursor: pointer;
}

.cursor-text {
    cursor: text;
}

.cursor-move {
    cursor: move;
}

.cursor-not-allowed {
    cursor: not-allowed;
}

.cursor-wait {
    cursor: wait;
}

.cursor-crosshair {
    cursor: crosshair;
}

.cursor-help {
    cursor: help;
}

.cursor-grab {
    cursor: grab;
}

.cursor-grabbing {
    cursor: grabbing;
}

.cursor-col-resize {
    cursor: col-resize;
}

.cursor-row-resize {
    cursor: row-resize;
}

.cursor-no-drop {
    cursor: no-drop;
}

.cursor-progress {
    cursor: progress;
}

.cursor-all-scroll {
    cursor: all-scroll;
}

.cursor-zoom-in {
    cursor: zoom-in;
}

.cursor-zoom-out {
    cursor: zoom-out;
}


/* GRADIENT*/
.gradient {
	background: var(--gradient-bg);
}

/* FONT WEIGHT NUMBERS*/
.font-weight-100 {
    font-weight: 100;
}

.font-weight-200 {
    font-weight: 200;
}

.font-weight-300 {
    font-weight: 300;
}

.font-weight-400 {
    font-weight: 400;
}

.font-weight-500 {
    font-weight: 500;
}

.font-weight-600 {
    font-weight: 600;
}

.font-weight-700 {
    font-weight: 700;
}

.font-weight-800 {
    font-weight: 800;
}

.font-weight-900 {
    font-weight: 900;
}

/* FONT WEIGHT WORDS*/
.font-weight-thin {
    font-weight: 100;
}

.font-weight-light {
    font-weight: 300;
}

.font-weight-regular {
    font-weight: 400;
}

.font-weight-medium {
    font-weight: 500;
}

.font-weight-semi-bold {
    font-weight: 600;
}

.font-weight-bold {
    font-weight: 700;
}

.font-weight-extra-bold {
    font-weight: 800;
}

.font-weight-black {
    font-weight: 900;
}

/* Text Hover Effects */
.text-hover-underline:hover {
  text-decoration: underline;
}

.text-hover-underline-offset:hover {
    text-decoration: underline;
    text-underline-offset: 4px; 
}

.text-hover-bold:hover {
  font-weight: bold;
}

.text-hover-color:hover {
  color: #007BFF; /* Blue */
}

.text-hover-opacity:hover {
  opacity: 0.7;
}

/* Background Hover Effects */
.bg-hover-light:hover {
  background-color: #f3f4f6; /* Light Gray */
}

.bg-hover-gradient:hover {
  background: linear-gradient(to right, #007BFF, #00C9A7); /* Blue to Green */
}

.bg-hover-opacity:hover {
  background-color: rgba(0, 128, 128, 0.5);
}

/* Border Hover Effects */
.border-hover {
  border: 2px solid transparent; /* Start with no visible border */
}

.border-hover:hover {
  border-color: #ff4500; /* Red Border */
}

.border-hover-thick {
  border: 2px solid #ddd; /* Base border */
}

.border-hover-thick:hover {
  border-width: 4px;
}

.border-hover-color {
  border: 2px solid #ddd; /* Default border */
}

.border-hover-color:hover {
  border-color: #4CAF50; /* Green Border */
}

/* Transform & Animation Effects */
.scale-hover:hover {
  transform: scale(1.1);
  transition: transform 0.3s ease;
}

.rotate-hover:hover {
  transform: rotate(10deg);
  transition: transform 0.3s ease;
}

.translate-hover:hover {
  transform: translateX(10px);
  transition: transform 0.3s ease;
}

.shadow-hover:hover {
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
  transition: box-shadow 0.3s ease;
}

.blur-hover:hover {
  filter: blur(3px);
}


/* Text Hover Effects */
.text-hover-underline:hover {
  text-decoration: underline;
}

.text-hover-bold:hover {
  font-weight: bold;
}

.text-hover-color:hover {
  color: var(--blue-clr); 
}

.text-hover-opacity:hover {
  opacity: 0.7;
}

/* Background Hover Effects */
.bg-hover-light:hover {
  background-color: var(--header-bg); 
}

/* Border Hover Effects */
.border-hover {
  border: 1px solid transparent; /* Start with no visible border */
}

.border-hover:hover {
  border-color: var(--blue-clr); 
}

.border-hover-thick {
  border: 1px solid var(--border-main-clr); /* Base border */
}

.border-hover-thick:hover {
  border-width: 2px;
  border-color: var(--blue-clr);
}

/* Transform & Animation Effects */
.scale-hover:hover {
  transform: scale(1.05);
  transition: transform 0.3s ease;
}

.translate-hover:hover {
  transform: translateX(10px);
  transition: transform 0.3s ease;
}

.shadow-hover:hover {
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3);
  transition: box-shadow 0.3s ease;
}

/*HIDE ON MOBILE*/

@media (min-width: 769px) {
  .hide-on-desktop {
    display: none !important;
  }
}

@media (max-width: 768px) {
  .hide-on-mobile {
  display: none !important;
}
}

.rotate-90 {
    transform: rotate(90deg);
    transition: transform 0.3s ease;
}

/* Icon rotating*/
.icon-rotate-right {
  transform: rotate(0deg);
}

.icon-rotate-up {
  transform: rotate(-90deg);
  transform-origin: center;
}

.icon-rotate-left {
  transform: scaleX(-1);
}

.icon-rotate-down {
  transform: rotate(90deg);
  transform-origin: center;
}