/** global **/
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');

:root {
  --font-primary: "Poppins", sans-serif;
  --font-title: "Plus Jakarta Sans", sans-serif;
}

:root {
  --text-4: 4px;
  --text-7: 7px;
  --text-10: 10px;
  --text-12: 12px;
  --text-13: 13px;
  --text-14: 14px;
  --text-15: 15px;
  --text-16: 16px;
  --text-18: 18px;
  --text-20: 20px;
  --text-22: 22px;
  --text-24: 24px;
  --text-25: 25px;
  --text-26: 26px;
  --text-30: 30px;
  --text-40: 40px;
  --text-50: 50px;
  --text-60: 60px;
  --text-80: 80px;
  --text-100: 100px;
  --text-120: 120px;
  --text-150: 150px;
  --text-170: 170px;
  --text-200: 200px;
  --text-220: 220px;
  --text-250: 250px;
}

:root {
  --color-white: #FFFFFF;
  --color-black: #000000;
  --color-border: #DDDDDD;
  --color-dark-1: #232323;
  --color-dark-2: #393939;
  --color-dark-3: #5a5a5a;
  --color-dark-4: #7E7E7E;
  --color-dark-5: #b1b1b1;
  --color-dark-6: #161617;
  --color-dark-7: #0e0e0e;
  --color-light-1: #697488;
  --color-light-2: #F5F5F5;
  --color-light-3: #f0faf7;
  --color-light-4: #fcfcfc;
  --color-light-5: #f6fbff;
  --color-light-6: #F8F8F8;
  --color-light-7: #fdfdfd;
  --color-gray-1: #EFEFEF;
  --color-gray-2: #E0E0E0;
  --color-gray-3: #D7D7D7;
  --color-gray-4: #FDFDFD;
  --color-blue-1: #4139d3;
  --color-blue-2: #0071e3;
  --color-blue-3: #56a4f3;
  --color-blue-4: #b0d6fc;
  --color-blue-5: #deecfb;
  --color-purple-1: #5f1fcc;
  --color-purple-2: #790ac6;
  --color-purple-3: #a055e7;
  --color-purple-4: #c797f5;
  --color-purple-5: #f0e7f9;
  --color-orange-1: #FF622D;
  --color-orange-2: #F9704B;
  --color-orange-3: #F9917A;
  --color-orange-4: #F7AFA4;
  --color-orange-5: #FDF0EE;
  --color-red-1: #d80028;
  --color-red-2: #e55973;
  --color-red-3: #e98699;
  --color-red-4: #eabfc7;
  --color-red-5: #fff6f8;
  --color-green-1: #05CD99;
  --color-green-2: #48d8b3;
  --color-green-3: #77ebcd;
  --color-green-4: #b2efdf;
  --color-green-5: #f0fffb;
  --color-yellow-1: #EC9922;
  --color-yellow-2: #F3BB2E;
  --color-yellow-3: #FFCC4D;
  --color-yellow-4: #ffe29b;
  --color-yellow-5: #FDF5E9;
  --color-heart-1: #EF4444;
  --color-brown-1: #923E01;
  --color-info-1: #CDE9F6;
  --color-info-2: #4780AA;
  --color-warning-1: #F7F3D7;
  --color-warning-2: #927238;
  --color-error-1: #ECC8C5;
  --color-error-2: #f21100;
  --color-success-1: #DEF2D7;
  --color-success-2: #5B7052;
}

[data-anim-wrap] {
  pointer-events: none;
}

[data-anim-wrap].animated {
  pointer-events: auto;
}

@-webkit-keyframes reveal {
  100% {
    opacity: 1;
  }
}

@keyframes reveal {
  100% {
    opacity: 1;
  }
}

[data-anim^='slide-'],
[data-anim-child^='slide-'] {
  opacity: 0;
  transition-property: opacity, transform;
  pointer-events: none;
  transition-duration: 1s;
  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
}

[data-anim^='slide-'].is-in-view,
[data-anim-child^='slide-'].is-in-view {
  opacity: 1;
  transform: translate3d(0, 0, 0);
  pointer-events: auto;
}

[data-anim^='slide-up'],
[data-anim-child^='slide-up'] {
  transform: translate3d(0, 40px, 0);
}

[data-anim^='slide-down'],
[data-anim-child^='slide-down'] {
  transform: translate3d(0, -40px, 0);
}

[data-anim^='slide-right'],
[data-anim-child^='slide-right'] {
  transform: translate3d(-40px, 0, 0);
}

[data-anim^='slide-left'],
[data-anim-child^='slide-left'] {
  transform: translate3d(40px, 0, 0);
}

[data-anim^='fade'],
[data-anim-child^='fade'] {
  opacity: 0;
  transition-property: opacity;
  pointer-events: none;
  transition-duration: 0.8s;
  transition-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
}

[data-anim^='fade'].is-in-view,
[data-anim-child^='fade'].is-in-view {
  opacity: 1;
  pointer-events: auto;
}

[data-anim*="delay-1"],
[data-anim-child*="delay-1"] {
  transition-delay: 0.1s;
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}

[data-anim*="delay-1"]::after,
[data-anim-child*="delay-1"]::after {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}

[data-anim*="delay-1"]>*,
[data-anim-child*="delay-1"]>* {
  -webkit-animation-delay: 0.1s;
  animation-delay: 0.1s;
}

[data-anim*="delay-2"],
[data-anim-child*="delay-2"] {
  transition-delay: 0.2s;
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}

[data-anim*="delay-2"]::after,
[data-anim-child*="delay-2"]::after {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}

[data-anim*="delay-2"]>*,
[data-anim-child*="delay-2"]>* {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}

[data-anim*="delay-3"],
[data-anim-child*="delay-3"] {
  transition-delay: 0.3s;
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}

[data-anim*="delay-3"]::after,
[data-anim-child*="delay-3"]::after {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}

[data-anim*="delay-3"]>*,
[data-anim-child*="delay-3"]>* {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}

[data-anim*="delay-4"],
[data-anim-child*="delay-4"] {
  transition-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}

[data-anim*="delay-4"]::after,
[data-anim-child*="delay-4"]::after {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}

[data-anim*="delay-4"]>*,
[data-anim-child*="delay-4"]>* {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}

[data-anim*="delay-5"],
[data-anim-child*="delay-5"] {
  transition-delay: 0.5s;
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}

[data-anim*="delay-5"]::after,
[data-anim-child*="delay-5"]::after {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}

[data-anim*="delay-5"]>*,
[data-anim-child*="delay-5"]>* {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}

