/* #region Scrollbar Styles */

.modern-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: rgba(155, 155, 155, 0.5) transparent;
}

.modern-scrollbar::-webkit-scrollbar {
    width: 8px;
}

.modern-scrollbar::-webkit-scrollbar-track {
    background: transparent;
    border-radius: 20px;
}

.modern-scrollbar::-webkit-scrollbar-thumb {
    background-color: rgba(155, 155, 155, 0.5);
    border-radius: 20px;
    border: transparent;
}

.modern-scrollbar::-webkit-scrollbar-thumb:hover {
    background-color: rgba(155, 155, 155, 0.8);
}

/* #endregion */

/* #region Cursor Pointer */

.mdCursorPointer{
    cursor: pointer !important;
}

/* #endregion */

/* #region Border Radius */

.mdBorderRadius-0 {
    border-radius: 0 !important;
}

.mdBorderRadius-10{
    border-radius: 10px !important;
}

.mdBorderRadius-12{
    border-radius: 12px !important;
}

.mdBorderRadius-14{
    border-radius: 14px !important;
}

.mdBorderRadius-20{
    border-radius: 20px !important;
}

/* #endregion */

/* #region Font Size */

.mdFontSize-10{
    font-size: 10px !important;
}

.mdFontSize-11{
    font-size: 11px !important;
}

.mdFontSize-12{
    font-size: 12px !important;
}

.mdFontSize-13{
    font-size: 13px !important;
}

.mdFontSize-14{
    font-size: 14px !important;
}

.mdFontSize-16 {
  font-size: 16px !important;
}

.mdFontSize-18 {
  font-size: 18px !important;
}

.mdFontSize-24 {
  font-size: 24px !important;
}

.mdFontSize-32{
    font-size: 32px !important;
}


/* #endregion Font Size */

/* #region Display */

.mdDisplayNone{
    display: none !important;
}

.mdDisplayFlexRowACJC{
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

.mdDisplayFlexColumnACJC{
    display: flex !important;
    flex-direction: column;
    align-items: center !important;
    justify-content: center !important;
}

.mdDisplayFlexRowACJSB{
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* #endregion */

/* #region Border */

.mdBorderNone{
    border: none !important;
}

.mdBorder{
    border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

/* #endregion Border */

/* #region Margin */

.mdMargin-0{
    margin: 0px !important;
}

.mdMarginBottom-10{
    margin-bottom: 10px !important;
}
.mdMarginBottom-20{
    margin-bottom: 20px !important;
}
.mdMarginBottom-30{
    margin-bottom: 30px !important;
}
.mdMarginBottom-40{
    margin-bottom: 40px !important;
}

.mdMarginTop-20{
    margin-top: 30px !important;
}

/* #endregion Margin */

/* #region Height */

.mdHeightPercent-88{
    height: 88% !important;
}

.mdHeightPercent-89{
    height: 89% !important;
}

.mdHeightPercent-90{
    height: 90% !important;
}

.mdHeightPercent-91{
    height: 91% !important;
}

.mdHeightPercent-92{
    height: 92% !important;
}

.mdHeight-6vh{
    height: 6vh !important;
}

.mdHeight-75vh{
    height: 75vh !important;
}

.mdHeight-77vh{
    height: 77vh !important;
}

.mdHeight-80vh{
    height: 80vh !important;
}

.mdHeight-60vh{
    height: 60vh !important;
}

.mdHeight-62vh{
    height: 62vh !important;
}

.mdHeight-63vh{
    height: 63vh !important;
}

.mdHeight-65vh{
    height: 65vh !important;
}

.mdHeight-66vh{
    height: 66vh !important;
}

.mdHeight-67vh{
    height: 67vh !important;
}

.mdHeight-53vh{
    height: 88% !important;
}

.mdHeight-54vh{
    height: 90% !important;
}

.mdH100W100{
    width: 100% !important;
    height: 100% !important;
}

/* #endregion Height */