simplify-css/css/simplify.css

Simplify is utility-first modern CSS framework.

/* Reset default css tag & selecters*/
body,
blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

button {
  background: transparent;
  padding: 0;
}

button:focus {
  outline: none;
}

fieldset {
  margin: 0;
  padding: 0;
}

ol,
ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

html {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  line-height: 1.5;
}

*, ::before,
::after {
  box-sizing: border-box;
  border-width: 0;
  border-style: solid;
  border-color: #e2e8f0;
}

hr {
  border-top-width: 1px;
}

img {
  border-style: solid;
}

textarea {
  resize: vertical;
}

input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {
  color: #a0aec0;
}

input::-moz-placeholder, textarea::-moz-placeholder {
  color: #a0aec0;
}

input:-ms-input-placeholder, textarea:-ms-input-placeholder {
  color: #a0aec0;
}

input::-ms-input-placeholder, textarea::-ms-input-placeholder {
  color: #a0aec0;
}

input::placeholder,
textarea::placeholder {
  color: #a0aec0;
}

button,
[role="button"] {
  cursor: pointer;
}

table {
  border-collapse: collapse;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

a {
  color: inherit;
  text-decoration: inherit;
}

button,
input,
optgroup,
select,
textarea {
  padding: 0;
  line-height: inherit;
  color: inherit;
}

pre,
code,
kbd,
samp {
  font-family: inherit;
}

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block;
}

img,
video {
  max-width: 100%;
  height: auto;
}

.container {
  max-width: 100%;
}

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

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

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

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

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

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

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

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

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

.text-decoration-line-through {
  text-decoration: line-through;
}

.text-decoration-capitalize {
  -webkit-text-decoration: capitalize;
          text-decoration: capitalize;
}

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

.display-block {
  display: block;
}

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

.display-inline {
  display: inline;
}

.display-flex {
  display: -webkit-box;
  display: flex;
}

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

.display-table {
  display: table;
}

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

.display-none {
  display: none;
}

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

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

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

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

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

.align-items-flex-start {
  -webkit-box-align: start;
          align-items: flex-start;
}

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

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

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

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

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

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

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

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

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

.justify-content-center {
  -webkit-box-pack: center;
          justify-content: center;
}

.justify-content-flex-start {
  -webkit-box-pack: start;
          justify-content: flex-start;
}

.justify-content-flex-end {
  -webkit-box-pack: end;
          justify-content: flex-end;
}

.justify-content-space-between {
  -webkit-box-pack: justify;
          justify-content: space-between;
}

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

.justify-content-space-evenly {
  -webkit-box-pack: space-evenly;
          justify-content: space-evenly;
}

.appearance-none {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.flex-direction-row {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
          flex-direction: row;
}

.flex-direction-row-reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
          flex-direction: row-reverse;
}

.flex-direction-column {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
          flex-direction: column;
}

.flex-direction-column-reverse {
  -webkit-box-orient: vertical;
  -webkit-box-direction: reverse;
          flex-direction: column-reverse;
}

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

.flex-auto {
  -webkit-box-flex: 1;
          flex: 1 1 auto;
}

.flex-initial {
  -webkit-box-flex: 0;
          flex: 0 1 auto;
}

.flex-none {
  -webkit-box-flex: 0;
          flex: none;
}

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

.background-size-auto {
  background-size: auto;
}

.background-size-cover {
  background-size: cover;
}

.background-size-contain {
  background-size: contain;
}

.background-attachment-fixed {
  background-attachment: fixed;
}

.background-attachment-local {
  background-attachment: local;
}

.background-attachment-scroll {
  background-attachment: scroll;
}

.background-repeat-repeat {
  background-repeat: repeat;
}

.background-repeat-no-repeat {
  background-repeat: no-repeat;
}

.background-repeat-x {
  background-repeat: repeat-x;
}

.background-repeat-y {
  background-repeat: repeat-y;
}

.background-repeat-round {
  background-repeat: round;
}

.background-repeat-space {
  background-repeat: space;
}

.order-first {
  -webkit-box-ordinal-group: -9998;
          order: -9999;
}

.order-last {
  -webkit-box-ordinal-group: 10000;
          order: 9999;
}

.order-none {
  -webkit-box-ordinal-group: 1;
          order: 0;
}

.order-1 {
  -webkit-box-ordinal-group: 2;
          order: 1;
}

.order-2 {
  -webkit-box-ordinal-group: 3;
          order: 2;
}

.order-3 {
  -webkit-box-ordinal-group: 4;
          order: 3;
}

.order-4 {
  -webkit-box-ordinal-group: 5;
          order: 4;
}

.order-5 {
  -webkit-box-ordinal-group: 6;
          order: 5;
}

.order-6 {
  -webkit-box-ordinal-group: 7;
          order: 6;
}

.order-7 {
  -webkit-box-ordinal-group: 8;
          order: 7;
}

.order-8 {
  -webkit-box-ordinal-group: 9;
          order: 8;
}

.order-9 {
  -webkit-box-ordinal-group: 10;
          order: 9;
}

.order-10 {
  -webkit-box-ordinal-group: 11;
          order: 10;
}

.order-11 {
  -webkit-box-ordinal-group: 12;
          order: 11;
}

.order-12 {
  -webkit-box-ordinal-group: 13;
          order: 12;
}

.position-fixed {
  position: fixed;
}

.position-absolute {
  position: absolute;
}

.position-relateive {
  position: relative;
}

.position-sticky {
  position: -webkit-sticky;
  position: sticky;
}

.position-static {
  position: static;
}

.position-unset {
  position: unset;
}

.border-style-solid {
  border-style: solid;
}

.border-style-dashed {
  border-style: dashed;
}

.border-style-dotted {
  border-style: dotted;
}

.border-style-double {
  border-style: double;
}

.border-style-none {
  border-style: none;
}

.width-auto {
  width: auto;
}

.width-1-by-2 {
  width: 50%;
}

.width-1-by-3 {
  width: 3.33333%;
}

.width-2-by-3 {
  width: 66.66667%;
}

.width-1-by-4 {
  width: 25%;
}

.width-2-by-4 {
  width: 50%;
}

.width-3-by-4 {
  width: 75%;
}

.width-1-by-5 {
  width: 20%;
}

.width-2-by-5 {
  width: 40%;
}

.width-3-by-5 {
  width: 60%;
}

.width-4-by-5 {
  width: 80%;
}

.width-1-by-6 {
  width: 16.66667%;
}

.width-2-by-6 {
  width: 33.33333%;
}

.width-3-by-6 {
  width: 50%;
}

.width-4-by-6 {
  width: 66.66667%;
}

.width-5-by-6 {
  width: 83.33333%;
}

.width-1-by-12 {
  width: 8.33333%;
}

.width-2-by-12 {
  width: 16.66667%;
}

.width-3-by-12 {
  width: 25%;
}

.width-4-by-12 {
  width: 33.33333%;
}

.width-5-by-12 {
  width: 41.66667%;
}

.width-6-by-12 {
  width: 50%;
}

.width-7-by-12 {
  width: 58.33333%;
}

.width-8-by-12 {
  width: 66.66667%;
}

.width-9-by-12 {
  width: 75%;
}

.width-10-by-12 {
  width: 83.33333%;
}