[data-anim*="delay-6"],
[data-anim-child*="delay-6"] {
  transition-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

[data-anim*="delay-6"]::after,
[data-anim-child*="delay-6"]::after {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

[data-anim*="delay-6"]>*,
[data-anim-child*="delay-6"]>* {
  -webkit-animation-delay: 0.6s;
  animation-delay: 0.6s;
}

[data-anim*="delay-7"],
[data-anim-child*="delay-7"] {
  transition-delay: 0.7s;
  -webkit-animation-delay: 0.7s;
  animation-delay: 0.7s;
}

[data-anim*="delay-7"]::after,
[data-anim-child*="delay-7"]::after {
  -webkit-animation-delay: 0.7s;
  animation-delay: 0.7s;
}

[data-anim*="delay-7"]>*,
[data-anim-child*="delay-7"]>* {
  -webkit-animation-delay: 0.7s;
  animation-delay: 0.7s;
}

[data-anim*="delay-8"],
[data-anim-child*="delay-8"] {
  transition-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}

[data-anim*="delay-8"]::after,
[data-anim-child*="delay-8"]::after {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}

[data-anim*="delay-8"]>*,
[data-anim-child*="delay-8"]>* {
  -webkit-animation-delay: 0.8s;
  animation-delay: 0.8s;
}

[data-anim*="delay-9"],
[data-anim-child*="delay-9"] {
  transition-delay: 0.9s;
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
}

[data-anim*="delay-9"]::after,
[data-anim-child*="delay-9"]::after {
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
}

[data-anim*="delay-9"]>*,
[data-anim-child*="delay-9"]>* {
  -webkit-animation-delay: 0.9s;
  animation-delay: 0.9s;
}

[data-anim*="delay-10"],
[data-anim-child*="delay-10"] {
  transition-delay: 1s;
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

[data-anim*="delay-10"]::after,
[data-anim-child*="delay-10"]::after {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

[data-anim*="delay-10"]>*,
[data-anim-child*="delay-10"]>* {
  -webkit-animation-delay: 1s;
  animation-delay: 1s;
}

[data-anim*="delay-11"],
[data-anim-child*="delay-11"] {
  transition-delay: 1.1s;
  -webkit-animation-delay: 1.1s;
  animation-delay: 1.1s;
}

[data-anim*="delay-11"]::after,
[data-anim-child*="delay-11"]::after {
  -webkit-animation-delay: 1.1s;
  animation-delay: 1.1s;
}

[data-anim*="delay-11"]>*,
[data-anim-child*="delay-11"]>* {
  -webkit-animation-delay: 1.1s;
  animation-delay: 1.1s;
}

[data-anim*="delay-12"],
[data-anim-child*="delay-12"] {
  transition-delay: 1.2s;
  -webkit-animation-delay: 1.2s;
  animation-delay: 1.2s;
}

[data-anim*="delay-12"]::after,
[data-anim-child*="delay-12"]::after {
  -webkit-animation-delay: 1.2s;
  animation-delay: 1.2s;
}

[data-anim*="delay-12"]>*,
[data-anim-child*="delay-12"]>* {
  -webkit-animation-delay: 1.2s;
  animation-delay: 1.2s;
}

[data-anim*="delay-13"],
[data-anim-child*="delay-13"] {
  transition-delay: 1.3s;
  -webkit-animation-delay: 1.3s;
  animation-delay: 1.3s;
}

[data-anim*="delay-13"]::after,
[data-anim-child*="delay-13"]::after {
  -webkit-animation-delay: 1.3s;
  animation-delay: 1.3s;
}

[data-anim*="delay-13"]>*,
[data-anim-child*="delay-13"]>* {
  -webkit-animation-delay: 1.3s;
  animation-delay: 1.3s;
}

[data-anim*="delay-14"],
[data-anim-child*="delay-14"] {
  transition-delay: 1.4s;
  -webkit-animation-delay: 1.4s;
  animation-delay: 1.4s;
}

[data-anim*="delay-14"]::after,
[data-anim-child*="delay-14"]::after {
  -webkit-animation-delay: 1.4s;
  animation-delay: 1.4s;
}

[data-anim*="delay-14"]>*,
[data-anim-child*="delay-14"]>* {
  -webkit-animation-delay: 1.4s;
  animation-delay: 1.4s;
}

[data-anim*="delay-15"],
[data-anim-child*="delay-15"] {
  transition-delay: 1.5s;
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
}

[data-anim*="delay-15"]::after,
[data-anim-child*="delay-15"]::after {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
}

[data-anim*="delay-15"]>*,
[data-anim-child*="delay-15"]>* {
  -webkit-animation-delay: 1.5s;
  animation-delay: 1.5s;
}

[data-anim*="delay-16"],
[data-anim-child*="delay-16"] {
  transition-delay: 1.6s;
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
}

[data-anim*="delay-16"]::after,
[data-anim-child*="delay-16"]::after {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
}

[data-anim*="delay-16"]>*,
[data-anim-child*="delay-16"]>* {
  -webkit-animation-delay: 1.6s;
  animation-delay: 1.6s;
}

[data-anim*="delay-17"],
[data-anim-child*="delay-17"] {
  transition-delay: 1.7s;
  -webkit-animation-delay: 1.7s;
  animation-delay: 1.7s;
}

[data-anim*="delay-17"]::after,
[data-anim-child*="delay-17"]::after {
  -webkit-animation-delay: 1.7s;
  animation-delay: 1.7s;
}

[data-anim*="delay-17"]>*,
[data-anim-child*="delay-17"]>* {
  -webkit-animation-delay: 1.7s;
  animation-delay: 1.7s;
}

[data-anim*="delay-18"],
[data-anim-child*="delay-18"] {
  transition-delay: 1.8s;
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}

[data-anim*="delay-18"]::after,
[data-anim-child*="delay-18"]::after {
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}

[data-anim*="delay-18"]>*,
[data-anim-child*="delay-18"]>* {
  -webkit-animation-delay: 1.8s;
  animation-delay: 1.8s;
}

[data-anim*="delay-19"],
[data-anim-child*="delay-19"] {
  transition-delay: 1.9s;
  -webkit-animation-delay: 1.9s;
  animation-delay: 1.9s;
}

[data-anim*="delay-19"]::after,
[data-anim-child*="delay-19"]::after {
  -webkit-animation-delay: 1.9s;
  animation-delay: 1.9s;
}

[data-anim*="delay-19"]>*,
[data-anim-child*="delay-19"]>* {
  -webkit-animation-delay: 1.9s;
  animation-delay: 1.9s;
}

[data-anim*="delay-20"],
[data-anim-child*="delay-20"] {
  transition-delay: 2s;
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

[data-anim*="delay-20"]::after,
[data-anim-child*="delay-20"]::after {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

[data-anim*="delay-20"]>*,
[data-anim-child*="delay-20"]>* {
  -webkit-animation-delay: 2s;
  animation-delay: 2s;
}

/* animation */
.ani1 {
  -webkit-animation: ani1 10s infinite ease-in-out alternate;
  animation: ani1 10s infinite ease-in-out alternate;
}

.ani2 {
  -webkit-animation: ani2 10s infinite ease-in-out alternate;
  animation: ani2 10s infinite ease-in-out alternate;
}

.ani3 {
  -webkit-animation: ani3 4s infinite ease-in-out alternate;
  animation: ani3 4s infinite ease-in-out alternate;
}

.ani4 {
  -webkit-animation: ani4 7s infinite ease-in-out alternate;
  animation: ani4 7s infinite ease-in-out alternate;
}

.ani5 {
  -webkit-animation: ani5 7s infinite ease-in-out alternate;
  animation: ani5 7s infinite ease-in-out alternate;
}

.ani6 {
  -webkit-animation: ani6 7s infinite ease-in-out alternate;
  animation: ani6 7s infinite ease-in-out alternate;
}

.ani7 {
  -webkit-animation: ani7 7s infinite ease-in-out alternate;
  animation: ani7 7s infinite ease-in-out alternate;
}

.ani8 {
  -webkit-animation: ani8 2000ms infinite ease-in-out alternate;
  animation: ani8 2000ms infinite ease-in-out alternate;
}

@keyframes ani1 {
  0% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }

  20% {
    -webkit-transform: translate(-73px, 1px) rotate(-36deg);
    transform: translate(-73px, 1px) rotate(-36deg);
  }

  40% {
    -webkit-transform: translate(-141px, -72px) rotate(-72deg);
    transform: translate(-141px, -72px) rotate(-72deg);
  }

  60% {
    -webkit-transform: translate(-83px, -122px) rotate(-108deg);
    transform: translate(-83px, -122px) rotate(-108deg);
  }

  80% {
    -webkit-transform: translate(40px, -72px) rotate(-144deg);
    transform: translate(40px, -72px) rotate(-144deg);
  }

  100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

@keyframes ani2 {
  0% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }

  20% {
    -webkit-transform: translate(20px, 1px) rotate(36deg);
    transform: translate(20px, 1px) rotate(36deg);
  }

  40% {
    -webkit-transform: translate(100px, 72px) rotate(72deg);
    transform: translate(100px, 72px) rotate(72deg);
  }

  60% {
    -webkit-transform: translate(83px, 122px) rotate(108deg);
    transform: translate(83px, 122px) rotate(108deg);
  }

  80% {
    -webkit-transform: translate(40px, 72px) rotate(144deg);
    transform: translate(40px, 72px) rotate(144deg);
  }

  100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

@keyframes ani3 {
  0% {
    transform: scale(0.8, 0.8);
  }

  50% {
    transform: scale(1, 1);
  }

  100% {
    transform: scale(0.8, 0.8);
  }
}

@keyframes ani4 {

  0%,
  100% {
    transform: translateX(0);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }

  50% {
    transform: translateX(-20px);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
}

@keyframes ani5 {

  0%,
  100% {
    transform: translateX(0);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }

  50% {
    transform: translateX(20px);
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
  }
}

@keyframes ani6 {
  0% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }

  20% {
    -webkit-transform: translate(-13px, 1px) rotate(-6deg);
    transform: translate(-13px, 1px) rotate(-6deg);
  }

  40% {
    -webkit-transform: translate(-41px, -22px) rotate(-22deg);
    transform: translate(-41px, -22px) rotate(-22deg);
  }

  60% {
    -webkit-transform: translate(-33px, -22px) rotate(-50deg);
    transform: translate(-33px, -22px) rotate(-50deg);
  }

  80% {
    -webkit-transform: translate(40px, -72px) rotate(-50deg);
    transform: translate(40px, -72px) rotate(-50deg);
  }

  100% {
    -webkit-transform: translate(0px, 0px) rotate(0deg);
    transform: translate(0px, 0px) rotate(0deg);
  }
}

@keyframes ani7 {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

@keyframes ani8 {
  from {
    -webkit-transform: translateY(0);
    -moz-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  to {
    -webkit-transform: translateY(-7px);
    -moz-transform: translateY(-7px);
    -o-transform: translateY(-7px);
    -ms-transform: translateY(-7px);
    transform: translateY(-7px);
  }
}

/* Zaten varsa bu kısmı eklemeyin */
.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  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: 1080px;
  }
}

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


/*** Them BG Color ***/
.bg-white {
  background-color: var(--color-white) !important
}

.bg-black {
  background-color: var(--color-black) !important
}

.bg-border {
  background-color: var(--color-border) !important
}

.bg-dark-1 {
  background-color: var(--color-dark-1) !important
}

.bg-dark-2 {
  background-color: var(--color-dark-2) !important
}

.bg-dark-3 {
  background-color: var(--color-dark-3) !important
}

.bg-dark-4 {
  background-color: var(--color-dark-4) !important
}

.bg-dark-5 {
  background-color: var(--color-dark-5) !important
}

.bg-dark-6 {
  background: var(--color-dark-6) !important
}
.bg-dark-7 {
  background: var(--color-dark-7) !important
}

.bg-dark-6-gradian {
  background: linear-gradient(rgb(0 0 0), rgb(29 29 31) 50%) !important;
}

.bg-light-1 {
  background-color: var(--color-light-1) !important
}

.bg-light-2 {
  background-color: var(--color-light-2) !important
}

.bg-light-3 {
  background-color: var(--color-light-3) !important
}

.bg-light-4 {
  background-color: var(--color-light-4) !important
}

.bg-light-5 {
  background-color: var(--color-light-5) !important
}

.bg-light-6 {
  background-color: var(--color-light-6) !important
}

.bg-light-7 {
  background-color: var(--color-light-7) !important
}

.bg-gray-1 {
  background-color: var(--color-gray-1) !important
}

.bg-gray-2 {
  background-color: var(--color-gray-2) !important
}

.bg-gray-3 {
  background-color: var(--color-gray-3) !important
}

.bg-gray-4 {
  background-color: var(--color-gray-4) !important
}

.bg-orange-1 {
  background-color: var(--color-orange-1) !important
}

.bg-orange-2 {
  background-color: var(--color-orange-2) !important
}

.bg-orange-3 {
  background-color: var(--color-orange-3) !important
}

.bg-orange-4 {
  background-color: var(--color-orange-4) !important
}

.bg-orange-5 {
  background-color: var(--color-orange-5) !important
}

.bg-orange-1-g {
  background: linear-gradient(113deg, var(--color-orange-3) 0%, var(--color-orange-1) 100%) !important;
}

.bg-blue-1 {
  background-color: var(--color-blue-1) !important
}

.bg-blue-2 {
  background-color: var(--color-blue-2) !important
}

.bg-blue-3 {
  background-color: var(--color-blue-3) !important
}

.bg-blue-4 {
  background-color: var(--color-blue-4) !important
}

.bg-blue-5 {
  background-color: var(--color-blue-5) !important
}

.bg-blue-1-g {
  background: linear-gradient(113deg, var(--color-blue-2) 0%, var(--color-blue-1) 100%) !important;
}

.bg-green-1 {
  background-color: var(--color-green-1) !important
}

.bg-green-2 {
  background-color: var(--color-green-2) !important
}

.bg-green-3 {
  background-color: var(--color-green-3) !important
}

.bg-green-4 {
  background-color: var(--color-green-4) !important
}

.bg-green-5 {
  background-color: var(--color-green-5) !important
}

.bg-yellow-1 {
  background-color: var(--color-yellow-1) !important
}

.bg-yellow-2 {
  background-color: var(--color-yellow-2) !important
}

.bg-yellow-3 {
  background-color: var(--color-yellow-3) !important
}

.bg-yellow-4 {
  background-color: var(--color-yellow-4) !important
}

.bg-yellow-5 {
  background-color: var(--color-yellow-5) !important
}

.bg-purple-1 {
  background-color: var(--color-purple-1) !important
}

.bg-purple-2 {
  background-color: var(--color-purple-2) !important
}

.bg-purple-3 {
  background-color: var(--color-purple-3) !important
}

.bg-purple-4 {
  background-color: var(--color-purple-4) !important
}

.bg-purple-5 {
  background-color: var(--color-purple-5) !important
}

.bg-red-1 {
  background-color: var(--color-red-1) !important
}

.bg-red-2 {
  background-color: var(--color-red-2) !important
}

.bg-red-3 {
  background-color: var(--color-red-3) !important
}

.bg-red-4 {
  background-color: var(--color-red-4) !important
}

.bg-red-5 {
  background-color: var(--color-red-5) !important
}

.bg-brown-1 {
  background-color: var(--color-brown-1) !important
}

.bg-pg-gradyan {
  background: linear-gradient(113deg, var(--color-green-4) 0%, var(--color-green-1) 100%);
}

.bg-gradyan-1 {
  background: radial-gradient(101.06% 233.34% at 29.14% 50%, rgba(198, 215, 235, .4) 0, #c6d7eb 61.98%), #fff;
}

.bg-gradyan-2 {
  background: radial-gradient(101.06% 233.34% at 29.14% 50%, rgba(204, 231, 214, .4) 0, #cce7d6 61.98%), #fff;
}

.bg-gradyan-3 {
  background: radial-gradient(101.06% 233.34% at 29.14% 50%, hsla(22, 36%, 85%, .4) 0, #e7d6cc 61.98%), #fff
}

.bg-footer-gradyan {
  background: linear-gradient(90deg, #EAC645 0%, #F2A173 17.57%, #97DEC0 49.15%, #6C87E6 59.32%, #CE4EEE 78.05%, #EF5B2C 100%);
}

.bg-gradyan-partner {
  background: linear-gradient(180deg, #ffffff 0%, #f4f4f4 100%);
}

.bg-heart-1 {
  background-color: var(--color-heart-1) !important
}

.bg-info-1 {
  background-color: var(--color-info-1) !important
}

.bg-info-2 {
  background-color: var(--color-info-2) !important
}

.bg-warning-1 {
  background-color: var(--color-warning-1) !important
}

.bg-warning-2 {
  background-color: var(--color-warning-2) !important
}

.bg-error-1 {
  background-color: var(--color-error-1) !important
}

.bg-error-2 {
  background-color: var(--color-error-2) !important
}

.bg-success-1 {
  background-color: var(--color-success-1) !important
}

.bg-success-2 {
  background-color: var(--color-success-2) !important
}

.bg-blue-1-05 {
  background-color: rgb(247 247 247 / 81%);
}

.bg-white-10 {
  background-color: rgba(255, 255, 255, 0.1)
}

.bg-white-20 {
  background-color: rgba(255, 255, 255, 0.2)
}

.bg-white-50 {
  background-color: rgba(255, 255, 255, 0.5)
}

.bg-black-20 {
  background-color: rgba(0, 0, 0, 0.2)
}

.bg-black-10 {
  background-color: rgba(0, 0, 0, 0.1)
}

/*** Them Text Color ***/
.text-white {
  color: var(--color-white)
}

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

.text-border {
  color: var(--color-border)
}

.text-dark-1 {
  color: var(--color-dark-1);
}

.text-dark-2 {
  color: var(--color-dark-2)
}

.text-dark-3 {
  color: var(--color-dark-3)
}

.text-dark-4 {
  color: var(--color-dark-4)
}

.text-dark-5 {
  color: var(--color-dark-5)
}

.text-dark-6 {
  color: var(--color-dark-6)
}

.text-dark-7 {
  color: var(--color-dark-7)
}

.text-light-1 {
  color: var(--color-light-1)
}

.text-light-2 {
  color: var(--color-light-2)
}

.text-light-3 {
  color: var(--color-light-3)
}

.text-light-4 {
  color: var(--color-light-4)
}

.text-light-5 {
  color: var(--color-light-5)
}

.text-light-6 {
  color: var(--color-light-6)
}

.text-gray-1 {
  color: var(--color-gray-1)
}

.text-gray-2 {
  color: var(--color-gray-2)
}

.text-gray-3 {
  color: var(--color-gray-3)
}

.text-gray-4 {
  color: var(--color-gray-4)
}

.text-orange-1 {
  color: var(--color-orange-1)
}

.text-orange-2 {
  color: var(--color-orange-2)
}

.text-orange-3 {
  color: var(--color-orange-3)
}

.text-orange-4 {
  color: var(--color-orange-4)
}

.text-orange-5 {
  color: var(--color-orange-5)
}

.text-blue-1 {
  color: var(--color-blue-1)
}

.text-blue-2 {
  color: var(--color-blue-2)
}

.text-blue-3 {
  color: var(--color-blue-3)
}

.text-blue-4 {
  color: var(--color-blue-4)
}

.text-blue-5 {
  color: var(--color-blue-5)
}

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

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

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

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

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

.text-yellow-1 {
  color: var(--color-yellow-1)
}

.text-yellow-2 {
  color: var(--color-yellow-2)
}

.text-yellow-3 {
  color: var(--color-yellow-3)
}

.text-yellow-4 {
  color: var(--color-yellow-4)
}

.text-yellow-5 {
  color: var(--color-yellow-5)
}

.text-purple-1 {
  color: var(--color-purple-1)
}

.text-purple-2 {
  color: var(--color-purple-2)
}

.text-purple-3 {
  color: var(--color-purple-3)
}

.text-purple-4 {
  color: var(--color-purple-4)
}

.text-purple-5 {
  color: var(--color-purple-5)
}

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

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

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

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

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

.text-brown-1 {
  color: var(--color-brown-1)
}

.text-heart-1 {
  color: var(--color-heart-1)
}

.text-info-1 {
  color: var(--color-info-1)
}

.text-info-2 {
  color: var(--color-info-2)
}

.text-warning-1 {
  color: var(--color-warning-1)
}

.text-warning-2 {
  color: var(--color-warning-2)
}

.text-error-1 {
  color: var(--color-error-1)
}

.text-error-2 {
  color: var(--color-error-2)
}

.text-success-1 {
  color: var(--color-success-1)
}

.text-success-2 {
  color: var(--color-success-2)
}

.text-inherit {
  color: inherit
}

.text-white-50 {
  color: rgba(255, 255, 255, 0.5)
}

.text-gradiant-1 {
  background: -webkit-linear-gradient(#eee, #333);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.text-gradiant-2 {
  background: linear-gradient(45deg, var(--color-blue-3), var(--color-blue-2), var(--color-blue-1), var(--color-purple-1), var(--color-purple-2), var(--color-purple-3), var(--color-purple-4));
  background: -webkit-linear-gradient(45deg, var(--color-blue-3), var(--color-blue-2), var(--color-blue-1), var(--color-purple-1), var(--color-purple-2), var(--color-purple-3), var(--color-purple-4));
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


/*** BTN STYLE ***/
button {
  padding: 0;
  margin: 0;
  border: 0;
  border-radius: 0;
  background-color: transparent;
  text-decoration: none;
}

button:focus {
  outline: 0;
}

.button {
  display: flex;
  align-items: center;
  justify-content: center;
  text-wrap: nowrap;
  vertical-align: middle;
  text-align: center;
  padding: 12px 20px;
  line-height: 1;
  font-weight: 400;
  font-size: 14px;
  line-height: 1;
  border-radius: 60px;
  height: 40px;
  border: 1px solid transparent;
  transition: all 0.5s ease;
  box-shadow: 0 2px 5px 0px #0000001c;
}

.button i.ml-none,
.button svg.ml-none {
  margin-left: 0px !important;
}

.button i,
.button svg {
  margin-left: -6px !important;
}

.button.-sm {
  font-size: 12px;
  height: 30px;
  line-height: 30px;
}

.button.-md {
  font-size: 14px;
  height: 45px;
  line-height: 45px;
}

.button.-lg {
  font-size: 16px;
  height: 60px;
  line-height: 60px;
}

.button.-min-180 {
  min-width: 180px;
}

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

.button.-white:hover {
  border-color: var(--color-white);
  background: var(--color-white) !important;
  color: white !important;
}

.button.-outline-white {
  border-color: var(--color-white);
}

.button.-outline-white:hover {
  background: var(--color-white);
  border-color: transparent;
  color: white !important;
}

.button.-black:hover {
  border-color: var(--color-black);
  background: var(--color-black) !important;
  color: white !important;
}

.button.-outline-black {
  border-color: var(--color-black);
}

.button.-outline-black:hover {
  background: var(--color-black);
  border-color: transparent;
  color: white !important;
}

.button.-border:hover {
  border-color: var(--color-border);
  background: var(--color-border) !important;
  color: white !important;
}

.button.-outline-border {
  border-color: var(--color-border);
}

.button.-outline-border:hover {
  background: var(--color-border);
  border-color: transparent;
  color: white !important;
}

.button.-dark-1:hover {
  border-color: var(--color-dark-4);
  background: var(--color-dark-4) !important;
  color: white !important;
}

.button.-outline-dark-1 {
  border-color: var(--color-dark-1);
  background: transparent;
}

.button.-outline-dark-1:hover {
  background: var(--color-dark-1);
  border-color: transparent;
  color: white !important;
}

.button.-dark-2:hover {
  border-color: var(--color-dark-2);
  background: var(--color-dark-2) !important;
  color: white !important;
}

.button.-outline-dark-2 {
  border-color: var(--color-dark-2);
}

.button.-outline-dark-2:hover {
  background: var(--color-dark-2);
  border-color: transparent;
  color: white !important;
}

.button.-dark-3:hover {
  border-color: var(--color-dark-3);
  background: var(--color-dark-3) !important;
  color: white !important;
}

.button.-outline-dark-3 {
  border-color: var(--color-dark-3);
}

.button.-outline-dark-3:hover {
  background: var(--color-dark-3);
  border-color: transparent;
  color: white !important;
}

.button.-dark-4:hover {
  border-color: var(--color-dark-4);
  background: var(--color-dark-4) !important;
  color: white !important;
}

.button.-outline-dark-4 {
  border-color: var(--color-dark-4);
}

.button.-outline-dark-4:hover {
  background: var(--color-dark-4);
  border-color: transparent;
  color: white !important;
}

.button.-light-1:hover {
  border-color: var(--color-light-1);
  background: var(--color-light-1) !important;
  color: white !important;
}

.button.-outline-light-1 {
  border-color: var(--color-light-1);
}

.button.-outline-light-1:hover {
  background: var(--color-light-1);
  border-color: transparent;
  color: white !important;
}

.button.-light-2:hover {
  border-color: var(--color-dark-4) !important;
  background: var(--color-light-2) !important;
  color: var(--color-dark-4) !important;
}

.button.-outline-light-2 {
  border-color: var(--color-light-2);
}

.button.-outline-light-2:hover {
  background: var(--color-light-2);
  border-color: transparent;
}

.button.-light-3:hover {
  border-color: var(--color-light-3);
  background: var(--color-light-3) !important;
  color: var(--color-green-2) !important;
}

.button.-outline-light-3 {
  border-color: var(--color-light-3);
}

.button.-outline-light-3:hover {
  background: var(--color-light-3);
  border-color: transparent;
  color: white !important;
}


/* BTN purple */
.button.-purple-1:hover {
  border-color: var(--color-purple-1);
  background: var(--color-purple-1) !important;
  color: var(--color-purple-6) !important;
}

.button.-outline-purple-1 {
  border-color: var(--color-purple-1);
  background: transparent !important;
}

.button.-outline-purple-1:hover {
  background: var(--color-purple-1);
  border-color: transparent;
  color: var(--color-purple-1) !important;
}

.button.-purple-2:hover {
  border-color: var(--color-purple-2);
  background: var(--color-purple-2) !important;
  color: var(--color-purple-6) !important;
}

.button.-outline-purple-2 {
  border-color: var(--color-purple-2);
  background: transparent !important;
}

.button.-outline-purple-2:hover {
  background: var(--color-purple-2);
  border-color: transparent;
  color: var(--color-purple-2) !important;
}

.button.-purple-3:hover {
  border-color: var(--color-purple-3);
  background: var(--color-purple-3) !important;
  color: var(--color-purple-6) !important;
}

.button.-outline-purple-3 {
  border-color: var(--color-purple-3);
  background: transparent !important;
}

.button.-outline-purple-3:hover {
  background: var(--color-purple-3);
  border-color: transparent;
  color: var(--color-purple-3) !important;
}

.button.-purple-4:hover {
  border-color: var(--color-purple-4);
  background: var(--color-purple-4) !important;
  color: var(--color-purple-6) !important;
}

.button.-outline-purple-4 {
  border-color: var(--color-purple-4);
  background: transparent !important;
}

.button.-outline-purple-4:hover {
  background: var(--color-purple-4);
  border-color: transparent;
  color: var(--color-purple-4) !important;
}

.button.-purple-5:hover {
  border-color: var(--color-purple-5);
  background: var(--color-purple-5) !important;
  color: var(--color-purple-1) !important;
}

.button.-outline-purple-5 {
  border-color: var(--color-purple-5);
  background: transparent !important;
}

.button.-outline-purple-5:hover {
  background: var(--color-purple-5);
  border-color: transparent;
  color: var(--color-purple-5) !important;
}

.button.-purple-6:hover {
  border-color: var(--color-purple-6);
  background: var(--color-purple-6) !important;
  color: var(--color-purple-1) !important;
}

.button.-outline-purple-6 {
  border-color: var(--color-purple-6);
  background: transparent !important;
}

.button.-outline-purple-6:hover {
  background: var(--color-purple-6);
  border-color: transparent;
  color: var(--color-purple-6) !important;
}

/* BTN purple */


/* BTN BLUE */
.button.-blue-1:hover {
  border-color: var(--color-blue-1) !important;
  background: var(--color-blue-1) !important;
  color: white !important;
}

.button.-outline-blue-1 {
  border-color: var(--color-blue-1);
}

.button.-outline-blue-1:hover {
  background: var(--color-blue-1);
  border-color: transparent;
  color: white !important;
}

.button.-blue-2:hover {
  border-color: var(--color-blue-2);
  background: var(--color-blue-2) !important;
  color: white !important;
}

.button.-outline-blue-2 {
  border-color: var(--color-blue-2);
}

.button.-outline-blue-2:hover {
  background: var(--color-blue-2);
  border-color: transparent;
  color: white !important;
}

.button.-blue-3:hover {
  border-color: var(--color-blue-3) !important;
  background: var(--color-blue-3) !important;
  color: white !important;
}

.button.-outline-blue-3 {
  border-color: var(--color-blue-3);
}

.button.-outline-blue-3:hover {
  background: var(--color-blue-3);
  border-color: transparent;
  color: white !important;
}

.button.-blue-3:hover {
  border-color: var(--color-blue-4) !important;
  background: var(--color-blue-4) !important;
  color: white !important;
}

.button.-outline-blue-3 {
  border-color: var(--color-blue-4);
}

.button.-outline-blue-3:hover {
  background: var(--color-blue-4);
  border-color: transparent;
  color: white !important;
}

.button.-blue-5:hover {
  border-color: var(--color-blue-5) !important;
  background: var(--color-blue-5) !important;
  color: white !important;
}

.button.-outline-blue-5 {
  border-color: var(--color-blue-5);
}

.button.-outline-blue-5:hover {
  background: var(--color-blue-5);
  border-color: transparent;
  color: white !important;
}

/* BTN BLUE */


/* BTN YELLOW */
.button.-yellow-1:hover {
  border-color: var(--color-yellow-1);
  background: var(--color-yellow-1) !important;
  color: var(--color-blue-1) !important;
}

.button.-outline-yellow-1 {
  border-color: var(--color-yellow-1);
  background: transparent !important;
}

.button.-outline-yellow-1:hover {
  background: var(--color-yellow-1);
  border-color: transparent;
  color: var(--color-blue-1) !important;
}

.button.-yellow-2:hover {
  border-color: var(--color-yellow-2);
  background: var(--color-yellow-2) !important;
  color: var(--color-blue-1) !important;
}

.button.-outline-yellow-2 {
  border-color: var(--color-yellow-2);
  background: transparent !important;
}

.button.-outline-yellow-2:hover {
  background: var(--color-yellow-2);
  border-color: transparent;
  color: var(--color-blue-1) !important;
}

.button.-yellow-3:hover {
  border-color: var(--color-yellow-3);
  background: var(--color-yellow-3);
  color: var(--color-blue-1) !important;
}

.button.-outline-yellow-3 {
  border-color: var(--color-yellow-3);
  background: transparent !important;
}

.button.-outline-yellow-3:hover {
  background: var(--color-yellow-3);
  border-color: transparent;
  color: var(--color-blue-1) !important;
}

.button.-yellow-4:hover {
  border-color: var(--color-yellow-4);
  background: var(--color-yellow-4) !important;
  color: var(--color-blue-1) !important;
}

.button.-outline-yellow-4 {
  border-color: var(--color-yellow-4);
  background: transparent !important;
}

.button.-outline-yellow-4:hover {
  background: var(--color-yellow-4);
  border-color: transparent;
  color: var(--color-blue-1) !important;
}

.button.-yellow-5:hover {
  border-color: var(--color-yellow-5);
  background: var(--color-yellow-5) !important;
  color: var(--color-yellow-1) !important;
}

.button.-outline-yellow-5 {
  border-color: var(--color-yellow-5);
  background: transparent !important;
}

.button.-outline-yellow-5:hover {
  background: var(--color-yellow-5);
  border-color: transparent;
  color: var(--color-yellow-1) !important;
}

/* BTN YELLOW */


/* BTN GREEN */
.button.-green-1:hover {
  border-color: var(--color-green-1);
  background: var(--color-green-1) !important;
  color: white !important;
}

.button.-outline-green-1 {
  border-color: var(--color-green-1);
}

.button.-outline-green-1:hover {
  background: var(--color-green-1);
  border-color: transparent;
  color: white !important;
}

.button.-green-2:hover {
  border-color: var(--color-green-2);
  background: var(--color-green-2) !important;
  color: white !important;
}

.button.-outline-green-2 {
  border-color: var(--color-green-2);
}

.button.-outline-green-2:hover {
  background: var(--color-green-2);
  border-color: transparent;
  color: white !important;
}

.button.-green-3:hover {
  border-color: var(--color-green-3);
  background: var(--color-green-3) !important;
  color: white !important;
}

.button.-outline-green-3 {
  border-color: var(--color-green-3);
}

.button.-outline-green-3:hover {
  background: var(--color-green-3);
  border-color: transparent;
  color: white !important;
}

.button.-green-4:hover {
  border-color: var(--color-green-4);
  background: var(--color-green-4) !important;
  color: white !important;
}

.button.-outline-green-4 {
  border-color: var(--color-green-4);
}

.button.-outline-green-4:hover {
  background: var(--color-green-4);
  border-color: transparent;
  color: white !important;
}

.button.-green-5:hover {
  border-color: var(--color-green-5);
  background: var(--color-green-5) !important;
  color: white !important;
}

.button.-outline-green-5 {
  border-color: var(--color-green-5);
}

.button.-outline-green-5:hover {
  background: var(--color-green-5);
  border-color: transparent;
  color: white !important;
}

/* BTN GREEN */


.button.-brown-1:hover {
  border-color: var(--color-brown-1);
  background: var(--color-brown-1) !important;
  color: white !important;
}

.button.-outline-brown-1 {
  border-color: var(--color-brown-1);
}

.button.-outline-brown-1:hover {
  background: var(--color-brown-1);
  border-color: transparent;
  color: white !important;
}

.button.-red-1 {
  border-color: none;
  background: var(--color-red-1) !important;
  color: white !important;
}

.button.-red-1:hover {
  border-color: none;
  background: var(--color-red-2) !important;
  color: white !important;
}

.button.-red-1:hover svg {
  color: var(--color-white) !important;
}

.button.-outline-red-1 {
  background: transparent !important;
  border-color: var(--color-red-1) !important;
  color: var(--color-red-1) !important;
}

.button.-outline-red-1:hover svg {
  color: var(--color-white) !important;
}

.button.-outline-red-1:hover {
  background: var(--color-red-1) !important;
  border-color: none !important;
  color: var(--color-white) !important;
}

.button.-red-2:hover {
  border-color: var(--color-red-2);
  background: var(--color-red-2) !important;
  color: white !important;
}

.button.-outline-red-2 {
  border-color: var(--color-red-2);
}

.button.-outline-red-2:hover {
  background: var(--color-red-2);
  border-color: transparent;
  color: white !important;
}

.button.-red-3:hover {
  border-color: var(--color-red-3);
  background: var(--color-red-3) !important;
  color: white !important;
}

.button.-outline-red-3 {
  border-color: var(--color-red-3);
}

.button.-outline-red-3:hover {
  background: var(--color-red-3);
  border-color: transparent;
  color: white !important;
}

.button.-info-1:hover {
  border-color: var(--color-info-1);
  background: var(--color-info-1) !important;
  color: white !important;
}

.button.-outline-info-1 {
  border-color: var(--color-info-1);
}

.button.-outline-info-1:hover {
  background: var(--color-info-1);
  border-color: transparent;
  color: white !important;
}

.button.-info-2:hover {
  border-color: var(--color-info-2);
  background: var(--color-info-2) !important;
  color: white !important;
}

.button.-outline-info-2 {
  border-color: var(--color-info-2);
}

.button.-outline-info-2:hover {
  background: var(--color-info-2);
  border-color: transparent;
  color: white !important;
}

.button.-warning-1:hover {
  border-color: var(--color-warning-1);
  background: var(--color-warning-1) !important;
  color: white !important;
}

.button.-outline-warning-1 {
  border-color: var(--color-warning-1);
}

.button.-outline-warning-1:hover {
  background: var(--color-warning-1);
  border-color: transparent;
  color: white !important;
}

.button.-warning-2:hover {
  border-color: var(--color-warning-2);
  background: var(--color-warning-2) !important;
  color: white !important;
}

.button.-outline-warning-2 {
  border-color: var(--color-warning-2);
}

.button.-outline-warning-2:hover {
  background: var(--color-warning-2);
  border-color: transparent;
  color: white !important;
}

.button.-error-1:hover {
  border-color: var(--color-error-1);
  background: var(--color-error-1) !important;
  color: white !important;
}

.button.-outline-error-1 {
  border-color: var(--color-error-1);
}

.button.-outline-error-1:hover {
  background: var(--color-error-1);
  border-color: transparent;
  color: white !important;
}

.button.-error-2:hover {
  border-color: var(--color-error-2);
  background: var(--color-error-2) !important;
  color: white !important;
}

.button.-outline-error-2 {
  border-color: var(--color-error-2);
}

.button.-outline-error-2:hover {
  background: var(--color-error-2);
  border-color: transparent;
  color: white !important;
}

.button.-success-1:hover {
  border-color: var(--color-success-1);
  background: var(--color-success-1) !important;
  color: white !important;
}

.button.-outline-success-1 {
  border-color: var(--color-success-1);
}

.button.-outline-success-1:hover {
  background: var(--color-success-1);
  border-color: transparent;
  color: white !important;
}

.button.-success-2:hover {
  border-color: var(--color-success-2);
  background: var(--color-success-2) !important;
  color: white !important;
}

.button.-outline-success-2 {
  border-color: var(--color-success-2);
}

.button.-outline-success-2:hover {
  background: var(--color-success-2);
  border-color: transparent;
  color: white !important;
}

.button.-white:hover {
  background: var(--color-light-3) !important;
  color: var(--color-dark-1) !important;
}

.button.-blue-1-05:hover {
  background: rgba(53, 84, 209, 0.05) !important;
  color: var(--color-blue-1) !important;
}

.button.-outline-white:hover {
  background: white !important;
  color: var(--color-dark-1) !important;
}


.bg-blur {
  background: #ffffff0a;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.bg-blur-1 {
  background: #00000014;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.bg-blur-2 {
  background: #eff5fb24;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.bg-blur-3 {
  background: #ffffff8f;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.bg-blur-4 {
  background: #184e7703;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.bg-blur-6 {
  background: #0000008f;
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.bg-blur-nocolor {
  background: #ffffff00;
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}



/*** ratio ***/
.ratio>* {
  position: relative;
  display: block;
  overflow: hidden;
  width: auto;
  height: auto;
  left: auto;
  top: auto;
}

.ratio::before {
  display: block;
  width: 100%;
  content: "";
}

.ratio-1\:1::before {
  padding-bottom: 100%
}

.ratio-2\:1::before {
  padding-bottom: 50%
}

.ratio-3\:2::before {
  padding-bottom: 66.66667%
}

.ratio-3\:4::before {
  padding-bottom: 133.33333%
}

.ratio-4\:3::before {
  padding-bottom: 75%
}

.ratio-4\:2::before {
  padding-bottom: 40%
}

.ratio-4\:1::before {
  padding-bottom: 25%
}

.ratio-5\:4::before {
  padding-bottom: 80%
}

.ratio-6\:5::before {
  padding-bottom: 83.33333%
}

.ratio-8\:5::before {
  padding-bottom: 62.5%
}

.ratio-9\:16::before {
  padding-bottom: 179%;
}

.ratio-9\:14::before {
  padding-bottom: 159%;
}

.ratio-9\:15::before {
  padding-bottom: 169%;
}

.ratio-9\:12::before {
  padding-bottom: 139%;
}

.ratio-15\:9::before {
  padding-bottom: 60%
}

.ratio-16\:9::before {
  padding-bottom: 56.25%
}

.ratio-23\:18::before {
  padding-bottom: 78.26087%
}

.ratio-41\:35::before {
  padding-bottom: 85.36585%
}

.ratio-41\:45::before {
  padding-bottom: 109.7561%
}

.ratio-41\:45::before {
  padding-bottom: 109.7561%
}

.ratio-41\:51::before {
  padding-bottom: 115%
}

.ratio-63\:55::before {
  padding-bottom: 87.30159%
}

.ratio-64\:45::before {
  padding-bottom: 70.3125%
}

@media (max-width: 1300px) {
  .xxl\:ratio-1\:1::before {
    padding-bottom: 100%
  }

  .xxl\:ratio-2\:1::before {
    padding-bottom: 50%
  }

  .xxl\:ratio-3\:2::before {
    padding-bottom: 66.66667%
  }

  .xxl\:ratio-3\:4::before {
    padding-bottom: 133.33333%
  }

  .xxl\:ratio-4\:3::before {
    padding-bottom: 75%
  }

  .xxl\:ratio-4\:2::before {
    padding-bottom: 40%
  }

  .xxl\:ratio-4\:1::before {
    padding-bottom: 25%
  }

  .xxl\:ratio-5\:4::before {
    padding-bottom: 80%
  }

  .xxl\:ratio-6\:5::before {
    padding-bottom: 83.33333%
  }

  .xxl\:ratio-8\:5::before {
    padding-bottom: 62.5%
  }

  .xxl\:ratio-9\:16::before {
    padding-bottom: 179%;
  }

  .xxl\:ratio-9\:15::before {
    padding-bottom: 169%;
  }

  .xxl\:ratio-9\:14::before {
    padding-bottom: 159%;
  }

  .xxl\:ratio-9\:12::before {
    padding-bottom: 139%;
  }

  .xxl\:ratio-15\:9::before {
    padding-bottom: 60%
  }

  .xxl\:ratio-16\:9::before {
    padding-bottom: 56.25%
  }

  .xxl\:ratio-23\:18::before {
    padding-bottom: 78.26087%
  }

  .xxl\:ratio-41\:35::before {
    padding-bottom: 85.36585%
  }

  .xxl\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .xxl\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .xxl\:ratio-41\:51::before {
    padding-bottom: 115%
  }

  .xxl\:ratio-63\:55::before {
    padding-bottom: 87.30159%
  }

  .xxl\:ratio-64\:45::before {
    padding-bottom: 70.3125%
  }
}

@media (max-width: 1199px) {
  .xl\:ratio-1\:1::before {
    padding-bottom: 100%
  }

  .xl\:ratio-2\:1::before {
    padding-bottom: 50%
  }

  .xl\:ratio-3\:2::before {
    padding-bottom: 66.66667%
  }

  .xl\:ratio-3\:4::before {
    padding-bottom: 133.33333%
  }

  .xl\:ratio-4\:3::before {
    padding-bottom: 75%
  }

  .xl\:ratio-4\:2::before {
    padding-bottom: 40%
  }

  .xl\:ratio-4\:1::before {
    padding-bottom: 25%
  }

  .xl\:ratio-5\:4::before {
    padding-bottom: 80%
  }

  .xl\:ratio-6\:5::before {
    padding-bottom: 83.33333%
  }

  .xl\:ratio-8\:5::before {
    padding-bottom: 62.5%
  }

  .xl\:ratio-9\:16::before {
    padding-bottom: 179%;
  }

  .xl\:ratio-9\:14::before {
    padding-bottom: 159%;
  }

  .xl\:ratio-9\:15::before {
    padding-bottom: 169%;
  }

  .xl\:ratio-9\:12::before {
    padding-bottom: 139%;
  }

  .xl\:ratio-15\:9::before {
    padding-bottom: 60%
  }

  .xl\:ratio-16\:9::before {
    padding-bottom: 56.25%
  }

  .xl\:ratio-23\:18::before {
    padding-bottom: 78.26087%
  }

  .xl\:ratio-41\:35::before {
    padding-bottom: 85.36585%
  }

  .xl\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .xl\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .xl\:ratio-41\:51::before {
    padding-bottom: 115%
  }

  .xl\:ratio-63\:55::before {
    padding-bottom: 87.30159%
  }

  .xl\:ratio-64\:45::before {
    padding-bottom: 70.3125%
  }
}

@media (max-width: 991px) {
  .lg\:ratio-1\:1::before {
    padding-bottom: 100%
  }

  .lg\:ratio-2\:1::before {
    padding-bottom: 50%
  }

  .lg\:ratio-3\:2::before {
    padding-bottom: 66.66667%
  }

  .lg\:ratio-3\:4::before {
    padding-bottom: 133.33333%
  }

  .lg\:ratio-4\:3::before {
    padding-bottom: 75%
  }

  .lg\:ratio-4\:2::before {
    padding-bottom: 40%
  }

  .lg\:ratio-4\:1::before {
    padding-bottom: 25%
  }

  .lg\:ratio-5\:4::before {
    padding-bottom: 80%
  }

  .lg\:ratio-6\:5::before {
    padding-bottom: 83.33333%
  }

  .lg\:ratio-8\:5::before {
    padding-bottom: 62.5%
  }

  .lg\:ratio-9\:16::before {
    padding-bottom: 179%;
  }

  .lg\:ratio-9\:14::before {
    padding-bottom: 159%;
  }

  .lg\:ratio-9\:15::before {
    padding-bottom: 169%;
  }

  .lg\:ratio-9\:12::before {
    padding-bottom: 139%;
  }

  .lg\:ratio-15\:9::before {
    padding-bottom: 60%
  }

  .lg\:ratio-16\:9::before {
    padding-bottom: 56.25%
  }

  .lg\:ratio-23\:18::before {
    padding-bottom: 78.26087%
  }

  .lg\:ratio-41\:35::before {
    padding-bottom: 85.36585%
  }

  .lg\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .lg\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .lg\:ratio-41\:51::before {
    padding-bottom: 115%
  }

  .lg\:ratio-63\:55::before {
    padding-bottom: 87.30159%
  }

  .lg\:ratio-64\:45::before {
    padding-bottom: 70.3125%
  }
}

@media (max-width: 767px) {
  .md\:ratio-1\:1::before {
    padding-bottom: 100%
  }

  .md\:ratio-2\:1::before {
    padding-bottom: 50%
  }

  .md\:ratio-3\:2::before {
    padding-bottom: 66.66667%
  }

  .md\:ratio-3\:4::before {
    padding-bottom: 133.33333%
  }

  .md\:ratio-4\:3::before {
    padding-bottom: 75%
  }

  .md\:ratio-4\:2::before {
    padding-bottom: 40%
  }

  .md\:ratio-4\:1::before {
    padding-bottom: 25%
  }

  .md\:ratio-5\:4::before {
    padding-bottom: 80%
  }

  .md\:ratio-6\:5::before {
    padding-bottom: 83.33333%
  }

  .md\:ratio-8\:5::before {
    padding-bottom: 62.5%
  }

  .md\:ratio-9\:16::before {
    padding-bottom: 179%;
  }

  .md\:ratio-9\:14::before {
    padding-bottom: 159%;
  }

  .md\:ratio-9\:15::before {
    padding-bottom: 169%;
  }

  .md\:ratio-9\:12::before {
    padding-bottom: 139%;
  }

  .md\:ratio-15\:9::before {
    padding-bottom: 60%
  }

  .md\:ratio-16\:9::before {
    padding-bottom: 56.25%
  }

  .md\:ratio-23\:18::before {
    padding-bottom: 78.26087%
  }

  .md\:ratio-41\:35::before {
    padding-bottom: 85.36585%
  }

  .md\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .md\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .md\:ratio-41\:51::before {
    padding-bottom: 115%
  }

  .md\:ratio-63\:55::before {
    padding-bottom: 87.30159%
  }

  .md\:ratio-64\:45::before {
    padding-bottom: 70.3125%
  }
}

@media (max-width: 575px) {
  .sm\:ratio-1\:1::before {
    padding-bottom: 100%
  }

  .sm\:ratio-2\:1::before {
    padding-bottom: 50%
  }

  .sm\:ratio-3\:2::before {
    padding-bottom: 66.66667%
  }

  .sm\:ratio-3\:4::before {
    padding-bottom: 133.33333%
  }

  .sm\:ratio-4\:3::before {
    padding-bottom: 75%
  }

  .sm\:ratio-4\:2::before {
    padding-bottom: 40%
  }

  .sm\:ratio-4\:1::before {
    padding-bottom: 25%
  }

  .sm\:ratio-5\:4::before {
    padding-bottom: 80%
  }

  .sm\:ratio-6\:5::before {
    padding-bottom: 83.33333%
  }

  .sm\:ratio-8\:5::before {
    padding-bottom: 62.5%
  }

  .sm\:ratio-9\:16::before {
    padding-bottom: 179%;
  }

  .sm\:ratio-9\:14::before {
    padding-bottom: 159%;
  }

  .sm\:ratio-9\:15::before {
    padding-bottom: 169%;
  }

  .sm\:ratio-9\:12::before {
    padding-bottom: 139%;
  }

  .sm\:ratio-15\:9::before {
    padding-bottom: 60%
  }

  .sm\:ratio-16\:9::before {
    padding-bottom: 56.25%
  }

  .sm\:ratio-23\:18::before {
    padding-bottom: 78.26087%
  }

  .sm\:ratio-41\:35::before {
    padding-bottom: 85.36585%
  }

  .sm\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .sm\:ratio-41\:45::before {
    padding-bottom: 109.7561%
  }

  .sm\:ratio-41\:51::before {
    padding-bottom: 115%
  }

  .sm\:ratio-63\:55::before {
    padding-bottom: 87.30159%
  }

  .sm\:ratio-64\:45::before {
    padding-bottom: 70.3125%
  }
}

/*** Zindex ***/
.z-n1 {
  z-index: -1 !important
}

.z-0 {
  z-index: 0 !important
}

.z-1 {
  z-index: 1 !important
}

.z-2 {
  z-index: 2 !important
}

.z-3 {
  z-index: 3 !important
}

.z-4 {
  z-index: 4 !important
}

.z-5 {
  z-index: 5 !important
}

.z-10 {
  z-index: 10 !important
}

.z-50 {
  z-index: 50 !important
}

.z-100 {
  z-index: 100 !important
}

.z-200 {
  z-index: 200 !important
}

.z-500 {
  z-index: 500 !important
}

.z-900 {
  z-index: 900 !important
}

.z-1000 {
  z-index: 1000 !important
}

/*** Letter Space ***/
.ls-0 {
  letter-spacing: 0px !important
}

.ls-1 {
  letter-spacing: 1px !important
}

.ls-2 {
  letter-spacing: 2px !important
}

.ls-3 {
  letter-spacing: 3px !important
}

.ls-4 {
  letter-spacing: 4px !important
}

.ls-5 {
  letter-spacing: 5px !important
}

.ls-10 {
  letter-spacing: 10px !important
}

.ls-n1 {
  letter-spacing: -1px !important
}

.ls-n2 {
  letter-spacing: -2px !important
}

.ls-n3 {
  letter-spacing: -3px !important
}

.ls-n4 {
  letter-spacing: -4px !important
}

.ls-n5 {
  letter-spacing: -5px !important
}

.ls-n10 {
  letter-spacing: -10px !important
}

/*** Line Height ***/
.lh-0 {
  line-height: 0 !important
}

.lh-1 {
  line-height: 1 !important
}

.lh-11 {
  line-height: 1.1 !important
}

.lh-12 {
  line-height: 1.2 !important
}

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

.lh-14 {
  line-height: 1.4 !important
}

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

.lh-16 {
  line-height: 1.6 !important
}

.lh-17 {
  line-height: 1.7 !important
}

.lh-18 {
  line-height: 1.8 !important
}

.lh-19 {
  line-height: 1.9 !important
}

.lh-2 {
  line-height: 2 !important
}

.lh-3 {
  line-height: 3 !important
}

.lh-4 {
  line-height: 4 !important
}

@media (max-width: 1300px) {
  .xxl\:lh-0 {
    line-height: 0 !important
  }

  .xxl\:lh-1 {
    line-height: 1 !important
  }

  .xxl\:lh-11 {
    line-height: 1.1 !important
  }

  .xxl\:lh-12 {
    line-height: 1.2 !important
  }

  .xxl\:lh-13 {
    line-height: 1.3 !important
  }

  .xxl\:lh-14 {
    line-height: 1.4 !important
  }

  .xxl\:lh-15 {
    line-height: 1.5 !important
  }

  .xxl\:lh-16 {
    line-height: 1.6 !important
  }

  .xxl\:lh-17 {
    line-height: 1.7 !important
  }

  .xxl\:lh-18 {
    line-height: 1.8 !important
  }

  .xxl\:lh-19 {
    line-height: 1.9 !important
  }

  .xxl\:lh-2 {
    line-height: 2 !important
  }

  .xxl\:lh-3 {
    line-height: 3 !important
  }

  .xxl\:h-4 {
    line-height: 4 !important
  }
}

@media (max-width: 1199px) {
  .xl\:lh-0 {
    line-height: 0 !important
  }

  .xl\:lh-1 {
    line-height: 1 !important
  }

  .xl\:lh-11 {
    line-height: 1.1 !important
  }

  .xl\:lh-12 {
    line-height: 1.2 !important
  }

  .xl\:lh-13 {
    line-height: 1.3 !important
  }

  .xl\:lh-14 {
    line-height: 1.4 !important
  }

  .xl\:lh-15 {
    line-height: 1.5 !important
  }

  .xl\:lh-16 {
    line-height: 1.6 !important
  }

  .xl\:lh-17 {
    line-height: 1.7 !important
  }

  .xl\:lh-18 {
    line-height: 1.8 !important
  }

  .xl\:lh-19 {
    line-height: 1.9 !important
  }

  .xl\:lh-2 {
    line-height: 2 !important
  }

  .xl\:lh-3 {
    line-height: 3 !important
  }

  .xl\:h-4 {
    line-height: 4 !important
  }
}

@media (max-width: 991px) {
  .lg\:lh-0 {
    line-height: 0 !important
  }

  .lg\:lh-1 {
    line-height: 1 !important
  }

  .lg\:lh-11 {
    line-height: 1.1 !important
  }

  .lg\:lh-12 {
    line-height: 1.2 !important
  }

  .lg\:lh-13 {
    line-height: 1.3 !important
  }

  .lg\:lh-14 {
    line-height: 1.4 !important
  }

  .lg\:lh-15 {
    line-height: 1.5 !important
  }

  .lg\:lh-16 {
    line-height: 1.6 !important
  }

  .lg\:lh-17 {
    line-height: 1.7 !important
  }

  .lg\:lh-18 {
    line-height: 1.8 !important
  }

  .lg\:lh-19 {
    line-height: 1.9 !important
  }

  .lg\:lh-2 {
    line-height: 2 !important
  }

  .lg\:lh-3 {
    line-height: 3 !important
  }

  .lg\:h-4 {
    line-height: 4 !important
  }
}

@media (max-width: 767px) {
  .md\:lh-0 {
    line-height: 0 !important
  }

  .md\:lh-1 {
    line-height: 1 !important
  }

  .md\:lh-11 {
    line-height: 1.1 !important
  }

  .md\:lh-12 {
    line-height: 1.2 !important
  }

  .md\:lh-13 {
    line-height: 1.3 !important
  }

  .md\:lh-14 {
    line-height: 1.4 !important
  }

  .md\:lh-15 {
    line-height: 1.5 !important
  }

  .md\:lh-16 {
    line-height: 1.6 !important
  }

  .md\:lh-17 {
    line-height: 1.7 !important
  }

  .md\:lh-18 {
    line-height: 1.8 !important
  }

  .md\:lh-19 {
    line-height: 1.9 !important
  }

  .md\:lh-2 {
    line-height: 2 !important
  }

  .md\:lh-3 {
    line-height: 3 !important
  }

  .md\:h-4 {
    line-height: 4 !important
  }
}

@media (max-width: 575px) {
  .sm\:lh-0 {
    line-height: 0 !important
  }

  .sm\:lh-1 {
    line-height: 1 !important
  }

  .sm\:lh-11 {
    line-height: 1.1 !important
  }

  .sm\:lh-12 {
    line-height: 1.2 !important
  }

  .sm\:lh-13 {
    line-height: 1.3 !important
  }

  .sm\:lh-14 {
    line-height: 1.4 !important
  }

  .sm\:lh-15 {
    line-height: 1.5 !important
  }

  .sm\:lh-16 {
    line-height: 1.6 !important
  }

  .sm\:lh-17 {
    line-height: 1.7 !important
  }

  .sm\:lh-18 {
    line-height: 1.8 !important
  }

  .sm\:lh-19 {
    line-height: 1.9 !important
  }

  .sm\:lh-2 {
    line-height: 2 !important
  }

  .sm\:lh-3 {
    line-height: 3 !important
  }

  .sm\:h-4 {
    line-height: 4 !important
  }
}

/*** Font Size ***/
.text-4 {
  font-size: var(--text-4) !important;
}

.text-7 {
  font-size: var(--text-7) !important;
}

.text-10 {
  font-size: var(--text-10) !important;
}

.text-12 {
  font-size: var(--text-12) !important;
}

.text-13 {
  font-size: var(--text-13) !important;
}

.text-14 {
  font-size: var(--text-14) !important;
}

.text-15 {
  font-size: var(--text-15) !important;
}

.text-16 {
  font-size: var(--text-16) !important;
}

.text-18 {
  font-size: var(--text-18) !important;
}

.text-20 {
  font-size: var(--text-20) !important;
}

.text-22 {
  font-size: var(--text-22) !important;
}

.text-24 {
  font-size: var(--text-24) !important;
}

.text-25 {
  font-size: var(--text-25) !important;
}

.text-26 {
  font-size: var(--text-26) !important;
}

.text-30 {
  font-size: var(--text-30) !important;
}

.text-40 {
  font-size: var(--text-40) !important;
}

.text-50 {
  font-size: var(--text-50) !important;
}

.text-60 {
  font-size: var(--text-60) !important;
}

.text-80 {
  font-size: var(--text-80) !important;
}

.text-100 {
  font-size: var(--text-100) !important;
}

.text-120 {
  font-size: var(--text-120) !important;
}

.text-150 {
  font-size: var(--text-150) !important;
}

.text-170 {
  font-size: var(--text-170) !important;
}

.text-200 {
  font-size: var(--text-200) !important;
}

.text-220 {
  font-size: var(--text-220) !important;
}

.text-250 {
  font-size: var(--text-250) !important;
}

@media (max-width: 1199px) {
  .xl\:text-4 {
    font-size: var(--text-4) !important;
  }

  .xl\:text-7 {
    font-size: var(--text-7) !important;
  }

  .xl\:text-10 {
    font-size: var(--text-10) !important;
  }

  .xl\:text-12 {
    font-size: var(--text-12) !important;
  }

  .xl\:text-13 {
    font-size: var(--text-13) !important;
  }

  .xl\:text-14 {
    font-size: var(--text-14) !important;
  }

  .xl\:text-15 {
    font-size: var(--text-15) !important;
  }

  .xl\:text-16 {
    font-size: var(--text-16) !important;
  }

  .xl\:text-18 {
    font-size: var(--text-18) !important;
  }

  .xl\:text-20 {
    font-size: var(--text-20) !important;
  }

  .xl\:text-22 {
    font-size: var(--text-22) !important;
  }

  .xl\:text-24 {
    font-size: var(--text-24) !important;
  }

  .xl\:text-25 {
    font-size: var(--text-25) !important;
  }

  .xl\:text-26 {
    font-size: var(--text-26) !important;
  }

  .xl\:text-30 {
    font-size: var(--text-30) !important;
  }

  .xl\:text-40 {
    font-size: var(--text-40) !important;
  }

  .xl\:text-50 {
    font-size: var(--text-50) !important;
  }

  .xl\:text-60 {
    font-size: var(--text-60) !important;
  }

  .xl\:text-80 {
    font-size: var(--text-80) !important;
  }

  .xl\:text-100 {
    font-size: var(--text-100) !important;
  }

  .xl\:text-120 {
    font-size: var(--text-120) !important;
  }

  .xl\:text-150 {
    font-size: var(--text-150) !important;
  }

  .xl\:text-170 {
    font-size: var(--text-170) !important;
  }

  .xl\:text-200 {
    font-size: var(--text-200) !important;
  }

  .xl\:text-220 {
    font-size: var(--text-220) !important;
  }

  .xl\:text-250 {
    font-size: var(--text-250) !important;
  }
}

@media (max-width: 991px) {
  .lg\:text-4 {
    font-size: var(--text-4) !important;
  }

  .lg\:text-7 {
    font-size: var(--text-7) !important;
  }

  .lg\:text-10 {
    font-size: var(--text-10) !important;
  }

  .lg\:text-12 {
    font-size: var(--text-12) !important;
  }

  .lg\:text-13 {
    font-size: var(--text-13) !important;
  }

  .lg\:text-14 {
    font-size: var(--text-14) !important;
  }

  .lg\:text-15 {
    font-size: var(--text-15) !important;
  }

  .lg\:text-16 {
    font-size: var(--text-16) !important;
  }

  .lg\:text-18 {
    font-size: var(--text-18) !important;
  }

  .lg\:text-20 {
    font-size: var(--text-20) !important;
  }

  .lg\:text-22 {
    font-size: var(--text-22) !important;
  }

  .lg\:text-24 {
    font-size: var(--text-24) !important;
  }

  .lg\:text-25 {
    font-size: var(--text-25) !important;
  }

  .lg\:text-26 {
    font-size: var(--text-26) !important;
  }

  .lg\:text-30 {
    font-size: var(--text-30) !important;
  }

  .lg\:text-40 {
    font-size: var(--text-40) !important;
  }

  .lg\:text-50 {
    font-size: var(--text-50) !important;
  }

  .lg\:text-60 {
    font-size: var(--text-60) !important;
  }

  .lg\:text-80 {
    font-size: var(--text-80) !important;
  }

  .lg\:text-100 {
    font-size: var(--text-100) !important;
  }

  .lg\:text-120 {
    font-size: var(--text-120) !important;
  }

  .lg\:text-150 {
    font-size: var(--text-150) !important;
  }

  .lg\:text-170 {
    font-size: var(--text-170) !important;
  }

  .lg\:text-200 {
    font-size: var(--text-200) !important;
  }

  .lg\:text-220 {
    font-size: var(--text-220) !important;
  }

  .lg\:text-250 {
    font-size: var(--text-250) !important;
  }
}

@media (max-width: 767px) {
  .md\:text-4 {
    font-size: var(--text-4) !important;
  }

  .md\:text-7 {
    font-size: var(--text-7) !important;
  }

  .md\:text-10 {
    font-size: var(--text-10) !important;
  }

  .md\:text-12 {
    font-size: var(--text-12) !important;
  }

  .md\:text-13 {
    font-size: var(--text-13) !important;
  }

  .md\:text-14 {
    font-size: var(--text-14) !important;
  }

  .md\:text-15 {
    font-size: var(--text-15) !important;
  }

  .md\:text-16 {
    font-size: var(--text-16) !important;
  }

  .md\:text-18 {
    font-size: var(--text-18) !important;
  }

  .md\:text-20 {
    font-size: var(--text-20) !important;
  }

  .md\:text-22 {
    font-size: var(--text-22) !important;
  }

  .md\:text-24 {
    font-size: var(--text-24) !important;
  }

  .md\:text-25 {
    font-size: var(--text-25) !important;
  }

  .md\:text-26 {
    font-size: var(--text-26) !important;
  }

  .md\:text-30 {
    font-size: var(--text-30) !important;
  }

  .md\:text-40 {
    font-size: var(--text-40) !important;
  }

  .md\:text-50 {
    font-size: var(--text-50) !important;
  }

  .md\:text-60 {
    font-size: var(--text-60) !important;
  }

  .md\:text-80 {
    font-size: var(--text-80) !important;
  }

  .md\:text-100 {
    font-size: var(--text-100) !important;
  }

  .md\:text-120 {
    font-size: var(--text-120) !important;
  }

  .md\:text-150 {
    font-size: var(--text-150) !important;
  }

  .md\:text-170 {
    font-size: var(--text-170) !important;
  }

  .md\:text-200 {
    font-size: var(--text-200) !important;
  }

  .md\:text-220 {
    font-size: var(--text-220) !important;
  }

  .md\:text-250 {
    font-size: var(--text-250) !important;
  }
}

@media (max-width: 575px) {
  .sm\:text-4 {
    font-size: var(--text-4) !important;
  }

  .sm\:text-7 {
    font-size: var(--text-7) !important;
  }

  .sm\:text-10 {
    font-size: var(--text-10) !important;
  }

  .sm\:text-12 {
    font-size: var(--text-12) !important;
  }

  .sm\:text-13 {
    font-size: var(--text-13) !important;
  }

  .sm\:text-14 {
    font-size: var(--text-14) !important;
  }

  .sm\:text-15 {
    font-size: var(--text-15) !important;
  }

  .sm\:text-16 {
    font-size: var(--text-16) !important;
  }

  .sm\:text-18 {
    font-size: var(--text-18) !important;
  }

  .sm\:text-20 {
    font-size: var(--text-20) !important;
  }

  .sm\:text-22 {
    font-size: var(--text-22) !important;
  }

  .sm\:text-24 {
    font-size: var(--text-24) !important;
  }

  .sm\:text-25 {
    font-size: var(--text-25) !important;
  }

  .sm\:text-26 {
    font-size: var(--text-26) !important;
  }

  .sm\:text-30 {
    font-size: var(--text-30) !important;
  }

  .sm\:text-40 {
    font-size: var(--text-40) !important;
  }

  .sm\:text-50 {
    font-size: var(--text-50) !important;
  }

  .sm\:text-60 {
    font-size: var(--text-60) !important;
  }

  .sm\:text-80 {
    font-size: var(--text-80) !important;
  }

  .sm\:text-100 {
    font-size: var(--text-100) !important;
  }

  .sm\:text-120 {
    font-size: var(--text-120) !important;
  }

  .sm\:text-150 {
    font-size: var(--text-150) !important;
  }

  .sm\:text-170 {
    font-size: var(--text-170) !important;
  }

  .sm\:text-200 {
    font-size: var(--text-200) !important;
  }

  .sm\:text-220 {
    font-size: var(--text-220) !important;
  }

  .sm\:text-250 {
    font-size: var(--text-250) !important;
  }
}

@media (max-width: 479px) {
  .xs\:text-4 {
    font-size: var(--text-4) !important;
  }

  .xs\:text-7 {
    font-size: var(--text-7) !important;
  }

  .xs\:text-10 {
    font-size: var(--text-10) !important;
  }

  .xs\:text-12 {
    font-size: var(--text-12) !important;
  }

  .xs\:text-13 {
    font-size: var(--text-13) !important;
  }

  .xs\:text-14 {
    font-size: var(--text-14) !important;
  }

  .xs\:text-15 {
    font-size: var(--text-15) !important;
  }

  .xs\:text-16 {
    font-size: var(--text-16) !important;
  }

  .xs\:text-18 {
    font-size: var(--text-18) !important;
  }

  .xs\:text-20 {
    font-size: var(--text-20) !important;
  }

  .xs\:text-22 {
    font-size: var(--text-22) !important;
  }

  .xs\:text-24 {
    font-size: var(--text-24) !important;
  }

  .xs\:text-25 {
    font-size: var(--text-25) !important;
  }

  .xs\:text-26 {
    font-size: var(--text-26) !important;
  }

  .xs\:text-30 {
    font-size: var(--text-30) !important;
  }

  .xs\:text-40 {
    font-size: var(--text-40) !important;
  }

  .xs\:text-50 {
    font-size: var(--text-50) !important;
  }

  .xs\:text-60 {
    font-size: var(--text-60) !important;
  }

  .xs\:text-80 {
    font-size: var(--text-80) !important;
  }

  .xs\:text-100 {
    font-size: var(--text-100) !important;
  }

  .xs\:text-120 {
    font-size: var(--text-120) !important;
  }

  .xs\:text-150 {
    font-size: var(--text-150) !important;
  }

  .xs\:text-170 {
    font-size: var(--text-170) !important;
  }

  .xs\:text-200 {
    font-size: var(--text-200) !important;
  }

  .xs\:text-220 {
    font-size: var(--text-220) !important;
  }

  .xs\:text-250 {
    font-size: var(--text-250) !important;
  }
}

/*** Font Position ***/
.text-center {
  text-align: center !important
}

.text-end {
  text-align: end !important
}

.text-justify {
  text-align: justify !important
}

.text-start {
  text-align: left !important
}

.text-end {
  text-align: right !important
}

@media (max-width: 1199px) {
  .xl\:text-center {
    text-align: center !important
  }

  .xl\:text-end {
    text-align: end !important
  }

  .xl\:text-justify {
    text-align: justify !important
  }

  .xl\:text-start {
    text-align: left !important
  }

  .xl\:text-end {
    text-align: right !important
  }
}

@media (max-width: 991px) {
  .lg\:text-center {
    text-align: center !important
  }

  .lg\:text-end {
    text-align: end !important
  }

  .lg\:text-justify {
    text-align: justify !important
  }

  .lg\:text-start {
    text-align: left !important
  }

  .lg\:text-end {
    text-align: right !important
  }
}

@media (max-width: 767px) {
  .md\:text-center {
    text-align: center !important
  }

  .md\:text-end {
    text-align: end !important
  }

  .md\:text-justify {
    text-align: justify !important
  }

  .md\:text-start {
    text-align: left !important
  }

  .md\:text-end {
    text-align: right !important
  }
}

@media (max-width: 575px) {
  .sm\:text-center {
    text-align: center !important
  }

  .sm\:text-end {
    text-align: end !important
  }

  .sm\:text-justify {
    text-align: justify !important
  }

  .sm\:text-start {
    text-align: left !important
  }

  .sm\:text-end {
    text-align: right !important
  }
}

/*** Font Weight ***/
.fw-100 {
  font-weight: 100 !important;
}

.fw-200 {
  font-weight: 200 !important;
}

.fw-300 {
  font-weight: 300 !important;
}

.fw-400 {
  font-weight: 400 !important;
}

.fw-500 {
  font-weight: 500 !important;
}

.fw-600 {
  font-weight: 600 !important;
}

.fw-700 {
  font-weight: 700 !important;
}

.fw-800 {
  font-weight: 800 !important;
}

.fw-900 {
  font-weight: 900 !important;
}


/*** T R B L ***/
.top-0 {
  top: 0 !important;
}

.top-10px {
  top: 10px !important;
}

.top-20px {
  top: 20px !important;
}

.top-30px {
  top: 30px !important;
}

.top-40px {
  top: 40px !important;
}

.top-50px {
  top: 50px !important;
}

.top-60px {
  top: 60px !important;
}

.top-70px {
  top: 70px !important;
}

.top-80px {
  top: 80px !important;
}

.top-90px {
  top: 90px !important;
}

.top-100px {
  top: 100px !important;
}

.right-0 {
  right: 0 !important;
}

.bottom-0 {
  bottom: 0 !important;
}

.left-0 {
  left: 0 !important;
}

.mr-n0 {
  margin-right: 0px !important;
}

.mr-n1 {
  margin-right: -5px !important;
}

.mr-n2 {
  margin-right: -10px !important;
}

.mr-n3 {
  margin-right: -15px !important;
}

.mr-n4 {
  margin-right: -20px !important;
}

.mr-n5 {
  margin-right: -25px !important;
}

.mr-n6 {
  margin-right: -50px !important;
}

.mr-n7 {
  margin-right: -75px !important;
}

.mr-n8 {
  margin-right: -100px !important;
}

.mr-n9 {
  margin-right: -125px !important;
}

.mr-n10 {
  margin-right: -150px !important;
}

.ml-n0 {
  margin-left: 0px !important;
}

.ml-n1 {
  margin-left: -5px !important;
}

.ml-n2 {
  margin-left: -10px !important;
}

.ml-n3 {
  margin-left: -15px !important;
}

.ml-n4 {
  margin-left: -20px !important;
}

.ml-n5 {
  margin-left: -25px !important;
}

.ml-n6 {
  margin-left: -50px !important;
}

.ml-n7 {
  margin-left: -75px !important;
}

.ml-n8 {
  margin-left: -100px !important;
}

.ml-n9 {
  margin-left: -125px !important;
}

.ml-n10 {
  margin-left: -150px !important;
}

.mt-n0 {
  margin-top: 0px !important;
}

.mt-n1 {
  margin-top: -5px !important;
}

.mt-n2 {
  margin-top: -10px !important;
}

.mt-n3 {
  margin-top: -15px !important;
}

.mt-n4 {
  margin-top: -20px !important;
}

.mt-n5 {
  margin-top: -25px !important;
}

.mt-n6 {
  margin-top: -50px !important;
}

.mt-n7 {
  margin-top: -75px !important;
}

.mt-n8 {
  margin-top: -100px !important;
}

.mt-n9 {
  margin-top: -125px !important;
}

.mt-n10 {
  margin-top: -150px !important;
}

.mb-n1 {
  margin-bottom: -5px !important;
}

.mb-n0 {
  margin-bottom: 0px !important;
}

.mb-n2 {
  margin-bottom: -10px !important;
}

.mb-n3 {
  margin-bottom: -15px !important;
}

.mb-n4 {
  margin-bottom: -20px !important;
}

.mb-n5 {
  margin-bottom: -25px !important;
}

.mb-n6 {
  margin-bottom: -50px !important;
}

.mb-n7 {
  margin-bottom: -75px !important;
}

.mb-n8 {
  margin-bottom: -100px !important;
}

.mb-n9 {
  margin-bottom: -125px !important;
}

.mb-n10 {
  margin-bottom: -150px !important;
}

@media (max-width: 1199px) {
  .xl\:mr-n0 {
    margin-right: 0px !important;
  }

  .xl\:mr-n1 {
    margin-right: -5px !important;
  }

  .xl\:mr-n2 {
    margin-right: -10px !important;
  }

  .xl\:mr-n3 {
    margin-right: -15px !important;
  }

  .xl\:mr-n4 {
    margin-right: -20px !important;
  }

  .xl\:mr-n5 {
    margin-right: -25px !important;
  }

  .xl\:mr-n6 {
    margin-right: -50px !important;
  }

  .xl\:mr-n7 {
    margin-right: -75px !important;
  }

  .xl\:mr-n8 {
    margin-right: -100px !important;
  }

  .xl\:mr-n9 {
    margin-right: -125px !important;
  }

  .xl\:mr-n10 {
    margin-right: -150px !important;
  }

  .xl\:ml-n0 {
    margin-left: 0px !important;
  }

  .xl\:ml-n1 {
    margin-left: -5px !important;
  }

  .xl\:ml-n2 {
    margin-left: -10px !important;
  }

  .xl\:ml-n3 {
    margin-left: -15px !important;
  }

  .xl\:ml-n4 {
    margin-left: -20px !important;
  }

  .xl\:ml-n5 {
    margin-left: -25px !important;
  }

  .xl\:ml-n6 {
    margin-left: -50px !important;
  }

  .xl\:ml-n7 {
    margin-left: -75px !important;
  }

  .xl\:ml-n8 {
    margin-left: -100px !important;
  }

  .xl\:ml-n9 {
    margin-left: -125px !important;
  }

  .xl\:ml-n10 {
    margin-left: -150px !important;
  }

  .xl\:mt-n0 {
    margin-top: 0px !important;
  }

  .xl\:mt-n1 {
    margin-top: -5px !important;
  }

  .xl\:mt-n2 {
    margin-top: -10px !important;
  }

  .xl\:mt-n3 {
    margin-top: -15px !important;
  }

  .xl\:mt-n4 {
    margin-top: -20px !important;
  }

  .xl\:mt-n5 {
    margin-top: -25px !important;
  }

  .xl\:mt-n6 {
    margin-top: -50px !important;
  }

  .xl\:mt-n7 {
    margin-top: -75px !important;
  }

  .xl\:mt-n8 {
    margin-top: -100px !important;
  }

  .xl\:mt-n9 {
    margin-top: -125px !important;
  }

  .xl\:mt-n10 {
    margin-top: -150px !important;
  }

  .xl\:mb-n0 {
    margin-bottom: 0px !important;
  }

  .xl\:mb-n1 {
    margin-bottom: -5px !important;
  }

  .xl\:mb-n2 {
    margin-bottom: -10px !important;
  }

  .xl\:mb-n3 {
    margin-bottom: -15px !important;
  }

  .xl\:mb-n4 {
    margin-bottom: -20px !important;
  }

  .xl\:mb-n5 {
    margin-bottom: -25px !important;
  }

  .xl\:mb-n6 {
    margin-bottom: -50px !important;
  }

  .xl\:mb-n7 {
    margin-bottom: -75px !important;
  }

  .xl\:mb-n8 {
    margin-bottom: -100px !important;
  }

  .xl\:mb-n9 {
    margin-bottom: -125px !important;
  }

  .xl\:mb-n10 {
    margin-bottom: -150px !important;
  }
}

@media (max-width: 991px) {
  .lg\:mr-n0 {
    margin-right: 0px !important;
  }

  .lg\:mr-n1 {
    margin-right: -5px !important;
  }

  .lg\:mr-n2 {
    margin-right: -10px !important;
  }

  .lg\:mr-n3 {
    margin-right: -15px !important;
  }

  .lg\:mr-n4 {
    margin-right: -20px !important;
  }

  .lg\:mr-n5 {
    margin-right: -25px !important;
  }

  .lg\:mr-n6 {
    margin-right: -50px !important;
  }

  .lg\:mr-n7 {
    margin-right: -75px !important;
  }

  .lg\:mr-n8 {
    margin-right: -100px !important;
  }

  .lg\:mr-n9 {
    margin-right: -125px !important;
  }

  .lg\:mr-n10 {
    margin-right: -150px !important;
  }

  .lg\:ml-n0 {
    margin-left: 0px !important;
  }

  .lg\:ml-n1 {
    margin-left: -5px !important;
  }

  .lg\:ml-n2 {
    margin-left: -10px !important;
  }

  .lg\:ml-n3 {
    margin-left: -15px !important;
  }

  .lg\:ml-n4 {
    margin-left: -20px !important;
  }

  .lg\:ml-n5 {
    margin-left: -25px !important;
  }

  .lg\:ml-n6 {
    margin-left: -50px !important;
  }

  .lg\:ml-n7 {
    margin-left: -75px !important;
  }

  .lg\:ml-n8 {
    margin-left: -100px !important;
  }

  .lg\:ml-n9 {
    margin-left: -125px !important;
  }

  .lg\:ml-n10 {
    margin-left: -150px !important;
  }

  .lg\:mt-n0 {
    margin-top: 0px !important;
  }

  .lg\:mt-n1 {
    margin-top: -5px !important;
  }

  .lg\:mt-n2 {
    margin-top: -10px !important;
  }

  .lg\:mt-n3 {
    margin-top: -15px !important;
  }

  .lg\:mt-n4 {
    margin-top: -20px !important;
  }

  .lg\:mt-n5 {
    margin-top: -25px !important;
  }

  .lg\:mt-n6 {
    margin-top: -50px !important;
  }

  .lg\:mt-n7 {
    margin-top: -75px !important;
  }

  .lg\:mt-n8 {
    margin-top: -100px !important;
  }

  .lg\:mt-n9 {
    margin-top: -125px !important;
  }

  .lg\:mt-n10 {
    margin-top: -150px !important;
  }

  .lg\:mb-n0 {
    margin-bottom: 0px !important;
  }

  .lg\:mb-n1 {
    margin-bottom: -5px !important;
  }

  .lg\:mb-n2 {
    margin-bottom: -10px !important;
  }

  .lg\:mb-n3 {
    margin-bottom: -15px !important;
  }

  .lg\:mb-n4 {
    margin-bottom: -20px !important;
  }

  .lg\:mb-n5 {
    margin-bottom: -25px !important;
  }

  .lg\:mb-n6 {
    margin-bottom: -50px !important;
  }

  .lg\:mb-n7 {
    margin-bottom: -75px !important;
  }

  .lg\:mb-n8 {
    margin-bottom: -100px !important;
  }

  .lg\:mb-n9 {
    margin-bottom: -125px !important;
  }

  .lg\:mb-n10 {
    margin-bottom: -150px !important;
  }
}

@media (max-width: 767px) {
  .md\:mr-n0 {
    margin-right: 0px !important;
  }

  .md\:mr-n1 {
    margin-right: -5px !important;
  }

  .md\:mr-n2 {
    margin-right: -10px !important;
  }

  .md\:mr-n3 {
    margin-right: -15px !important;
  }

  .md\:mr-n4 {
    margin-right: -20px !important;
  }

  .md\:mr-n5 {
    margin-right: -25px !important;
  }

  .md\:mr-n6 {
    margin-right: -50px !important;
  }

  .md\:mr-n7 {
    margin-right: -75px !important;
  }

  .md\:mr-n8 {
    margin-right: -100px !important;
  }

  .md\:mr-n9 {
    margin-right: -125px !important;
  }

  .md\:mr-n10 {
    margin-right: -150px !important;
  }

  .md\:ml-n0 {
    margin-left: 0px !important;
  }

  .md\:ml-n1 {
    margin-left: -5px !important;
  }

  .md\:ml-n2 {
    margin-left: -10px !important;
  }

  .md\:ml-n3 {
    margin-left: -15px !important;
  }

  .md\:ml-n4 {
    margin-left: -20px !important;
  }

  .md\:ml-n5 {
    margin-left: -25px !important;
  }

  .md\:ml-n6 {
    margin-left: -50px !important;
  }

  .md\:ml-n7 {
    margin-left: -75px !important;
  }

  .md\:ml-n8 {
    margin-left: -100px !important;
  }

  .md\:ml-n9 {
    margin-left: -125px !important;
  }

  .md\:ml-n10 {
    margin-left: -150px !important;
  }

  .md\:mt-n0 {
    margin-top: 0px !important;
  }

  .md\:mt-n1 {
    margin-top: -5px !important;
  }

  .md\:mt-n2 {
    margin-top: -10px !important;
  }

  .md\:mt-n3 {
    margin-top: -15px !important;
  }

  .md\:mt-n4 {
    margin-top: -20px !important;
  }

  .md\:mt-n5 {
    margin-top: -25px !important;
  }

  .md\:mt-n6 {
    margin-top: -50px !important;
  }

  .md\:mt-n7 {
    margin-top: -75px !important;
  }

  .md\:mt-n8 {
    margin-top: -100px !important;
  }

  .md\:mt-n9 {
    margin-top: -125px !important;
  }

  .md\:mt-n10 {
    margin-top: -150px !important;
  }

  .md\:mb-n0 {
    margin-bottom: 0px !important;
  }

  .md\:mb-n1 {
    margin-bottom: -5px !important;
  }

  .md\:mb-n2 {
    margin-bottom: -10px !important;
  }

  .md\:mb-n3 {
    margin-bottom: -15px !important;
  }

  .md\:mb-n4 {
    margin-bottom: -20px !important;
  }

  .md\:mb-n5 {
    margin-bottom: -25px !important;
  }

  .md\:mb-n6 {
    margin-bottom: -50px !important;
  }

  .md\:mb-n7 {
    margin-bottom: -75px !important;
  }

  .md\:mb-n8 {
    margin-bottom: -100px !important;
  }

  .md\:mb-n9 {
    margin-bottom: -125px !important;
  }

  .md\:mb-n10 {
    margin-bottom: -150px !important;
  }
}

@media (max-width: 575px) {
  .sm\:mr-n0 {
    margin-right: 0px !important;
  }

  .sm\:mr-n1 {
    margin-right: -5px !important;
  }

  .sm\:mr-n2 {
    margin-right: -10px !important;
  }

  .sm\:mr-n3 {
    margin-right: -15px !important;
  }

  .sm\:mr-n4 {
    margin-right: -20px !important;
  }

  .sm\:mr-n5 {
    margin-right: -25px !important;
  }

  .sm\:mr-n6 {
    margin-right: -50px !important;
  }

  .sm\:mr-n7 {
    margin-right: -75px !important;
  }

  .sm\:mr-n8 {
    margin-right: -100px !important;
  }

  .sm\:mr-n9 {
    margin-right: -125px !important;
  }

  .sm\:mr-n10 {
    margin-right: -150px !important;
  }

  .sm\:ml-n0 {
    margin-left: 0px !important;
  }

  .sm\:ml-n1 {
    margin-left: -5px !important;
  }

  .sm\:ml-n2 {
    margin-left: -10px !important;
  }

  .sm\:ml-n3 {
    margin-left: -15px !important;
  }

  .sm\:ml-n4 {
    margin-left: -20px !important;
  }

  .sm\:ml-n5 {
    margin-left: -25px !important;
  }

  .sm\:ml-n6 {
    margin-left: -50px !important;
  }

  .sm\:ml-n7 {
    margin-left: -75px !important;
  }

  .sm\:ml-n8 {
    margin-left: -100px !important;
  }

  .sm\:ml-n9 {
    margin-left: -125px !important;
  }

  .sm\:ml-n10 {
    margin-left: -150px !important;
  }

  .sm\:mt-n0 {
    margin-top: 0px !important;
  }

  .sm\:mt-n1 {
    margin-top: -5px !important;
  }

  .sm\:mt-n2 {
    margin-top: -10px !important;
  }

  .sm\:mt-n3 {
    margin-top: -15px !important;
  }

  .sm\:mt-n4 {
    margin-top: -20px !important;
  }

  .sm\:mt-n5 {
    margin-top: -25px !important;
  }

  .sm\:mt-n6 {
    margin-top: -50px !important;
  }

  .sm\:mt-n7 {
    margin-top: -75px !important;
  }

  .sm\:mt-n8 {
    margin-top: -100px !important;
  }

  .sm\:mt-n9 {
    margin-top: -125px !important;
  }

  .sm\:mt-n10 {
    margin-top: -150px !important;
  }

  .sm\:mb-n0 {
    margin-bottom: 0px !important;
  }

  .sm\:mb-n1 {
    margin-bottom: -5px !important;
  }

  .sm\:mb-n2 {
    margin-bottom: -10px !important;
  }

  .sm\:mb-n3 {
    margin-bottom: -15px !important;
  }

  .sm\:mb-n4 {
    margin-bottom: -20px !important;
  }

  .sm\:mb-n5 {
    margin-bottom: -25px !important;
  }

  .sm\:mb-n6 {
    margin-bottom: -50px !important;
  }

  .sm\:mb-n7 {
    margin-bottom: -75px !important;
  }

  .sm\:mb-n8 {
    margin-bottom: -100px !important;
  }

  .sm\:mb-n9 {
    margin-bottom: -125px !important;
  }

  .sm\:mb-n10 {
    margin-bottom: -150px !important;
  }
}

/*** Spaces Margin & Padding ***/
.py-0 {
  padding-top: 0 !important;
  padding-bottom: 0 !important
}

.px-0 {
  padding-left: 0 !important;
  padding-right: 0 !important
}

.pt-0 {
  padding-top: 0 !important
}

.pb-0 {
  padding-bottom: 0 !important
}

.pl-0 {
  padding-left: 0 !important
}

.pr-0 {
  padding-right: 0 !important
}

.mt-0 {
  margin-top: 0 !important
}

.mb-0 {
  margin-bottom: 0 !important
}

.ml-0 {
  margin-left: 0 !important
}

.mr-0 {
  margin-right: 0 !important
}

.py-4 {
  padding-top: 4px !important;
  padding-bottom: 4px !important
}

.px-4 {
  padding-left: 4px !important;
  padding-right: 4px !important
}

.pt-4 {
  padding-top: 4px !important
}

.pb-4 {
  padding-bottom: 4px !important
}

.pl-4 {
  padding-left: 4px !important
}

.pr-4 {
  padding-right: 4px !important
}

.mt-4 {
  margin-top: 4px !important
}

.mb-4 {
  margin-bottom: 4px !important
}

.ml-4 {
  margin-left: 4px !important
}

.mr-4 {
  margin-right: 4px !important
}

.py-5 {
  padding-top: 5px !important;
  padding-bottom: 5px !important
}

.px-5 {
  padding-left: 5px !important;
  padding-right: 5px !important
}

.pt-5 {
  padding-top: 5px !important
}

.pb-5 {
  padding-bottom: 5px !important
}

.pl-5 {
  padding-left: 5px !important
}

.pr-5 {
  padding-right: 5px !important
}

.mt-5 {
  margin-top: 5px !important
}

.mb-5 {
  margin-bottom: 5px !important
}

.ml-5 {
  margin-left: 5px !important
}

.mr-5 {
  margin-right: 5px !important
}

.py-10 {
  padding-top: 10px !important;
  padding-bottom: 10px !important
}

.px-10 {
  padding-left: 10px !important;
  padding-right: 10px !important
}

.pt-10 {
  padding-top: 10px !important
}

.pb-10 {
  padding-bottom: 10px !important
}

.pl-10 {
  padding-left: 10px !important
}

.pr-10 {
  padding-right: 10px !important
}

.mt-10 {
  margin-top: 10px !important
}

.mb-10 {
  margin-bottom: 10px !important
}

.ml-10 {
  margin-left: 10px !important
}

.mr-10 {
  margin-right: 10px !important
}

.py-15 {
  padding-top: 15px !important;
  padding-bottom: 15px !important
}

.px-15 {
  padding-left: 15px !important;
  padding-right: 15px !important
}

.pt-15 {
  padding-top: 15px !important
}

.pb-15 {
  padding-bottom: 15px !important
}

.pl-15 {
  padding-left: 15px !important
}

.pr-15 {
  padding-right: 15px !important
}

.mt-15 {
  margin-top: 15px !important
}

.mb-15 {
  margin-bottom: 15px !important
}

.ml-15 {
  margin-left: 15px !important
}

.mr-15 {
  margin-right: 15px !important
}

.py-20 {
  padding-top: 20px !important;
  padding-bottom: 20px !important
}

.px-20 {
  padding-left: 20px !important;
  padding-right: 20px !important
}

.pt-20 {
  padding-top: 20px !important
}

.pb-20 {
  padding-bottom: 20px !important
}

.pl-20 {
  padding-left: 20px !important
}

.pr-20 {
  padding-right: 20px !important
}

.mt-20 {
  margin-top: 20px !important
}

.mb-20 {
  margin-bottom: 20px !important
}

.ml-20 {
  margin-left: 20px !important
}

.mr-20 {
  margin-right: 20px !important
}

.py-24 {
  padding-top: 24px !important;
  padding-bottom: 24px !important
}

.px-24 {
  padding-left: 24px !important;
  padding-right: 24px !important
}

.pt-24 {
  padding-top: 24px !important
}

.pb-24 {
  padding-bottom: 24px !important
}

.pl-24 {
  padding-left: 24px !important
}

.pr-24 {
  padding-right: 24px !important
}

.mt-24 {
  margin-top: 24px !important
}

.mb-24 {
  margin-bottom: 24px !important
}

.ml-24 {
  margin-left: 24px !important
}

.mr-24 {
  margin-right: 24px !important
}

.py-28 {
  padding-top: 28px !important;
  padding-bottom: 28px !important
}

.px-28 {
  padding-left: 28px !important;
  padding-right: 28px !important
}

.pt-28 {
  padding-top: 28px !important
}

.pb-28 {
  padding-bottom: 28px !important
}

.pl-28 {
  padding-left: 28px !important
}

.pr-28 {
  padding-right: 28px !important
}

.mt-28 {
  margin-top: 28px !important
}

.mb-28 {
  margin-bottom: 28px !important
}

.ml-28 {
  margin-left: 28px !important
}

.mr-28 {
  margin-right: 28px !important
}

.py-30 {
  padding-top: 30px !important;
  padding-bottom: 30px !important
}

.px-30 {
  padding-left: 30px !important;
  padding-right: 30px !important
}

.pt-30 {
  padding-top: 30px !important
}

.pb-30 {
  padding-bottom: 30px !important
}

.pl-30 {
  padding-left: 30px !important
}

.pr-30 {
  padding-right: 30px !important
}

.mt-30 {
  margin-top: 30px !important
}

.mb-30 {
  margin-bottom: 30px !important
}

.ml-30 {
  margin-left: 30px !important
}

.mr-30 {
  margin-right: 30px !important
}

.py-35 {
  padding-top: 35px !important;
  padding-bottom: 35px !important
}

.px-35 {
  padding-left: 35px !important;
  padding-right: 35px !important
}

.pt-35 {
  padding-top: 35px !important
}

.pb-35 {
  padding-bottom: 35px !important
}

.pl-35 {
  padding-left: 35px !important
}

.pr-35 {
  padding-right: 35px !important
}

.mt-35 {
  margin-top: 35px !important
}

.mb-35 {
  margin-bottom: 35px !important
}

.ml-35 {
  margin-left: 35px !important
}

.mr-35 {
  margin-right: 35px !important
}

.py-40 {
  padding-top: 40px !important;
  padding-bottom: 40px !important
}

.px-40 {
  padding-left: 40px !important;
  padding-right: 40px !important
}

.pt-40 {
  padding-top: 40px !important
}

.pb-40 {
  padding-bottom: 40px !important
}

.pl-40 {
  padding-left: 40px !important
}

.pr-40 {
  padding-right: 40px !important
}

.mt-40 {
  margin-top: 40px !important
}

.mb-40 {
  margin-bottom: 40px !important
}

.ml-40 {
  margin-left: 40px !important
}

.mr-40 {
  margin-right: 40px !important
}

.py-45 {
  padding-top: 45px !important;
  padding-bottom: 45px !important
}

.px-45 {
  padding-left: 45px !important;
  padding-right: 45px !important
}

.pt-45 {
  padding-top: 45px !important
}

.pb-45 {
  padding-bottom: 45px !important
}

.pl-45 {
  padding-left: 45px !important
}

.pr-45 {
  padding-right: 45px !important
}

.mt-45 {
  margin-top: 45px !important
}

.mb-45 {
  margin-bottom: 45px !important
}

.ml-45 {
  margin-left: 45px !important
}

.mr-45 {
  margin-right: 45px !important
}

.py-50 {
  padding-top: 50px !important;
  padding-bottom: 50px !important
}

.px-50 {
  padding-left: 50px !important;
  padding-right: 50px !important
}

.pt-50 {
  padding-top: 50px !important
}

.pb-50 {
  padding-bottom: 50px !important
}

.pl-50 {
  padding-left: 50px !important
}

.pr-50 {
  padding-right: 50px !important
}

.mt-50 {
  margin-top: 50px !important
}

.mb-50 {
  margin-bottom: 50px !important
}

.ml-50 {
  margin-left: 50px !important
}

.mr-50 {
  margin-right: 50px !important
}

.py-60 {
  padding-top: 60px !important;
  padding-bottom: 60px !important
}

.px-60 {
  padding-left: 60px !important;
  padding-right: 60px !important
}

.pt-60 {
  padding-top: 60px !important
}

.pb-60 {
  padding-bottom: 60px !important
}

.pl-60 {
  padding-left: 60px !important
}

.pr-60 {
  padding-right: 60px !important
}

.mt-60 {
  margin-top: 60px !important
}

.mb-60 {
  margin-bottom: 60px !important
}

.ml-60 {
  margin-left: 60px !important
}

.mr-60 {
  margin-right: 60px !important
}

.py-70 {
  padding-top: 70px !important;
  padding-bottom: 70px !important
}

.px-70 {
  padding-left: 70px !important;
  padding-right: 70px !important
}

.pt-70 {
  padding-top: 70px !important
}

.pb-70 {
  padding-bottom: 70px !important
}

.pl-70 {
  padding-left: 70px !important
}

.pr-70 {
  padding-right: 70px !important
}

.mt-70 {
  margin-top: 70px !important
}

.mb-70 {
  margin-bottom: 70px !important
}

.ml-70 {
  margin-left: 70px !important
}

.mr-70 {
  margin-right: 70px !important
}

.py-80 {
  padding-top: 80px !important;
  padding-bottom: 80px !important
}

.px-80 {
  padding-left: 80px !important;
  padding-right: 80px !important
}

.pt-80 {
  padding-top: 80px !important
}

.pb-80 {
  padding-bottom: 80px !important
}

.pl-80 {
  padding-left: 80px !important
}

.pr-80 {
  padding-right: 80px !important
}

.mt-80 {
  margin-top: 80px !important
}

.mb-80 {
  margin-bottom: 80px !important
}

.ml-80 {
  margin-left: 80px !important
}

.mr-80 {
  margin-right: 80px !important
}

.py-90 {
  padding-top: 90px !important;
  padding-bottom: 90px !important
}

.px-90 {
  padding-left: 90px !important;
  padding-right: 90px !important
}

.pt-90 {
  padding-top: 90px !important
}

.pb-90 {
  padding-bottom: 90px !important
}

.pl-90 {
  padding-left: 90px !important
}

.pr-90 {
  padding-right: 90px !important
}

.mt-90 {
  margin-top: 90px !important
}

.mb-90 {
  margin-bottom: 90px !important
}

.ml-90 {
  margin-left: 90px !important
}

.mr-90 {
  margin-right: 90px !important
}

.py-120 {
  padding-top: 120px !important;
  padding-bottom: 120px !important
}

.px-120 {
  padding-left: 120px !important;
  padding-right: 120px !important
}

.pt-120 {
  padding-top: 120px !important
}

.pb-120 {
  padding-bottom: 120px !important
}

.pb-140 {
  padding-bottom: 140px !important
}

.pl-120 {
  padding-left: 120px !important
}

.pr-120 {
  padding-right: 120px !important
}

.mt-120 {
  margin-top: 120px !important
}

.mb-120 {
  margin-bottom: 120px !important
}

.ml-120 {
  margin-left: 120px !important
}

.mr-120 {
  margin-right: 120px !important
}

@media (max-width: 1199px) {
  .xl\:py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
  }

  .xl\:px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important
  }

  .xl\:pt-0 {
    padding-top: 0 !important
  }

  .xl\:pb-0 {
    padding-bottom: 0 !important
  }

  .xl\:pl-0 {
    padding-left: 0 !important
  }

  .xl\:pr-0 {
    padding-right: 0 !important
  }

  .xl\:mt-0 {
    margin-top: 0 !important
  }

  .xl\:mb-0 {
    margin-bottom: 0 !important
  }

  .xl\:ml-0 {
    margin-left: 0 !important
  }

  .xl\:mr-0 {
    margin-right: 0 !important
  }

  .xl\:py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important
  }

  .xl\:px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important
  }

  .xl\:pt-4 {
    padding-top: 4px !important
  }

  .xl\:pb-4 {
    padding-bottom: 4px !important
  }

  .xl\:pl-4 {
    padding-left: 4px !important
  }

  .xl\:pr-4 {
    padding-right: 4px !important
  }

  .xl\:mt-4 {
    margin-top: 4px !important
  }

  .xl\:mb-4 {
    margin-bottom: 4px !important
  }

  .xl\:ml-4 {
    margin-left: 4px !important
  }

  .xl\:mr-4 {
    margin-right: 4px !important
  }

  .xl\:py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important
  }

  .xl\:px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important
  }

  .xl\:pt-5 {
    padding-top: 5px !important
  }

  .xl\:pb-5 {
    padding-bottom: 5px !important
  }

  .xl\:pl-5 {
    padding-left: 5px !important
  }

  .xl\:pr-5 {
    padding-right: 5px !important
  }

  .xl\:mt-5 {
    margin-top: 5px !important
  }

  .xl\:mb-5 {
    margin-bottom: 5px !important
  }

  .xl\:ml-5 {
    margin-left: 5px !important
  }

  .xl\:mr-5 {
    margin-right: 5px !important
  }

  .xl\:py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important
  }

  .xl\:px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important
  }

  .xl\:pt-10 {
    padding-top: 10px !important
  }

  .xl\:pb-10 {
    padding-bottom: 10px !important
  }

  .xl\:pl-10 {
    padding-left: 10px !important
  }

  .xl\:pr-10 {
    padding-right: 10px !important
  }

  .xl\:mt-10 {
    margin-top: 10px !important
  }

  .xl\:mb-10 {
    margin-bottom: 10px !important
  }

  .xl\:ml-10 {
    margin-left: 10px !important
  }

  .xl\:mr-10 {
    margin-right: 10px !important
  }

  .xl\:py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important
  }

  .xl\:px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important
  }

  .xl\:pt-15 {
    padding-top: 15px !important
  }

  .xl\:pb-15 {
    padding-bottom: 15px !important
  }

  .xl\:pl-15 {
    padding-left: 15px !important
  }

  .xl\:pr-15 {
    padding-right: 15px !important
  }

  .xl\:mt-15 {
    margin-top: 15px !important
  }

  .xl\:mb-15 {
    margin-bottom: 15px !important
  }

  .xl\:ml-15 {
    margin-left: 15px !important
  }

  .xl\:mr-15 {
    margin-right: 15px !important
  }

  .xl\:py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important
  }

  .xl\:px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important
  }

  .xl\:pt-20 {
    padding-top: 20px !important
  }

  .xl\:pb-20 {
    padding-bottom: 20px !important
  }

  .xl\:pl-20 {
    padding-left: 20px !important
  }

  .xl\:pr-20 {
    padding-right: 20px !important
  }

  .xl\:mt-20 {
    margin-top: 20px !important
  }

  .xl\:mb-20 {
    margin-bottom: 20px !important
  }

  .xl\:ml-20 {
    margin-left: 20px !important
  }

  .xl\:mr-20 {
    margin-right: 20px !important
  }

  .xl\:py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important
  }

  .xl\:px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important
  }

  .xl\:pt-24 {
    padding-top: 24px !important
  }

  .xl\:pb-24 {
    padding-bottom: 24px !important
  }

  .xl\:pl-24 {
    padding-left: 24px !important
  }

  .xl\:pr-24 {
    padding-right: 24px !important
  }

  .xl\:mt-24 {
    margin-top: 24px !important
  }

  .xl\:mb-24 {
    margin-bottom: 24px !important
  }

  .xl\:ml-24 {
    margin-left: 24px !important
  }

  .xl\:mr-24 {
    margin-right: 24px !important
  }

  .xl\:py-28 {
    padding-top: 28px !important;
    padding-bottom: 28px !important
  }

  .xl\:px-28 {
    padding-left: 28px !important;
    padding-right: 28px !important
  }

  .xl\:pt-28 {
    padding-top: 28px !important
  }

  .xl\:pb-28 {
    padding-bottom: 28px !important
  }

  .xl\:pl-28 {
    padding-left: 28px !important
  }

  .xl\:pr-28 {
    padding-right: 28px !important
  }

  .xl\:mt-28 {
    margin-top: 28px !important
  }

  .xl\:mb-28 {
    margin-bottom: 28px !important
  }

  .xl\:ml-28 {
    margin-left: 28px !important
  }

  .xl\:mr-28 {
    margin-right: 28px !important
  }

  .xl\:py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important
  }

  .xl\:px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important
  }

  .xl\:pt-30 {
    padding-top: 30px !important
  }

  .xl\:pb-30 {
    padding-bottom: 30px !important
  }

  .xl\:pl-30 {
    padding-left: 30px !important
  }

  .xl\:pr-30 {
    padding-right: 30px !important
  }

  .xl\:mt-30 {
    margin-top: 30px !important
  }

  .xl\:mb-30 {
    margin-bottom: 30px !important
  }

  .xl\:ml-30 {
    margin-left: 30px !important
  }

  .xl\:mr-30 {
    margin-right: 30px !important
  }

  .xl\:py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important
  }

  .xl\:px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important
  }

  .xl\:pt-35 {
    padding-top: 35px !important
  }

  .xl\:pb-35 {
    padding-bottom: 35px !important
  }

  .xl\:pl-35 {
    padding-left: 35px !important
  }

  .xl\:pr-35 {
    padding-right: 35px !important
  }

  .xl\:mt-35 {
    margin-top: 35px !important
  }

  .xl\:mb-35 {
    margin-bottom: 35px !important
  }

  .xl\:ml-35 {
    margin-left: 35px !important
  }

  .xl\:mr-35 {
    margin-right: 35px !important
  }

  .xl\:py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important
  }

  .xl\:px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important
  }

  .xl\:pt-40 {
    padding-top: 40px !important
  }

  .xl\:pb-40 {
    padding-bottom: 40px !important
  }

  .xl\:pl-40 {
    padding-left: 40px !important
  }

  .xl\:pr-40 {
    padding-right: 40px !important
  }

  .xl\:mt-40 {
    margin-top: 40px !important
  }

  .xl\:mb-40 {
    margin-bottom: 40px !important
  }

  .xl\:ml-40 {
    margin-left: 40px !important
  }

  .xl\:mr-40 {
    margin-right: 40px !important
  }

  .xl\:py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important
  }

  .xl\:px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important
  }

  .xl\:pt-45 {
    padding-top: 45px !important
  }

  .xl\:pb-45 {
    padding-bottom: 45px !important
  }

  .xl\:pl-45 {
    padding-left: 45px !important
  }

  .xl\:pr-45 {
    padding-right: 45px !important
  }

  .xl\:mt-45 {
    margin-top: 45px !important
  }

  .xl\:mb-45 {
    margin-bottom: 45px !important
  }

  .xl\:ml-45 {
    margin-left: 45px !important
  }

  .xl\:mr-45 {
    margin-right: 45px !important
  }

  .xl\:py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important
  }

  .xl\:px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important
  }

  .xl\:pt-50 {
    padding-top: 50px !important
  }

  .xl\:pb-50 {
    padding-bottom: 50px !important
  }

  .xl\:pl-50 {
    padding-left: 50px !important
  }

  .xl\:pr-50 {
    padding-right: 50px !important
  }

  .xl\:mt-50 {
    margin-top: 50px !important
  }

  .xl\:mb-50 {
    margin-bottom: 50px !important
  }

  .xl\:ml-50 {
    margin-left: 50px !important
  }

  .xl\:mr-50 {
    margin-right: 50px !important
  }

  .xl\:py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important
  }

  .xl\:px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important
  }

  .xl\:pt-60 {
    padding-top: 60px !important
  }

  .xl\:pb-60 {
    padding-bottom: 60px !important
  }

  .xl\:pl-60 {
    padding-left: 60px !important
  }

  .xl\:pr-60 {
    padding-right: 60px !important
  }

  .xl\:mt-60 {
    margin-top: 60px !important
  }

  .xl\:mb-60 {
    margin-bottom: 60px !important
  }

  .xl\:ml-60 {
    margin-left: 60px !important
  }

  .xl\:mr-60 {
    margin-right: 60px !important
  }

  .xl\:py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important
  }

  .xl\:px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important
  }

  .xl\:pt-70 {
    padding-top: 70px !important
  }

  .xl\:pb-70 {
    padding-bottom: 70px !important
  }

  .xl\:pl-70 {
    padding-left: 70px !important
  }

  .xl\:pr-70 {
    padding-right: 70px !important
  }

  .xl\:mt-70 {
    margin-top: 70px !important
  }

  .xl\:mb-70 {
    margin-bottom: 70px !important
  }

  .xl\:ml-70 {
    margin-left: 70px !important
  }

  .xl\:mr-70 {
    margin-right: 70px !important
  }

  .xl\:py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important
  }

  .xl\:px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important
  }

  .xl\:pt-80 {
    padding-top: 80px !important
  }

  .xl\:pb-80 {
    padding-bottom: 80px !important
  }

  .xl\:pl-80 {
    padding-left: 80px !important
  }

  .xl\:pr-80 {
    padding-right: 80px !important
  }

  .xl\:mt-80 {
    margin-top: 80px !important
  }

  .xl\:mb-80 {
    margin-bottom: 80px !important
  }

  .xl\:ml-80 {
    margin-left: 80px !important
  }

  .xl\:mr-80 {
    margin-right: 80px !important
  }

  .xl\:py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important
  }

  .xl\:px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important
  }

  .xl\:pt-90 {
    padding-top: 90px !important
  }

  .xl\:pb-90 {
    padding-bottom: 90px !important
  }

  .xl\:pl-90 {
    padding-left: 90px !important
  }

  .xl\:pr-90 {
    padding-right: 90px !important
  }

  .xl\:mt-90 {
    margin-top: 90px !important
  }

  .xl\:mb-90 {
    margin-bottom: 90px !important
  }

  .xl\:ml-90 {
    margin-left: 90px !important
  }

  .xl\:mr-90 {
    margin-right: 90px !important
  }

  .xl\:py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important
  }

  .xl\:px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important
  }

  .xl\:pt-120 {
    padding-top: 120px !important
  }

  .xl\:pb-120 {
    padding-bottom: 120px !important
  }

  .xl\:pl-120 {
    padding-left: 120px !important
  }

  .xl\:pr-120 {
    padding-right: 120px !important
  }

  .xl\:mt-120 {
    margin-top: 120px !important
  }

  .xl\:mb-120 {
    margin-bottom: 120px !important
  }

  .xl\:ml-120 {
    margin-left: 120px !important
  }

  .xl\:mr-120 {
    margin-right: 120px !important
  }
}

