.trans_scroll {overflow: overlay;}
.trans_scroll::-webkit-scrollbar {width: 16px;height: 16px;}
.trans_scroll::-webkit-scrollbar-thumb {background: rgba(0, 0, 0, 0.2);}
.trans_scroll::-webkit-scrollbar-track {background: rgba(0, 0, 0, 0.1);}

.bg-stripes-indigo {
    background-color: #818cf81a;
    background-image: linear-gradient(135deg,#6366f180 10%,transparent 0,transparent 50%,#6366f180 0,#6366f180 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.bg-stripes-blue {
    background-color: #60a5fa1a;
    background-image: linear-gradient(135deg,#3b82f680 10%,transparent 0,transparent 50%,#3b82f680 0,#3b82f680 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.bg-stripes-purple {
    background-color: #c084fc1a;
    background-image: linear-gradient(135deg,#a855f780 10%,transparent 0,transparent 50%,#a855f780 0,#a855f780 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.bg-stripes-gray {
    background-color: #9ca3af1a;
    background-image: linear-gradient(135deg,#6b728080 10%,transparent 0,transparent 50%,#6b728080 0,#6b728080 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.bg-stripes-sky {
    background-color: #38bdf81a;
    background-image: linear-gradient(135deg,#0ea5e980 10%,transparent 0,transparent 50%,#0ea5e980 0,#0ea5e980 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.bg-stripes-fuchsia {
    background-color: #e879f91a;
    background-image: linear-gradient(135deg,#d946ef80 10%,transparent 0,transparent 50%,#d946ef80 0,#d946ef80 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.bg-stripes-pink {
    background-color: #f472b61a;
    background-image: linear-gradient(135deg,#ec489980 10%,transparent 0,transparent 50%,#ec489980 0,#ec489980 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.bg-stripes-violet {
    background-color: #a78bfa1a;
    background-image: linear-gradient(135deg,#8b5cf680 10%,transparent 0,transparent 50%,#8b5cf680 0,#8b5cf680 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.bg-stripes-cyan {
    background-color: #22d3ee1a;
    background-image: linear-gradient(135deg,#06b6d480 10%,transparent 0,transparent 50%,#06b6d480 0,#06b6d480 60%,transparent 0,transparent);
    background-size: 7.07px 7.07px;
}

.h-screen-50 {height: 50vh;}
.h-screen-80 {height: 80vh;}
.h-screen-90 {height: 90vh;}

.min-w-xs {min-width: 20rem; /* 320px */}
.min-w-sm {min-width: 24rem; /* 384px */}
.min-w-md {min-width: 28rem; /* 448px */}
.min-w-lg {min-width: 32rem; /* 512px */}
.min-w-xl {min-width: 36rem; /* 576px */}

.box-shadow-sm{box-shadow: 3px 3px 6px #a2a2a2;}
.box-shadow-lg{box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);}
.box-shadow-inset{box-shadow: 3px 3px 6px #a2a2a2 inset;}

.sm\:min-w-xs {min-width: 20rem; /* 320px */}
.sm\:min-w-sm {min-width: 24rem; /* 384px */}
.sm\:min-w-md {min-width: 28rem; /* 448px */}
.sm\:min-w-lg {min-width: 32rem; /* 512px */}
.sm\:min-w-xl {min-width: 36rem; /* 576px */}

.font-bold-icon {-webkit-text-stroke: 0.04rem;}

.drop-shadow-base {
    --tw-drop-shadow: drop-shadow(0 4px 4px rgba(0,0,0,0.4));
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.ext-shadow-base {box-shadow: 0px 4px 8px 0px rgb(0 0 0 / 20%);}
.h-12\.5 {height: 3.125rem;}
.h-13 {height: 3.25rem;}