.shadow-sm {
  align-items: flex-start;
  box-shadow: 0 0 1px 0 var(--light__shadow_lkv);
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 1;
}

.shadow-md {
  align-items: flex-start;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.08), 0 2px 4px rgba(0, 0, 0, 0.11),
    0 0 1px #727272;
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 2;
}

.shadow-lg {
  align-items: flex-start;
  box-shadow: 0 11px 15px -3px rgba(0, 0, 0, 0.11),
    0 2px 6px rgba(0, 0, 0, 0.07), 0 0 1px #727272;
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 3;
}

.shadow-xl {
  align-items: flex-start;
  box-shadow: 0 20px 25px rgba(0, 0, 0, 0.09), 0 5px 11px rgba(0, 0, 0, 0.12),
    0 0 1px #727272;
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 4;
}

.shadow-2xl {
  align-items: flex-start;
  box-shadow: 0 25px 50px rgba(0, 0, 0, 0.23), 0 9px 18px rgba(0, 0, 0, 0.1),
    0 0 1px #727272;
  flex: 0 auto;
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  justify-content: flex-start;
  position: relative;
  z-index: 5;
}