@media (max-width: 991px) {
  .lg\:py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
  }

  .lg\:px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important
  }

  .lg\:pt-0 {
    padding-top: 0 !important
  }

  .lg\:pb-0 {
    padding-bottom: 0 !important
  }

  .lg\:pl-0 {
    padding-left: 0 !important
  }

  .lg\:pr-0 {
    padding-right: 0 !important
  }

  .lg\:mt-0 {
    margin-top: 0 !important
  }

  .lg\:mb-0 {
    margin-bottom: 0 !important
  }

  .lg\:ml-0 {
    margin-left: 0 !important
  }

  .lg\:mr-0 {
    margin-right: 0 !important
  }

  .lg\:py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important
  }

  .lg\:px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important
  }

  .lg\:pt-4 {
    padding-top: 4px !important
  }

  .lg\:pb-4 {
    padding-bottom: 4px !important
  }

  .lg\:pl-4 {
    padding-left: 4px !important
  }

  .lg\:pr-4 {
    padding-right: 4px !important
  }

  .lg\:mt-4 {
    margin-top: 4px !important
  }

  .lg\:mb-4 {
    margin-bottom: 4px !important
  }

  .lg\:ml-4 {
    margin-left: 4px !important
  }

  .lg\:mr-4 {
    margin-right: 4px !important
  }

  .lg\:py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important
  }

  .lg\:px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important
  }

  .lg\:pt-5 {
    padding-top: 5px !important
  }

  .lg\:pb-5 {
    padding-bottom: 5px !important
  }

  .lg\:pl-5 {
    padding-left: 5px !important
  }

  .lg\:pr-5 {
    padding-right: 5px !important
  }

  .lg\:mt-5 {
    margin-top: 5px !important
  }

  .lg\:mb-5 {
    margin-bottom: 5px !important
  }

  .lg\:ml-5 {
    margin-left: 5px !important
  }

  .lg\:mr-5 {
    margin-right: 5px !important
  }

  .lg\:py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important
  }

  .lg\:px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important
  }

  .lg\:pt-10 {
    padding-top: 10px !important
  }

  .lg\:pb-10 {
    padding-bottom: 10px !important
  }

  .lg\:pl-10 {
    padding-left: 10px !important
  }

  .lg\:pr-10 {
    padding-right: 10px !important
  }

  .lg\:mt-10 {
    margin-top: 10px !important
  }

  .lg\:mb-10 {
    margin-bottom: 10px !important
  }

  .lg\:ml-10 {
    margin-left: 10px !important
  }

  .lg\:mr-10 {
    margin-right: 10px !important
  }

  .lg\:py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important
  }

  .lg\:px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important
  }

  .lg\:pt-15 {
    padding-top: 15px !important
  }

  .lg\:pb-15 {
    padding-bottom: 15px !important
  }

  .lg\:pl-15 {
    padding-left: 15px !important
  }

  .lg\:pr-15 {
    padding-right: 15px !important
  }

  .lg\:mt-15 {
    margin-top: 15px !important
  }

  .lg\:mb-15 {
    margin-bottom: 15px !important
  }

  .lg\:ml-15 {
    margin-left: 15px !important
  }

  .lg\:mr-15 {
    margin-right: 15px !important
  }

  .lg\:py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important
  }

  .lg\:px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important
  }

  .lg\:pt-20 {
    padding-top: 20px !important
  }

  .lg\:pb-20 {
    padding-bottom: 20px !important
  }

  .lg\:pl-20 {
    padding-left: 20px !important
  }

  .lg\:pr-20 {
    padding-right: 20px !important
  }

  .lg\:mt-20 {
    margin-top: 20px !important
  }

  .lg\:mb-20 {
    margin-bottom: 20px !important
  }

  .lg\:ml-20 {
    margin-left: 20px !important
  }

  .lg\:mr-20 {
    margin-right: 20px !important
  }

  .lg\:py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important
  }

  .lg\:px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important
  }

  .lg\:pt-24 {
    padding-top: 24px !important
  }

  .lg\:pb-24 {
    padding-bottom: 24px !important
  }

  .lg\:pl-24 {
    padding-left: 24px !important
  }

  .lg\:pr-24 {
    padding-right: 24px !important
  }

  .lg\:mt-24 {
    margin-top: 24px !important
  }

  .lg\:mb-24 {
    margin-bottom: 24px !important
  }

  .lg\:ml-24 {
    margin-left: 24px !important
  }

  .lg\:mr-24 {
    margin-right: 24px !important
  }

  .lg\:py-28 {
    padding-top: 28px !important;
    padding-bottom: 28px !important
  }

  .lg\:px-28 {
    padding-left: 28px !important;
    padding-right: 28px !important
  }

  .lg\:pt-28 {
    padding-top: 28px !important
  }

  .lg\:pb-28 {
    padding-bottom: 28px !important
  }

  .lg\:pl-28 {
    padding-left: 28px !important
  }

  .lg\:pr-28 {
    padding-right: 28px !important
  }

  .lg\:mt-28 {
    margin-top: 28px !important
  }

  .lg\:mb-28 {
    margin-bottom: 28px !important
  }

  .lg\:ml-28 {
    margin-left: 28px !important
  }

  .lg\:mr-28 {
    margin-right: 28px !important
  }

  .lg\:py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important
  }

  .lg\:px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important
  }

  .lg\:pt-30 {
    padding-top: 30px !important
  }

  .lg\:pb-30 {
    padding-bottom: 30px !important
  }

  .lg\:pl-30 {
    padding-left: 30px !important
  }

  .lg\:pr-30 {
    padding-right: 30px !important
  }

  .lg\:mt-30 {
    margin-top: 30px !important
  }

  .lg\:mb-30 {
    margin-bottom: 30px !important
  }

  .lg\:ml-30 {
    margin-left: 30px !important
  }

  .lg\:mr-30 {
    margin-right: 30px !important
  }

  .lg\:py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important
  }

  .lg\:px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important
  }

  .lg\:pt-35 {
    padding-top: 35px !important
  }

  .lg\:pb-35 {
    padding-bottom: 35px !important
  }

  .lg\:pl-35 {
    padding-left: 35px !important
  }

  .lg\:pr-35 {
    padding-right: 35px !important
  }

  .lg\:mt-35 {
    margin-top: 35px !important
  }

  .lg\:mb-35 {
    margin-bottom: 35px !important
  }

  .lg\:ml-35 {
    margin-left: 35px !important
  }

  .lg\:mr-35 {
    margin-right: 35px !important
  }

  .lg\:py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important
  }

  .lg\:px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important
  }

  .lg\:pt-40 {
    padding-top: 40px !important
  }

  .lg\:pb-40 {
    padding-bottom: 40px !important
  }

  .lg\:pl-40 {
    padding-left: 40px !important
  }

  .lg\:pr-40 {
    padding-right: 40px !important
  }

  .lg\:mt-40 {
    margin-top: 40px !important
  }

  .lg\:mb-40 {
    margin-bottom: 40px !important
  }

  .lg\:ml-40 {
    margin-left: 40px !important
  }

  .lg\:mr-40 {
    margin-right: 40px !important
  }

  .lg\:py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important
  }

  .lg\:px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important
  }

  .lg\:pt-45 {
    padding-top: 45px !important
  }

  .lg\:pb-45 {
    padding-bottom: 45px !important
  }

  .lg\:pl-45 {
    padding-left: 45px !important
  }

  .lg\:pr-45 {
    padding-right: 45px !important
  }

  .lg\:mt-45 {
    margin-top: 45px !important
  }

  .lg\:mb-45 {
    margin-bottom: 45px !important
  }

  .lg\:ml-45 {
    margin-left: 45px !important
  }

  .lg\:mr-45 {
    margin-right: 45px !important
  }

  .lg\:py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important
  }

  .lg\:px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important
  }

  .lg\:pt-50 {
    padding-top: 50px !important
  }

  .lg\:pb-50 {
    padding-bottom: 50px !important
  }

  .lg\:pl-50 {
    padding-left: 50px !important
  }

  .lg\:pr-50 {
    padding-right: 50px !important
  }

  .lg\:mt-50 {
    margin-top: 50px !important
  }

  .lg\:mb-50 {
    margin-bottom: 50px !important
  }

  .lg\:ml-50 {
    margin-left: 50px !important
  }

  .lg\:mr-50 {
    margin-right: 50px !important
  }

  .lg\:py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important
  }

  .lg\:px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important
  }

  .lg\:pt-60 {
    padding-top: 60px !important
  }

  .lg\:pb-60 {
    padding-bottom: 60px !important
  }

  .lg\:pl-60 {
    padding-left: 60px !important
  }

  .lg\:pr-60 {
    padding-right: 60px !important
  }

  .lg\:mt-60 {
    margin-top: 60px !important
  }

  .lg\:mb-60 {
    margin-bottom: 60px !important
  }

  .lg\:ml-60 {
    margin-left: 60px !important
  }

  .lg\:mr-60 {
    margin-right: 60px !important
  }

  .lg\:py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important
  }

  .lg\:px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important
  }

  .lg\:pt-70 {
    padding-top: 70px !important
  }

  .lg\:pb-70 {
    padding-bottom: 70px !important
  }

  .lg\:pl-70 {
    padding-left: 70px !important
  }

  .lg\:pr-70 {
    padding-right: 70px !important
  }

  .lg\:mt-70 {
    margin-top: 70px !important
  }

  .lg\:mb-70 {
    margin-bottom: 70px !important
  }

  .lg\:ml-70 {
    margin-left: 70px !important
  }

  .lg\:mr-70 {
    margin-right: 70px !important
  }

  .lg\:py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important
  }

  .lg\:px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important
  }

  .lg\:pt-80 {
    padding-top: 80px !important
  }

  .lg\:pb-80 {
    padding-bottom: 80px !important
  }

  .lg\:pl-80 {
    padding-left: 80px !important
  }

  .lg\:pr-80 {
    padding-right: 80px !important
  }

  .lg\:mt-80 {
    margin-top: 80px !important
  }

  .lg\:mb-80 {
    margin-bottom: 80px !important
  }

  .lg\:ml-80 {
    margin-left: 80px !important
  }

  .lg\:mr-80 {
    margin-right: 80px !important
  }

  .lg\:py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important
  }

  .lg\:px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important
  }

  .lg\:pt-90 {
    padding-top: 90px !important
  }

  .lg\:pb-90 {
    padding-bottom: 90px !important
  }

  .lg\:pl-90 {
    padding-left: 90px !important
  }

  .lg\:pr-90 {
    padding-right: 90px !important
  }

  .lg\:mt-90 {
    margin-top: 90px !important
  }

  .lg\:mb-90 {
    margin-bottom: 90px !important
  }

  .lg\:ml-90 {
    margin-left: 90px !important
  }

  .lg\:mr-90 {
    margin-right: 90px !important
  }

  .lg\:py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important
  }

  .lg\:px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important
  }

  .lg\:pt-120 {
    padding-top: 120px !important
  }

  .lg\:pb-120 {
    padding-bottom: 120px !important
  }

  .lg\:pl-120 {
    padding-left: 120px !important
  }

  .lg\:pr-120 {
    padding-right: 120px !important
  }

  .lg\:mt-120 {
    margin-top: 120px !important
  }

  .lg\:mb-120 {
    margin-bottom: 120px !important
  }

  .lg\:ml-120 {
    margin-left: 120px !important
  }

  .lg\:mr-120 {
    margin-right: 120px !important
  }
}

