/* Common style properties */
.overflow-auto {
  overflow: auto;}
.cursor-pointer {
  cursor: pointer;}
.cursor-default {
  cursor: default !important;}

/* Common Flex styles */
.d-flex {
	display: flex; }

.flex-row {
	flex-direction: row; }
	
.flex-column {
  flex-direction: column; }
  
.flex-row-reverse {
  flex-direction: row-reverse; }
  
.flex-column-reverse {
  flex-direction: column-reverse; }
  
.flex-wrap {
  flex-wrap: wrap; }
  
.flex-nowrap {
  flex-wrap: nowrap; }
  
.flex-wrap-reverse {
  flex-wrap: wrap-reverse; }
  
.flex-fill {
  flex: 1 1 auto; }
  
.flex-grow-0 {
  flex-grow: 0; }
  
.flex-grow-1 {
  flex-grow: 1; }
  
.flex-shrink-0 {
  flex-shrink: 0; }
  
.flex-shrink-1 {
  flex-shrink: 1; }
  
.justify-content-start {
  justify-content: flex-start; }
  
.justify-content-end {
  justify-content: flex-end; }
  
.justify-content-center {
  justify-content: center; }
  
.justify-content-between {
  justify-content: space-between; }
  
.justify-content-around {
  justify-content: space-around; }
  
.align-items-start {
  align-items: flex-start; }
  
.align-items-end {
  align-items: flex-end; }
  
.align-items-center {
  align-items: center; }
  
.align-items-baseline {
  align-items: baseline; }
  
.align-items-stretch {
  align-items: stretch; }
  
.align-content-start {
  align-content: flex-start; }
  
.align-content-end {
  align-content: flex-end; }
  
.align-content-center {
  align-content: center; }
  
.align-content-between {
  align-content: space-between; }
  
.align-content-around {
  align-content: space-around; }
  
.align-content-stretch {
  align-content: stretch; }
  
.align-self-auto {
  align-self: auto; }
  
.align-self-start {
  align-self: flex-start; }
  
.align-self-end {
  align-self: flex-end; }
  
.align-self-center {
  align-self: center; }
  
.align-self-baseline {
  align-self: baseline; }
  
.align-self-stretch {
	align-self: stretch; }

/* Height */
.mn-ht-50 {
  min-height: 50px; }
.mn-ht-100 {
  min-height: 100px; }
.mn-ht-150 {
  min-height: 150px; }
.mn-ht-200 {
  min-height: 200px; }

/* Position */
.pos-relative {
  position: relative;
}
.pos-absolute {
  position: absolute;
}
.pos-fixed {
  position: fixed;
}

/* loading */
.loading-icon {
  display: block;
  width: 30px;
  height: 30px;
  margin: 0 auto;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 50%;
}
#main_container .loading-icon{
  left: 60%;
}
#root .loading-icon {
  left: 54%;
}
#loading-content {
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
}
#loading-content img {
  width: 35px;
  height: 35px;
}

  /* Height */
.mx-ht-50 {
  max-height: 50px; }
.mx-ht-100 {
  max-height: 100px; }
.mx-ht-150 {
  max-height: 150px; }
.mx-ht-200 {
  max-height: 200px; }
.mx-ht-400 {
  max-height: 400px; }
.mx-ht-600 {
  max-height: 600px; }

/* font-size */
.fs-10 {
  font-size: 10px; }
.fs-12 {
  font-size: 12px; }
.fs-14 {
  font-size: 14px; }
.fs-16 {
  font-size: 16px; }
.fs-18 {
  font-size: 18px; }
.fs-20 {
  font-size: 20px; }

/* font-weight */
.fw-100 {
  font-weight: 100; }
.fw-400 {
  font-weight: 400; }
.fw-500 {
  font-weight: 500; }
.fw-600 {
  font-weight: 600; }
.fw-700 {
  font-weight: 700; }
.fw-900 {
  font-weight: 900; }

/* opacity */
.op-0 {
  opacity: 0; }
.op-1 {
  opacity: 0.1; }
.op-2 {
  opacity: 0.2; }
.op-3 {
  opacity: 0.3; }
.op-4 {
  opacity: 0.4; }
.op-5 {
  opacity: 0.5; }
.op-6 {
  opacity: 0.6; }
.op-7 {
  opacity: 0.7; }
.op-8 {
  opacity: 0.8; }
.op-9 {
  opacity: 0.9; }

  /* position */
.bt-0 {
  bottom: 0; }
.bt-15 {
  bottom: 15px; }
.bt-20 {
  bottom: 20px; }
.tp-0 {
  top: 0; }
.tp-15 {
  top: 15px; }
.tp-20 {
  top: 20px; }
.lt-0 {
  left: 0 }
.lt-15 {
  left: 15px; }
.lt-20 {
  left: 20px; }

/* padding */
.p-0 {
  padding: 0 !important;
}

.pt-0,
.py-0 {
  padding-top: 0 !important;
}

.pr-0,
.px-0 {
  padding-right: 0 !important;
}

.pb-0,
.py-0 {
  padding-bottom: 0 !important;
}

.pl-0,
.px-0 {
  padding-left: 0 !important;
}

.p-1 {
  padding: 0.25rem !important;
}

.pt-1,
.py-1 {
  padding-top: 0.25rem !important;
}

.pr-1,
.px-1 {
  padding-right: 0.25rem !important;
}

.pb-1,
.py-1 {
  padding-bottom: 0.25rem !important;
}

.pl-1,
.px-1 {
  padding-left: 0.25rem !important;
}

.p-2 {
  padding: 0.5rem !important;
}

.pt-2,
.py-2 {
  padding-top: 0.5rem !important;
}

.pr-2,
.px-2 {
  padding-right: 0.5rem !important;
}

.pb-2,
.py-2 {
  padding-bottom: 0.5rem !important;
}

.pl-2,
.px-2 {
  padding-left: 0.5rem !important;
}

.p-3 {
  padding: 1rem !important;
}

.pt-3,
.py-3 {
  padding-top: 1rem !important;
}

.pr-3,
.px-3 {
  padding-right: 1rem !important;
}

.pb-3,
.py-3 {
  padding-bottom: 1rem !important;
}

.pl-3,
.px-3 {
  padding-left: 1rem !important;
}

.p-4 {
  padding: 1.5rem !important;
}

.pt-4,
.py-4 {
  padding-top: 1.5rem !important;
}

.pr-4,
.px-4 {
  padding-right: 1.5rem !important;
}

.pb-4,
.py-4 {
  padding-bottom: 1.5rem !important;
}

.pl-4,
.px-4 {
  padding-left: 1.5rem !important;
}

.p-5 {
  padding: 3rem !important;
}

.pt-5,
.py-5 {
  padding-top: 3rem !important;
}

.pr-5,
.px-5 {
  padding-right: 3rem !important;
}

.pb-5,
.py-5 {
  padding-bottom: 3rem !important;
}

.pl-5,
.px-5 {
  padding-left: 3rem !important;
}

.no-access-content {
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
  text-transform: uppercase;
}