.pad-1 {
  padding: 1rem;
}
.pad-2 {
  padding: 2rem;
}
.pad-h-2 {
  padding: 0rem 2rem;
}
.pad-h-1 {
  padding: 0rem 1rem;
}
.pad-v-1 {
  padding: 1rem 0rem;
}
.pad-v-2 {
  padding: 2rem 0rem;
}
.pad-l-05 {
  padding-left: 0.5rem;
}
.pad-l-1 {
  padding-left: 1rem;
}
.pad-l-2 {
  padding-left: 2rem;
}
.pad-l-3 {
  padding-left: 3rem;
}
.pad-r-1 {
  padding-right: 1rem;
}
.pad-r-2 {
  padding-right: 2rem;
}
.margin-h-2 {
  margin: 0rem 2rem;
}
.margin-v-1 {
  margin: 1rem 0rem;
}
.margin-v-2 {
  margin: 2rem 0rem;
}
.lfloat {
  float: left;
}
.rfloat {
  float: right;
}
.left {
  margin-right: auto;
}
.right {
  margin-left: auto;
}
.center {
  margin: auto;
}
.text-center {
  text-align: center;
}
.text-left {
  text-align: center;
}
.capitalize {
  text-transform: capitalize;
}
.uppercase {
  text-transform: uppercase;
}
.pointer {
  cursor: pointer;
}
.flex {
  display: flex;
}
.flex-center {
  display: flex;
  align-items: center;
  justify-content: center;
}
.column {
  flex-direction: column;
}
.row {
  flex-direction: row;
}
.wrap {
  flex-wrap: wrap;
}
.flex1 {
  flex: 1;
}
.space-between {
  justify-content: space-between;
}
.space-evenly {
  justify-content: space-evenly;
}
.justify-center {
  justify-content: center;
}
.align-center {
  align-items: center;
}
.width-20 {
  width: 20rem;
}
.width-15 {
  width: 15rem;
}
.height-20 {
  height: 20rem;
}
.height-25 {
  height: 25rem;
}
.height-30 {
  height: 30rem;
}
.height-15 {
  height: 15rem;
}
.height-3 {
  height: 3rem;
}
.scroll-x {
  overflow-x: scroll;
}
.scroll-y {
  overflow-y: scroll;
}
.icon--small {
  max-width: fit-content;
  height: fit-content;
  color: white;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.icon--medium {
  max-width: fit-content;
  height: fit-content;
  color: white;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  padding: 3px;
}
.icon--large {
  max-width: fit-content;
  height: fit-content;
  color: white;
  border-radius: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  padding: 3px;
}
.success-bg {
  background-color: #5cb85c;
}
.incomplete-bg {
  background-color: #d9dbd9;
}
.grid-2-1 {
  display: grid;
  grid-template-columns: 2fr 1fr;
}
.grid-1-1 {
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.grid-1-2 {
  display: grid;
  grid-template-columns: 1fr 2fr;
}
.column-gap-3 {
  grid-column-gap: 3rem;
}
.danger-text {
  color: crimson;
}
.success-text {
  color: #00b900;
}