@media (max-width: 767px) {
  .md\:py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
  }

  .md\:px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important
  }

  .md\:pt-0 {
    padding-top: 0 !important
  }

  .md\:pb-0 {
    padding-bottom: 0 !important
  }

  .md\:pl-0 {
    padding-left: 0 !important
  }

  .md\:pr-0 {
    padding-right: 0 !important
  }

  .md\:mt-0 {
    margin-top: 0 !important
  }

  .md\:mb-0 {
    margin-bottom: 0 !important
  }

  .md\:ml-0 {
    margin-left: 0 !important
  }

  .md\:mr-0 {
    margin-right: 0 !important
  }

  .md\:py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important
  }

  .md\:px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important
  }

  .md\:pt-4 {
    padding-top: 4px !important
  }

  .md\:pb-4 {
    padding-bottom: 4px !important
  }

  .md\:pl-4 {
    padding-left: 4px !important
  }

  .md\:pr-4 {
    padding-right: 4px !important
  }

  .md\:mt-4 {
    margin-top: 4px !important
  }

  .md\:mb-4 {
    margin-bottom: 4px !important
  }

  .md\:ml-4 {
    margin-left: 4px !important
  }

  .md\:mr-4 {
    margin-right: 4px !important
  }

  .md\:py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important
  }

  .md\:px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important
  }

  .md\:pt-5 {
    padding-top: 5px !important
  }

  .md\:pb-5 {
    padding-bottom: 5px !important
  }

  .md\:pl-5 {
    padding-left: 5px !important
  }

  .md\:pr-5 {
    padding-right: 5px !important
  }

  .md\:mt-5 {
    margin-top: 5px !important
  }

  .md\:mb-5 {
    margin-bottom: 5px !important
  }

  .md\:ml-5 {
    margin-left: 5px !important
  }

  .md\:mr-5 {
    margin-right: 5px !important
  }

  .md\:py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important
  }

  .md\:px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important
  }

  .md\:pt-10 {
    padding-top: 10px !important
  }

  .md\:pb-10 {
    padding-bottom: 10px !important
  }

  .md\:pl-10 {
    padding-left: 10px !important
  }

  .md\:pr-10 {
    padding-right: 10px !important
  }

  .md\:mt-10 {
    margin-top: 10px !important
  }

  .md\:mb-10 {
    margin-bottom: 10px !important
  }

  .md\:ml-10 {
    margin-left: 10px !important
  }

  .md\:mr-10 {
    margin-right: 10px !important
  }

  .md\:py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important
  }

  .md\:px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important
  }

  .md\:pt-15 {
    padding-top: 15px !important
  }

  .md\:pb-15 {
    padding-bottom: 15px !important
  }

  .md\:pl-15 {
    padding-left: 15px !important
  }

  .md\:pr-15 {
    padding-right: 15px !important
  }

  .md\:mt-15 {
    margin-top: 15px !important
  }

  .md\:mb-15 {
    margin-bottom: 15px !important
  }

  .md\:ml-15 {
    margin-left: 15px !important
  }

  .md\:mr-15 {
    margin-right: 15px !important
  }

  .md\:py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important
  }

  .md\:px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important
  }

  .md\:pt-20 {
    padding-top: 20px !important
  }

  .md\:pb-20 {
    padding-bottom: 20px !important
  }

  .md\:pl-20 {
    padding-left: 20px !important
  }

  .md\:pr-20 {
    padding-right: 20px !important
  }

  .md\:mt-20 {
    margin-top: 20px !important
  }

  .md\:mb-20 {
    margin-bottom: 20px !important
  }

  .md\:ml-20 {
    margin-left: 20px !important
  }

  .md\:mr-20 {
    margin-right: 20px !important
  }

  .md\:py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important
  }

  .md\:px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important
  }

  .md\:pt-24 {
    padding-top: 24px !important
  }

  .md\:pb-24 {
    padding-bottom: 24px !important
  }

  .md\:pl-24 {
    padding-left: 24px !important
  }

  .md\:pr-24 {
    padding-right: 24px !important
  }

  .md\:mt-24 {
    margin-top: 24px !important
  }

  .md\:mb-24 {
    margin-bottom: 24px !important
  }

  .md\:ml-24 {
    margin-left: 24px !important
  }

  .md\:mr-24 {
    margin-right: 24px !important
  }

  .md\:py-28 {
    padding-top: 28px !important;
    padding-bottom: 28px !important
  }

  .md\:px-28 {
    padding-left: 28px !important;
    padding-right: 28px !important
  }

  .md\:pt-28 {
    padding-top: 28px !important
  }

  .md\:pb-28 {
    padding-bottom: 28px !important
  }

  .md\:pl-28 {
    padding-left: 28px !important
  }

  .md\:pr-28 {
    padding-right: 28px !important
  }

  .md\:mt-28 {
    margin-top: 28px !important
  }

  .md\:mb-28 {
    margin-bottom: 28px !important
  }

  .md\:ml-28 {
    margin-left: 28px !important
  }

  .md\:mr-28 {
    margin-right: 28px !important
  }

  .md\:py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important
  }

  .md\:px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important
  }

  .md\:pt-30 {
    padding-top: 30px !important
  }

  .md\:pb-30 {
    padding-bottom: 30px !important
  }

  .md\:pl-30 {
    padding-left: 30px !important
  }

  .md\:pr-30 {
    padding-right: 30px !important
  }

  .md\:mt-30 {
    margin-top: 30px !important
  }

  .md\:mb-30 {
    margin-bottom: 30px !important
  }

  .md\:ml-30 {
    margin-left: 30px !important
  }

  .md\:mr-30 {
    margin-right: 30px !important
  }

  .md\:py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important
  }

  .md\:px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important
  }

  .md\:pt-35 {
    padding-top: 35px !important
  }

  .md\:pb-35 {
    padding-bottom: 35px !important
  }

  .md\:pl-35 {
    padding-left: 35px !important
  }

  .md\:pr-35 {
    padding-right: 35px !important
  }

  .md\:mt-35 {
    margin-top: 35px !important
  }

  .md\:mb-35 {
    margin-bottom: 35px !important
  }

  .md\:ml-35 {
    margin-left: 35px !important
  }

  .md\:mr-35 {
    margin-right: 35px !important
  }

  .md\:py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important
  }

  .md\:px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important
  }

  .md\:pt-40 {
    padding-top: 40px !important
  }

  .md\:pb-40 {
    padding-bottom: 40px !important
  }

  .md\:pl-40 {
    padding-left: 40px !important
  }

  .md\:pr-40 {
    padding-right: 40px !important
  }

  .md\:mt-40 {
    margin-top: 40px !important
  }

  .md\:mb-40 {
    margin-bottom: 40px !important
  }

  .md\:ml-40 {
    margin-left: 40px !important
  }

  .md\:mr-40 {
    margin-right: 40px !important
  }

  .md\:py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important
  }

  .md\:px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important
  }

  .md\:pt-45 {
    padding-top: 45px !important
  }

  .md\:pb-45 {
    padding-bottom: 45px !important
  }

  .md\:pl-45 {
    padding-left: 45px !important
  }

  .md\:pr-45 {
    padding-right: 45px !important
  }

  .md\:mt-45 {
    margin-top: 45px !important
  }

  .md\:mb-45 {
    margin-bottom: 45px !important
  }

  .md\:ml-45 {
    margin-left: 45px !important
  }

  .md\:mr-45 {
    margin-right: 45px !important
  }

  .md\:py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important
  }

  .md\:px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important
  }

  .md\:pt-50 {
    padding-top: 50px !important
  }

  .md\:pb-50 {
    padding-bottom: 50px !important
  }

  .md\:pl-50 {
    padding-left: 50px !important
  }

  .md\:pr-50 {
    padding-right: 50px !important
  }

  .md\:mt-50 {
    margin-top: 50px !important
  }

  .md\:mb-50 {
    margin-bottom: 50px !important
  }

  .md\:ml-50 {
    margin-left: 50px !important
  }

  .md\:mr-50 {
    margin-right: 50px !important
  }

  .md\:py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important
  }

  .md\:px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important
  }

  .md\:pt-60 {
    padding-top: 60px !important
  }

  .md\:pb-60 {
    padding-bottom: 60px !important
  }

  .md\:pl-60 {
    padding-left: 60px !important
  }

  .md\:pr-60 {
    padding-right: 60px !important
  }

  .md\:mt-60 {
    margin-top: 60px !important
  }

  .md\:mb-60 {
    margin-bottom: 60px !important
  }

  .md\:ml-60 {
    margin-left: 60px !important
  }

  .md\:mr-60 {
    margin-right: 60px !important
  }

  .md\:py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important
  }

  .md\:px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important
  }

  .md\:pt-70 {
    padding-top: 70px !important
  }

  .md\:pb-70 {
    padding-bottom: 70px !important
  }

  .md\:pl-70 {
    padding-left: 70px !important
  }

  .md\:pr-70 {
    padding-right: 70px !important
  }

  .md\:mt-70 {
    margin-top: 70px !important
  }

  .md\:mb-70 {
    margin-bottom: 70px !important
  }

  .md\:ml-70 {
    margin-left: 70px !important
  }

  .md\:mr-70 {
    margin-right: 70px !important
  }

  .md\:py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important
  }

  .md\:px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important
  }

  .md\:pt-80 {
    padding-top: 80px !important
  }

  .md\:pb-80 {
    padding-bottom: 80px !important
  }

  .md\:pl-80 {
    padding-left: 80px !important
  }

  .md\:pr-80 {
    padding-right: 80px !important
  }

  .md\:mt-80 {
    margin-top: 80px !important
  }

  .md\:mb-80 {
    margin-bottom: 80px !important
  }

  .md\:ml-80 {
    margin-left: 80px !important
  }

  .md\:mr-80 {
    margin-right: 80px !important
  }

  .md\:py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important
  }

  .md\:px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important
  }

  .md\:pt-90 {
    padding-top: 90px !important
  }

  .md\:pb-90 {
    padding-bottom: 90px !important
  }

  .md\:pl-90 {
    padding-left: 90px !important
  }

  .md\:pr-90 {
    padding-right: 90px !important
  }

  .md\:mt-90 {
    margin-top: 90px !important
  }

  .md\:mb-90 {
    margin-bottom: 90px !important
  }

  .md\:ml-90 {
    margin-left: 90px !important
  }

  .md\:mr-90 {
    margin-right: 90px !important
  }

  .md\:py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important
  }

  .md\:px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important
  }

  .md\:pt-120 {
    padding-top: 120px !important
  }

  .md\:pb-120 {
    padding-bottom: 120px !important
  }

  .md\:pl-120 {
    padding-left: 120px !important
  }

  .md\:pr-120 {
    padding-right: 120px !important
  }

  .md\:mt-120 {
    margin-top: 120px !important
  }

  .md\:mb-120 {
    margin-bottom: 120px !important
  }

  .md\:ml-120 {
    margin-left: 120px !important
  }

  .md\:mr-120 {
    margin-right: 120px !important
  }
}