.width-11-by-12 {
  width: 91.66667%;
}

.width-full {
  width: 100%;
}

.width-screen {
  width: 100vw;
}

.font-size-xxs {
  font-size: 0.5rem;
}

.font-size-xs {
  font-size: 0.75rem;
}

.font-size-sm {
  font-size: 0.875rem;
}

.font-size-base {
  font-size: 1rem;
}

.font-size-lg {
  font-size: 1.125rem;
}

.font-size-xl {
  font-size: 1.25rem;
}

.font-size-2xl {
  font-size: 1.5rem;
}

.font-size-3xl {
  font-size: 1.875rem;
}

.font-size-4xl {
  font-size: 2.25rem;
}

.font-size-5xl {
  font-size: 3rem;
}

.font-size-6xl {
  font-size: 4rem;
}

.font-weight-normal {
  font-weight: 400;
}

.font-weight-medium {
  font-weight: 500;
}

.font-weight-semibold {
  font-weight: 600;
}

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

.font-weight-black {
  font-weight: 900;
}

.font-family-base {
  font-family: "Poppins", sans-serif;
}

.font-family-title {
  font-family: "Roboto", sans-serif;
}

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

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

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

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

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

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

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

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

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

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

.box-shadow {
  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
}

.box-shadow-md {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.box-shadow-lg {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
}

.box-shadow-xl {
  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.box-shadow-2xl {
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
}

.box-shadow-inner {
  box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
}

.box-shadow-outline {
  box-shadow: 0 0 0 3px rgba(66, 153, 225, 0.5);
}

.box-shadow-none {
  box-shadow: none;
}

.opacity-0 {
  opacity: 0;
}

.opacity-25 {
  opacity: 0.25;
}

.opacity-50 {
  opacity: 0.5;
}

.opacity-75 {
  opacity: 0.75;
}

.opacity-100 {
  opacity: 1;
}

.top-0 {
  top: 0;
}

.top-auto {
  top: auto;
}

.top-full {
  top: 100%;
}

.bottom-auto {
  bottom: auto;
}

.bottom-0 {
  bottom: 0;
}

.bottom-full {
  bottom: 100%;
}

.left-auto {
  left: auto;
}

.left-0 {
  left: 0;
}

.left-full {
  left: 100%;
}

.right-auto {
  right: auto;
}

.right-0 {
  right: 0;
}

.right-full {
  right: 100%;
}

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

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

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

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

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

.float-right {
  float: right;
}

.float-left {
  float: left;
}

.float-none {
  float: none;
}

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

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

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

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

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

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

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

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

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

.overflow-hidden {
  overflow: hidden;
}

.overflow-visible {
  overflow: visible;
}

.overflow-scroll {
  overflow: scroll;
}

.visibility-visible {
  visibility: visible;
}

.visibility-hidden {
  visibility: hidden;
}

.letter-spacing-xs {
  letter-spacing: -0.05em;
}

.letter-spacing-sm {
  letter-spacing: -0.025em;
}

.letter-spacing-normal {
  letter-spacing: 0;
}

.letter-spacing-md {
  letter-spacing: 0.025em;
}

.letter-spacing-lg {
  letter-spacing: 0.05em;
}

.letter-spacing-xl {
  letter-spacing: 0.1em;
}

.line-height-none {
  line-height: 0;
}

.line-height-normal {
  line-height: 1.25;
}

.line-height {
  line-height: 1.5;
}

.line-height-double {
  line-height: 2;
}

.list-style-type-none {
  list-style-type: none;
}

.list-style-type-disc {
  list-style-type: disc;
}

.list-style-type-circle {
  list-style-type: circle;
}

.list-style-type-decimal {
  list-style-type: decimal;
}

.list-style-type-square {
  list-style-type: square;
}

.list-style-type-lower-alpha {
  list-style-type: lower-alpha;
}

.list-style-type-upper-alpha {
  list-style-type: upper-alpha;
}

.list-style-position-inside {
  list-style-position: inside;
}

.list-style-position-outside {
  list-style-position: outside;
}

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

.vertical-align-top {
  vertical-align: top;
}

.vertical-align-middle {
  vertical-align: middle;
}

.vertical-align-bottom {
  vertical-align: bottom;
}

.vertical-align-text-top {
  vertical-align: text-top;
}

.vertical-align-text-bottom {
  vertical-align: text-bottom;
}

.white-space-normal {
  white-space: normal;
}

.white-space-nowrap {
  white-space: nowrap;
}

.white-space-pre {
  white-space: pre;
}

.white-space-pre-line {
  white-space: pre-line;
}

.white-space-pre-wrap {
  white-space: pre-wrap;
}

.cursor-auto {
  cursor: auto;
}

.cursor-normal {
  cursor: default;
}

.cursor-pointer {
  cursor: pointer;
}

.cursor-wait {
  cursor: wait;
}

.cursor-text {
  cursor: text;
}

.cursor-move {
  cursor: move;
}

.cursor-not-allowed {
  cursor: not-allowed;
}

.pointer-events-none {
  pointer-events: none;
}

.pointer-events-auto {
  pointer-events: auto;
}

.outline-none {
  outline: 0;
}

.resize-none {
  resize: none;
}

.resize-both {
  resize: both;
}

.resize-x {
  resize: vertical;
}

.resize-y {
  resize: horizontal;
}

.user-select-none {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.user-select-text {
  -webkit-user-select: text;
     -moz-user-select: text;
      -ms-user-select: text;
          user-select: text;
}

.user-select-all {
  -webkit-user-select: all;
     -moz-user-select: all;
      -ms-user-select: all;
          user-select: all;
}

.user-select-auto {
  -webkit-user-select: auto;
     -moz-user-select: auto;
      -ms-user-select: auto;
          user-select: auto;
}

.fill-current {
  fill: currentColor;
}

.stroke-current {
  stroke: currentColor;
}

.transition {
  -webkit-transition: all .5s ease-in-out;
  transition: all .5s ease-in-out;
}

.transition-fast {
  -webkit-transition: all .2s ease-in-out;
  transition: all .2s ease-in-out;
}

.transition-slow {
  -webkit-transition: all .8s ease-in-out;
  transition: all .8s ease-in-out;
}

.height-0 {
  height: 0;
}

.height-1 {
  height: 0.25rem;
}

.height-2 {
  height: 0.5rem;
}

.height-3 {
  height: 0.75rem;
}

.height-4 {
  height: 1rem;
}

.height-5 {
  height: 1.25rem;
}

.height-6 {
  height: 1.5rem;
}

.height-8 {
  height: 2rem;
}

.height-10 {
  height: 2.5rem;
}

.height-12 {
  height: 3rem;
}

.height-16 {
  height: 4rem;
}

.height-20 {
  height: 5rem;
}

.height-24 {
  height: 6rem;
}

.height-32 {
  height: 8rem;
}

.height-40 {
  height: 10rem;
}

.height-48 {
  height: 12rem;
}

.height-56 {
  height: 14rem;
}

.height-64 {
  height: 16rem;
}

.height-auto {
  height: auto;
}

.height-px {
  height: 1px;
}

.height-full {
  height: 100%;
}

.height-screen {
  height: 100vh;
}

.width-0 {
  width: 0;
}

.width-1 {
  width: 0.25rem;
}

.width-2 {
  width: 0.5rem;
}

.width-3 {
  width: 0.75rem;
}

.width-4 {
  width: 1rem;
}

.width-5 {
  width: 1.25rem;
}

.width-6 {
  width: 1.5rem;
}

.width-8 {
  width: 2rem;
}

.width-10 {
  width: 2.5rem;
}

.width-12 {
  width: 3rem;
}

.width-16 {
  width: 4rem;
}

.width-20 {
  width: 5rem;
}

.width-24 {
  width: 6rem;
}

.width-32 {
  width: 8rem;
}

.width-40 {
  width: 10rem;
}

.width-48 {
  width: 12rem;
}

.width-56 {
  width: 14rem;
}

.width-64 {
  width: 16rem;
}

.width-auto {
  width: auto;
}

.width-px {
  width: 1px;
}

.width-half {
  width: 50%;
}

.width-full {
  width: 100%;
}

.width-screen {
  width: 100vw;
}

.min-height-0 {
  min-height: 0;
}

.min-height-1 {
  min-height: 0.25rem;
}

.min-height-2 {
  min-height: 0.5rem;
}

.min-height-3 {
  min-height: 0.75rem;
}

.min-height-4 {
  min-height: 1rem;
}

.min-height-5 {
  min-height: 1.25rem;
}

.min-height-6 {
  min-height: 1.5rem;
}

.min-height-8 {
  min-height: 2rem;
}

.min-height-10 {
  min-height: 2.5rem;
}

.min-height-12 {
  min-height: 3rem;
}

.min-height-16 {
  min-height: 4rem;
}

.min-height-20 {
  min-height: 5rem;
}

.min-height-24 {
  min-height: 6rem;
}

.min-height-32 {
  min-height: 8rem;
}

.min-height-40 {
  min-height: 10rem;
}

.min-height-48 {
  min-height: 12rem;
}

.min-height-56 {
  min-height: 14rem;
}

.min-height-64 {
  min-height: 16rem;
}

.min-height-auto {
  min-height: auto;
}

.min-height-px {
  min-height: 1px;
}

.min-height-full {
  min-height: 100%;
}

.min-height-screen {
  min-height: 100vh;
}

.min-width-0 {
  min-width: 0;
}

.min-width-1 {
  min-width: 0.25rem;
}

.min-width-2 {
  min-width: 0.5rem;
}

.min-width-3 {
  min-width: 0.75rem;
}

.min-width-4 {
  min-width: 1rem;
}

.min-width-5 {
  min-width: 1.25rem;
}

.min-width-6 {
  min-width: 1.5rem;
}

.min-width-8 {
  min-width: 2rem;
}

.min-width-10 {
  min-width: 2.5rem;
}

.min-width-12 {
  min-width: 3rem;
}

.min-width-16 {
  min-width: 4rem;
}

.min-width-20 {
  min-width: 5rem;
}

.min-width-24 {
  min-width: 6rem;
}

.min-width-32 {
  min-width: 8rem;
}

.min-width-40 {
  min-width: 10rem;
}

.min-width-48 {
  min-width: 12rem;
}

.min-width-56 {
  min-width: 14rem;
}

.min-width-64 {
  min-width: 16rem;
}

.min-width-auto {
  min-width: auto;
}

.min-width-px {
  min-width: 1px;
}

.min-width-half {
  min-width: 50%;
}

.min-width-full {
  min-width: 100%;
}

.min-width-screen {
  min-width: 100vw;
}

.max-height-0 {
  max-height: 0;
}

.max-height-1 {
  max-height: 0.25rem;
}

.max-height-2 {
  max-height: 0.5rem;
}

.max-height-3 {
  max-height: 0.75rem;
}

.max-height-4 {
  max-height: 1rem;
}

.max-height-5 {
  max-height: 1.25rem;
}

.max-height-6 {
  max-height: 1.5rem;
}

.max-height-8 {
  max-height: 2rem;
}

.max-height-10 {
  max-height: 2.5rem;
}

.max-height-12 {
  max-height: 3rem;
}

.max-height-16 {
  max-height: 4rem;
}

.max-height-20 {
  max-height: 5rem;
}

.max-height-24 {
  max-height: 6rem;
}

.max-height-32 {
  max-height: 8rem;
}

.max-height-40 {
  max-height: 10rem;
}

.max-height-48 {
  max-height: 12rem;
}

.max-height-56 {
  max-height: 14rem;
}

.max-height-64 {
  max-height: 16rem;
}

.max-height-auto {
  max-height: auto;
}

.max-height-px {
  max-height: 1px;
}

.max-height-full {
  max-height: 100%;
}

.max-height-screen {
  max-height: 100vh;
}

.max-width-0 {
  max-width: 0;
}

.max-width-1 {
  max-width: 0.25rem;
}

.max-width-2 {
  max-width: 0.5rem;
}

.max-width-3 {
  max-width: 0.75rem;
}

.max-width-4 {
  max-width: 1rem;
}

.max-width-5 {
  max-width: 1.25rem;
}

.max-width-6 {
  max-width: 1.5rem;
}

.max-width-8 {
  max-width: 2rem;
}

.max-width-10 {
  max-width: 2.5rem;
}

.max-width-12 {
  max-width: 3rem;
}

.max-width-16 {
  max-width: 4rem;
}

.max-width-20 {
  max-width: 5rem;
}

.max-width-24 {
  max-width: 6rem;
}

.max-width-32 {
  max-width: 8rem;
}

.max-width-40 {
  max-width: 10rem;
}

.max-width-48 {
  max-width: 12rem;
}

.max-width-56 {
  max-width: 14rem;
}

.max-width-64 {
  max-width: 16rem;
}

.max-width-auto {
  max-width: auto;
}

.max-width-px {
  max-width: 1px;
}

.max-width-half {
  max-width: 50%;
}

.max-width-full {
  max-width: 100%;
}

.max-width-screen {
  max-width: 100vw;
}

.margin-auto {
  margin: auto;
}

.margin-x-auto {
  margin-left: auto;
  margin-right: auto;
}

.margin-y-auto {
  margin-top: auto;
  margin-bottom: auto;
}

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

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

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

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

.margin-0 {
  margin: 0;
}

.margin-x-0 {
  margin-left: 0;
  margin-right: 0;
}

.margin-y-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.margin-left-0 {
  margin-left: 0;
}

.margin-right-0 {
  margin-right: 0;
}

.margin-top-0 {
  margin-top: 0;
}

.margin-bottom-0 {
  margin-bottom: 0;
}

.margin-1 {
  margin: 0.25rem;
}

.-margin-1 {
  margin: -0.25rem;
}

.margin-x-1 {
  margin-left: 0.25rem;
  margin-right: 0.25rem;
}

.-margin-x-1 {
  margin-left: -0.25rem;
  margin-right: -0.25rem;
}

.margin-y-1 {
  margin-top: 0.25rem;
  margin-bottom: 0.25rem;
}

.-margin-y-1 {
  margin-top: -0.25rem;
  margin-bottom: -0.25rem;
}

.margin-left-1 {
  margin-left: 0.25rem;
}

.-margin-left-1 {
  margin-left: -0.25rem;
}

.margin-right-1 {
  margin-right: 0.25rem;
}

.-margin-right-1 {
  margin-right: -0.25rem;
}

.margin-top-1 {
  margin-top: 0.25rem;
}

.-margin-top-1 {
  margin-top: -0.25rem;
}

.margin-bottom-1 {
  margin-bottom: 0.25rem;
}

.-margin-bottom-1 {
  margin-bottom: -0.25rem;
}

.margin-2 {
  margin: 0.5rem;
}

.-margin-2 {
  margin: -0.5rem;
}

.margin-x-2 {
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

.-margin-x-2 {
  margin-left: -0.5rem;
  margin-right: -0.5rem;
}

.margin-y-2 {
  margin-top: 0.5rem;
  margin-bottom: 0.5rem;
}

.-margin-y-2 {
  margin-top: -0.5rem;
  margin-bottom: -0.5rem;
}

.margin-left-2 {
  margin-left: 0.5rem;
}

.-margin-left-2 {
  margin-left: -0.5rem;
}

.margin-right-2 {
  margin-right: 0.5rem;
}

.-margin-right-2 {
  margin-right: -0.5rem;
}

.margin-top-2 {
  margin-top: 0.5rem;
}

.-margin-top-2 {
  margin-top: -0.5rem;
}

.margin-bottom-2 {
  margin-bottom: 0.5rem;
}

.-margin-bottom-2 {
  margin-bottom: -0.5rem;
}

.margin-3 {
  margin: 0.75rem;
}

.-margin-3 {
  margin: -0.75rem;
}

.margin-x-3 {
  margin-left: 0.75rem;
  margin-right: 0.75rem;
}

.-margin-x-3 {
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}

.margin-y-3 {
  margin-top: 0.75rem;
  margin-bottom: 0.75rem;
}

.-margin-y-3 {
  margin-top: -0.75rem;
  margin-bottom: -0.75rem;
}

.margin-left-3 {
  margin-left: 0.75rem;
}

.-margin-left-3 {
  margin-left: -0.75rem;
}

.margin-right-3 {
  margin-right: 0.75rem;
}

.-margin-right-3 {
  margin-right: -0.75rem;
}

.margin-top-3 {
  margin-top: 0.75rem;
}

.-margin-top-3 {
  margin-top: -0.75rem;
}

.margin-bottom-3 {
  margin-bottom: 0.75rem;
}

.-margin-bottom-3 {
  margin-bottom: -0.75rem;
}

.margin-4 {
  margin: 1rem;
}

.-margin-4 {
  margin: -1rem;
}

.margin-x-4 {
  margin-left: 1rem;
  margin-right: 1rem;
}

.-margin-x-4 {
  margin-left: -1rem;
  margin-right: -1rem;
}

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

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

.margin-left-4 {
  margin-left: 1rem;
}

.-margin-left-4 {
  margin-left: -1rem;
}

.margin-right-4 {
  margin-right: 1rem;
}

.-margin-right-4 {
  margin-right: -1rem;
}

.margin-top-4 {
  margin-top: 1rem;
}

.-margin-top-4 {
  margin-top: -1rem;
}

.margin-bottom-4 {
  margin-bottom: 1rem;
}

.-margin-bottom-4 {
  margin-bottom: -1rem;
}

.margin-5 {
  margin: 1.25rem;
}

.-margin-5 {
  margin: -1.25rem;
}

.margin-x-5 {
  margin-left: 1.25rem;
  margin-right: 1.25rem;
}

.-margin-x-5 {
  margin-left: -1.25rem;
  margin-right: -1.25rem;
}

.margin-y-5 {
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
}

.-margin-y-5 {
  margin-top: -1.25rem;
  margin-bottom: -1.25rem;
}

.margin-left-5 {
  margin-left: 1.25rem;
}

.-margin-left-5 {
  margin-left: -1.25rem;
}

.margin-right-5 {
  margin-right: 1.25rem;
}

.-margin-right-5 {
  margin-right: -1.25rem;
}

.margin-top-5 {
  margin-top: 1.25rem;
}

.-margin-top-5 {
  margin-top: -1.25rem;
}

.margin-bottom-5 {
  margin-bottom: 1.25rem;
}

.-margin-bottom-5 {
  margin-bottom: -1.25rem;
}

.margin-6 {
  margin: 1.5rem;
}

.-margin-6 {
  margin: -1.5rem;
}

.margin-x-6 {
  margin-left: 1.5rem;
  margin-right: 1.5rem;
}

.-margin-x-6 {
  margin-left: -1.5rem;
  margin-right: -1.5rem;
}

.margin-y-6 {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
}

.-margin-y-6 {
  margin-top: -1.5rem;
  margin-bottom: -1.5rem;
}

.margin-left-6 {
  margin-left: 1.5rem;
}

.-margin-left-6 {
  margin-left: -1.5rem;
}

.margin-right-6 {
  margin-right: 1.5rem;
}

.-margin-right-6 {
  margin-right: -1.5rem;
}

.margin-top-6 {
  margin-top: 1.5rem;
}

.-margin-top-6 {
  margin-top: -1.5rem;
}

.margin-bottom-6 {
  margin-bottom: 1.5rem;
}

.-margin-bottom-6 {
  margin-bottom: -1.5rem;
}

.margin-8 {
  margin: 2rem;
}

.-margin-8 {
  margin: -2rem;
}

.margin-x-8 {
  margin-left: 2rem;
  margin-right: 2rem;
}

.-margin-x-8 {
  margin-left: -2rem;
  margin-right: -2rem;
}

.margin-y-8 {
  margin-top: 2rem;
  margin-bottom: 2rem;
}

.-margin-y-8 {
  margin-top: -2rem;
  margin-bottom: -2rem;
}

.margin-left-8 {
  margin-left: 2rem;
}

.-margin-left-8 {
  margin-left: -2rem;
}

.margin-right-8 {
  margin-right: 2rem;
}

.-margin-right-8 {
  margin-right: -2rem;
}

.margin-top-8 {
  margin-top: 2rem;
}

.-margin-top-8 {
  margin-top: -2rem;
}

.margin-bottom-8 {
  margin-bottom: 2rem;
}

.-margin-bottom-8 {
  margin-bottom: -2rem;
}

.margin-10 {
  margin: 2.5rem;
}

.-margin-10 {
  margin: -2.5rem;
}

.margin-x-10 {
  margin-left: 2.5rem;
  margin-right: 2.5rem;
}

.-margin-x-10 {
  margin-left: -2.5rem;
  margin-right: -2.5rem;
}

.margin-y-10 {
  margin-top: 2.5rem;
  margin-bottom: 2.5rem;
}

.-margin-y-10 {
  margin-top: -2.5rem;
  margin-bottom: -2.5rem;
}

.margin-left-10 {
  margin-left: 2.5rem;
}

.-margin-left-10 {
  margin-left: -2.5rem;
}

.margin-right-10 {
  margin-right: 2.5rem;
}

.-margin-right-10 {
  margin-right: -2.5rem;
}

.margin-top-10 {
  margin-top: 2.5rem;
}

.-margin-top-10 {
  margin-top: -2.5rem;
}

.margin-bottom-10 {
  margin-bottom: 2.5rem;
}

.-margin-bottom-10 {
  margin-bottom: -2.5rem;
}

.margin-12 {
  margin: 3rem;
}

.-margin-12 {
  margin: -3rem;
}

.margin-x-12 {
  margin-left: 3rem;
  margin-right: 3rem;
}

.-margin-x-12 {
  margin-left: -3rem;
  margin-right: -3rem;
}

.margin-y-12 {
  margin-top: 3rem;
  margin-bottom: 3rem;
}

.-margin-y-12 {
  margin-top: -3rem;
  margin-bottom: -3rem;
}

.margin-left-12 {
  margin-left: 3rem;
}

.-margin-left-12 {
  margin-left: -3rem;
}

.margin-right-12 {
  margin-right: 3rem;
}

.-margin-right-12 {
  margin-right: -3rem;
}

.margin-top-12 {
  margin-top: 3rem;
}

.-margin-top-12 {
  margin-top: -3rem;
}

.margin-bottom-12 {
  margin-bottom: 3rem;
}

.-margin-bottom-12 {
  margin-bottom: -3rem;
}

.margin-16 {
  margin: 4rem;
}

.-margin-16 {
  margin: -4rem;
}

.margin-x-16 {
  margin-left: 4rem;
  margin-right: 4rem;
}

.-margin-x-16 {
  margin-left: -4rem;
  margin-right: -4rem;
}

.margin-y-16 {
  margin-top: 4rem;
  margin-bottom: 4rem;
}

.-margin-y-16 {
  margin-top: -4rem;
  margin-bottom: -4rem;
}

.margin-left-16 {
  margin-left: 4rem;
}

.-margin-left-16 {
  margin-left: -4rem;
}

.margin-right-16 {
  margin-right: 4rem;
}

.-margin-right-16 {
  margin-right: -4rem;
}

.margin-top-16 {
  margin-top: 4rem;
}

.-margin-top-16 {
  margin-top: -4rem;
}

.margin-bottom-16 {
  margin-bottom: 4rem;
}

.-margin-bottom-16 {
  margin-bottom: -4rem;
}

.margin-20 {
  margin: 5rem;
}

.-margin-20 {
  margin: -5rem;
}

.margin-x-20 {
  margin-left: 5rem;
  margin-right: 5rem;
}

.-margin-x-20 {
  margin-left: -5rem;
  margin-right: -5rem;
}

.margin-y-20 {
  margin-top: 5rem;
  margin-bottom: 5rem;
}

.-margin-y-20 {
  margin-top: -5rem;
  margin-bottom: -5rem;
}

.margin-left-20 {
  margin-left: 5rem;
}

.-margin-left-20 {
  margin-left: -5rem;
}

.margin-right-20 {
  margin-right: 5rem;
}

.-margin-right-20 {
  margin-right: -5rem;
}

.margin-top-20 {
  margin-top: 5rem;
}

.-margin-top-20 {
  margin-top: -5rem;
}

.margin-bottom-20 {
  margin-bottom: 5rem;
}

.-margin-bottom-20 {
  margin-bottom: -5rem;
}

.margin-24 {
  margin: 6rem;
}

.-margin-24 {
  margin: -6rem;
}

.margin-x-24 {
  margin-left: 6rem;
  margin-right: 6rem;
}

.-margin-x-24 {
  margin-left: -6rem;
  margin-right: -6rem;
}

.margin-y-24 {
  margin-top: 6rem;
  margin-bottom: 6rem;
}

.-margin-y-24 {
  margin-top: -6rem;
  margin-bottom: -6rem;
}

.margin-left-24 {
  margin-left: 6rem;
}

.-margin-left-24 {
  margin-left: -6rem;
}

.margin-right-24 {
  margin-right: 6rem;
}

.-margin-right-24 {
  margin-right: -6rem;
}

.margin-top-24 {
  margin-top: 6rem;
}

.-margin-top-24 {
  margin-top: -6rem;
}

.margin-bottom-24 {
  margin-bottom: 6rem;
}

.-margin-bottom-24 {
  margin-bottom: -6rem;
}

.margin-32 {
  margin: 8rem;
}

.-margin-32 {
  margin: -8rem;
}

.margin-x-32 {
  margin-left: 8rem;
  margin-right: 8rem;
}

.-margin-x-32 {
  margin-left: -8rem;
  margin-right: -8rem;
}

.margin-y-32 {
  margin-top: 8rem;
  margin-bottom: 8rem;
}

.-margin-y-32 {
  margin-top: -8rem;
  margin-bottom: -8rem;
}

.margin-left-32 {
  margin-left: 8rem;
}

.-margin-left-32 {
  margin-left: -8rem;
}

.margin-right-32 {
  margin-right: 8rem;
}

.-margin-right-32 {
  margin-right: -8rem;
}

.margin-top-32 {
  margin-top: 8rem;
}

.-margin-top-32 {
  margin-top: -8rem;
}

.margin-bottom-32 {
  margin-bottom: 8rem;
}

.-margin-bottom-32 {
  margin-bottom: -8rem;
}

.margin-40 {
  margin: 10rem;
}

.-margin-40 {
  margin: -10rem;
}

.margin-x-40 {
  margin-left: 10rem;
  margin-right: 10rem;
}

.-margin-x-40 {
  margin-left: -10rem;
  margin-right: -10rem;
}

.margin-y-40 {
  margin-top: 10rem;
  margin-bottom: 10rem;
}

.-margin-y-40 {
  margin-top: -10rem;
  margin-bottom: -10rem;
}

.margin-left-40 {
  margin-left: 10rem;
}

.-margin-left-40 {
  margin-left: -10rem;
}

.margin-right-40 {
  margin-right: 10rem;
}

.-margin-right-40 {
  margin-right: -10rem;
}

.margin-top-40 {
  margin-top: 10rem;
}

.-margin-top-40 {
  margin-top: -10rem;
}

.margin-bottom-40 {
  margin-bottom: 10rem;
}

.-margin-bottom-40 {
  margin-bottom: -10rem;
}

.margin-48 {
  margin: 12rem;
}

.-margin-48 {
  margin: -12rem;
}

.margin-x-48 {
  margin-left: 12rem;
  margin-right: 12rem;
}

.-margin-x-48 {
  margin-left: -12rem;
  margin-right: -12rem;
}

.margin-y-48 {
  margin-top: 12rem;
  margin-bottom: 12rem;
}

.-margin-y-48 {
  margin-top: -12rem;
  margin-bottom: -12rem;
}

.margin-left-48 {
  margin-left: 12rem;
}

.-margin-left-48 {
  margin-left: -12rem;
}

.margin-right-48 {
  margin-right: 12rem;
}

.-margin-right-48 {
  margin-right: -12rem;
}

.margin-top-48 {
  margin-top: 12rem;
}

.-margin-top-48 {
  margin-top: -12rem;
}

.margin-bottom-48 {
  margin-bottom: 12rem;
}

.-margin-bottom-48 {
  margin-bottom: -12rem;
}

.margin-56 {
  margin: 14rem;
}

.-margin-56 {
  margin: -14rem;
}

.margin-x-56 {
  margin-left: 14rem;
  margin-right: 14rem;
}

.-margin-x-56 {
  margin-left: -14rem;
  margin-right: -14rem;
}

.margin-y-56 {
  margin-top: 14rem;
  margin-bottom: 14rem;
}

.-margin-y-56 {
  margin-top: -14rem;
  margin-bottom: -14rem;
}

.margin-left-56 {
  margin-left: 14rem;
}

.-margin-left-56 {
  margin-left: -14rem;
}

.margin-right-56 {
  margin-right: 14rem;
}

.-margin-right-56 {
  margin-right: -14rem;
}

.margin-top-56 {
  margin-top: 14rem;
}

.-margin-top-56 {
  margin-top: -14rem;
}

.margin-bottom-56 {
  margin-bottom: 14rem;
}

.-margin-bottom-56 {
  margin-bottom: -14rem;
}

.margin-64 {
  margin: 16rem;
}

.-margin-64 {
  margin: -16rem;
}

.margin-x-64 {
  margin-left: 16rem;
  margin-right: 16rem;
}

.-margin-x-64 {
  margin-left: -16rem;
  margin-right: -16rem;
}

.margin-y-64 {
  margin-top: 16rem;
  margin-bottom: 16rem;
}

.-margin-y-64 {
  margin-top: -16rem;
  margin-bottom: -16rem;
}

.margin-left-64 {
  margin-left: 16rem;
}

.-margin-left-64 {
  margin-left: -16rem;
}

.margin-right-64 {
  margin-right: 16rem;
}

.-margin-right-64 {
  margin-right: -16rem;
}

.margin-top-64 {
  margin-top: 16rem;
}

.-margin-top-64 {
  margin-top: -16rem;
}

.margin-bottom-64 {
  margin-bottom: 16rem;
}

.-margin-bottom-64 {
  margin-bottom: -16rem;
}

.padding-0 {
  padding: 0;
}

.padding-x-0 {
  padding-left: 0;
  padding-right: 0;
}

.padding-y-0 {
  padding-top: 0;
  padding-bottom: 0;
}

.padding-left-0 {
  padding-left: 0;
}

.padding-right-0 {
  padding-right: 0;
}

.padding-top-0 {
  padding-top: 0;
}

.padding-bottom-0 {
  padding-bottom: 0;
}

.padding-1 {
  padding: 0.25rem;
}

.padding-x-1 {
  padding-left: 0.25rem;
  padding-right: 0.25rem;
}

.padding-y-1 {
  padding-top: 0.25rem;
  padding-bottom: 0.25rem;
}

.padding-left-1 {
  padding-left: 0.25rem;
}

.padding-right-1 {
  padding-right: 0.25rem;
}

.padding-top-1 {
  padding-top: 0.25rem;
}

.padding-bottom-1 {
  padding-bottom: 0.25rem;
}

.padding-2 {
  padding: 0.5rem;
}

.padding-x-2 {
  padding-left: 0.5rem;
  padding-right: 0.5rem;
}

.padding-y-2 {
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
}

.padding-left-2 {
  padding-left: 0.5rem;
}

.padding-right-2 {
  padding-right: 0.5rem;
}

.padding-top-2 {
  padding-top: 0.5rem;
}

.padding-bottom-2 {
  padding-bottom: 0.5rem;
}

.padding-3 {
  padding: 0.75rem;
}

.padding-x-3 {
  padding-left: 0.75rem;
  padding-right: 0.75rem;
}

.padding-y-3 {
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
}

.padding-left-3 {
  padding-left: 0.75rem;
}

.padding-right-3 {
  padding-right: 0.75rem;
}

.padding-top-3 {
  padding-top: 0.75rem;
}

.padding-bottom-3 {
  padding-bottom: 0.75rem;
}

.padding-4 {
  padding: 1rem;
}

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

.padding-y-4 {
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.padding-left-4 {
  padding-left: 1rem;
}

.padding-right-4 {
  padding-right: 1rem;
}

.padding-top-4 {
  padding-top: 1rem;
}

.padding-bottom-4 {
  padding-bottom: 1rem;
}

.padding-5 {
  padding: 1.25rem;
}

.padding-x-5 {
  padding-left: 1.25rem;
  padding-right: 1.25rem;
}

.padding-y-5 {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
}

.padding-left-5 {
  padding-left: 1.25rem;
}

.padding-right-5 {
  padding-right: 1.25rem;
}

.padding-top-5 {
  padding-top: 1.25rem;
}

.padding-bottom-5 {
  padding-bottom: 1.25rem;
}

.padding-6 {
  padding: 1.5rem;
}

.padding-x-6 {
  padding-left: 1.5rem;
  padding-right: 1.5rem;
}

.padding-y-6 {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

.padding-left-6 {
  padding-left: 1.5rem;
}

.padding-right-6 {
  padding-right: 1.5rem;
}

.padding-top-6 {
  padding-top: 1.5rem;
}

.padding-bottom-6 {
  padding-bottom: 1.5rem;
}

.padding-8 {
  padding: 2rem;
}

.padding-x-8 {
  padding-left: 2rem;
  padding-right: 2rem;
}

.padding-y-8 {
  padding-top: 2rem;
  padding-bottom: 2rem;
}

.padding-left-8 {
  padding-left: 2rem;
}

.padding-right-8 {
  padding-right: 2rem;
}

.padding-top-8 {
  padding-top: 2rem;
}

.padding-bottom-8 {
  padding-bottom: 2rem;
}

.padding-10 {
  padding: 2.5rem;
}

.padding-x-10 {
  padding-left: 2.5rem;
  padding-right: 2.5rem;
}

.padding-y-10 {
  padding-top: 2.5rem;
  padding-bottom: 2.5rem;
}

.padding-left-10 {
  padding-left: 2.5rem;
}

.padding-right-10 {
  padding-right: 2.5rem;
}

.padding-top-10 {
  padding-top: 2.5rem;
}

.padding-bottom-10 {
  padding-bottom: 2.5rem;
}

.padding-12 {
  padding: 3rem;
}

.padding-x-12 {
  padding-left: 3rem;
  padding-right: 3rem;
}

.padding-y-12 {
  padding-top: 3rem;
  padding-bottom: 3rem;
}

.padding-left-12 {
  padding-left: 3rem;
}

.padding-right-12 {
  padding-right: 3rem;
}

.padding-top-12 {
  padding-top: 3rem;
}

.padding-bottom-12 {
  padding-bottom: 3rem;
}

.padding-16 {
  padding: 4rem;
}

.padding-x-16 {
  padding-left: 4rem;
  padding-right: 4rem;
}

.padding-y-16 {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

.padding-left-16 {
  padding-left: 4rem;
}

.padding-right-16 {
  padding-right: 4rem;
}

.padding-top-16 {
  padding-top: 4rem;
}

.padding-bottom-16 {
  padding-bottom: 4rem;
}

.padding-20 {
  padding: 5rem;
}

.padding-x-20 {
  padding-left: 5rem;
  padding-right: 5rem;
}

.padding-y-20 {
  padding-top: 5rem;
  padding-bottom: 5rem;
}

.padding-left-20 {
  padding-left: 5rem;
}

.padding-right-20 {
  padding-right: 5rem;
}

.padding-top-20 {
  padding-top: 5rem;
}

.padding-bottom-20 {
  padding-bottom: 5rem;
}

.padding-24 {
  padding: 6rem;
}

.padding-x-24 {
  padding-left: 6rem;
  padding-right: 6rem;
}

.padding-y-24 {
  padding-top: 6rem;
  padding-bottom: 6rem;
}

.padding-left-24 {
  padding-left: 6rem;
}

.padding-right-24 {
  padding-right: 6rem;
}

.padding-top-24 {
  padding-top: 6rem;
}

.padding-bottom-24 {
  padding-bottom: 6rem;
}

.padding-32 {
  padding: 8rem;
}

.padding-x-32 {
  padding-left: 8rem;
  padding-right: 8rem;
}

.padding-y-32 {
  padding-top: 8rem;
  padding-bottom: 8rem;
}

.padding-left-32 {
  padding-left: 8rem;
}

.padding-right-32 {
  padding-right: 8rem;
}

.padding-top-32 {
  padding-top: 8rem;
}

.padding-bottom-32 {
  padding-bottom: 8rem;
}

.padding-40 {
  padding: 10rem;
}

.padding-x-40 {
  padding-left: 10rem;
  padding-right: 10rem;
}

.padding-y-40 {
  padding-top: 10rem;
  padding-bottom: 10rem;
}

.padding-left-40 {
  padding-left: 10rem;
}

.padding-right-40 {
  padding-right: 10rem;
}

.padding-top-40 {
  padding-top: 10rem;
}

.padding-bottom-40 {
  padding-bottom: 10rem;
}

.padding-48 {
  padding: 12rem;
}

.padding-x-48 {
  padding-left: 12rem;
  padding-right: 12rem;
}

.padding-y-48 {
  padding-top: 12rem;
  padding-bottom: 12rem;
}

.padding-left-48 {
  padding-left: 12rem;
}

.padding-right-48 {
  padding-right: 12rem;
}

.padding-top-48 {
  padding-top: 12rem;
}

.padding-bottom-48 {
  padding-bottom: 12rem;
}

.padding-56 {
  padding: 14rem;
}

.padding-x-56 {
  padding-left: 14rem;
  padding-right: 14rem;
}

.padding-y-56 {
  padding-top: 14rem;
  padding-bottom: 14rem;
}

.padding-left-56 {
  padding-left: 14rem;
}

.padding-right-56 {
  padding-right: 14rem;
}

.padding-top-56 {
  padding-top: 14rem;
}

.padding-bottom-56 {
  padding-bottom: 14rem;
}

.padding-64 {
  padding: 16rem;
}

.padding-x-64 {
  padding-left: 16rem;
  padding-right: 16rem;
}

.padding-y-64 {
  padding-top: 16rem;
  padding-bottom: 16rem;
}

.padding-left-64 {
  padding-left: 16rem;
}

.padding-right-64 {
  padding-right: 16rem;
}

.padding-top-64 {
  padding-top: 16rem;
}

.padding-bottom-64 {
  padding-bottom: 16rem;
}

.border {
  border-width: 1px;
}

.border-x {
  border-left-width: 1px;
  border-right-width: 1px;
}

.border-y {
  border-top-width: 1px;
  border-bottom-width: 1px;
}

.border-left {
  border-left-width: 1px;
}

.border-right {
  border-right-width: 1px;
}

.border-top {
  border-top-width: 1px;
}

.border-bottom {
  border-bottom-width: 1px;
}

.border-0 {
  border-width: 0;
}

.border-x-0 {
  border-left-width: 0;
  border-right-width: 0;
}

.border-y-0 {
  border-top-width: 0;
  border-bottom-width: 0;
}

.border-left-0 {
  border-left-width: 0;
}

.border-right-0 {
  border-right-width: 0;
}

.border-top-0 {
  border-top-width: 0;
}

.border-bottom-0 {
  border-bottom-width: 0;
}

.border-2 {
  border-width: 2px;
}

.border-x-2 {
  border-left-width: 2px;
  border-right-width: 2px;
}

.border-y-2 {
  border-top-width: 2px;
  border-bottom-width: 2px;
}

.border-left-2 {
  border-left-width: 2px;
}

.border-right-2 {
  border-right-width: 2px;
}

.border-top-2 {
  border-top-width: 2px;
}

.border-bottom-2 {
  border-bottom-width: 2px;
}

.border-4 {
  border-width: 4px;
}

.border-x-4 {
  border-left-width: 4px;
  border-right-width: 4px;
}

.border-y-4 {
  border-top-width: 4px;
  border-bottom-width: 4px;
}

.border-left-4 {
  border-left-width: 4px;
}

.border-right-4 {
  border-right-width: 4px;
}

.border-top-4 {
  border-top-width: 4px;
}

.border-bottom-4 {
  border-bottom-width: 4px;
}

.border-6 {
  border-width: 6px;
}

.border-x-6 {
  border-left-width: 6px;
  border-right-width: 6px;
}

.border-y-6 {
  border-top-width: 6px;
  border-bottom-width: 6px;
}

.border-left-6 {
  border-left-width: 6px;
}

.border-right-6 {
  border-right-width: 6px;
}

.border-top-6 {
  border-top-width: 6px;
}

.border-bottom-6 {
  border-bottom-width: 6px;
}

.border-8 {
  border-width: 8px;
}

.border-x-8 {
  border-left-width: 8px;
  border-right-width: 8px;
}

.border-y-8 {
  border-top-width: 8px;
  border-bottom-width: 8px;
}

.border-left-8 {
  border-left-width: 8px;
}

.border-right-8 {
  border-right-width: 8px;
}

.border-top-8 {
  border-top-width: 8px;
}

.border-bottom-8 {
  border-bottom-width: 8px;
}

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

.border-radius-top-left-default {
  border-top-left-radius: 4px;
}

.border-radius-top-right-default {
  border-top-right-radius: 4px;
}

.border-radius-bottom-left-default {
  border-bottom-left-radius: 4px;
}

.border-radius-bottom-right-default {
  border-bottom-right-radius: 4px;
}

.border-radius-none {
  border-radius: 0;
}

.border-radius-top-left-none {
  border-top-left-radius: 0;
}

.border-radius-top-right-none {
  border-top-right-radius: 0;
}

.border-radius-bottom-left-none {
  border-bottom-left-radius: 0;
}

.border-radius-bottom-right-none {
  border-bottom-right-radius: 0;
}

.border-radius-2 {
  border-radius: 2px;
}

.border-radius-top-left-2 {
  border-top-left-radius: 2px;
}

.border-radius-top-right-2 {
  border-top-right-radius: 2px;
}

.border-radius-bottom-left-2 {
  border-bottom-left-radius: 2px;
}

.border-radius-bottom-right-2 {
  border-bottom-right-radius: 2px;
}

.border-radius-6 {
  border-radius: 6px;
}

.border-radius-top-left-6 {
  border-top-left-radius: 6px;
}

.border-radius-top-right-6 {
  border-top-right-radius: 6px;
}

.border-radius-bottom-left-6 {
  border-bottom-left-radius: 6px;
}

.border-radius-bottom-right-6 {
  border-bottom-right-radius: 6px;
}

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

.border-radius-top-left-8 {
  border-top-left-radius: 8px;
}

.border-radius-top-right-8 {
  border-top-right-radius: 8px;
}

.border-radius-bottom-left-8 {
  border-bottom-left-radius: 8px;
}

.border-radius-bottom-right-8 {
  border-bottom-right-radius: 8px;
}

.border-radius-10 {
  border-radius: 10px;
}

.border-radius-top-left-10 {
  border-top-left-radius: 10px;
}

.border-radius-top-right-10 {
  border-top-right-radius: 10px;
}

.border-radius-bottom-left-10 {
  border-bottom-left-radius: 10px;
}

.border-radius-bottom-right-10 {
  border-bottom-right-radius: 10px;
}

.border-radius-25 {
  border-radius: 25px;
}

.border-radius-top-left-25 {
  border-top-left-radius: 25px;
}

.border-radius-top-right-25 {
  border-top-right-radius: 25px;
}

.border-radius-bottom-left-25 {
  border-bottom-left-radius: 25px;
}

.border-radius-bottom-right-25 {
  border-bottom-right-radius: 25px;
}

.border-radius-full {
  border-radius: 50%;
}

.border-radius-top-left-full {
  border-top-left-radius: 50%;
}

.border-radius-top-right-full {
  border-top-right-radius: 50%;
}

.border-radius-bottom-left-full {
  border-bottom-left-radius: 50%;
}

.border-radius-bottom-right-full {
  border-bottom-right-radius: 50%;
}

.text-color-transparent {
  color: transparent;
}

.border-color-transparent {
  border-color: transparent;
}

.background-color-transparent {
  background-color: transparent;
}

.text-color-white {
  color: #fff;
}

.border-color-white {
  border-color: #fff;
}

.background-color-white {
  background-color: #fff;
}

.text-color-black {
  color: #000;
}

.border-color-black {
  border-color: #000;
}

.background-color-black {
  background-color: #000;
}

.text-color-gray {
  color: #808080;
}

.border-color-gray {
  border-color: #808080;
}

.background-color-gray {
  background-color: #808080;
}

.text-color-primary {
  color: #7504f5;
}

.border-color-primary {
  border-color: #7504f5;
}

.background-color-primary {
  background-color: #7504f5;
}

.text-color-secendory {
  color: #0abdf3;
}

.border-color-secendory {
  border-color: #0abdf3;
}

.background-color-secendory {
  background-color: #0abdf3;
}

.text-color-warning {
  color: #ffa500;
}

.border-color-warning {
  border-color: #ffa500;
}

.background-color-warning {
  background-color: #ffa500;
}

.text-color-error {
  color: #ff0000;
}

.border-color-error {
  border-color: #ff0000;
}

.background-color-error {
  background-color: #ff0000;
}

.text-color-info {
  color: #1564e2;
}

.border-color-info {
  border-color: #1564e2;
}

.background-color-info {
  background-color: #1564e2;
}

.text-color-success {
  color: #00d66b;
}

.border-color-success {
  border-color: #00d66b;
}

.background-color-success {
  background-color: #00d66b;
}

.hover\:text-color-transparent:hover {
  color: transparent;
}

.hover\:border-color-transparent:hover {
  border-color: transparent;
}

.hover\:background-color-transparent:hover {
  background-color: transparent;
}

.hover\:text-color-white:hover {
  color: #fff;
}

.hover\:border-color-white:hover {
  border-color: #fff;
}

.hover\:background-color-white:hover {
  background-color: #fff;
}

.hover\:text-color-black:hover {
  color: #000;
}

.hover\:border-color-black:hover {
  border-color: #000;
}

.hover\:background-color-black:hover {
  background-color: #000;
}

.hover\:text-color-gray:hover {
  color: #808080;
}

.hover\:border-color-gray:hover {
  border-color: #808080;
}

.hover\:background-color-gray:hover {
  background-color: #808080;
}

.hover\:text-color-primary:hover {
  color: #7504f5;
}

.hover\:border-color-primary:hover {
  border-color: #7504f5;
}

.hover\:background-color-primary:hover {
  background-color: #7504f5;
}

.hover\:text-color-secendory:hover {
  color: #0abdf3;
}

.hover\:border-color-secendory:hover {
  border-color: #0abdf3;
}

.hover\:background-color-secendory:hover {
  background-color: #0abdf3;
}

.hover\:text-color-warning:hover {
  color: #ffa500;
}

.hover\:border-color-warning:hover {
  border-color: #ffa500;
}

.hover\:background-color-warning:hover {
  background-color: #ffa500;
}

.hover\:text-color-error:hover {
  color: #ff0000;
}

.hover\:border-color-error:hover {
  border-color: #ff0000;
}

.hover\:background-color-error:hover {
  background-color: #ff0000;
}

.hover\:text-color-info:hover {
  color: #1564e2;
}

.hover\:border-color-info:hover {
  border-color: #1564e2;
}

.hover\:background-color-info:hover {
  background-color: #1564e2;
}

.hover\:text-color-success:hover {
  color: #00d66b;
}

.hover\:border-color-success:hover {
  border-color: #00d66b;
}

.hover\:background-color-success:hover {
  background-color: #00d66b;
}

.focus\:text-color-transparent:focus {
  color: transparent;
}

.focus\:border-color-transparent:focus {
  border-color: transparent;
}

.focus\:background-color-transparent:focus {
  background-color: transparent;
}

.focus\:text-color-white:focus {
  color: #fff;
}

.focus\:border-color-white:focus {
  border-color: #fff;
}

.focus\:background-color-white:focus {
  background-color: #fff;
}

.focus\:text-color-black:focus {
  color: #000;
}

.focus\:border-color-black:focus {
  border-color: #000;
}

.focus\:background-color-black:focus {
  background-color: #000;
}

.focus\:text-color-gray:focus {
  color: #808080;
}

.focus\:border-color-gray:focus {
  border-color: #808080;
}

.focus\:background-color-gray:focus {
  background-color: #808080;
}

.focus\:text-color-primary:focus {
  color: #7504f5;
}

.focus\:border-color-primary:focus {
  border-color: #7504f5;
}

.focus\:background-color-primary:focus {
  background-color: #7504f5;
}

.focus\:text-color-secendory:focus {
  color: #0abdf3;
}

.focus\:border-color-secendory:focus {
  border-color: #0abdf3;
}

.focus\:background-color-secendory:focus {
  background-color: #0abdf3;
}

.focus\:text-color-warning:focus {
  color: #ffa500;
}

.focus\:border-color-warning:focus {
  border-color: #ffa500;
}

.focus\:background-color-warning:focus {
  background-color: #ffa500;
}

.focus\:text-color-error:focus {
  color: #ff0000;
}

.focus\:border-color-error:focus {
  border-color: #ff0000;
}

.focus\:background-color-error:focus {
  background-color: #ff0000;
}

.focus\:text-color-info:focus {
  color: #1564e2;
}

.focus\:border-color-info:focus {
  border-color: #1564e2;
}

.focus\:background-color-info:focus {
  background-color: #1564e2;
}

.focus\:text-color-success:focus {
  color: #00d66b;
}

.focus\:border-color-success:focus {
  border-color: #00d66b;
}

.focus\:background-color-success:focus {
  background-color: #00d66b;
}

@media screen and (min-width: 640px) {
  .container {
    max-width: 640px;
  }
  .sm