/*Position -------------------*/

.top-0 {
  top: 0;
}

.top-50 {
  top: 50%;
}

.left-0 {
  left: 0;
}

.left-50 {
  left: 50%;
}

.right-0 {
  right: 0;
}

.right-50 {
  right: 50%;
}

.bottom-0 {
  bottom: 0;
}

.bottom-50 {
  bottom: 50%;
}

/*Style -------------------*/

.bkg-black {
  background-color: black;
}

.txt-black {
  color: black;
}

.cursor-pointer {
  cursor: pointer;
}

/*z-index -------------------*/

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

.z-index1 {
  z-index: 1;
}

.z-index2 {
  z-index: 2;
}

.z-index3 {
  z-index: 3;
}

.z-index4 {
  z-index: 4;
}

.z-index5 {
  z-index: 5;
}
.z-index6 {
  z-index: 6;
}

.z-index7 {
  z-index: 7;
}

.z-index8 {
  z-index: 8;
}

.z-index9 {
  z-index: 9;
}

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

.z-index25 {
  z-index: 25;
}

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

.z-index500 {
  z-index: 500;
}

.z-index999 {
  z-index: 999;
}

/*Opacity -------------------*/

.opacity0 {
  opacity: 0;
}

.opacity0-1 {
  opacity: 0.1;
}

.opacity0-2 {
  opacity: 0.2;
}

.opacity0-3 {
  opacity: 0.3;
}

.opacity0-4 {
  opacity: 0.4;
}

.opacity0-5 {
  opacity: 0.5;
}

.opacity0-6 {
  opacity: 0.6;
}

.opacity0-7 {
  opacity: 0.7;
}

.opacity0-8 {
  opacity: 0.8;
}

.opacity0-9 {
  opacity: 0.9;
}

.opacity1 {
  opacity: 1;
}

/*Font weight -------------------*/

.font100 {
  font-weight: 100;
}

.font200 {
  font-weight: 200;
}

.font300 {
  font-weight: 300;
}

.font400 {
  font-weight: 400;
}

.font500 {
  font-weight: 500;
}

.font600 {
  font-weight: 600;
}

.font700 {
  font-weight: 700;
}

.font800 {
  font-weight: 800;
}

.font900 {
  font-weight: 900;
}

/*Padding 0.25rem -------------------*/
.pad-0-25y {
  padding: 0.25rem 0;
}

.pad-0-25x {
  padding: 0 0.25rem;
}

.pad-0-25 {
  padding: 0.25rem;
}

.pad-t0-25 {
  padding-top: 0.25rem;
}

.pad-b0-25 {
  padding-bottom: 0.25rem;
}

.pad-l0-25 {
  padding-left: 0.25rem;
}

.pad-r0-25 {
  padding-right: 0.25rem;
}

/*Padding 0.5rem -------------------*/
.pad-0-5y {
  padding: 0.5rem 0;
}

.pad-0-5x {
  padding: 0 0.5rem;
}

.pad-0-5 {
  padding: 0.5rem;
}

.pad-t0-5 {
  padding-top: 0.5rem;
}

.pad-b0-5 {
  padding-bottom: 0.5rem;
}

.pad-l0-5 {
  padding-left: 0.5rem;
}

.pad-r0-5 {
  padding-right: 0.5rem;
}

/*Padding 1rem -------------------*/

.pad-1y {
  padding: 1rem 0;
}

.pad-1x {
  padding: 0 1rem;
}

.pad-1 {
  padding: 1rem;
}

.pad-t1 {
  padding-top: 1rem;
}

.pad-b1 {
  padding-bottom: 1rem;
}

.pad-l1 {
  padding-left: 1rem;
}

.pad-r1 {
  padding-right: 1rem;
}

/*Padding 2rem -------------------*/

.pad-2y {
  padding: 2rem 0;
}

.pad-2x {
  padding: 0 2rem;
}

.pad-2 {
  padding: 2rem;
}

.pad-t2 {
  padding-top: 2rem;
}

.pad-b2 {
  padding-bottom: 2rem;
}

.pad-l2 {
  padding-left: 2rem;
}

.pad-r2 {
  padding-right: 2rem;
}

/*Margin 0.25rem -------------------*/
.margin-0-25y {
  margin: 0.25rem 0;
}

.margin-0-25x {
  margin: 0 0.25rem;
}

.margin-0-25 {
  margin: 0.25rem;
}

.margin-t0-25 {
  margin-top: 0.25rem;
}

.margin-b0-25 {
  margin-bottom: 0.25rem;
}

.margin-l0-25 {
  margin-left: 0.25rem;
}

.margin-r0-25 {
  margin-right: 0.25rem;
}

/*Margin 0.5rem -------------------*/
.margin-0-5y {
  margin: 0.5rem 0;
}

.margin-0-5x {
  margin: 0 0.5rem;
}

.margin-0-5 {
  margin: 0.5rem;
}

.margin-t0-5 {
  margin-top: 0.5rem;
}

.margin-b0-5 {
  margin-bottom: 0.5rem;
}

.margin-l0-5 {
  margin-left: 0.5rem;
}

.margin-r0-5 {
  margin-right: 0.5rem;
}

/*Margin 1rem -------------------*/

.margin-1y {
  margin: 1rem 0;
}

.margin-1x {
  margin: 0 1rem;
}

.margin-1 {
  margin: 1rem;
}

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

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

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

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

/*Margin 2rem -------------------*/

.margin-2y {
  margin: 2rem 0;
}

.margin-2x {
  margin: 0 2rem;
}

.margin-2 {
  margin: 2rem;
}

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

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

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

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

/*Border -------------------*/

.border-none {
  border: none;
}