@media (max-width: 575px) {
  .sm\:py-0 {
    padding-top: 0 !important;
    padding-bottom: 0 !important
  }

  .sm\:px-0 {
    padding-left: 0 !important;
    padding-right: 0 !important
  }

  .sm\:pt-0 {
    padding-top: 0 !important
  }

  .sm\:pb-0 {
    padding-bottom: 0 !important
  }

  .sm\:pl-0 {
    padding-left: 0 !important
  }

  .sm\:pr-0 {
    padding-right: 0 !important
  }

  .sm\:mt-0 {
    margin-top: 0 !important
  }

  .sm\:mb-0 {
    margin-bottom: 0 !important
  }

  .sm\:ml-0 {
    margin-left: 0 !important
  }

  .sm\:mr-0 {
    margin-right: 0 !important
  }

  .sm\:py-4 {
    padding-top: 4px !important;
    padding-bottom: 4px !important
  }

  .sm\:px-4 {
    padding-left: 4px !important;
    padding-right: 4px !important
  }

  .sm\:pt-4 {
    padding-top: 4px !important
  }

  .sm\:pb-4 {
    padding-bottom: 4px !important
  }

  .sm\:pl-4 {
    padding-left: 4px !important
  }

  .sm\:pr-4 {
    padding-right: 4px !important
  }

  .sm\:mt-4 {
    margin-top: 4px !important
  }

  .sm\:mb-4 {
    margin-bottom: 4px !important
  }

  .sm\:ml-4 {
    margin-left: 4px !important
  }

  .sm\:mr-4 {
    margin-right: 4px !important
  }

  .sm\:py-5 {
    padding-top: 5px !important;
    padding-bottom: 5px !important
  }

  .sm\:px-5 {
    padding-left: 5px !important;
    padding-right: 5px !important
  }

  .sm\:pt-5 {
    padding-top: 5px !important
  }

  .sm\:pb-5 {
    padding-bottom: 5px !important
  }

  .sm\:pl-5 {
    padding-left: 5px !important
  }

  .sm\:pr-5 {
    padding-right: 5px !important
  }

  .sm\:mt-5 {
    margin-top: 5px !important
  }

  .sm\:mb-5 {
    margin-bottom: 5px !important
  }

  .sm\:ml-5 {
    margin-left: 5px !important
  }

  .sm\:mr-5 {
    margin-right: 5px !important
  }

  .sm\:py-10 {
    padding-top: 10px !important;
    padding-bottom: 10px !important
  }

  .sm\:px-10 {
    padding-left: 10px !important;
    padding-right: 10px !important
  }

  .sm\:pt-10 {
    padding-top: 10px !important
  }

  .sm\:pb-10 {
    padding-bottom: 10px !important
  }

  .sm\:pl-10 {
    padding-left: 10px !important
  }

  .sm\:pr-10 {
    padding-right: 10px !important
  }

  .sm\:mt-10 {
    margin-top: 10px !important
  }

  .sm\:mb-10 {
    margin-bottom: 10px !important
  }

  .sm\:ml-10 {
    margin-left: 10px !important
  }

  .sm\:mr-10 {
    margin-right: 10px !important
  }

  .sm\:py-15 {
    padding-top: 15px !important;
    padding-bottom: 15px !important
  }

  .sm\:px-15 {
    padding-left: 15px !important;
    padding-right: 15px !important
  }

  .sm\:pt-15 {
    padding-top: 15px !important
  }

  .sm\:pb-15 {
    padding-bottom: 15px !important
  }

  .sm\:pl-15 {
    padding-left: 15px !important
  }

  .sm\:pr-15 {
    padding-right: 15px !important
  }

  .sm\:mt-15 {
    margin-top: 15px !important
  }

  .sm\:mb-15 {
    margin-bottom: 15px !important
  }

  .sm\:ml-15 {
    margin-left: 15px !important
  }

  .sm\:mr-15 {
    margin-right: 15px !important
  }

  .sm\:py-20 {
    padding-top: 20px !important;
    padding-bottom: 20px !important
  }

  .sm\:px-20 {
    padding-left: 20px !important;
    padding-right: 20px !important
  }

  .sm\:pt-20 {
    padding-top: 20px !important
  }

  .sm\:pb-20 {
    padding-bottom: 20px !important
  }

  .sm\:pl-20 {
    padding-left: 20px !important
  }

  .sm\:pr-20 {
    padding-right: 20px !important
  }

  .sm\:mt-20 {
    margin-top: 20px !important
  }

  .sm\:mb-20 {
    margin-bottom: 20px !important
  }

  .sm\:ml-20 {
    margin-left: 20px !important
  }

  .sm\:mr-20 {
    margin-right: 20px !important
  }

  .sm\:py-24 {
    padding-top: 24px !important;
    padding-bottom: 24px !important
  }

  .sm\:px-24 {
    padding-left: 24px !important;
    padding-right: 24px !important
  }

  .sm\:pt-24 {
    padding-top: 24px !important
  }

  .sm\:pb-24 {
    padding-bottom: 24px !important
  }

  .sm\:pl-24 {
    padding-left: 24px !important
  }

  .sm\:pr-24 {
    padding-right: 24px !important
  }

  .sm\:mt-24 {
    margin-top: 24px !important
  }

  .sm\:mb-24 {
    margin-bottom: 24px !important
  }

  .sm\:ml-24 {
    margin-left: 24px !important
  }

  .sm\:mr-24 {
    margin-right: 24px !important
  }

  .sm\:py-28 {
    padding-top: 28px !important;
    padding-bottom: 28px !important
  }

  .sm\:px-28 {
    padding-left: 28px !important;
    padding-right: 28px !important
  }

  .sm\:pt-28 {
    padding-top: 28px !important
  }

  .sm\:pb-28 {
    padding-bottom: 28px !important
  }

  .sm\:pl-28 {
    padding-left: 28px !important
  }

  .sm\:pr-28 {
    padding-right: 28px !important
  }

  .sm\:mt-28 {
    margin-top: 28px !important
  }

  .sm\:mb-28 {
    margin-bottom: 28px !important
  }

  .sm\:ml-28 {
    margin-left: 28px !important
  }

  .sm\:mr-28 {
    margin-right: 28px !important
  }

  .sm\:py-30 {
    padding-top: 30px !important;
    padding-bottom: 30px !important
  }

  .sm\:px-30 {
    padding-left: 30px !important;
    padding-right: 30px !important
  }

  .sm\:pt-30 {
    padding-top: 30px !important
  }

  .sm\:pb-30 {
    padding-bottom: 30px !important
  }

  .sm\:pl-30 {
    padding-left: 30px !important
  }

  .sm\:pr-30 {
    padding-right: 30px !important
  }

  .sm\:mt-30 {
    margin-top: 30px !important
  }

  .sm\:mb-30 {
    margin-bottom: 30px !important
  }

  .sm\:ml-30 {
    margin-left: 30px !important
  }

  .sm\:mr-30 {
    margin-right: 30px !important
  }

  .sm\:py-35 {
    padding-top: 35px !important;
    padding-bottom: 35px !important
  }

  .sm\:px-35 {
    padding-left: 35px !important;
    padding-right: 35px !important
  }

  .sm\:pt-35 {
    padding-top: 35px !important
  }

  .sm\:pb-35 {
    padding-bottom: 35px !important
  }

  .sm\:pl-35 {
    padding-left: 35px !important
  }

  .sm\:pr-35 {
    padding-right: 35px !important
  }

  .sm\:mt-35 {
    margin-top: 35px !important
  }

  .sm\:mb-35 {
    margin-bottom: 35px !important
  }

  .sm\:ml-35 {
    margin-left: 35px !important
  }

  .sm\:mr-35 {
    margin-right: 35px !important
  }

  .sm\:py-40 {
    padding-top: 40px !important;
    padding-bottom: 40px !important
  }

  .sm\:px-40 {
    padding-left: 40px !important;
    padding-right: 40px !important
  }

  .sm\:pt-40 {
    padding-top: 40px !important
  }

  .sm\:pb-40 {
    padding-bottom: 40px !important
  }

  .sm\:pl-40 {
    padding-left: 40px !important
  }

  .sm\:pr-40 {
    padding-right: 40px !important
  }

  .sm\:mt-40 {
    margin-top: 40px !important
  }

  .sm\:mb-40 {
    margin-bottom: 40px !important
  }

  .sm\:ml-40 {
    margin-left: 40px !important
  }

  .sm\:mr-40 {
    margin-right: 40px !important
  }

  .sm\:py-45 {
    padding-top: 45px !important;
    padding-bottom: 45px !important
  }

  .sm\:px-45 {
    padding-left: 45px !important;
    padding-right: 45px !important
  }

  .sm\:pt-45 {
    padding-top: 45px !important
  }

  .sm\:pb-45 {
    padding-bottom: 45px !important
  }

  .sm\:pl-45 {
    padding-left: 45px !important
  }

  .sm\:pr-45 {
    padding-right: 45px !important
  }

  .sm\:mt-45 {
    margin-top: 45px !important
  }

  .sm\:mb-45 {
    margin-bottom: 45px !important
  }

  .sm\:ml-45 {
    margin-left: 45px !important
  }

  .sm\:mr-45 {
    margin-right: 45px !important
  }

  .sm\:py-50 {
    padding-top: 50px !important;
    padding-bottom: 50px !important
  }

  .sm\:px-50 {
    padding-left: 50px !important;
    padding-right: 50px !important
  }

  .sm\:pt-50 {
    padding-top: 50px !important
  }

  .sm\:pb-50 {
    padding-bottom: 50px !important
  }

  .sm\:pl-50 {
    padding-left: 50px !important
  }

  .sm\:pr-50 {
    padding-right: 50px !important
  }

  .sm\:mt-50 {
    margin-top: 50px !important
  }

  .sm\:mb-50 {
    margin-bottom: 50px !important
  }

  .sm\:ml-50 {
    margin-left: 50px !important
  }

  .sm\:mr-50 {
    margin-right: 50px !important
  }

  .sm\:py-60 {
    padding-top: 60px !important;
    padding-bottom: 60px !important
  }

  .sm\:px-60 {
    padding-left: 60px !important;
    padding-right: 60px !important
  }

  .sm\:pt-60 {
    padding-top: 60px !important
  }

  .sm\:pb-60 {
    padding-bottom: 60px !important
  }

  .sm\:pl-60 {
    padding-left: 60px !important
  }

  .sm\:pr-60 {
    padding-right: 60px !important
  }

  .sm\:mt-60 {
    margin-top: 60px !important
  }

  .sm\:mb-60 {
    margin-bottom: 60px !important
  }

  .sm\:ml-60 {
    margin-left: 60px !important
  }

  .sm\:mr-60 {
    margin-right: 60px !important
  }

  .sm\:py-70 {
    padding-top: 70px !important;
    padding-bottom: 70px !important
  }

  .sm\:px-70 {
    padding-left: 70px !important;
    padding-right: 70px !important
  }

  .sm\:pt-70 {
    padding-top: 70px !important
  }

  .sm\:pb-70 {
    padding-bottom: 70px !important
  }

  .sm\:pl-70 {
    padding-left: 70px !important
  }

  .sm\:pr-70 {
    padding-right: 70px !important
  }

  .sm\:mt-70 {
    margin-top: 70px !important
  }

  .sm\:mb-70 {
    margin-bottom: 70px !important
  }

  .sm\:ml-70 {
    margin-left: 70px !important
  }

  .sm\:mr-70 {
    margin-right: 70px !important
  }

  .sm\:py-80 {
    padding-top: 80px !important;
    padding-bottom: 80px !important
  }

  .sm\:px-80 {
    padding-left: 80px !important;
    padding-right: 80px !important
  }

  .sm\:pt-80 {
    padding-top: 80px !important
  }

  .sm\:pb-80 {
    padding-bottom: 80px !important
  }

  .sm\:pl-80 {
    padding-left: 80px !important
  }

  .sm\:pr-80 {
    padding-right: 80px !important
  }

  .sm\:mt-80 {
    margin-top: 80px !important
  }

  .sm\:mb-80 {
    margin-bottom: 80px !important
  }

  .sm\:ml-80 {
    margin-left: 80px !important
  }

  .sm\:mr-80 {
    margin-right: 80px !important
  }

  .sm\:py-90 {
    padding-top: 90px !important;
    padding-bottom: 90px !important
  }

  .sm\:px-90 {
    padding-left: 90px !important;
    padding-right: 90px !important
  }

  .sm\:pt-90 {
    padding-top: 90px !important
  }

  .sm\:pb-90 {
    padding-bottom: 90px !important
  }

  .sm\:pl-90 {
    padding-left: 90px !important
  }

  .sm\:pr-90 {
    padding-right: 90px !important
  }

  .sm\:mt-90 {
    margin-top: 90px !important
  }

  .sm\:mb-90 {
    margin-bottom: 90px !important
  }

  .sm\:ml-90 {
    margin-left: 90px !important
  }

  .sm\:mr-90 {
    margin-right: 90px !important
  }

  .sm\:py-120 {
    padding-top: 120px !important;
    padding-bottom: 120px !important
  }

  .sm\:px-120 {
    padding-left: 120px !important;
    padding-right: 120px !important
  }

  .sm\:pt-120 {
    padding-top: 120px !important
  }

  .sm\:pb-120 {
    padding-bottom: 120px !important
  }

  .sm\:pl-120 {
    padding-left: 120px !important
  }

  .sm\:pr-120 {
    padding-right: 120px !important
  }

  .sm\:mt-120 {
    margin-top: 120px !important
  }

  .sm\:mb-120 {
    margin-bottom: 120px !important
  }

  .sm\:ml-120 {
    margin-left: 120px !important
  }

  .sm\:mr-120 {
    margin-right: 120px !important
  }
}

