.white-color {
    color: #fff;
}

a.white-color:hover,
button.white-color:hover {
    color: #000;
}

.white-bg {
    background-color: #fff;
}

.white-bg-opacity-0-5 {
    background-color: rgba(255, 255, 255, 0.5);
    backdrop-filter: blur(5px);
}

.color-gray-min {
    color: #bababa;
}

.gray-color {
    color: #c5c5c5;
}

.gray-bg {
    background-color: #c5c5c5;
}

.gray-bg-max {
    background-color: #a6a6a6;
}

span.gray-bg-max:hover {
    background-color: #8a8a8a;
}

button.gray-bg:hover {
    background-color: #acacac;
}

a.gray-bg:hover {
    background-color: #afafaf;
}

.black-color {
    color: #000;
}

a.black-color:hover {
    color: rgba(30, 179, 91);
}

.black-bg {
    background-color: #000;
}

.green-color-3 {
    color: rgba(30, 179, 91);
}

a.green-color-3:hover {
    color: rgb(0, 156, 75);
}

.green-bg-3 {
    background-color: rgba(30, 179, 91);
}

input.green-bg-3:hover,
a.green-bg-3:hover,
button.green-bg-3:hover {
    background-color: rgb(0, 133, 62);
    color: #fae603;
}

.green-bg-4 {
    background-color: rgb(0, 153, 115);
}

.blue-bg-1 {
    background-color: rgb(0, 129, 189);
}

a.blue-bg-1:hover,
input.blue-bg-1:hover {
    background-color: rgb(0, 114, 167);
}

.blue-bg-2 {
    background-color: rgb(0, 156, 143);
}

input.blue-bg-2:hover,
a.blue-bg-2:hover {
    background-color: rgb(0, 131, 120);
}

.blue-bg-3 {
    background-color: rgb(0, 81, 73);
}

a.blue-bg-3:hover {
    background-color: rgb(0, 103, 92);
    color: #fae603;
}

.green-bg-2 {
    background-color: rgb(81, 156, 0);
}

span.green-bg-2:hover,
a.green-bg-2:hover {
    background-color: rgb(66, 128, 0);
}

.color-blue {
    color: #0ca0f8;
}

a.color-blue:hover {
    color: #0078bd;
}

.color-blue-deep {
    color: #0924a5;
}

.bg-blue-deep {
    background-color: #0924a5;
}

a.bg-blue-deep:hover {
    background-color: #072fff;
    color: #fae603;
}

.color-purple-1 {
    color: #a937d6;
}

.color-purple {
    color: #683dcb;
}

.bg-purple {
    background-color: #683dcb;
}

a.bg-purple:hover {
    background-color: #5326b6;
    color: #fae603;
}

.bg-purple-1 {
    background-color: #9a00ff;
}

a.bg-purple-1:hover {
    background-color: #7500c1;
    color: #fae603;
}

.red-color-1 {
    color: #bd0000;
}

.red-bg-1 {
    background-color: #bd0000;
}

input.red-bg-1:hover,
a.red-bg-1:hover,
button.red-bg-1:hover {
    background-color: #9e0000;
    color: #ffea02;
}

.color-magenta {
    color: #e92668;
}

.bg-magenta {
    background-color: #e92668;
}

button.bg-magenta:hover,
a.bg-magenta:hover {
    background-color: #d31253;
    color: #fff;
}

.input-box:focus-within {
    outline: 2px solid #0066ff;
}

.bg-blue {
    background-color: #0ca0f8;
}

a.bg-blue:hover,
button.bg-blue:hover {
    background-color: #008fe2;
    color: #fff;
}

.bg-yellow {
    background-color: #ffea02;
}

a.bg-yellow:hover {
    background-color: #ffcc02;
    color: #000;
}

.bg-pink {
    background-color: #ff6499;
}

a.bg-pink:hover,
button.bg-pink:hover {
    background-color: #ff397c;
    color: #ffea02;
}

.bg-orange {
    background-color: #ff6a00;
}

a.bg-orange:hover {
    background-color: #ff4400;
    color: #fff;
}

.border-1-px-padd {
    padding: 5px 10px;
    border: 1px solid #a5a5a5;
}

.border-btm-1-px-padd {
    padding: 5px;
    border-bottom: 1px solid #a5a5a5;
}

.border-btm-1-px-padd:last-child {
    border: none !important;
}

.border-none {
    border: none !important;
}