/* --------------------*/
/* ---- =HELPER CLASSES ------ */
/* --------------------*/
.color-primary { color: var(--ep-primary) !important }
.color-secondary { color: var(--ep-secondary) !important }
.color-text { color: var(--textDefault) !important }
.color-text-strong { color: var(--textStrong) !important }
.color-warning { color: var(--ep-warning) !important }
.color-info { color: var(--ep-info) !important }
.color-success { color: var(--ep-success) !important }
.color-danger { color: var(--ep-danger) !important }
.color-disabled { color: var(--textDisabled) !important }
.color-white { color: #fff !important }
.color-black { color: #212223 !important }

svg.color-primary { fill: var(--ep-primary) !important }
svg.color-secondary { fill: var(--ep-secondary) !important }
svg.color-text { fill: var(--textDefault) !important }
svg.color-text-strong { fill: var(--textStrong) !important }
svg.color-warning { fill: var(--ep-warning) !important }
svg.color-info { fill: var(--ep-info) !important }
svg.color-success { fill: var(--ep-success) !important }
svg.color-danger { fill: var(--ep-danger) !important }
svg.color-disabled { fill: var(--textDisabled) !important }
svg.color-white { fill: #fff !important }
svg.color-black { fill: #212223 !important }

.bg-primary { background: var(--ep-primary) !important }
.bg-secondary { background: var(--ep-secondary) !important }
.bg-text { background: var(--textDefault) !important }
.bg-warning { background: var(--ep-warning) !important }
.bg-info { background: var(--ep-info) !important }
.bg-success { background: var(--ep-success) !important }
.bg-danger { background: var(--ep-danger) !important }
.bg-disabled { background: var(--textDisabled) !important }
.bg-black { background: #000 !important }
.bg-light-grey { background-color: #e5e5e5 !important }
.bg-medium-grey { background-color: #cccccc !important }
.bg-grey { background-color: #999999 !important }
.bg-dark-grey { background-color: #222222 !important }
.bg-white, .bg-fff { background-color: white !important }
.bg-none, .no-bg { background: none !important; background-image: none !important; background-color: transparent !important }

.p-0 { padding: 0px !important; }
.pt-0 { padding-top: 0px !important; }
.pr-0 { padding-right: 0px !important; }
.pb-0 { padding-bottom: 0px !important; }
.pl-0 { padding-left: 0px !important; }
.pv-0 { padding-block: 0 !important; }
.ph-0 { padding-inline: 0 !important; }

.p-05 { padding: .5rem !important }
.pt-05 { padding-top: .5rem !important }
.pr-05 { padding-right: .5rem !important }
.pb-05 { padding-bottom: .5rem !important }
.pl-05 { padding-left: .5rem !important }
.pv-05 { padding-block: .5rem !important }
.ph-05 { padding-inline: .5rem !important }

.p-1 { padding: 1rem !important }
.pt-1 { padding-top: 1rem !important }
.pr-1 { padding-right: 1rem !important }
.pb-1 { padding-bottom: 1rem !important }
.pl-1 { padding-left: 1rem !important }
.pv-1 { padding-block: 1rem !important }
.ph-1 { padding-inline: 1rem !important }

.p-15 { padding: 1.5rem !important }
.pt-15 { padding-top: 1.5rem !important }
.pr-15 { padding-right: 1.5rem !important }
.pb-15 { padding-bottom: 1.5rem !important }
.pl-15 { padding-left: 1.5rem !important }
.pv-15 { padding-block: 1.5rem !important }
.ph-15 { padding-inline: 1.5rem !important }

.p-2 { padding: 2rem !important }
.pt-2 { padding-top: 2rem !important }
.pr-2 { padding-right: 2rem !important }
.pb-2 { padding-bottom: 2rem !important }
.pl-2 { padding-left: 2rem !important }
.pv-2 { padding-block: 2rem !important }
.ph-2 { padding-inline: 2rem !important }

.p-25 { padding: 2.5rem !important }
.pt-25 { padding-top: 2.5rem !important }
.pr-25 { padding-right: 2.5rem !important }
.pb-25 { padding-bottom: 2.5rem !important }
.pl-25 { padding-left: 2.5rem !important }
.pv-25 { padding-block: 2.5rem !important }
.ph-25 { padding-inline: 2.5rem !important }

.p-3 { padding: 3rem !important }
.pt-3 { padding-top: 3rem !important }
.pr-3 { padding-right: 3rem !important }
.pb-3 { padding-bottom: 3rem !important }
.pl-3 { padding-left: 3rem !important }
.pv-3 { padding-block: 3rem !important }
.ph-3 { padding-inline: 3rem !important }

.p-35 { padding: 3.5rem !important }
.pt-35 { padding-top: 3.5rem !important }
.pr-35 { padding-right: 3.5rem !important }
.pb-35 { padding-bottom: 3.5rem !important }
.pl-35 { padding-left: 3.5rem !important }
.pv-35 { padding-block: 3.5rem !important }
.ph-35 { padding-inline: 3.5rem !important }

.p-4 { padding: 4rem !important }
.pt-4 { padding-top: 4rem !important }
.pr-4 { padding-right: 4rem !important }
.pb-4 { padding-bottom: 4rem !important }
.pl-4 { padding-left: 4rem !important }
.pv-4 { padding-block: 4rem !important }
.ph-4 { padding-inline: 0 4rem !important }

.p-45 { padding: 4.5rem !important }
.pt-45 { padding-top: 4.5rem !important }
.pr-45 { padding-right: 4.5rem !important }
.pb-45 { padding-bottom: 4.5rem !important }
.pl-45 { padding-left: 4.5rem !important }
.pv-45 { padding-block: 4.5rem !important }
.ph-45 { padding-inline: 4.5rem !important }

.p-5 { padding: 5rem !important }
.pt-5 { padding-top: 5rem !important }
.pr-5 { padding-right: 5rem !important }
.pb-5 { padding-bottom: 5rem !important }
.pl-5 { padding-left: 5rem !important }
.pv-5 { padding-block: 5rem !important }
.ph-5 { padding-inline: 5rem !important }


.m-0 { margin: 0 !important; }
.mt-0 { margin-top: 0 !important; }
.mr-0 { margin-right: 0 !important; }
.mb-0 { margin-bottom: 0 !important; }
.ml-0 { margin-left: 0 !important; }
.mv-0 { margin-block: 0 !important; }
.mh-0 { margin-inline: 0 !important; }

.m-05 { margin: .5rem !important }
.mt-05 { margin-top: .5rem !important }
.mr-05 { margin-right: .5rem !important }
.mb-05 { margin-bottom: .5rem !important }
.ml-05 { margin-left: .5rem !important }
.mv-05 { margin-block: .5rem !important }
.mh-05 { margin-inline: .5rem !important }

.m-1 { margin: 1rem !important }
.mt-1 { margin-top: 1rem !important }
.mr-1 { margin-right: 1rem !important }
.mb-1 { margin-bottom: 1rem !important }
.ml-1 { margin-left: 1rem !important }
.mv-1 { margin-block: 1rem !important }
.mh-1 { margin-inline: 1rem !important }

.m-15 { margin: 1.5rem !important }
.mt-15 { margin-top: 1.5rem !important }
.mr-15 { margin-right: 1.5rem !important }
.mb-15 { margin-bottom: 1.5rem !important }
.ml-15 { margin-left: 1.5rem !important }
.mv-15 { margin-block: 1.5rem !important }
.mh-15 { margin-inline: 1.5rem !important }

.m-2 { margin: 2rem !important }
.mt-2 { margin-top: 2rem !important }
.mr-2 { margin-right: 2rem !important }
.mb-2 { margin-bottom: 2rem !important }
.ml-2 { margin-left: 2rem !important }
.mv-2 { margin-block: 2rem !important }
.mh-2 { margin-inline: 2rem !important }

.m-25 { margin: 2.5rem !important }
.mt-25 { margin-top: 2.5rem !important }
.mr-25 { margin-right: 2.5rem !important }
.mb-25 { margin-bottom: 2.5rem !important }
.ml-25 { margin-left: 2.5rem !important }
.mv-25 { margin-block: 2.5rem !important }
.mh-25 { margin-inline: 2.5rem !important }

.m-3 { margin: 3rem !important }
.mt-3 { margin-top: 3rem !important }
.mr-3 { margin-right: 3rem !important }
.mb-3 { margin-bottom: 3rem !important }
.ml-3 { margin-left: 3rem !important }
.mv-3 { margin-block: 3rem !important }
.mh-3 { margin-inline: 3rem !important }

.m-35 { margin: 3.5rem !important }
.mt-35 { margin-top: 3.5rem !important }
.mr-35 { margin-right: 3.5rem !important }
.mb-35 { margin-bottom: 3.5rem !important }
.ml-35 { margin-left: 3.5rem !important }
.mv-35 { margin-block: 3.5rem !important }
.mh-35 { margin-inline: 3.5rem !important }

.m-4 { margin: 4rem !important }
.mt-4 { margin-top: 4rem !important }
.mr-4 { margin-right: 4rem !important }
.mb-4 { margin-bottom: 4rem !important }
.ml-4 { margin-left: 4rem !important }
.mv-4 { margin-block: 4rem !important }
.mh-4 { margin-inline: 4rem !important }

.m-45 { margin: 4.5rem !important }
.mt-45 { margin-top: 4.5rem !important }
.mr-45 { margin-right: 4.5rem !important }
.mb-45 { margin-bottom: 4.5rem !important }
.ml-45 { margin-left: 4.5rem !important }
.mv-45 { margin-block: 4.5rem !important }
.mh-45 { margin-inline: 4.5rem !important }

.m-5 { margin: 5rem !important }
.mt-5 { margin-top: 5rem !important }
.mr-5 { margin-right: 5rem !important }
.mb-5 { margin-bottom: 5rem !important }
.ml-5 { margin-left: 5rem !important }
.mv-5 { margin-block: 5rem !important }
.mh-5 { margin-inline: 5rem !important }

.m-auto { margin: auto !important }
.mt-auto { margin-top: auto !important }
.mr-auto { margin-right: auto !important }
.mb-auto { margin-bottom: auto !important }
.ml-auto { margin-left: auto !important }
.mh-auto { margin-inline: auto !important }
.mv-auto { margin-block: auto !important }

.lh-1 { line-height: 1 !important }
.lh-13 { line-height: 1.3 !important }
.lh-15 { line-height: 1.5 !important }

.bold, .strong { font-weight: bold !important }
.no-bold { font-weight: normal !important }

.italic, .em { font-style: italic !important }
.strike { text-decoration: line-through !important }

.normal { font-weight: normal !important; font-style: normal !important }
.uppercase { text-transform: uppercase !important }

.text-left { text-align: left !important }
.text-center { text-align: center !important }
.text-right { text-align: right !important }

.fw100 { font-weight: 100 !important }
.fw200 { font-weight: 200 !important }
.fw300 { font-weight: 300 !important }
.fw400 { font-weight: 400 !important }
.fw500 { font-weight: 500 !important }
.fw600 { font-weight: 600 !important }
.fw700 { font-weight: 700 !important }
.fw800 { font-weight: 800 !important }
.fw900 { font-weight: 900 !important }

.fs9 { font-size: 9px !important }
.fs10 { font-size: 10px !important }
.fs11 { font-size: 11px !important }
.fs12 { font-size: 12px !important }
.fs13 { font-size: 13px !important }
.fs14 { font-size: 14px !important }
.fs15 { font-size: 15px !important }
.fs16 { font-size: 16px !important }
.fs17 { font-size: 17px !important }
.fs18 { font-size: 18px !important }
.fs19 { font-size: 19px !important }
.fs20 { font-size: 20px !important }
.fs30 { font-size: 30px !important }
.fs40 { font-size: 40px !important }
.fs50 { font-size: 50px !important }
.fs60 { font-size: 60px !important }
.fsGiga { font-size: var(--txtSizeGiga) !important }
.fsHuge { font-size: var(--txtSizeHuge) !important }
.fsXXLarge { font-size: var(--txtSizeXXLarge) !important }
.fsXLarge { font-size: var(--txtSizeXLarge) !important }
.fsLarge { font-size: var(--txtSizeLarge) !important }
.fsTiny { font-size: var(--txtSizeTiny) !important }
.fsSmall { font-size: var(--txtSizeSmall) !important }
.fsNormal { font-size: var(--txtSizeNormal) !important }

.size-small { font-size: 75% !important }
.size-normal { font-size: 100% !important }
.size-medium { font-size: 125% !important }
.size-large { font-size: 150% !important }
.size-huge { font-size: 200% !important }

.no-wrap { white-space: nowrap !important }
.text-ellipsis { white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }
.no-ul, .no-ul:hover, .no-ul a, .no-ul a:hover { text-decoration: none !important }

.color-inherit { color: inherit !important }
.clear { clear: both !important }
    .clear:after { display: table !important; content: " " !important; clear: both !important }

.f-left { float: left !important }
.f-right { float: right !important }
.f-none { float: none !important }

.d-block { display: block !important }
.d-inline { display: inline !important }
.d-inline-block { display: inline-block !important; *display: inline !important; zoom: 1 !important }
.flex, .d-flex { display: flex !important; }
.inline-flex, d-inline-flex { display: inline-flex !important; }
.direction-row { flex-direction: row !important; }
.direction-row-reverse { flex-direction: row-reverse !important; }
.direction-column { flex-direction: column !important; }
.direction-column-reverse { flex-direction: column-reverse !important; }
.justify-start { justify-content: flex-start !important; }
.justify-center { justify-content: center !important; }
.justify-end { justify-content: flex-end !important; }
.justify-between { justify-content: space-between !important; }
.justify-around { justify-content: space-around !important; }
.align-start { align-items: flex-start !important; }
.align-center { align-items: center !important; }
.align-end { align-items: flex-end !important; }
.-fg1 { flex-grow: 1; }
.-fg2 { flex-grow: 2; }
.-fg3 { flex-grow: 3; }
.-fg4 { flex-grow: 4; }
.-fg5 { flex-grow: 5; }
.-fg6 { flex-grow: 6; }
.-fg7 { flex-grow: 7; }
.-fg8 { flex-grow: 8; }
.-fg9 { flex-grow: 9; }
.gap-05 { gap: .5rem !important; }
.gap-1 { gap: 1rem !important; }
.gap-2 { gap: 2rem !important; }





.d-none, .hide, .hidden { display: none !important }
.rel, .relative { position: relative !important }
.abs, .absolute { position: absolute !important }
.fixed { position: fixed !important }
.static { position: static !important }

.t-0 { top: 0 !important }
.b-0 { bottom: 0 !important }
.l-0 { left: 0 !important }
.r-0 { right: 0 !important }
.tb-0 { top: 0 !important; bottom: 0 !important }
.lr-0 { left: 0 !important; right: 0 !important }

.no-shadow { box-shadow: none !important }
.no-border-radius { border-radius: 0 !important }
.no-border { border-width: 0 !important }
.border-transparent { border-color: transparent !important }

.pointer,
.clickable { cursor: pointer !important }
.pointer-events-none { pointer-events: none !important }
.fullwidth { width: 100% !important }

.nolist { list-style: none !important }

.text-shadow { text-shadow: 1px 1px 1px rgba(0,0,0,0.4) !important }

.radius { border-radius: var(--borderRadius) !important; }
.radius3 { border-radius: 3px !important }
.radius5 { border-radius: 5px !important }
.radius10 { border-radius: 10px !important }
.height100 { height: 100% !important }