.mx-auto {
  margin-left: auto;
  margin-right: auto
}

.xl\:mx-auto {
  margin-left: auto;
  margin-right: auto
}

.lg\:mx-auto {
  margin-left: auto;
  margin-right: auto
}

.md\:mx-auto {
  margin-left: auto;
  margin-right: auto
}

.sm\:mx-auto {
  margin-left: auto;
  margin-right: auto
}

/*** Gap x y ***/
.x-gap-0 {
  margin-left: -0;
  margin-right: -0
}

.x-gap-0>* {
  padding-left: 0;
  padding-right: 0
}

.y-gap-0 {
  margin-top: -0;
  margin-bottom: -0
}

.y-gap-0>* {
  padding-top: 0;
  padding-bottom: 0
}

.x-gap-5 {
  margin-left: -2.5px;
  margin-right: -2.5px
}

.x-gap-5>* {
  padding-left: 2.5px;
  padding-right: 2.5px
}

.y-gap-5 {
  margin-top: -2.5px;
  margin-bottom: -2.5px
}

.y-gap-5>* {
  padding-top: 2.5px;
  padding-bottom: 2.5px
}

.x-gap-10 {
  margin-left: -5px;
  margin-right: -5px
}

.x-gap-10>* {
  padding-left: 5px;
  padding-right: 5px
}

.y-gap-10 {
  margin-top: -5px;
  margin-bottom: -5px
}

.y-gap-10>* {
  padding-top: 5px;
  padding-bottom: 5px
}

.x-gap-15 {
  margin-left: -7.5px;
  margin-right: -7.5px
}

.x-gap-15>* {
  padding-left: 7.5px;
  padding-right: 7.5px
}

.y-gap-15 {
  margin-top: -7.5px;
  margin-bottom: -7.5px
}

.y-gap-15>* {
  padding-top: 7.5px;
  padding-bottom: 7.5px
}

.x-gap-20 {
  margin-left: -10px;
  margin-right: -10px
}

.x-gap-20>* {
  padding-left: 10px;
  padding-right: 10px
}

.y-gap-20 {
  margin-top: -10px;
  margin-bottom: -10px
}

.y-gap-20>* {
  padding-top: 10px;
  padding-bottom: 10px
}

.x-gap-30 {
  margin-left: -15px;
  margin-right: -15px
}

.x-gap-30>* {
  padding-left: 15px;
  padding-right: 15px
}

.y-gap-30 {
  margin-top: -15px;
  margin-bottom: -15px
}

.y-gap-30>* {
  padding-top: 15px;
  padding-bottom: 15px
}

.x-gap-40 {
  margin-left: -20px;
  margin-right: -20px
}

.x-gap-40>* {
  padding-left: 20px;
  padding-right: 20px
}

.y-gap-40 {
  margin-top: -20px;
  margin-bottom: -20px
}

.y-gap-40>* {
  padding-top: 20px;
  padding-bottom: 20px
}

.x-gap-50 {
  margin-left: -25px;
  margin-right: -25px
}

.x-gap-50>* {
  padding-left: 25px;
  padding-right: 25px
}

.y-gap-50 {
  margin-top: -25px;
  margin-bottom: -25px
}

.y-gap-50>* {
  padding-top: 25px;
  padding-bottom: 25px
}

.x-gap-60 {
  margin-left: -30px;
  margin-right: -30px
}

.x-gap-60>* {
  padding-left: 30px;
  padding-right: 30px
}

.y-gap-60 {
  margin-top: -30px;
  margin-bottom: -30px
}

.y-gap-60>* {
  padding-top: 30px;
  padding-bottom: 30px
}

.x-gap-80 {
  margin-left: -40px;
  margin-right: -40px
}

.x-gap-80>* {
  padding-left: 40px;
  padding-right: 40px
}

.y-gap-80 {
  margin-top: -40px;
  margin-bottom: -40px
}

.y-gap-80>* {
  padding-top: 40px;
  padding-bottom: 40px
}

@media (max-width: 767px) {
  .md\:x-gap-0 {
    margin-left: -0;
    margin-right: -0
  }

  .md\:x-gap-0>* {
    padding-left: 0;
    padding-right: 0
  }

  .md\:y-gap-0 {
    margin-top: -0;
    margin-bottom: -0
  }

  .md\:y-gap-0>* {
    padding-top: 0;
    padding-bottom: 0
  }

  .md\:x-gap-5 {
    margin-left: -2.5px;
    margin-right: -2.5px
  }

  .md\:x-gap-5>* {
    padding-left: 2.5px;
    padding-right: 2.5px
  }

  .md\:y-gap-5 {
    margin-top: -2.5px;
    margin-bottom: -2.5px
  }

  .md\:y-gap-5>* {
    padding-top: 2.5px;
    padding-bottom: 2.5px
  }

  .md\:x-gap-10 {
    margin-left: -5px;
    margin-right: -5px
  }

  .md\:x-gap-10>* {
    padding-left: 5px;
    padding-right: 5px
  }

  .md\:y-gap-10 {
    margin-top: -5px;
    margin-bottom: -5px
  }

  .md\:y-gap-10>* {
    padding-top: 5px;
    padding-bottom: 5px
  }

  .md\:x-gap-15 {
    margin-left: -7.5px;
    margin-right: -7.5px
  }

  .md\:x-gap-15>* {
    padding-left: 7.5px;
    padding-right: 7.5px
  }

  .md\:y-gap-15 {
    margin-top: -7.5px;
    margin-bottom: -7.5px
  }

  .md\:y-gap-15>* {
    padding-top: 7.5px;
    padding-bottom: 7.5px
  }

  .md\:x-gap-20 {
    margin-left: -10px;
    margin-right: -10px
  }

  .md\:x-gap-20>* {
    padding-left: 10px;
    padding-right: 10px
  }

  .md\:y-gap-20 {
    margin-top: -10px;
    margin-bottom: -10px
  }

  .md\:y-gap-20>* {
    padding-top: 10px;
    padding-bottom: 10px
  }

  .md\:x-gap-30 {
    margin-left: -15px;
    margin-right: -15px
  }

  .md\:x-gap-30>* {
    padding-left: 15px;
    padding-right: 15px
  }

  .md\:y-gap-30 {
    margin-top: -15px;
    margin-bottom: -15px
  }

  .md\:y-gap-30>* {
    padding-top: 15px;
    padding-bottom: 15px
  }

  .md\:x-gap-40 {
    margin-left: -20px;
    margin-right: -20px
  }

  .md\:x-gap-40>* {
    padding-left: 20px;
    padding-right: 20px
  }

  .md\:y-gap-40 {
    margin-top: -20px;
    margin-bottom: -20px
  }

  .md\:y-gap-40>* {
    padding-top: 20px;
    padding-bottom: 20px
  }

  .md\:x-gap-50 {
    margin-left: -25px;
    margin-right: -25px
  }

  .md\:x-gap-50>* {
    padding-left: 25px;
    padding-right: 25px
  }

  .md\:y-gap-50 {
    margin-top: -25px;
    margin-bottom: -25px
  }

  .md\:y-gap-50>* {
    padding-top: 25px;
    padding-bottom: 25px
  }

  .md\:x-gap-60 {
    margin-left: -30px;
    margin-right: -30px
  }

  .md\:x-gap-60>* {
    padding-left: 30px;
    padding-right: 30px
  }

  .md\:y-gap-60 {
    margin-top: -30px;
    margin-bottom: -30px
  }

  .md\:y-gap-60>* {
    padding-top: 30px;
    padding-bottom: 30px
  }

  .md\:x-gap-80 {
    margin-left: -40px;
    margin-right: -40px
  }

  .md\:x-gap-80>* {
    padding-left: 40px;
    padding-right: 40px
  }

  .md\:y-gap-80 {
    margin-top: -40px;
    margin-bottom: -40px
  }

  .md\:y-gap-80>* {
    padding-top: 40px;
    padding-bottom: 40px
  }
}

@media (max-width: 575px) {
  .sm\:x-gap-0 {
    margin-left: -0;
    margin-right: -0
  }

  .sm\:x-gap-0>* {
    padding-left: 0;
    padding-right: 0
  }

  .sm\:y-gap-0 {
    margin-top: -0;
    margin-bottom: -0
  }

  .sm\:y-gap-0>* {
    padding-top: 0;
    padding-bottom: 0
  }

  .sm\:x-gap-5 {
    margin-left: -2.5px;
    margin-right: -2.5px
  }

  .sm\:x-gap-5>* {
    padding-left: 2.5px;
    padding-right: 2.5px
  }

  .sm\:y-gap-5 {
    margin-top: -2.5px;
    margin-bottom: -2.5px
  }

  .sm\:y-gap-5>* {
    padding-top: 2.5px;
    padding-bottom: 2.5px
  }

  .sm\:x-gap-10 {
    margin-left: -5px;
    margin-right: -5px
  }

  .sm\:x-gap-10>* {
    padding-left: 5px;
    padding-right: 5px
  }

  .sm\:y-gap-10 {
    margin-top: -5px;
    margin-bottom: -5px
  }

  .sm\:y-gap-10>* {
    padding-top: 5px;
    padding-bottom: 5px
  }

  .sm\:x-gap-15 {
    margin-left: -7.5px;
    margin-right: -7.5px
  }

  .sm\:x-gap-15>* {
    padding-left: 7.5px;
    padding-right: 7.5px
  }

  .sm\:y-gap-15 {
    margin-top: -7.5px;
    margin-bottom: -7.5px
  }

  .sm\:y-gap-15>* {
    padding-top: 7.5px;
    padding-bottom: 7.5px
  }

  .sm\:x-gap-20 {
    margin-left: -10px;
    margin-right: -10px
  }

  .sm\:x-gap-20>* {
    padding-left: 10px;
    padding-right: 10px
  }

  .sm\:y-gap-20 {
    margin-top: -10px;
    margin-bottom: -10px
  }

  .sm\:y-gap-20>* {
    padding-top: 10px;
    padding-bottom: 10px
  }

  .sm\:x-gap-30 {
    margin-left: -15px;
    margin-right: -15px
  }

  .sm\:x-gap-30>* {
    padding-left: 15px;
    padding-right: 15px
  }

  .sm\:y-gap-30 {
    margin-top: -15px;
    margin-bottom: -15px
  }

  .sm\:y-gap-30>* {
    padding-top: 15px;
    padding-bottom: 15px
  }

  .sm\:x-gap-40 {
    margin-left: -20px;
    margin-right: -20px
  }

  .sm\:x-gap-40>* {
    padding-left: 20px;
    padding-right: 20px
  }

  .sm\:y-gap-40 {
    margin-top: -20px;
    margin-bottom: -20px
  }

  .sm\:y-gap-40>* {
    padding-top: 20px;
    padding-bottom: 20px
  }

  .sm\:x-gap-50 {
    margin-left: -25px;
    margin-right: -25px
  }

  .sm\:x-gap-50>* {
    padding-left: 25px;
    padding-right: 25px
  }

  .sm\:y-gap-50 {
    margin-top: -25px;
    margin-bottom: -25px
  }

  .sm\:y-gap-50>* {
    padding-top: 25px;
    padding-bottom: 25px
  }

  .sm\:x-gap-60 {
    margin-left: -30px;
    margin-right: -30px
  }

  .sm\:x-gap-60>* {
    padding-left: 30px;
    padding-right: 30px
  }

  .sm\:y-gap-60 {
    margin-top: -30px;
    margin-bottom: -30px
  }

  .sm\:y-gap-60>* {
    padding-top: 30px;
    padding-bottom: 30px
  }

  .sm\:x-gap-80 {
    margin-left: -40px;
    margin-right: -40px
  }

  .sm\:x-gap-80>* {
    padding-left: 40px;
    padding-right: 40px
  }

  .sm\:y-gap-80 {
    margin-top: -40px;
    margin-bottom: -40px
  }

  .sm\:y-gap-80>* {
    padding-top: 40px;
    padding-bottom: 40px
  }
}

/*** Gap ***/
.gap-0 {
  gap: 0px
}

.gap-5 {
  gap: 5px
}

.gap-10 {
  gap: 10px
}

.gap-15 {
  gap: 15px
}

.gap-20 {
  gap: 20px
}

.gap-25 {
  gap: 25px
}

.gap-30 {
  gap: 30px
}

.gap-40 {
  gap: 40px
}

.gap-50 {
  gap: 50px
}

.gap-60 {
  gap: 60px
}

.gap-70 {
  gap: 70px
}

.gap-80 {
  gap: 80px
}

@media (max-width: 767px) {
  .md\:gap-0 {
    gap: 0px
  }

  .md\:gap-5 {
    gap: 5px
  }

  .md\:gap-10 {
    gap: 10px
  }

  .md\:gap-15 {
    gap: 15px
  }

  .md\:gap-20 {
    gap: 20px
  }

  .md\:gap-25 {
    gap: 25px
  }

  .md\:gap-30 {
    gap: 30px
  }

  .md\:gap-40 {
    gap: 40px
  }

  .md\:gap-50 {
    gap: 50px
  }

  .md\:gap-60 {
    gap: 60px
  }

  .md\:gap-70 {
    gap: 70px
  }

  .md\:gap-80 {
    gap: 80px
  }
}

@media (max-width: 575px) {
  .sm\:gap-0 {
    gap: 0px
  }

  .sm\:gap-5 {
    gap: 5px
  }

  .sm\:gap-10 {
    gap: 10px
  }

  .sm\:gap-15 {
    gap: 15px
  }

  .sm\:gap-20 {
    gap: 20px
  }

  .sm\:gap-25 {
    gap: 25px
  }

  .sm\:gap-30 {
    gap: 30px
  }

  .sm\:gap-40 {
    gap: 40px
  }

  .sm\:gap-50 {
    gap: 50px
  }

  .sm\:gap-60 {
    gap: 60px
  }

  .sm\:gap-70 {
    gap: 70px
  }

  .sm\:gap-80 {
    gap: 80px
  }
}

/*** Layout ***/
.layout-pt-sm {
  padding-top: 30px
}

.layout-pb-sm {
  padding-bottom: 30px
}

.layout-pt-md {
  padding-top: 60px
}

.layout-pb-md {
  padding-bottom: 60px
}

.layout-pt-lg {
  padding-top: 120px
}

.layout-pb-lg {
  padding-bottom: 120px
}

.layout-pt-xl {
  padding-top: 140px
}

.layout-pb-xl {
  padding-bottom: 140px
}

@media (max-width: 767px) {
  .layout-pt-sm {
    padding-top: 30px
  }

  .layout-pb-sm {
    padding-bottom: 30px
  }

  .layout-pt-md {
    padding-top: 60px
  }

  .layout-pb-md {
    padding-bottom: 60px
  }

  .layout-pt-lg {
    padding-top: 100px
  }

  .layout-pb-lg {
    padding-bottom: 100px
  }

  .layout-pt-xl {
    padding-top: 120px
  }

  .layout-pb-xl {
    padding-bottom: 120px
  }
}

@media (max-width: 575px) {
  .layout-pt-sm {
    padding-top: 30px
  }

  .layout-pb-sm {
    padding-bottom: 30px
  }

  .layout-pt-md {
    padding-top: 30px
  }

  .layout-pb-md {
    padding-bottom: 30px
  }

  .layout-pt-lg {
    padding-top: 60px
  }

  .layout-pb-lg {
    padding-bottom: 60px
  }

  .layout-pt-xl {
    padding-top: 60px
  }

  .layout-pb-xl {
    padding-bottom: 60px
  }
}

/*** Width % ***/
.w-1\/7 {
  width: 14.285714% !important
}

.w-1\/5 {
  width: 20% !important
}

.w-1\/4 {
  width: 25% !important
}

.w-1\/3 {
  width: 33.333333% !important
}

.w-1\/2 {
  width: 50% !important
}

.w-1\/1 {
  width: 100% !important
}

@media (max-width: 1199px) {
  .xl\:w-1\/5 {
    width: 20% !important
  }

  .xl\:w-1\/4 {
    width: 25% !important
  }

  .xl\:w-1\/3 {
    width: 33.333333% !important
  }

  .xl\:w-1\/2 {
    width: 50% !important
  }

  .xl\:w-1\/1 {
    width: 100% !important
  }
}

@media (max-width: 991px) {
  .lg\:w-1\/5 {
    width: 20% !important
  }

  .lg\:w-1\/4 {
    width: 25% !important
  }

  .lg\:w-1\/3 {
    width: 33.333333% !important
  }

  .lg\:w-1\/2 {
    width: 50% !important
  }

  .lg\:w-1\/1 {
    width: 100% !important
  }
}

@media (max-width: 767px) {
  .md\:w-1\/5 {
    width: 20% !important
  }

  .md\:w-1\/4 {
    width: 25% !important
  }

  .md\:w-1\/3 {
    width: 33.333333% !important
  }

  .md\:w-1\/2 {
    width: 50% !important
  }

  .md\:w-1\/1 {
    width: 100% !important
  }
}

@media (max-width: 575px) {
  .sm\:w-1\/5 {
    width: 20% !important
  }

  .sm\:w-1\/4 {
    width: 25% !important
  }

  .sm\:w-1\/3 {
    width: 33.333333% !important
  }

  .sm\:w-1\/2 {
    width: 50% !important
  }

  .sm\:w-1\/1 {
    width: 100% !important
  }
}

/*** Height % ***/
.h-1\/0 {
  height: 0% !important
}

.h-1\/7 {
  height: 14.285714% !important
}

.h-1\/5 {
  height: 20% !important
}

.h-1\/4 {
  height: 25% !important
}

.h-1\/3 {
  height: 33.333333% !important
}

.h-1\/2 {
  height: 50% !important
}

.h-1\/1 {
  height: 100% !important
}

@media (max-width: 1199px) {
  .xl\:h-1\/0 {
    height: 0% !important
  }

  .xl\:h-1\/5 {
    height: 20% !important
  }

  .xl\:h-1\/4 {
    height: 25% !important
  }

  .xl\:h-1\/3 {
    height: 33.333333% !important
  }

  .xl\:h-1\/2 {
    height: 50% !important
  }

  .xl\:h-1\/1 {
    height: 100% !important
  }
}

@media (max-width: 991px) {
  .lg\:h-1\/0 {
    height: 0% !important
  }

  .lg\:h-1\/5 {
    height: 20% !important
  }

  .lg\:h-1\/4 {
    height: 25% !important
  }

  .lg\:h-1\/3 {
    height: 33.333333% !important
  }

  .lg\:h-1\/2 {
    height: 50% !important
  }

  .lg\:h-1\/1 {
    height: 100% !important
  }
}

@media (max-width: 767px) {
  .md\:h-1\/0 {
    height: 0% !important
  }

  .md\:h-1\/5 {
    height: 20% !important
  }

  .md\:h-1\/4 {
    height: 25% !important
  }

  .md\:h-1\/3 {
    height: 33.333333% !important
  }

  .md\:h-1\/2 {
    height: 50% !important
  }

  .md\:h-1\/1 {
    height: 100% !important
  }
}

@media (max-width: 575px) {
  .sm\:h-1\/0 {
    height: 0% !important
  }

  .sm\:h-1\/5 {
    height: 20% !important
  }

  .sm\:h-1\/4 {
    height: 25% !important
  }

  .sm\:h-1\/3 {
    height: 33.333333% !important
  }

  .sm\:h-1\/2 {
    height: 50% !important
  }

  .sm\:h-1\/1 {
    height: 100% !important
  }
}


/*** Active ***/
.is-active-yes {
  max-height: 100% !important
}

.is-active-no {
  max-height: none !important
}

@media (min-width: 1199px) {
  .xl\:is-active-yes {
    max-height: 100% !important
  }

  .xl\:is-active-no {
    max-height: none !important
  }
}

@media (min-width: 991px) {
  .lg\:is-active-yes {
    max-height: 100% !important
  }

  .lg\:is-active-no {
    max-height: none !important
  }
}

@media (min-width: 767px) {
  .md\:is-active-yes {
    max-height: 100% !important
  }

  .md\:is-active-no {
    max-height: none !important
  }
}

@media (min-width: 575px) {
  .sm\:is-active-yes {
    max-height: 100% !important
  }

  .sm\:is-active-no {
    max-height: none !important
  }
}

/*** Flex ***/
.flex-column {
  flex-direction: column
}

.flex-center {
  display: flex;
  justify-content: center;
  align-items: center
}

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

.flex-row-reverse {
  flex-wrap: row-reverse !important;
}

.flex-row {
  flex-direction: row !important;
}

@media (max-width: 1199px) {
  .xl\:flex-column {
    flex-direction: column !important
  }

  .xl\:flex-wrap {
    flex-wrap: wrap !important;
  }

  .xl\:flex-row-reverse {
    flex-wrap: row-reverse !important;
  }

  .xl\:flex-row {
    flex-direction: row !important;
  }
}

@media (max-width: 991px) {
  .lg\:flex-column {
    flex-direction: column !important
  }

  .lg\:flex-wrap {
    flex-wrap: wrap !important;
  }

  .lg\:flex-row-reverse {
    flex-wrap: row-reverse !important;
  }

  .lg\:flex-row {
    flex-direction: row !important;
  }
}

@media (max-width: 767px) {
  .md\:flex-column {
    flex-direction: column !important
  }

  .md\:flex-wrap {
    flex-wrap: wrap !important;
  }

  .md\:flex-row-reverse {
    flex-wrap: row-reverse !important;
  }

  .md\:flex-row {
    flex-direction: row !important;
  }
}

@media (max-width: 575px) {
  .sm\:flex-column {
    flex-direction: column !important
  }

  .sm\:flex-wrap {
    flex-wrap: wrap !important;
  }

  .sm\:flex-row-reverse {
    flex-wrap: row-reverse !important;
  }

  .sm\:flex-row {
    flex-direction: row !important;
  }
}

.justify-start {
  justify-content: flex-start !important
}

.justify-end {
  justify-content: flex-end !important
}

.justify-center {
  justify-content: center !important
}

.justify-evenly {
  justify-content: space-evenly !important
}

.justify-between {
  justify-content: space-between !important
}

.items-start {
  align-items: flex-start !important
}

.items-end {
  align-items: flex-end !important
}

.items-center {
  align-items: center !important
}

@media (max-width: 1199px) {
  .xl\:justify-start {
    justify-content: flex-start !important
  }

  .xl\:justify-end {
    justify-content: flex-end !important
  }

  .xl\:justify-center {
    justify-content: center !important
  }

  .xl\:justify-evenly {
    justify-content: space-evenly !important
  }

  .xl\:justify-between {
    justify-content: space-between !important
  }

  .xl\:items-start {
    align-items: flex-start !important
  }

  .xl\:items-end {
    align-items: flex-end !important
  }

  .xl\:items-center {
    align-items: center !important
  }
}

@media (max-width: 991px) {
  .lg\:justify-start {
    justify-content: flex-start !important
  }

  .lg\:justify-end {
    justify-content: flex-end !important
  }

  .lg\:justify-center {
    justify-content: center !important
  }

  .lg\:justify-evenly {
    justify-content: space-evenly !important
  }

  .lg\:justify-between {
    justify-content: space-between !important
  }

  .lg\:items-start {
    align-items: flex-start !important
  }

  .lg\:items-end {
    align-items: flex-end !important
  }

  .lg\:items-center {
    align-items: center !important
  }
}

@media (max-width: 767px) {
  .md\:justify-start {
    justify-content: flex-start !important
  }

  .md\:justify-end {
    justify-content: flex-end !important
  }

  .md\:justify-center {
    justify-content: center !important
  }

  .md\:justify-evenly {
    justify-content: space-evenly !important
  }

  .md\:justify-between {
    justify-content: space-between !important
  }

  .md\:items-start {
    align-items: flex-start !important
  }

  .md\:items-end {
    align-items: flex-end !important
  }

  .md\:items-center {
    align-items: center !important
  }
}

@media (max-width: 575px) {
  .sm\:justify-start {
    justify-content: flex-start !important
  }

  .sm\:justify-end {
    justify-content: flex-end !important
  }

  .sm\:justify-center {
    justify-content: center !important
  }

  .sm\:justify-evenly {
    justify-content: space-evenly !important
  }

  .sm\:justify-between {
    justify-content: space-between !important
  }

  .sm\:items-start {
    align-items: flex-start !important
  }

  .sm\:items-end {
    align-items: flex-end !important
  }

  .sm\:items-center {
    align-items: center !important
  }
}

/*** Order ***/
.order-1 {
  order: 1 !important
}

.order-2 {
  order: 2 !important
}

.order-3 {
  order: 3 !important
}

@media (max-width: 1199px) {
  .xl\:order-1 {
    order: 1 !important
  }

  .xl\:order-2 {
    order: 2 !important
  }

  .xl\:order-3 {
    order: 3 !important
  }
}

@media (max-width: 991px) {
  .lg\:order-1 {
    order: 1 !important
  }

  .lg\:order-2 {
    order: 2 !important
  }

  .lg\:order-3 {
    order: 3 !important
  }
}

@media (max-width: 767px) {
  .md\:order-1 {
    order: 1 !important
  }

  .md\:order-2 {
    order: 2 !important
  }

  .md\:order-3 {
    order: 3 !important
  }
}

@media (max-width: 575px) {
  .sm\:order-1 {
    order: 1 !important
  }

  .sm\:order-2 {
    order: 2 !important
  }

  .sm\:order-3 {
    order: 3 !important
  }
}

/*** Dispalay ***/
.d-none {
  display: none !important
}

.d-flex {
  display: flex !important
}

.d-block {
  display: block !important
}

.d-inline-block {
  display: inline-block !important
}

@media (max-width: 1300px) {
  .xxl\:d-none {
    display: none !important
  }
}

@media (max-width: 1199px) {
  .xl\:d-none {
    display: none !important
  }

  .xl\:d-inline-block {
    display: inline-block !important
  }

  .xl\:d-block {
    display: block !important
  }

  .xl\:d-flex {
    display: flex !important
  }
}

@media (max-width: 991px) {
  .lg\:d-none {
    display: none !important
  }

  .lg\:d-inline-block {
    display: inline-block !important
  }

  .lg\:d-block {
    display: block !important
  }

  .lg\:d-flex {
    display: flex !important
  }
}

@media (max-width: 767px) {
  .md\:d-none {
    display: none !important
  }

  .md\:d-inline-block {
    display: inline-block !important
  }

  .md\:d-block {
    display: block !important
  }

  .md\:d-flex {
    display: flex !important
  }
}

@media (max-width: 575px) {
  .sm\:d-none {
    display: none !important
  }

  .sm\:d-inline-block {
    display: inline-block !important
  }

  .sm\:d-block {
    display: block !important
  }

  ratio-1 .sm\:d-flex {
    display: flex !important
  }
}

/*** Scrool Snap ***/
.scroll-x-snap {
  flex-shrink: 0;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-items: center;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-color: #aaa rgba(0, 0, 0, 0);
  scrollbar-width: thin;
  margin: 0;
}

.scroll-x-snap-item {
  display: grid;
  cursor: pointer;
  scroll-snap-stop: always;
  user-select: none;
}

.scroll-x-snap-item-1 {
  width: 100% !important;
  flex: 1 0 100%;
}

.scroll-x-snap-item-2 {
  width: 50% !important;
  flex: 1 0 50%;
}

.scroll-x-snap-item-3 {
  width: 33% !important;
  flex: 1 0 33%;
}

.scroll-x-snap-item-4 {
  width: 25% !important;
  flex: 1 0 25%;
}

.scroll-x-snap-item-5 {
  width: 20% !important;
  flex: 1 0 20%;
}

.scroll-x-snap-item-6 {
  width: 16% !important;
  flex: 1 0 16%;
}

.scroll-x-snap-item-7 {
  width: 14% !important;
  flex: 1 0 14%;
}

.scroll-x-snap-item-8 {
  width: 12% !important;
  flex: 1 0 12%;
}

.scroll-x-snap-item-9 {
  width: 11% !important;
  flex: 1 0 11%;
}

.scroll-x-snap-item-10 {
  width: 10% !important;
  flex: 1 0 10%;
}

.scroll-x-snap-item-11 {
  width: 9% !important;
  flex: 1 0 9%;
}

.scroll-x-snap-item-12 {
  width: 8% !important;
  flex: 1 0 8%;
}

@media (max-width: 1199px) {
  .xl\:scroll-x-snap-item-1 {
    width: 100% !important;
    flex: 1 0 100%;
  }

  .xl\:scroll-x-snap-item-2 {
    width: 50% !important;
    flex: 1 0 50%;
  }

  .xl\:scroll-x-snap-item-3 {
    width: 33% !important;
    flex: 1 0 33%;
  }

  .xl\:scroll-x-snap-item-4 {
    width: 25% !important;
    flex: 1 0 25%;
  }

  .xl\:scroll-x-snap-item-5 {
    width: 20% !important;
    flex: 1 0 20%;
  }

  .xl\:scroll-x-snap-item-6 {
    width: 16% !important;
    flex: 1 0 16%;
  }

  .xl\:scroll-x-snap-item-7 {
    width: 14% !important;
    flex: 1 0 14%;
  }

  .xl\:scroll-x-snap-item-8 {
    width: 12% !important;
    flex: 1 0 12%;
  }

  .xl\:scroll-x-snap-item-9 {
    width: 11% !important;
    flex: 1 0 11%;
  }

  .xl\:scroll-x-snap-item-10 {
    width: 10% !important;
    flex: 1 0 10%;
  }

  .xl\:scroll-x-snap-item-11 {
    width: 9% !important;
    flex: 1 0 9%;
  }

  .xl\:scroll-x-snap-item-12 {
    width: 8% !important;
    flex: 1 0 8%;
  }
}

@media (max-width: 991px) {
  .lg\:scroll-x-snap-item-1 {
    width: 100% !important;
    flex: 1 0 100%;
  }

  .lg\:scroll-x-snap-item-2 {
    width: 50% !important;
    flex: 1 0 50%;
  }

  .lg\:scroll-x-snap-item-3 {
    width: 33% !important;
    flex: 1 0 33%;
  }

  .lg\:scroll-x-snap-item-4 {
    width: 25% !important;
    flex: 1 0 25%;
  }

  .lg\:scroll-x-snap-item-5 {
    width: 20% !important;
    flex: 1 0 20%;
  }

  .lg\:scroll-x-snap-item-6 {
    width: 16% !important;
    flex: 1 0 16%;
  }

  .lg\:scroll-x-snap-item-7 {
    width: 14% !important;
    flex: 1 0 14%;
  }

  .lg\:scroll-x-snap-item-8 {
    width: 12% !important;
    flex: 1 0 12%;
  }

  .lg\:scroll-x-snap-item-9 {
    width: 11% !important;
    flex: 1 0 11%;
  }

  .lg\:scroll-x-snap-item-10 {
    width: 10% !important;
    flex: 1 0 10%;
  }

  .lg\:scroll-x-snap-item-11 {
    width: 9% !important;
    flex: 1 0 9%;
  }

  .lg\:scroll-x-snap-item-12 {
    width: 8% !important;
    flex: 1 0 8%;
  }
}

@media (max-width: 767px) {
  .md\:scroll-x-snap-item-1 {
    width: 100% !important;
    flex: 1 0 100%;
  }

  .md\:scroll-x-snap-item-2 {
    width: 50% !important;
    flex: 1 0 50%;
  }

  .md\:scroll-x-snap-item-3 {
    width: 33% !important;
    flex: 1 0 33%;
  }

  .md\:scroll-x-snap-item-4 {
    width: 25% !important;
    flex: 1 0 25%;
  }

  .md\:scroll-x-snap-item-5 {
    width: 20% !important;
    flex: 1 0 20%;
  }

  .md\:scroll-x-snap-item-6 {
    width: 16% !important;
    flex: 1 0 16%;
  }

  .md\:scroll-x-snap-item-7 {
    width: 14% !important;
    flex: 1 0 14%;
  }

  .md\:scroll-x-snap-item-8 {
    width: 12% !important;
    flex: 1 0 12%;
  }

  .md\:scroll-x-snap-item-9 {
    width: 11% !important;
    flex: 1 0 11%;
  }

  .md\:scroll-x-snap-item-10 {
    width: 10% !important;
    flex: 1 0 10%;
  }

  .md\:scroll-x-snap-item-11 {
    width: 9% !important;
    flex: 1 0 9%;
  }

  .md\:scroll-x-snap-item-12 {
    width: 8% !important;
    flex: 1 0 8%;
  }
}

@media (max-width: 575px) {
  .sm\:scroll-x-snap-item-1 {
    width: 100% !important;
    flex: 1 0 100%;
  }

  .sm\:scroll-x-snap-item-2 {
    width: 50% !important;
    flex: 1 0 50%;
  }

  .sm\:scroll-x-snap-item-3 {
    width: 33% !important;
    flex: 1 0 33%;
  }

  .sm\:scroll-x-snap-item-4 {
    width: 25% !important;
    flex: 1 0 25%;
  }

  .sm\:scroll-x-snap-item-5 {
    width: 20% !important;
    flex: 1 0 20%;
  }

  .sm\:scroll-x-snap-item-6 {
    width: 16% !important;
    flex: 1 0 16%;
  }

  .sm\:scroll-x-snap-item-7 {
    width: 14% !important;
    flex: 1 0 14%;
  }

  .sm\:scroll-x-snap-item-8 {
    width: 12% !important;
    flex: 1 0 12%;
  }

  .sm\:scroll-x-snap-item-9 {
    width: 11% !important;
    flex: 1 0 11%;
  }

  .sm\:scroll-x-snap-item-10 {
    width: 10% !important;
    flex: 1 0 10%;
  }

  .sm\:scroll-x-snap-item-11 {
    width: 9% !important;
    flex: 1 0 9%;
  }

  .sm\:scroll-x-snap-item-12 {
    width: 8% !important;
    flex: 1 0 8%;
  }
}

/*** Grid ***/
.g-1fr-1 {
  grid-template-columns: 1fr !important
}

.g-1fr-2 {
  grid-template-columns: 1fr 1fr !important
}

.g-1fr-3 {
  grid-template-columns: 1fr 1fr 1fr !important
}

.g-1fr-4 {
  grid-template-columns: 1fr 1fr 1fr 1fr !important
}

.g-1fr-5 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important
}

.g-1fr-6 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
}

.g-1fr-7 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
}

.g-1fr-8 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
}

.g-1fr-9 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
}

.g-1fr-10 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
}

.g-1fr-11 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
}

.g-1fr-12 {
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
}

@media (max-width: 1300px) {
  .xxl\:g-1fr-1 {
    grid-template-columns: 1fr !important
  }

  .xxl\:g-1fr-2 {
    grid-template-columns: 1fr 1fr !important
  }

  .xxl\:g-1fr-3 {
    grid-template-columns: 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-5 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-7 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-8 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-9 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-10 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-11 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xxl\:g-1fr-12 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  d-none {
    display: none !important
  }
}

@media (max-width: 1199px) {
  .xl\:g-1fr-1 {
    grid-template-columns: 1fr !important
  }

  .xl\:g-1fr-2 {
    grid-template-columns: 1fr 1fr !important
  }

  .xl\:g-1fr-3 {
    grid-template-columns: 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-5 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-7 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-8 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-9 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-10 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-11 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .xl\:g-1fr-12 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  d-none {
    display: none !important
  }
}

@media (max-width: 991px) {
  .lg\:g-1fr-1 {
    grid-template-columns: 1fr !important
  }

  .lg\:g-1fr-2 {
    grid-template-columns: 1fr 1fr !important
  }

  .lg\:g-1fr-3 {
    grid-template-columns: 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-5 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-7 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-8 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-9 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-10 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-11 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .lg\:g-1fr-12 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  d-none {
    display: none !important
  }
}

@media (max-width: 767px) {
  .md\:g-1fr-1 {
    grid-template-columns: 1fr !important
  }

  .md\:g-1fr-2 {
    grid-template-columns: 1fr 1fr !important
  }

  .md\:g-1fr-3 {
    grid-template-columns: 1fr 1fr 1fr !important
  }

  .md\:g-1fr-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr !important
  }

  .md\:g-1fr-5 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important
  }

  .md\:g-1fr-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .md\:g-1fr-7 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .md\:g-1fr-8 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .md\:g-1fr-9 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .md\:g-1fr-10 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .md\:g-1fr-11 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .md\:g-1fr-12 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  d-none {
    display: none !important
  }
}

@media (max-width: 575px) {
  .sm\:g-1fr-1 {
    grid-template-columns: 1fr !important
  }

  .sm\:g-1fr-2 {
    grid-template-columns: 1fr 1fr !important
  }

  .sm\:g-1fr-3 {
    grid-template-columns: 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-4 {
    grid-template-columns: 1fr 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-5 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-6 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-7 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-8 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-9 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-10 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-11 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  .sm\:g-1fr-12 {
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr !important
  }

  d-none {
    display: none !important
  }
}

/*** General ***/
.html-overflow-hidden {
  overflow: hidden !important
}

.html-overflow-hidden body {
  overflow-y: scroll
}

.origin-top {
  transform-origin: top !important
}

.origin-left {
  transform-origin: left !important
}

.overflow-scroll {
  overflow: scroll !important
}

.overflow-y-scroll {
  overflow-y: scroll !important
}

.overflow-x-scroll {
  overflow-x: scroll !important
}

.overflow-hidden {
  overflow: hidden !important
}

.overflow-normal {
  overflow: initial !important
}

.overflow-visible {
  overflow: visible !important
}

.pointer-events-auto {
  pointer-events: auto !important
}

.pointer-events-none {
  pointer-events: none !important
}

.bg-image {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center center;
  width: 100%;
  height: 100%
}

.img-ratio {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover
}

.line-through {
  text-decoration: line-through
}

.underline {
  text-decoration: underline
}

.italic {
  font-style: italic
}

.uppercase {
  text-transform: uppercase
}

.capitalize {
  text-transform: capitalize
}

.normal {
  text-transform: none
}

.after-none:after {
  display: none !important;
}

.before-none:before {
  display: none !important;
}

.mt-n1px {
  margin-top: -1px;
}

/*** Object ***/
.object-fit-cover {
  object-fit: cover !important
}

.object-fit-contain {
  object-fit: contain !important
}

.object-fit-fill {
  object-fit: fill !important
}

.object-fit-none {
  object-fit: none !important
}

.object-position-center {
  object-position: center !important
}

.object-position-top {
  object-position: top !important
}

.object-position-bottom {
  object-position: bottom !important
}

.object-position-left {
  object-position: left !important
}

.object-position-right {
  object-position: right !important
}


/*** rounded ***/
.rounded-0 {
  border-radius: 0 !important
}

.rounded-4 {
  border-radius: 4px !important
}

.rounded-8 {
  border-radius: 8px !important
}

.rounded-10 {
  border-radius: 10px !important
}

.rounded-12 {
  border-radius: 12px !important
}

.rounded-16 {
  border-radius: 16px !important
}

.rounded-18 {
  border-radius: 18px !important
}

.rounded-20 {
  border-radius: 20px !important
}

.rounded-22 {
  border-radius: 22px !important
}

.rounded-40 {
  border-radius: 40px !important
}

.rounded-50 {
  border-radius: 50px !important
}

.rounded-60 {
  border-radius: 60px !important
}

.rounded-70 {
  border-radius: 70px !important
}

.rounded-100 {
  border-radius: 100px !important
}

.rounded-full {
  border-radius: 100% !important
}

.rounded-right-6 {
  border-radius: 0 6px 6px 0 !important
}

.rounded-right-12 {
  border-radius: 0 12px 12px 0 !important
}

.rounded-right-16 {
  border-radius: 0 16px 16px 0 !important
}

.rounded-left-6 {
  border-radius: 6px 0 0 6px !important
}

.rounded-left-bottom-6 {
  border-radius: 0 0 0 6px !important
}

.rounded-b-r-4 {
  border-bottom-right-radius: 4px;
}

.rounded-b-r-6 {
  border-bottom-right-radius: 6px;
}

.rounded-b-r-8 {
  border-bottom-right-radius: 8px;
}

.rounded-b-r-10 {
  border-bottom-right-radius: 10px;
}

.rounded-b-r-12 {
  border-bottom-right-radius: 12px;
}

.rounded-b-r-16 {
  border-bottom-right-radius: 16px;
}

.rounded-b-r-18 {
  border-bottom-right-radius: 18px;
}

.rounded-b-r-20 {
  border-bottom-right-radius: 20px;
}

.rounded-b-r-24 {
  border-bottom-right-radius: 24px;
}

.rounded-b-r-30 {
  border-bottom-right-radius: 30px;
}

@media (max-width: 1199px) {
  .xl\:rounded-0 {
    border-radius: 0 !important
  }

  .xl\:rounded-4 {
    border-radius: 4px !important
  }

  .xl\:rounded-8 {
    border-radius: 8px !important
  }

  .xl\:rounded-10 {
    border-radius: 10px !important
  }

  .xl\:rounded-12 {
    border-radius: 12px !important
  }

  .xl\:rounded-16 {
    border-radius: 16px !important
  }

  .xl\:rounded-18 {
    border-radius: 18px !important
  }

  .xl\:rounded-20 {
    border-radius: 20px !important
  }

  .xl\:rounded-22 {
    border-radius: 22px !important
  }

  .xl\:rounded-40 {
    border-radius: 40px !important
  }

  .xl\:rounded-50 {
    border-radius: 50px !important
  }

  .xl\:rounded-60 {
    border-radius: 60px !important
  }

  .xl\:rounded-70 {
    border-radius: 70px !important
  }

  .xl\:rounded-100 {
    border-radius: 100px !important
  }

  .xl\:rounded-full {
    border-radius: 100% !important
  }
}

@media (max-width: 991px) {
  .lg\:rounded-0 {
    border-radius: 0 !important
  }

  .lg\:rounded-4 {
    border-radius: 4px !important
  }

  .lg\:rounded-8 {
    border-radius: 8px !important
  }

  .lg\:rounded-10 {
    border-radius: 10px !important
  }

  .lg\:rounded-12 {
    border-radius: 12px !important
  }

  .lg\:rounded-16 {
    border-radius: 16px !important
  }

  .lg\:rounded-18 {
    border-radius: 18px !important
  }

  .lg\:rounded-20 {
    border-radius: 20px !important
  }

  .lg\:rounded-22 {
    border-radius: 22px !important
  }

  .lg\:rounded-40 {
    border-radius: 40px !important
  }

  .lg\:rounded-50 {
    border-radius: 50px !important
  }

  .lg\:rounded-60 {
    border-radius: 60px !important
  }

  .lg\:rounded-70 {
    border-radius: 70px !important
  }

  .lg\:rounded-100 {
    border-radius: 100px !important
  }

  .lg\:rounded-full {
    border-radius: 100% !important
  }
}

@media (max-width: 767px) {
  .md\:rounded-0 {
    border-radius: 0 !important
  }

  .md\:rounded-4 {
    border-radius: 4px !important
  }

  .md\:rounded-8 {
    border-radius: 8px !important
  }

  .md\:rounded-10 {
    border-radius: 10px !important
  }

  .md\:rounded-12 {
    border-radius: 12px !important
  }

  .md\:rounded-16 {
    border-radius: 16px !important
  }

  .md\:rounded-18 {
    border-radius: 18px !important
  }

  .md\:rounded-20 {
    border-radius: 20px !important
  }

  .md\:rounded-22 {
    border-radius: 22px !important
  }

  .md\:rounded-40 {
    border-radius: 40px !important
  }

  .md\:rounded-50 {
    border-radius: 50px !important
  }

  .md\:rounded-60 {
    border-radius: 60px !important
  }

  .md\:rounded-70 {
    border-radius: 70px !important
  }

  .md\:rounded-100 {
    border-radius: 100px !important
  }

  .md\:rounded-full {
    border-radius: 100% !important
  }
}

@media (max-width: 575px) {
  .sm\:rounded-0 {
    border-radius: 0 !important
  }

  .sm\:rounded-4 {
    border-radius: 4px !important
  }

  .sm\:rounded-8 {
    border-radius: 8px !important
  }

  .sm\:rounded-10 {
    border-radius: 10px !important
  }

  .sm\:rounded-12 {
    border-radius: 12px !important
  }

  .sm\:rounded-16 {
    border-radius: 16px !important
  }

  .sm\:rounded-18 {
    border-radius: 18px !important
  }

  .sm\:rounded-20 {
    border-radius: 20px !important
  }

  .sm\:rounded-22 {
    border-radius: 22px !important
  }

  .sm\:rounded-40 {
    border-radius: 40px !important
  }

  .sm\:rounded-50 {
    border-radius: 50px !important
  }

  .sm\:rounded-60 {
    border-radius: 60px !important
  }

  .sm\:rounded-70 {
    border-radius: 70px !important
  }

  .sm\:rounded-100 {
    border-radius: 100px !important
  }

  .sm\:rounded-full {
    border-radius: 100% !important
  }
}

/*** Border ***/
@media (max-width: 991px) {
  .lg\:border-none {
    border: none !important
  }
}

.border-type-1 {
  border: 1px dashed var(--color-blue-1)
}

.border-top-light {
  border-top: 1px solid var(--color-border)
}

.border-left-light {
  border-left: 1px solid var(--color-border)
}

.border-bottom-light {
  border-bottom: 1px solid var(--color-border)
}

.border-white {
  border: 1px solid #fff
}

.border-dark-1 {
  border: 1px solid var(--color-dark-1)
}

.border-dark-2 {
  border: 1px solid var(--color-dark-2)
}

.border-dark-3 {
  border: 1px solid var(--color-dark-3)
}

.border-dark-4 {
  border: 1px solid var(--color-dark-4)
}

.border-blue-1 {
  border: 1px solid var(--color-blue-1)
}

.border-color-yellow-1 {
  border-color: var(--color-yellow-1) !important;
}

.border-color-yellow-2 {
  border-color: var(--color-yellow-2) !important;
}

.border-color-blue-1 {
  border-color: var(--color-blue-1) !important;
}

.border-color-blue-2 {
  border-color: var(--color-blue-2) !important;
}

.border-white-15 {
  border: 1px solid rgba(255, 255, 255, 0.15)
}

.border-white-25 {
  border: 1px solid rgba(255, 255, 255, 0.25)
}

.border-white-50 {
  border: 1px solid rgba(255, 255, 255, 0.50)
}

.border-white-75 {
  border: 1px solid rgba(255, 255, 255, 0.75)
}

.border-black-05 {
  border: 1px solid rgba(000, 000, 000, 0.05)
}

.border-black-15 {
  border: 1px solid rgba(000, 000, 000, 0.15)
}

.border-black-25 {
  border: 1px solid rgba(000, 000, 000, 0.25)
}

.border-black-50 {
  border: 1px solid rgba(000, 000, 000, 0.50)
}

.border-black-75 {
  border: 1px solid rgba(000, 000, 000, 0.75)
}

.border-top-white-15 {
  border-top: 1px solid rgba(255, 255, 255, 0.15)
}

.border-light {
  border: 1px solid var(--color-border) !important
}

.border-red-2 {
  border: 2px solid var(--color-red-1) !important;
}

.border-gray-2 {
  border: 2px solid var(--color-gray-1) !important;
}

.border-yellow-2 {
  border: 2px solid var(--color-yellow-1) !important;
}

.border-green-2 {
  border: 2px solid var(--color-green-1) !important;
}

.border-blue-1 {
  border: 1px solid var(--color-blue-1) !important;
}

.border-blue-2 {
  border: 1px solid var(--color-blue-2) !important;
}

.border-blue-3 {
  border: 1px solid var(--color-blue-3) !important;
}

.border-blue-4 {
  border: 1px solid var(--color-blue-4) !important;
}

.border-blue-5 {
  border: 1px solid var(--color-blue-5) !important;
}

.border-purple-1 {
  border: 1px solid var(--color-purple-1) !important;
}

.border-purple-2 {
  border: 1px solid var(--color-purple-2) !important;
}

.border-purple-3 {
  border: 1px solid var(--color-purple-3) !important;
}

.border-purple-4 {
  border: 1px solid var(--color-purple-4) !important;
}

.border-purple-5 {
  border: 1px solid var(--color-purple-5) !important;
}

.border-red1 {
  border: 1px solid var(--color-red-1) !important;
}

.border-red2 {
  border: 1px solid var(--color-red-2) !important;
}

.border-red3 {
  border: 1px solid var(--color-red-3) !important;
}

.border-red4 {
  border: 1px solid var(--color-red-4) !important;
}

.border-red5 {
  border: 1px solid var(--color-red-5) !important;
}

.border-error1 {
  border: 1px solid var(--color-error-1) !important;
}

.border-error2 {
  border: 1px solid var(--color-error-2) !important;
}

.border-gray1 {
  border: 1px solid var(--color-gray-1) !important;
}

.border-gray2 {
  border: 1px solid var(--color-gray-2) !important;
}

.border-gray3 {
  border: 1px solid var(--color-gray-3) !important;
}

.border-light-1 {
  border: 1px solid var(--color-light-1) !important;
}

.border-light-2 {
  border: 1px solid var(--color-light-2) !important;
}

.border-light-3 {
  border: 1px solid var(--color-light-3) !important;
}

.border-green1 {
  border: 1px solid var(--color-green-1);
}

.border-green2 {
  border: 1px solid var(--color-green-2);
}

.border-green3 {
  border: 1px solid var(--color-green-3);
}

.border-green4 {
  border: 1px solid var(--color-green-4);
}

.border-green5 {
  border: 1px solid var(--color-green-5);
}

.border-orange1 {
  border: 1px solid var(--color-orange-1);
}

.border-orange2 {
  border: 1px solid var(--color-orange-2);
}

.border-orange3 {
  border: 1px solid var(--color-orange-3);
}

.border-orange4 {
  border: 1px solid var(--color-orange-4);
}

.border-orange5 {
  border: 1px solid var(--color-orange-5);
}

.border-yellow1 {
  border: 1px solid var(--color-yellow-1);
}

.border-yellow2 {
  border: 1px solid var(--color-yellow-2);
}

.border-yellow3 {
  border: 1px solid var(--color-yellow-3);
}

.border-yellow4 {
  border: 1px solid var(--color-yellow-4);
}

.border-yellow5 {
  border: 1px solid var(--color-yellow-5);
}

.border-w2 {
  border-width: 2px !important
}

.border-w3 {
  border-width: 3px !important
}

.border-w4 {
  border-width: 4px !important
}

.border-w5 {
  border-width: 5px !important
}

.border-t-0 {
  border-top-width: 0px !important
}

.border-b-0 {
  border-bottom-width: 0px !important
}

.border-r-0 {
  border-right-width: 0px !important
}

.border-l-0 {
  border-left-width: 0px !important
}

.border-t-1 {
  border-width: 1px 0 0 0 !important
}

.border-b-1 {
  border-width: 0 0 1px 0 !important
}

.border-r-1 {
  border-width: 0 1px 0 0 !important
}

.border-l-1 {
  border-width: 0 0 0 1px !important
}


.border-s1 {
  border-width: 1px !important
}

.border-s2 {
  border-width: 2px !important
}

.border-s3 {
  border-width: 3px !important
}

.border-s4 {
  border-width: 4px !important
}

.border-s5 {
  border-width: 5px !important
}

/*** Opacity ***/
.opacity-1 {
  opacity: .1;
}

.opacity-2 {
  opacity: .2;
}

.opacity-3 {
  opacity: .3;
}

.opacity-4 {
  opacity: .4;
}

.opacity-5 {
  opacity: .5;
}

.opacity-6 {
  opacity: .6;
}

.opacity-7 {
  opacity: .7;
}

.opacity-8 {
  opacity: .8;
}

.opacity-9 {
  opacity: .9;
}

.opacity-10 {
  opacity: 10;
}

.opacity-none {
  opacity: 1 !important;
}


/*** Size W H ***/
.size-3 {
  flex-shrink: 0;
  width: 3px;
  height: 3px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-4 {
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-5 {
  flex-shrink: 0;
  width: 5px;
  height: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-8 {
  flex-shrink: 0;
  width: 8px;
  height: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-10 {
  flex-shrink: 0;
  width: 10px;
  height: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-12 {
  flex-shrink: 0;
  width: 12px;
  height: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-15 {
  flex-shrink: 0;
  width: 15px;
  height: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-18 {
  flex-shrink: 0;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-20 {
  flex-shrink: 0;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-25 {
  flex-shrink: 0;
  width: 25px;
  height: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-30 {
  flex-shrink: 0;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-35 {
  flex-shrink: 0;
  width: 35px;
  height: 35px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-38 {
  flex-shrink: 0;
  width: 38px;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-40 {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-45 {
  flex-shrink: 0;
  width: 45px;
  height: 45px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-55 {
  flex-shrink: 0;
  width: 55px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-50 {
  flex-shrink: 0;
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-60 {
  flex-shrink: 0;
  width: 60px;
  height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-65 {
  flex-shrink: 0;
  width: 65px;
  height: 65px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-70 {
  flex-shrink: 0;
  width: 70px;
  height: 70px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-80 {
  flex-shrink: 0;
  width: 80px;
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-90 {
  flex-shrink: 0;
  width: 90px;
  height: 90px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-100 {
  flex-shrink: 0;
  width: 100px;
  height: 100px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-110 {
  flex-shrink: 0;
  width: 110px;
  height: 110px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-120 {
  flex-shrink: 0;
  width: 120px;
  height: 120px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-130 {
  flex-shrink: 0;
  width: 130px;
  height: 130px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-140 {
  flex-shrink: 0;
  width: 140px;
  height: 140px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-160 {
  flex-shrink: 0;
  width: 160px;
  height: 160px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-180 {
  flex-shrink: 0;
  width: 180px;
  height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.size-250 {
  flex-shrink: 0;
  width: 250px;
  height: 250px;
  display: flex;
  align-items: center;
  justify-content: center;
}

@media (max-width: 1199px) {
  .xl\:size-3 {
    flex-shrink: 0;
    width: 3px;
    height: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-4 {
    flex-shrink: 0;
    width: 4px;
    height: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-5 {
    flex-shrink: 0;
    width: 5px;
    height: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-8 {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-10 {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-12 {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-15 {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-18 {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-20 {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-25 {
    flex-shrink: 0;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-30 {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-35 {
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-38 {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-40 {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-45 {
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-55 {
    flex-shrink: 0;
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-50 {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-60 {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-65 {
    flex-shrink: 0;
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-70 {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-80 {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-90 {
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-100 {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-110 {
    flex-shrink: 0;
    width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-120 {
    flex-shrink: 0;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-130 {
    flex-shrink: 0;
    width: 130px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-140 {
    flex-shrink: 0;
    width: 140px;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-160 {
    flex-shrink: 0;
    width: 160px;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-180 {
    flex-shrink: 0;
    width: 180px;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .xl\:size-250 {
    flex-shrink: 0;
    width: 250px;
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

@media (max-width: 991px) {
  .lg\:size-3 {
    flex-shrink: 0;
    width: 3px;
    height: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-4 {
    flex-shrink: 0;
    width: 4px;
    height: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-5 {
    flex-shrink: 0;
    width: 5px;
    height: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-8 {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-10 {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-12 {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-15 {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-18 {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-20 {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-25 {
    flex-shrink: 0;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-30 {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-35 {
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-38 {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-40 {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-45 {
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-55 {
    flex-shrink: 0;
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-50 {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-60 {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-65 {
    flex-shrink: 0;
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-70 {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-80 {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-90 {
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-100 {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-110 {
    flex-shrink: 0;
    width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-120 {
    flex-shrink: 0;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-130 {
    flex-shrink: 0;
    width: 130px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-140 {
    flex-shrink: 0;
    width: 140px;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-160 {
    flex-shrink: 0;
    width: 160px;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-180 {
    flex-shrink: 0;
    width: 180px;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .lg\:size-250 {
    flex-shrink: 0;
    width: 250px;
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

@media (max-width: 767px) {
  .md\:size-3 {
    flex-shrink: 0;
    width: 3px;
    height: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-4 {
    flex-shrink: 0;
    width: 4px;
    height: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-5 {
    flex-shrink: 0;
    width: 5px;
    height: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-8 {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-10 {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-12 {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-15 {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-18 {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-20 {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-25 {
    flex-shrink: 0;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-30 {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-35 {
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-38 {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-40 {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-45 {
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-55 {
    flex-shrink: 0;
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-50 {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-60 {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-65 {
    flex-shrink: 0;
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-70 {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-80 {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-90 {
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-100 {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-110 {
    flex-shrink: 0;
    width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-120 {
    flex-shrink: 0;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-130 {
    flex-shrink: 0;
    width: 130px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-140 {
    flex-shrink: 0;
    width: 140px;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-160 {
    flex-shrink: 0;
    width: 160px;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-180 {
    flex-shrink: 0;
    width: 180px;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .md\:size-250 {
    flex-shrink: 0;
    width: 250px;
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

@media (max-width: 575px) {
  .sm\:size-3 {
    flex-shrink: 0;
    width: 3px;
    height: 3px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-4 {
    flex-shrink: 0;
    width: 4px;
    height: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-5 {
    flex-shrink: 0;
    width: 5px;
    height: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-8 {
    flex-shrink: 0;
    width: 8px;
    height: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-10 {
    flex-shrink: 0;
    width: 10px;
    height: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-12 {
    flex-shrink: 0;
    width: 12px;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-15 {
    flex-shrink: 0;
    width: 15px;
    height: 15px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-18 {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-20 {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-25 {
    flex-shrink: 0;
    width: 25px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-30 {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-35 {
    flex-shrink: 0;
    width: 35px;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-38 {
    flex-shrink: 0;
    width: 38px;
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-40 {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-45 {
    flex-shrink: 0;
    width: 45px;
    height: 45px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-55 {
    flex-shrink: 0;
    width: 55px;
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-50 {
    flex-shrink: 0;
    width: 50px;
    height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-60 {
    flex-shrink: 0;
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-65 {
    flex-shrink: 0;
    width: 65px;
    height: 65px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-70 {
    flex-shrink: 0;
    width: 70px;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-80 {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-90 {
    flex-shrink: 0;
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-100 {
    flex-shrink: 0;
    width: 100px;
    height: 100px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-110 {
    flex-shrink: 0;
    width: 110px;
    height: 110px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-120 {
    flex-shrink: 0;
    width: 120px;
    height: 120px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-130 {
    flex-shrink: 0;
    width: 130px;
    height: 130px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-140 {
    flex-shrink: 0;
    width: 140px;
    height: 140px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-160 {
    flex-shrink: 0;
    width: 160px;
    height: 160px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-180 {
    flex-shrink: 0;
    width: 180px;
    height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sm\:size-250 {
    flex-shrink: 0;
    width: 250px;
    height: 250px;
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

/*** Box Shadow ***/
.shadow-0 {
  box-shadow: 0 0 0 0 transparent !important;
}

.shadow-1 {
  box-shadow: 0 20px 40px 0 #00000012;
}

.shadow-2 {
  box-shadow: 0 10px 35px 0 #0000001a
}

.shadow-3 {
  box-shadow: 0 10px 30px 0 #00000008
}

.shadow-4 {
  box-shadow: 0 10px 60px 0 #0510360D
}

.shadow-5 {
  box-shadow: 0 0px 40px 0 #00000057;
}

/*** H W ***/
.h-fit {
  height: fit-content !important
}

.h-full {
  height: 100% !important
}

.h-93 {
  height: 93% !important
}

.h-34 {
  height: 34px !important
}

.h-60 {
  height: 60px !important
}

.h-1 {
  height: 1px !important
}

.h-68 {
  height: 68px !important
}

.h-50 {
  height: 50px !important
}

.h-55 {
  height: 55px !important
}

.h-10 {
  height: 10px !important
}

.h-20 {
  height: 20px !important
}

.h-40 {
  height: 40px !important
}

.h-45 {
  height: 45px !important
}

.h-80 {
  height: 78px !important
}

.w-48 {
  width: 48px
}

.w-28 {
  width: 28px
}

.w-max-300 {
  max-width: 300px
}


/*** Min Widht ***/
.mnw-25 {
  min-width: 25px;
}

.mnw-35 {
  min-width: 35px;
}

.mnw-50 {
  min-width: 50px;
}

.mnw-75 {
  min-width: 75px;
}

.mnw-100 {
  min-width: 100px;
}

.mnw-150 {
  min-width: 150px;
}

.mnw-200 {
  min-width: 200px;
}

.mnw-250 {
  min-width: 250px;
}

.mnw-300 {
  min-width: 300px;
}

.mnw-350 {
  min-width: 350px;
}

.mnw-400 {
  min-width: 400px;
}

.mnw-450 {
  min-width: 450px;
}

.mnw-500 {
  min-width: 500px;
}

.mnw-600 {
  min-width: 600px;
}

.mnw-700 {
  min-width: 700px;
}

.mnw-800 {
  min-width: 800px;
}

.mnw-900 {
  min-width: 900px;
}

.mnw-1000 {
  min-width: 1000px;
}

@media (max-width: 1199px) {
  .xl\:mnw-25 {
    min-width: 25px;
  }

  .xl\:mnw-35 {
    min-width: 35px;
  }

  .xl\:mnw-50 {
    min-width: 50px;
  }

  .xl\:mnw-75 {
    min-width: 75px;
  }

  .xl\:mnw-100 {
    min-width: 100px;
  }

  .xl\:mnw-150 {
    min-width: 150px;
  }

  .xl\:mnw-200 {
    min-width: 200px;
  }

  .xl\:mnw-250 {
    min-width: 250px;
  }

  .xl\:mnw-300 {
    min-width: 300px;
  }

  .xl\:mnw-350 {
    min-width: 350px;
  }

  .xl\:mnw-400 {
    min-width: 400px;
  }

  .xl\:mnw-450 {
    min-width: 450px;
  }

  .xl\:mnw-500 {
    min-width: 500px;
  }

  .xl\:mnw-600 {
    min-width: 600px;
  }

  .xl\:mnw-700 {
    min-width: 700px;
  }

  .xl\:mnw-800 {
    min-width: 800px;
  }

  .xl\:mnw-900 {
    min-width: 900px;
  }

  .xl\:mnw-1000 {
    min-width: 1000px;
  }
}

@media (max-width: 991px) {
  .lg\:mnw-25 {
    min-width: 25px;
  }

  .lg\:mnw-35 {
    min-width: 35px;
  }

  .lg\:mnw-50 {
    min-width: 50px;
  }

  .lg\:mnw-75 {
    min-width: 75px;
  }

  .lg\:mnw-100 {
    min-width: 100px;
  }

  .lg\:mnw-150 {
    min-width: 150px;
  }

  .lg\:mnw-200 {
    min-width: 200px;
  }

  .lg\:mnw-250 {
    min-width: 250px;
  }

  .lg\:mnw-300 {
    min-width: 300px;
  }

  .lg\:mnw-350 {
    min-width: 350px;
  }

  .lg\:mnw-400 {
    min-width: 400px;
  }

  .lg\:mnw-450 {
    min-width: 450px;
  }

  .lg\:mnw-500 {
    min-width: 500px;
  }

  .lg\:mnw-600 {
    min-width: 600px;
  }

  .lg\:mnw-700 {
    min-width: 700px;
  }

  .lg\:mnw-800 {
    min-width: 800px;
  }

  .lg\:mnw-900 {
    min-width: 900px;
  }

  .lg\:mnw-1000 {
    min-width: 1000px;
  }
}

@media (max-width: 767px) {
  .md\:mnw-25 {
    min-width: 25px;
  }

  .md\:mnw-35 {
    min-width: 35px;
  }

  .md\:mnw-50 {
    min-width: 50px;
  }

  .md\:mnw-75 {
    min-width: 75px;
  }

  .md\:mnw-100 {
    min-width: 100px;
  }

  .md\:mnw-150 {
    min-width: 150px;
  }

  .md\:mnw-200 {
    min-width: 200px;
  }

  .md\:mnw-250 {
    min-width: 250px;
  }

  .md\:mnw-300 {
    min-width: 300px;
  }

  .md\:mnw-350 {
    min-width: 350px;
  }

  .md\:mnw-400 {
    min-width: 400px;
  }

  .md\:mnw-450 {
    min-width: 450px;
  }

  .md\:mnw-500 {
    min-width: 500px;
  }

  .md\:mnw-600 {
    min-width: 600px;
  }

  .md\:mnw-700 {
    min-width: 700px;
  }

  .md\:mnw-800 {
    min-width: 800px;
  }

  .md\:mnw-900 {
    min-width: 900px;
  }

  .md\:mnw-1000 {
    min-width: 1000px;
  }
}

@media (max-width: 575px) {
  .sm\:mnw-25 {
    min-width: 25px;
  }

  .sm\:mnw-35 {
    min-width: 35px;
  }

  .sm\:mnw-50 {
    min-width: 50px;
  }

  .sm\:mnw-75 {
    min-width: 75px;
  }

  .sm\:mnw-100 {
    min-width: 100px;
  }

  .sm\:mnw-150 {
    min-width: 150px;
  }

  .sm\:mnw-200 {
    min-width: 200px;
  }

  .sm\:mnw-250 {
    min-width: 250px;
  }

  .sm\:mnw-300 {
    min-width: 300px;
  }

  .sm\:mnw-350 {
    min-width: 350px;
  }

  .sm\:mnw-400 {
    min-width: 400px;
  }

  .sm\:mnw-450 {
    min-width: 450px;
  }

  .sm\:mnw-500 {
    min-width: 500px;
  }

  .sm\:mnw-600 {
    min-width: 600px;
  }

  .sm\:mnw-700 {
    min-width: 700px;
  }

  .sm\:mnw-800 {
    min-width: 800px;
  }

  .sm\:mnw-900 {
    min-width: 900px;
  }

  .sm\:mnw-1000 {
    min-width: 1000px;
  }
}

/*** Min Height ***/
.mnh-25 {
  min-height: 25px;
}

.mnh-35 {
  min-height: 35px;
}

.mnh-50 {
  min-height: 50px;
}

.mnh-75 {
  min-height: 75px;
}

.mnh-100 {
  min-height: 100px;
}

.mnh-150 {
  min-height: 150px;
}

.mnh-200 {
  min-height: 200px;
}

.mnh-250 {
  min-height: 250px;
}

.mnh-300 {
  min-height: 300px;
}

.mnh-350 {
  min-height: 350px;
}

.mnh-400 {
  min-height: 400px;
}

.mnh-450 {
  min-height: 450px;
}

.mnh-500 {
  min-height: 500px;
}

.mnh-600 {
  min-height: 600px;
}

.mnh-700 {
  min-height: 700px;
}

.mnh-800 {
  min-height: 800px;
}

.mnh-900 {
  min-height: 900px;
}

.mnh-1000 {
  min-height: 1000px;
}

@media (max-width: 1199px) {
  .xl\:mnh-25 {
    min-height: 25px;
  }

  .xl\:mnh-35 {
    min-height: 35px;
  }

  .xl\:mnh-50 {
    min-height: 50px;
  }

  .xl\:mnh-75 {
    min-height: 75px;
  }

  .xl\:mnh-100 {
    min-height: 100px;
  }

  .xl\:mnh-150 {
    min-height: 150px;
  }

  .xl\:mnh-200 {
    min-height: 200px;
  }

  .xl\:mnh-250 {
    min-height: 250px;
  }

  .xl\:mnh-300 {
    min-height: 300px;
  }

  .xl\:mnh-350 {
    min-height: 350px;
  }

  .xl\:mnh-400 {
    min-height: 400px;
  }

  .xl\:mnh-450 {
    min-height: 450px;
  }

  .xl\:mnh-500 {
    min-height: 500px;
  }

  .xl\:mnh-600 {
    min-height: 600px;
  }

  .xl\:mnh-700 {
    min-height: 700px;
  }

  .xl\:mnh-800 {
    min-height: 800px;
  }

  .xl\:mnh-900 {
    min-height: 900px;
  }

  .xl\:mnh-1000 {
    min-height: 1000px;
  }
}

@media (max-width: 991px) {
  .lg\:mnh-25 {
    min-height: 25px;
  }

  .lg\:mnh-35 {
    min-height: 35px;
  }

  .lg\:mnh-50 {
    min-height: 50px;
  }

  .lg\:mnh-75 {
    min-height: 75px;
  }

  .lg\:mnh-100 {
    min-height: 100px;
  }

  .lg\:mnh-150 {
    min-height: 150px;
  }

  .lg\:mnh-200 {
    min-height: 200px;
  }

  .lg\:mnh-250 {
    min-height: 250px;
  }

  .lg\:mnh-300 {
    min-height: 300px;
  }

  .lg\:mnh-350 {
    min-height: 350px;
  }

  .lg\:mnh-400 {
    min-height: 400px;
  }

  .lg\:mnh-450 {
    min-height: 450px;
  }

  .lg\:mnh-500 {
    min-height: 500px;
  }

  .lg\:mnh-600 {
    min-height: 600px;
  }

  .lg\:mnh-700 {
    min-height: 700px;
  }

  .lg\:mnh-800 {
    min-height: 800px;
  }

  .lg\:mnh-900 {
    min-height: 900px;
  }

  .lg\:mnh-1000 {
    min-height: 1000px;
  }
}

@media (max-width: 767px) {
  .md\:mnh-25 {
    min-height: 25px;
  }

  .md\:mnh-35 {
    min-height: 35px;
  }

  .md\:mnh-50 {
    min-height: 50px;
  }

  .md\:mnh-75 {
    min-height: 75px;
  }

  .md\:mnh-100 {
    min-height: 100px;
  }

  .md\:mnh-150 {
    min-height: 150px;
  }

  .md\:mnh-200 {
    min-height: 200px;
  }

  .md\:mnh-250 {
    min-height: 250px;
  }

  .md\:mnh-300 {
    min-height: 300px;
  }

  .md\:mnh-350 {
    min-height: 350px;
  }

  .md\:mnh-400 {
    min-height: 400px;
  }

  .md\:mnh-450 {
    min-height: 450px;
  }

  .md\:mnh-500 {
    min-height: 500px;
  }

  .md\:mnh-600 {
    min-height: 600px;
  }

  .md\:mnh-700 {
    min-height: 700px;
  }

  .md\:mnh-800 {
    min-height: 800px;
  }

  .md\:mnh-900 {
    min-height: 900px;
  }

  .md\:mnh-1000 {
    min-height: 1000px;
  }
}

@media (max-width: 575px) {
  .sm\:mnh-25 {
    min-height: 25px;
  }

  .sm\:mnh-35 {
    min-height: 35px;
  }

  .sm\:mnh-50 {
    min-height: 50px;
  }

  .sm\:mnh-75 {
    min-height: 75px;
  }

  .sm\:mnh-100 {
    min-height: 100px;
  }

  .sm\:mnh-150 {
    min-height: 150px;
  }

  .sm\:mnh-200 {
    min-height: 200px;
  }

  .sm\:mnh-250 {
    min-height: 250px;
  }

  .sm\:mnh-300 {
    min-height: 300px;
  }

  .sm\:mnh-350 {
    min-height: 350px;
  }

  .sm\:mnh-400 {
    min-height: 400px;
  }

  .sm\:mnh-450 {
    min-height: 450px;
  }

  .sm\:mnh-500 {
    min-height: 500px;
  }

  .sm\:mnh-600 {
    min-height: 600px;
  }

  .sm\:mnh-700 {
    min-height: 700px;
  }

  .sm\:mnh-800 {
    min-height: 800px;
  }

  .sm\:mnh-900 {
    min-height: 900px;
  }

  .sm\:mnh-1000 {
    min-height: 1000px;
  }
}

.mnh-wfa {
  min-height: -webkit-fill-available;
}

/*** Max Widht ***/
.mxw-25 {
  max-width: 25px;
}

.mxw-35 {
  max-width: 35px;
}

.mxw-50 {
  max-width: 50px;
}

.mxw-75 {
  max-width: 75px;
}

.mxw-100 {
  max-width: 100px;
}

.mxw-150 {
  max-width: 150px;
}

.mxw-200 {
  max-width: 200px;
}

.mxw-250 {
  max-width: 250px;
}

.mxw-300 {
  max-width: 300px;
}

.mxw-350 {
  max-width: 350px;
}

.mxw-400 {
  max-width: 400px;
}

.mxw-450 {
  max-width: 450px;
}

.mxw-500 {
  max-width: 500px;
}

.mxw-600 {
  max-width: 600px;
}

.mxw-700 {
  max-width: 700px;
}

.mxw-800 {
  max-width: 800px;
}

.mxw-900 {
  max-width: 900px;
}

.mxw-1000 {
  max-width: 1000px;
}

@media (max-width: 1199px) {
  .xl\:mxw-25 {
    max-width: 25px;
  }

  .xl\:mxw-35 {
    max-width: 35px;
  }

  .xl\:mxw-50 {
    max-width: 50px;
  }

  .xl\:mxw-75 {
    max-width: 75px;
  }

  .xl\:mxw-100 {
    max-width: 100px;
  }

  .xl\:mxw-150 {
    max-width: 150px;
  }

  .xl\:mxw-200 {
    max-width: 200px;
  }

  .xl\:mxw-250 {
    max-width: 250px;
  }

  .xl\:mxw-300 {
    max-width: 300px;
  }

  .xl\:mxw-350 {
    max-width: 350px;
  }

  .xl\:mxw-400 {
    max-width: 400px;
  }

  .xl\:mxw-450 {
    max-width: 450px;
  }

  .xl\:mxw-500 {
    max-width: 500px;
  }

  .xl\:mxw-600 {
    max-width: 600px;
  }

  .xl\:mxw-700 {
    max-width: 700px;
  }

  .xl\:mxw-800 {
    max-width: 800px;
  }

  .xl\:mxw-900 {
    max-width: 900px;
  }

  .xl\:mxw-1000 {
    max-width: 1000px;
  }
}

@media (max-width: 991px) {
  .lg\:mxw-25 {
    max-width: 25px;
  }

  .lg\:mxw-35 {
    max-width: 35px;
  }

  .lg\:mxw-50 {
    max-width: 50px;
  }

  .lg\:mxw-75 {
    max-width: 75px;
  }

  .lg\:mxw-100 {
    max-width: 100px;
  }

  .lg\:mxw-150 {
    max-width: 150px;
  }

  .lg\:mxw-200 {
    max-width: 200px;
  }

  .lg\:mxw-250 {
    max-width: 250px;
  }

  .lg\:mxw-300 {
    max-width: 300px;
  }

  .lg\:mxw-350 {
    max-width: 350px;
  }

  .lg\:mxw-400 {
    max-width: 400px;
  }

  .lg\:mxw-450 {
    max-width: 450px;
  }

  .lg\:mxw-500 {
    max-width: 500px;
  }

  .lg\:mxw-600 {
    max-width: 600px;
  }

  .lg\:mxw-700 {
    max-width: 700px;
  }

  .lg\:mxw-800 {
    max-width: 800px;
  }

  .lg\:mxw-900 {
    max-width: 900px;
  }

  .lg\:mxw-1000 {
    max-width: 1000px;
  }
}

@media (max-width: 767px) {
  .md\:mxw-25 {
    max-width: 25px;
  }

  .md\:mxw-35 {
    max-width: 35px;
  }

  .md\:mxw-50 {
    max-width: 50px;
  }

  .md\:mxw-75 {
    max-width: 75px;
  }

  .md\:mxw-100 {
    max-width: 100px;
  }

  .md\:mxw-150 {
    max-width: 150px;
  }

  .md\:mxw-200 {
    max-width: 200px;
  }

  .md\:mxw-250 {
    max-width: 250px;
  }

  .md\:mxw-300 {
    max-width: 300px;
  }

  .md\:mxw-350 {
    max-width: 350px;
  }

  .md\:mxw-400 {
    max-width: 400px;
  }

  .md\:mxw-450 {
    max-width: 450px;
  }

  .md\:mxw-500 {
    max-width: 500px;
  }

  .md\:mxw-600 {
    max-width: 600px;
  }

  .md\:mxw-700 {
    max-width: 700px;
  }

  .md\:mxw-800 {
    max-width: 800px;
  }

  .md\:mxw-900 {
    max-width: 900px;
  }

  .md\:mxw-1000 {
    max-width: 1000px;
  }
}

@media (max-width: 575px) {
  .sm\:mxw-25 {
    max-width: 25px;
  }

  .sm\:mxw-35 {
    max-width: 35px;
  }

  .sm\:mxw-50 {
    max-width: 50px;
  }

  .sm\:mxw-75 {
    max-width: 75px;
  }

  .sm\:mxw-100 {
    max-width: 100px;
  }

  .sm\:mxw-150 {
    max-width: 150px;
  }

  .sm\:mxw-200 {
    max-width: 200px;
  }

  .sm\:mxw-250 {
    max-width: 250px;
  }

  .sm\:mxw-300 {
    max-width: 300px;
  }

  .sm\:mxw-350 {
    max-width: 350px;
  }

  .sm\:mxw-400 {
    max-width: 400px;
  }

  .sm\:mxw-450 {
    max-width: 450px;
  }

  .sm\:mxw-500 {
    max-width: 500px;
  }

  .sm\:mxw-600 {
    max-width: 600px;
  }

  .sm\:mxw-700 {
    max-width: 700px;
  }

  .sm\:mxw-800 {
    max-width: 800px;
  }

  .sm\:mxw-900 {
    max-width: 900px;
  }

  .sm\:mxw-1000 {
    max-width: 1000px;
  }
}

/*** Max Height ***/
.mxh-25 {
  max-height: 25px;
}

.mxh-35 {
  max-height: 35px;
}

.mxh-50 {
  max-height: 50px;
}

.mxh-75 {
  max-height: 75px;
}

.mxh-100 {
  max-height: 100px;
}

.mxh-130 {
  max-height: 130px;
}

.mxh-150 {
  max-height: 150px;
}

.mxh-200 {
  max-height: 200px;
}

.mxh-250 {
  max-height: 250px;
}

.mxh-300 {
  max-height: 300px;
}

.mxh-350 {
  max-height: 350px;
}

.mxh-400 {
  max-height: 400px;
}

.mxh-450 {
  max-height: 450px;
}

.mxh-500 {
  max-height: 500px;
}

.mxh-550 {
  max-height: 550px;
}

.mxh-600 {
  max-height: 600px;
}

.mxh-700 {
  max-height: 700px;
}

.mxh-800 {
  max-height: 800px;
}

.mxh-900 {
  max-height: 900px;
}

.mxh-1000 {
  max-height: 1000px;
}

@media (max-width: 1199px) {
  .xl\:mxh-25 {
    max-height: 25px;
  }

  .xl\:mxh-35 {
    max-height: 35px;
  }

  .xl\:mxh-50 {
    max-height: 50px;
  }

  .xl\:mxh-75 {
    max-height: 75px;
  }

  .xl\:mxh-100 {
    max-height: 100px;
  }

  .xl\:mxh-150 {
    max-height: 150px;
  }

  .xl\:mxh-200 {
    max-height: 200px;
  }

  .xl\:mxh-250 {
    max-height: 250px;
  }

  .xl\:mxh-300 {
    max-height: 300px;
  }

  .xl\:mxh-350 {
    max-height: 350px;
  }

  .xl\:mxh-400 {
    max-height: 400px;
  }

  .xl\:mxh-450 {
    max-height: 450px;
  }

  .xl\:mxh-500 {
    max-height: 500px;
  }

  .xl\:mxh-600 {
    max-height: 600px;
  }

  .xl\:mxh-700 {
    max-height: 700px;
  }

  .xl\:mxh-800 {
    max-height: 800px;
  }

  .xl\:mxh-900 {
    max-height: 900px;
  }

  .xl\:mxh-1000 {
    max-height: 1000px;
  }
}

@media (max-width: 991px) {
  .lg\:mxh-25 {
    max-height: 25px;
  }

  .lg\:mxh-35 {
    max-height: 35px;
  }

  .lg\:mxh-50 {
    max-height: 50px;
  }

  .lg\:mxh-75 {
    max-height: 75px;
  }

  .lg\:mxh-100 {
    max-height: 100px;
  }

  .lg\:mxh-150 {
    max-height: 150px;
  }

  .lg\:mxh-200 {
    max-height: 200px;
  }

  .lg\:mxh-250 {
    max-height: 250px;
  }

  .lg\:mxh-300 {
    max-height: 300px;
  }

  .lg\:mxh-350 {
    max-height: 350px;
  }

  .lg\:mxh-400 {
    max-height: 400px;
  }

  .lg\:mxh-450 {
    max-height: 450px;
  }

  .lg\:mxh-500 {
    max-height: 500px;
  }

  .lg\:mxh-600 {
    max-height: 600px;
  }

  .lg\:mxh-700 {
    max-height: 700px;
  }

  .lg\:mxh-800 {
    max-height: 800px;
  }

  .lg\:mxh-900 {
    max-height: 900px;
  }

  .lg\:mxh-1000 {
    max-height: 1000px;
  }
}

@media (max-width: 767px) {
  .md\:mxh-25 {
    max-height: 25px;
  }

  .md\:mxh-35 {
    max-height: 35px;
  }

  .md\:mxh-50 {
    max-height: 50px;
  }

  .md\:mxh-75 {
    max-height: 75px;
  }

  .md\:mxh-100 {
    max-height: 100px;
  }

  .md\:mxh-150 {
    max-height: 150px;
  }

  .md\:mxh-200 {
    max-height: 200px;
  }

  .md\:mxh-250 {
    max-height: 250px;
  }

  .md\:mxh-300 {
    max-height: 300px;
  }

  .md\:mxh-350 {
    max-height: 350px;
  }

  .md\:mxh-400 {
    max-height: 400px;
  }

  .md\:mxh-450 {
    max-height: 450px;
  }

  .md\:mxh-500 {
    max-height: 500px;
  }

  .md\:mxh-600 {
    max-height: 600px;
  }

  .md\:mxh-700 {
    max-height: 700px;
  }

  .md\:mxh-800 {
    max-height: 800px;
  }

  .md\:mxh-900 {
    max-height: 900px;
  }

  .md\:mxh-1000 {
    max-height: 1000px;
  }
}

@media (max-width: 575px) {
  .sm\:mxh-25 {
    max-height: 25px;
  }

  .sm\:mxh-35 {
    max-height: 35px;
  }

  .sm\:mxh-50 {
    max-height: 50px;
  }

  .sm\:mxh-75 {
    max-height: 75px;
  }

  .sm\:mxh-100 {
    max-height: 100px;
  }

  .sm\:mxh-150 {
    max-height: 150px;
  }

  .sm\:mxh-200 {
    max-height: 200px;
  }

  .sm\:mxh-250 {
    max-height: 250px;
  }

  .sm\:mxh-300 {
    max-height: 300px;
  }

  .sm\:mxh-350 {
    max-height: 350px;
  }

  .sm\:mxh-400 {
    max-height: 400px;
  }

  .sm\:mxh-450 {
    max-height: 450px;
  }

  .sm\:mxh-500 {
    max-height: 500px;
  }

  .sm\:mxh-600 {
    max-height: 600px;
  }

  .sm\:mxh-700 {
    max-height: 700px;
  }

  .sm\:mxh-800 {
    max-height: 800px;
  }

  .sm\:mxh-900 {
    max-height: 900px;
  }

  .sm\:mxh-1000 {
    max-height: 1000px;
  }
}


.w-25vh {
  width: 25vh;
}

.w-50vh {
  width: 50vh;
}

.w-75vh {
  width: 75vh;
}

.w-100vh {
  width: 100vh;
}

.w-125vh {
  width: 125vh;
}

.w-150vh {
  width: 150vh;
}

.mnw-25vh {
  min-width: 25vh;
}

.mnw-50vh {
  min-width: 50vh;
}

.mnw-75vh {
  min-width: 75vh;
}

.mnw-100vh {
  min-width: 100vh;
}

.mnw-125vh {
  min-width: 125vh;
}

.mnw-150vh {
  min-width: 150vh;
}

.mxw-25vh {
  max-width: 25vh;
}

.mxw-50vh {
  max-width: 50vh;
}

.mxw-75vh {
  max-width: 75vh;
}

.mxw-100vh {
  max-width: 100vh;
}

.mxw-125vh {
  max-width: 125vh;
}

.mxw-150vh {
  max-width: 150vh;
}


.h-25vh {
  height: 25vh;
}

.h-50vh {
  height: 50vh;
}

.h-75vh {
  height: 75vh;
}

.h-100vh {
  height: 100vh;
}

.h-125vh {
  height: 125vh;
}

.h-150vh {
  height: 150vh;
}

.mnh-25vh {
  min-height: 25vh;
}

.mnh-50vh {
  min-height: 50vh;
}

.mnh-75vh {
  min-height: 75vh;
}

.mnh-100vh {
  min-height: 100vh;
}

.mnh-125vh {
  min-height: 125vh;
}

.mnh-150vh {
  min-height: 150vh;
}

.mxh-25vh {
  max-height: 25vh;
}

.mxh-50vh {
  max-height: 50vh;
}

.mxh-75vh {
  max-height: 75vh;
}

.mxh-100vh {
  max-height: 100vh;
}

.mxh-125vh {
  max-height: 125vh;
}

.mxh-150vh {
  max-height: 150vh;
}


/** scroll bar **/
.scroll-y-v1 {
  overflow-y: scroll;
  height: 100%;
}

.scroll-x-v1 {
  overflow-x: scroll;
  width: 100%;
}

.scroll-v1::-webkit-scrollbar {
  width: 5px;
  height: 100%
}

.scroll-v1::-webkit-scrollbar-button {
  width: 5px;
  height: 100%
}

.scroll-v1::-webkit-scrollbar-thumb {
  background: #eeeeee;
  border-radius: 0
}

.scroll-v1::-webkit-scrollbar-thumb:hover {
  background: #eeeeee;
}

.scroll-v1::-webkit-scrollbar-thumb:active {
  background: #eeeeee;
}

.scroll-v1::-webkit-scrollbar-track {
  background: #dddddd;
  border-radius: 0
}

.scroll-v1::-webkit-scrollbar-track:hover {
  background: #dddddd;
}

.scroll-v1::-webkit-scrollbar-track:active {
  background: rgba(0, 0, 0, 0)
}

.scroll-v1::-webkit-scrollbar-corner {
  background: rgba(0, 0, 0, 0)
}


.scroll-v1.-dark-scroll::-webkit-scrollbar {
  width: 5px;
  height: 100%
}

.scroll-v1.-dark-scroll::-webkit-scrollbar-button {
  width: 5px;
  height: 100%
}

.scroll-v1.-dark-scroll::-webkit-scrollbar-thumb {
  background: #4e4e4e;
  border-radius: 6px
}

.scroll-v1.-dark-scroll::-webkit-scrollbar-thumb:hover {
  background: #646464;
}

.scroll-v1.-dark-scroll::-webkit-scrollbar-thumb:active {
  background: #282828;
}

.scroll-v1.-dark-scroll::-webkit-scrollbar-track {
  background: #282828;
  border-radius: 0px
}

.scroll-v1.-dark-scroll::-webkit-scrollbar-track:hover {
  background: #282828;
}

.scroll-v1.-dark-scroll::-webkit-scrollbar-track:active {
  background: rgb(0 0 0 / 0%)
}

.scroll-v1.-dark-scroll::-webkit-scrollbar-corner {
  background: rgba(0, 0, 0, 0)
}