/* *********************************************** */
.input-range-0001-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    background-color: rgba(17, 17, 17, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 2px solid rgba(51, 51, 51, 1);
    gap: 10px;
}

.input-range-0001-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: rgba(7, 120, 139, 1);
    border: 2px solid rgba(51, 51, 51, 1);
}

.input-range-0001 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 2px solid rgba(51, 51, 51, 1);
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(90deg, rgba(55, 116, 148, 1) 30%, rgba(221, 221, 221, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0001::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 24px;
    border: 2px solid rgba(51, 51, 51, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(6, 182, 212, 1);   
    transition: 0.50s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0001::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 24px;
    border: 2px solid rgba(51, 51, 51, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(6, 182, 212, 1);    
    transition: 0.50s ease-in-out; 
}

.input-range-0001::-webkit-slider-thumb:hover {
    border: 2px solid rgba(6, 182, 212, 1);
    background: rgba(7, 120, 139, 1);
    transition: 0.50s ease-in-out; 
}                
/* *********************************************** */
.input-range-0002-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    background-color: rgba(17, 17, 17, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 2px solid rgba(51, 51, 51, 1);
    gap: 10px;
}

.input-range-0002-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(17, 17, 17, 1);
    font-size: 16px;
    border-radius: 25px 25px 25px 25px;
    background: rgba(255, 250, 220, 1);
    border: 2px solid rgba(152, 205, 0, 1);
}

.input-range-0002 {
    appearance: none;
    width: 100%;
    height: 3px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(90deg, rgba(152, 205, 0, 1) 30%, rgba(255, 250, 220, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0002::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 8px;
    height: 24px;
    border: 2px solid rgba(255, 250, 220, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(182, 245, 0, 1);   
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0002::-moz-range-thumb {
    appearance: none;
    width: 8px;
    height: 24px;
    border: 2px solid rgba(255, 250, 220, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(182, 245, 0, 1);    
    transition: 0.5s ease-in-out; 
}

.input-range-0002::-webkit-slider-thumb:hover {
    border: 2px solid rgba(182, 245, 0, 1);
    background: rgba(255, 250, 220, 1);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0003-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 50px;
    background-color: rgba(17, 17, 17, 0);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 2px solid rgba(94, 104, 109, 1);
    gap: 10px;
}

.input-range-0003-count {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(55, 116, 148, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: rgba(173, 238, 217, 1);
    border: 2px solid rgba(94, 104, 109, 1);
}

.input-range-0003-count::before{
    content: "";
    position: absolute;
    background: rgba(173, 238, 217, 1);
    border-radius: 3px;
    top: 8px;
    right: -6px;
    width: 10px;
    height: 10px;
    border: none;
    border-right: 2px solid rgba(94, 104, 109, 1);
    border-top: 2px solid rgba(94, 104, 109, 1);
    transform: rotate(45deg);
    z-index: 3;
}

.input-range-0003 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 2px solid rgba(94, 104, 109, 1);
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(90deg, rgba(169, 191, 168, 1) 30%, rgba(250, 254, 197, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0003::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(250, 254, 197, 1);
    border-radius: 5px 5px 5px 5px;
    background: rgba(173, 238, 217, 1);   
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0003::-moz-range-thumb {
    appearance: none;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(250, 254, 197, 1);
    border-radius: 5px 5px 5px 5px;
    background: rgba(173, 238, 217, 1);    
    transition: 0.5s ease-in-out; 
}

.input-range-0003::-webkit-slider-thumb:hover {
    border: 2px solid rgba(173, 238, 217, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(250, 254, 197, 1);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0004-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 25px;
    background-color: rgba(17, 17, 17, 0);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 2px solid rgba(51, 51, 51, 1);
    gap: 10px;
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
}

.input-range-0004-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: rgba(187, 120, 36, 1);
    border: 1px solid rgba(198, 151, 73, 1);
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
}

.input-range-0004 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 2px solid rgba(198, 151, 73, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(187, 120, 36, 1) 30%, rgba(221, 221, 221, 1) 30%);
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0004::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 24px;
    border: 1px solid rgba(198, 151, 73, 1);
    border-radius: 5px 5px 5px 5px;
    background: rgba(187, 120, 36, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
}

/* Thumb: for Firefox */
.input-range-0004::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 24px;
    border: 1px solid rgba(198, 151, 73, 1);
    border-radius: 5px 5px 5px 5px;
    background: rgba(187, 120, 36, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
}

.input-range-0004::-webkit-slider-thumb:hover {
    border: 1px solid rgba(228, 171, 93, 1);
    background: rgba(227, 160, 86, 1);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0005-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 25px;
    background-color: rgba(17, 17, 17, 0);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    gap: 10px;
    margin: 5px;
}

.input-range-0005-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: rgba(115, 196, 234, 1);
    border: none;
    border-bottom: 4px solid rgba(115, 196, 234, 1);
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
}

.input-range-0005 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: none;
    border-bottom: 2px solid rgba(115, 196, 234, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(115, 196, 234, 1) 30%, rgba(221, 221, 221, 1) 30%);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0005::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 24px;
    border: none;
    border-bottom: 4px solid rgba(115, 196, 234, 1);
    border-radius: 5px 5px 5px 5px;
    background: rgba(115, 196, 234, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

/* Thumb: for Firefox */
.input-range-0005::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 24px;
    border: none;
    border-bottom: 4px solid rgba(115, 196, 234, 1);
    border-radius: 5px 5px 5px 5px;
    background: rgba(115, 196, 234, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0005::-webkit-slider-thumb:hover {
    border: none;
    border-bottom: 24px solid rgba(115, 196, 234, 1);
    background: rgba(115, 196, 234, 1);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0006-main {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(17, 17, 17, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 2px solid rgba(51, 51, 51, 1);
    margin: 10px;
}

.input-range-0006-count {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: -35px;
    left: 0;
    width: 30px;
    height: 30px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 25px 25px 5px 25px;
    background: linear-gradient(95deg, rgba(39, 250, 64, 1) -7%, rgba(74, 20, 225, 1) 100%);
    border: 2px solid rgba(152, 205, 0, 1);
    transform: rotate(45deg);    
}

.input-range-0006-count span {
    transform: rotate(-45deg);
}

.input-range-0006 {
    appearance: none;
    width: 100%;
    height: 3px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(90deg, rgba(39, 252, 64, 1) 30%, rgba(74, 20, 225, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0006::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 8px;
    height: 24px;
    border: 2px solid rgba(255, 250, 220, 1);
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(135deg, rgba(39, 252, 64, 1) -7%, rgba(74, 20, 225, 1) 100%);   
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0006::-moz-range-thumb {
    appearance: none;
    width: 8px;
    height: 24px;
    border: 2px solid rgba(255, 250, 220, 1);
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(135deg, rgba(39, 252, 64, 1) -7%, rgba(74, 20, 225, 1) 100%);    
    transition: 0.5s ease-in-out; 
}

.input-range-0006::-webkit-slider-thumb:hover {
    border: 2px solid rgba(182, 245, 0, 1);
    background: linear-gradient(135deg, rgba(74, 20, 225, 1) -7%, rgba(39, 252, 64, 1) 100%);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0007-main {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(17, 17, 17, 0);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    box-shadow: rgba(255, 255, 255, 0.15) 0 1px 1px, inset rgba(0, 0, 0, 0.5) 0 0 0 1px;
    margin: 10px;
}

.input-range-0007-count {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: -36px;
    left: 0;
    width: 30px;
    height: 30px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: linear-gradient(95deg, rgba(33, 33, 33, 0) -7%, rgba(33, 33, 33, 0) 100%);
    border: none;
    box-shadow: rgba(255, 255, 255, 0.15) 0 1px 1px, inset rgba(0, 0, 0, 0.5) 0 0 0 1px;
    pointer-events: none;
    transform: rotate(45deg);    
}

.input-range-0007-count span {
    transform: rotate(-45deg);
}

.input-range-0007 {
    appearance: none;
    width: 100%;
    height: 7px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(90deg, rgba(17, 197, 64, 0.2) 30%, rgba(254, 20, 22, 0.2) 30%);
    box-shadow: rgba(255, 255, 255, 0.15) 0 1px 1px, inset rgba(0, 0, 0, 0.5) 0 0 0 1px;
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0007::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 8px;
    height: 16px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(135deg, rgba(66, 66, 66, 1) -7%, rgba(33, 33, 33, 1) 100%);   
    transition: 0.5s ease-in-out; 
    box-shadow: rgba(255, 255, 255, 0.15) 0 1px 1px, inset rgba(0, 0, 0, 0.5) 0 0 0 1px;
}

/* Thumb: for Firefox */
.input-range-0007::-moz-range-thumb {
    appearance: none;
    width: 8px;
    height: 16px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(135deg, rgba(66, 66, 66, 1) -7%, rgba(33, 33, 33, 1) 100%);    
    transition: 0.5s ease-in-out; 
    box-shadow: rgba(255, 255, 255, 0.15) 0 1px 1px, inset rgba(0, 0, 0, 0.5) 0 0 0 1px;
}

.input-range-0007::-webkit-slider-thumb:hover {
    border: none;
    background: linear-gradient(135deg, rgba(33, 33, 33, 1) -7%, rgba(66, 66, 66, 1) 100%);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0008-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 25px;
    background-image: linear-gradient(-180deg, rgba(254, 137, 214, 1) 0%, rgba(192, 31, 158, 1) 100%);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid rgba(110, 15, 155, 1);
    gap: 10px;
    margin: 5px;
    box-shadow: 0 8px 6px 0 rgba(0, 0, 0, 0.2), 0 -3px 12px rgba(192, 31, 158, 1) inset, 0 5px 3px rgba(255 ,255, 255, 0.4) inset, 0 3px 4px 0 rgba(254, 137, 214, 1) inset;
}

.input-range-0008-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(-180deg, rgba(254, 137, 214, 1) 0%, rgba(192, 31, 158, 1) 100%);
    border: 1px solid rgba(110, 15, 155, 1);
    box-shadow: 0 8px 6px 0 rgba(0, 0, 0, 0.2), 0 -3px 12px rgba(192, 31, 158, 1) inset, 0 5px 3px rgba(255 ,255, 255, 0.4) inset, 0 3px 4px 0 rgba(254, 137, 214, 1) inset;
}

.input-range-0008 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 1px solid rgba(110, 15, 155, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(254, 137, 214, 1) 30%, rgba(221, 221, 221, 1) 30%);
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0008::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 24px;
    border: 1px solid rgba(110, 15, 155, 1);
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(-180deg, rgba(254, 137, 214, 1) 0%, rgba(192, 31, 158, 1) 100%);   
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0008::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 24px;
    border: 1px solid rgba(110, 15, 155, 1);
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(-180deg, rgba(254, 137, 214, 1) 0%, rgba(192, 31, 158, 1) 100%);    
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
    transition: 0.5s ease-in-out; 
}

.input-range-0008::-webkit-slider-thumb:hover {
    border: 1px solid rgba(110, 15, 155, 1);
    background-image: linear-gradient(90deg, rgba(254, 137, 214, 1) 0%, rgba(192, 31, 158, 1) 100%);
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0009-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 40px;
    background-image: linear-gradient(135deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    gap: 10px;
    margin: 5px;
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
}

.input-range-0009-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(135deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%);
    border: none;
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
}

.input-range-0009 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(254, 137, 214, 1) 30%, rgba(221, 221, 221, 1) 30%);
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0009::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 24px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(135deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%);   
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0009::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 24px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(135deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%);    
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
    transition: 0.5s ease-in-out; 
}

.input-range-0009::-webkit-slider-thumb:hover {
    border: none;
    background-image: linear-gradient(90deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%);
    box-shadow: 0 4px 3px 0 rgba(0, 0, 0, 0.2), 0 -1px 6px rgba(192, 31, 158, 1) inset, 0 3px 1px rgba(255 ,255, 255, 0.4) inset, 0 1px 2px 0 rgba(254, 137, 214, 1) inset;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0010-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 20px;
    background-image: linear-gradient(135deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    gap: 10px;
    margin: 5px;
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
}

.input-range-0010-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 20px;
    color: rgba(241, 241, 241, 1);
    font-size: 26px;
    border-radius: 5px 5px 5px 5px;
    background-color: transparent;
    border: none;
}

.input-range-0010 {
    appearance: none;
    width: 100%;
    height: 4px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(254, 137, 214, 1) 30%, rgba(221, 221, 221, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0010::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 10px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(135deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%); 
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0010::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 10px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(135deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%);  
    transition: 0.5s ease-in-out; 
}

.input-range-0010::-webkit-slider-thumb:hover {
    border: none;
    background-image: linear-gradient(90deg, rgba(169, 108, 254, 1) 0%, rgba(236, 113, 207, 1) 50%, rgba(254, 134, 153, 1) 75%, rgba(254, 168, 102, 1) 100%);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0011-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 15px;
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), radial-gradient(90% 7% at 50% 8%, rgba(255, 255, 255, 0.5) 25%, rgba(255, 255, 255, 0) 50%), rgba(0, 83, 208, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid rgba(157, 196, 254, 1);
    gap: 10px;
    margin: 10px;
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5),  0 -2px 0 2px rgba(0, 0, 0, 0.3), 0 2px 0 2px rgba(255, 255, 255, 0.3), -4px 0 4px rgba(0, 83, 208, 1) inset, 0 4px 4px rgba(255, 255, 255, 0.3) inset,  4px 0 4px rgba(255, 255, 255, 0.3) inset, 0 -4px 4px rgba(0, 83, 208, 1) inset;
}

.input-range-0011-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 20px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 100px 100px 100px 100px;
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), radial-gradient(90% 7% at 50% 8%, rgba(255, 255, 255, 0.5) 25%, rgba(255, 255, 255, 0) 50%), rgba(0, 83, 208, 1);
    border: 1px solid rgba(157, 196, 254, 1);
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5),  0 -2px 0 2px rgba(0, 0, 0, 0.3), 0 2px 0 2px rgba(255, 255, 255, 0.3), -4px 0 4px rgba(0, 83, 208, 1) inset, 0 4px 4px rgba(255, 255, 255, 0.3) inset,  4px 0 4px rgba(255, 255, 255, 0.3) inset, 0 -4px 4px rgba(0, 83, 208, 1) inset;
}

.input-range-0011 {
    appearance: none;
    width: 100%;
    height: 8px;
    border: 1px solid rgba(157, 196, 254, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(0, 83, 208, 1) 30%, rgba(241, 241, 241, 1) 30%);
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5),  0 -2px 0 2px rgba(0, 0, 0, 0.3), 0 2px 0 2px rgba(255, 255, 255, 0.3), -4px 0 4px rgba(0, 82, 208, 1) inset, 0 4px 4px rgba(255, 255, 255, 0.3) inset,  4px 0 4px rgba(255, 255, 255, 0.3) inset, 0 -4px 4px rgba(0, 82, 208, 1) inset;
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0011::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 10px;
    height: 24px;
    border: 1px solid rgba(157, 196, 254, 1);
    border-radius: 5px 5px 5px 5px;
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), radial-gradient(90% 7% at 50% 8%, rgba(255, 255, 255, 0.5) 25%, rgba(255, 255, 255, 0) 50%), rgba(0, 83, 208, 1);   
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5),  0 -2px 0 2px rgba(0, 0, 0, 0.3), 0 2px 0 2px rgba(255, 255, 255, 0.3), -4px 0 4px rgba(0, 83, 208, 1) inset, 0 4px 4px rgba(255, 255, 255, 0.3) inset,  4px 0 4px rgba(255, 255, 255, 0.3) inset, 0 -4px 4px rgba(0, 83, 208, 1) inset;
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0011::-moz-range-thumb {
    appearance: none;
    width: 10px;
    height: 24px;
    border: 1px solid rgba(157, 196, 254, 1);
    border-radius: 5px 5px 5px 5px;
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), radial-gradient(90% 7% at 50% 8%, rgba(255, 255, 255, 0.5) 25%, rgba(255, 255, 255, 0) 50%), rgba(0, 83, 208, 1);    
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5),  0 -2px 0 2px rgba(0, 0, 0, 0.3), 0 2px 0 2px rgba(255, 255, 255, 0.3), -4px 0 4px rgba(0, 83, 208, 1) inset, 0 4px 4px rgba(255, 255, 255, 0.3) inset,  4px 0 4px rgba(255, 255, 255, 0.3) inset, 0 -4px 4px rgba(0, 83, 208, 1) inset;
    transition: 0.5s ease-in-out; 
}

.input-range-0011::-webkit-slider-thumb:hover {
    border: 1px solid rgba(157, 196, 254, 1);
    background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.2)), radial-gradient(90% 7% at 50% 8%, rgba(255, 255, 255, 0.5) 25%, rgba(255, 255, 255, 0) 50%), rgba(0, 103, 208, 1);
    box-shadow: 4px 4px 8px rgba(0, 0, 0, 0.5),  0 -2px 0 2px rgba(0, 0, 0, 0.3), 0 2px 0 2px rgba(255, 255, 255, 0.3), -4px 0 4px rgba(0, 103, 208, 1) inset, 0 4px 4px rgba(255, 255, 255, 0.3) inset,  4px 0 4px rgba(255, 255, 255, 0.3) inset, 0 -4px 4px rgba(0, 103, 208, 1) inset;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0012-main {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(17, 17, 17, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 2px solid rgba(51, 51, 51, 1);
    margin: 10px;
}

.input-range-0012-count {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 3px;
    left: 0;
    width: 30px;
    height: 20px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(-135deg, rgba(247, 44, 91, 1) -7%, rgba(167, 212, 119, 1) 100%);
    border: 1px solid rgba(247, 44, 91, 1);
    user-select: none;
    pointer-events: none;
    cursor: pointer;
}
    
.input-range-0012 {
    appearance: none;
    width: 100%;
    height: 3px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(90deg, rgba(228, 241, 172, 1) 30%, rgba(254, 116, 139, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0012::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 26px;
    height: 16px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(135deg, rgba(39, 252, 64, 0) -7%, rgba(74, 20, 225, 0) 100%);   
    transition: 0.01s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0012::-moz-range-thumb {
    appearance: none;
    width: 26px;
    height: 16px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(135deg, rgba(39, 252, 64, 0) -7%, rgba(74, 20, 225, 0) 100%);    
    transition: 0.01s ease-in-out; 
}

.input-range-0012::-webkit-slider-thumb:hover {
    border: none;
    background: linear-gradient(135deg, rgba(74, 20, 225, 0) -7%, rgba(39, 252, 64, 0) 100%);
    transition: 0.01s ease-in-out; 
}
/* *********************************************** */
.input-range-0013-main {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(17, 17, 17, 0);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    margin: 10px;
}

.input-range-0013-count {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    top: 0px;
    left: 0;
    width: 30px;
    height: 30px;
    color: rgba(188, 242, 246, 1);
    font-size: 16px;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(-90deg, rgba(254, 241, 1, 1) -7%, rgba(1, 107, 254, 1) 100%);
    border: 1px solid rgba(188, 242, 246, 1);
    user-select: none;
    pointer-events: none;
    cursor: pointer;
    transform: rotate(45deg);
}

.input-range-0013-count span {
    transform: rotate(-45deg);
}
    
.input-range-0013 {
    appearance: none;
    width: 100%;
    height: 3px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(90deg, rgba(1, 107, 254, 1) 30%, rgba(254, 241, 1, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0013::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 26px;
    height: 16px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(135deg, rgba(39, 252, 64, 0) -7%, rgba(74, 20, 225, 0) 100%);   
    transition: 0.01s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0013::-moz-range-thumb {
    appearance: none;
    width: 26px;
    height: 16px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(135deg, rgba(39, 252, 64, 0) -7%, rgba(74, 20, 225, 0) 100%);    
    transition: 0.01s ease-in-out; 
}

.input-range-0013::-webkit-slider-thumb:hover {
    border: none;
    background: linear-gradient(135deg, rgba(74, 20, 225, 0) -7%, rgba(39, 252, 64, 0) 100%);
    transition: 0.01s ease-in-out; 
}
/* *********************************************** */
.input-range-0014-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 25px;
    background-color: rgba(194, 251, 215, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 8px 8px 8px 8px;
    border: 2px solid rgba(0, 128, 0, 1);
    gap: 10px;
    margin: 5px;
    box-shadow: rgba(194, 251, 215, 0.2) 0 -25px 18px -14px inset,rgba(194, 251, 215, 0.15) 0 1px 2px,rgba(194, 251, 215, 0.15) 0 2px 4px,rgba(194, 251, 215, 0.15) 0 4px 8px,rgba(194, 251, 215, 0.15) 0 8px 16px,rgba(194, 251, 215, 0.15) 0 16px 32px;
    transform: scale(1) rotate(0deg);
}

.input-range-0014-main:hover {
    transform: scale(1.05) rotate(1deg);
}

.input-range-0014-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(0, 128, 0, 1);
    font-size: 16px;
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 251, 215, 1);
    border: 1px solid rgba(0, 128, 0, 1);
    box-shadow: rgba(194, 251, 215, 0.2) 0 -25px 18px -14px inset,rgba(194, 251, 215, 0.15) 0 1px 2px,rgba(194, 251, 215, 0.15) 0 2px 4px,rgba(194, 251, 215, 0.15) 0 4px 8px,rgba(194, 251, 215, 0.15) 0 8px 16px,rgba(194, 251, 215, 0.15) 0 16px 32px;
}

.input-range-0014 {
    appearance: none;
    width: 100%;
    height: 8px;
    border: 2px solid rgba(0, 128, 0, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(0, 128, 0, 1) 30%, rgba(241, 241, 241, 1) 30%);
    box-shadow: rgba(194, 251, 215, 0.2) 0 -25px 18px -14px inset,rgba(194, 251, 215, 0.15) 0 1px 2px,rgba(194, 251, 215, 0.15) 0 2px 4px,rgba(194, 251, 215, 0.15) 0 4px 8px,rgba(194, 251, 215, 0.15) 0 8px 16px,rgba(194, 251, 215, 0.15) 0 16px 32px;
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0014::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 14px;
    border: 1px solid rgba(0, 128, 0, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 251, 215, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: rgba(194, 251, 215, 0.2) 0 -25px 18px -14px inset,rgba(194, 251, 215, 0.15) 0 1px 2px,rgba(194, 251, 215, 0.15) 0 2px 4px,rgba(194, 251, 215, 0.15) 0 4px 8px,rgba(194, 251, 215, 0.15) 0 8px 16px,rgba(194, 251, 215, 0.15) 0 16px 32px;
}

/* Thumb: for Firefox */
.input-range-0014::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 14px;
    border: 1px solid rgba(0, 128, 0, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 251, 215, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: rgba(194, 251, 215, 0.2) 0 -25px 18px -14px inset,rgba(194, 251, 215, 0.15) 0 1px 2px,rgba(194, 251, 215, 0.15) 0 2px 4px,rgba(194, 251, 215, 0.15) 0 4px 8px,rgba(194, 251, 215, 0.15) 0 8px 16px,rgba(194, 251, 215, 0.15) 0 16px 32px;
}

.input-range-0014::-webkit-slider-thumb:hover {
    border: 1px solid rgba(0, 128, 0, 1);
    background: rgba(194, 251, 215, 1);
    box-shadow: rgba(194, 251, 215, 0.2) 0 -25px 18px -14px inset,rgba(194, 251, 215, 0.15) 0 1px 2px,rgba(194, 251, 215, 0.15) 0 2px 4px,rgba(194, 251, 215, 0.15) 0 4px 8px,rgba(194, 251, 215, 0.15) 0 8px 16px,rgba(194, 251, 215, 0.15) 0 16px 32px;
    border-radius: 5px 5px 5px 5px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0015-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 25px;
    background-color: rgba(194, 230, 251, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 2px solid rgba(0, 83, 128, 1);
    gap: 10px;
    margin: 5px;
    box-shadow: rgba(44, 118, 187, 0.2) 0 -25px 18px -14px inset,rgba(44, 118, 187, 0.15) 0 1px 2px,rgba(44, 118, 187, 0.15) 0 2px 4px,rgba(44, 118, 187, 0.15) 0 4px 8px,rgba(44, 118, 187, 0.15) 0 8px 16px,rgba(44, 118, 187, 0.15) 0 16px 32px;
    transform: rotate(3deg);
}

.input-range-0015-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(0, 83, 128, 1);
    font-size: 16px;
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 230, 251, 1);
    border: 1px solid rgba(0, 83, 128, 1);
    box-shadow: rgba(44, 118, 187, 0.2) 0 -25px 18px -14px inset,rgba(44, 118, 187, 0.15) 0 1px 2px,rgba(44, 118, 187, 0.15) 0 2px 4px,rgba(44, 118, 187, 0.15) 0 4px 8px,rgba(44, 118, 187, 0.15) 0 8px 16px,rgba(44, 118, 187, 0.15) 0 16px 32px;
}

.input-range-0015 {
    appearance: none;
    width: 100%;
    height: 8px;
    border: 1px solid rgba(0, 83, 128, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(194, 230, 251, 1) 30%, rgba(241, 241, 241, 1) 30%);
    box-shadow: rgba(44, 118, 187, 0.2) 0 -25px 18px -14px inset,rgba(44, 118, 187, 0.15) 0 1px 2px,rgba(44, 118, 187, 0.15) 0 2px 4px,rgba(44, 118, 187, 0.15) 0 4px 8px,rgba(44, 118, 187, 0.15) 0 8px 16px,rgba(44, 118, 187, 0.15) 0 16px 32px;
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0015::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    border: 1px solid rgba(0, 83, 128, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 230, 251, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: rgba(44, 118, 187, 0.2) 0 -25px 18px -14px inset,rgba(44, 118, 187, 0.15) 0 1px 2px,rgba(44, 118, 187, 0.15) 0 2px 4px,rgba(44, 118, 187, 0.15) 0 4px 8px,rgba(44, 118, 187, 0.15) 0 8px 16px,rgba(44, 118, 187, 0.15) 0 16px 32px;
}

/* Thumb: for Firefox */
.input-range-0015::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 14px;
    border: 1px solid rgba(0, 83, 128, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 230, 251, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: rgba(44, 118, 187, 0.2) 0 -25px 18px -14px inset,rgba(44, 118, 187, 0.15) 0 1px 2px,rgba(44, 118, 187, 0.15) 0 2px 4px,rgba(44, 118, 187, 0.15) 0 4px 8px,rgba(44, 118, 187, 0.15) 0 8px 16px,rgba(44, 118, 187, 0.15) 0 16px 32px;
}

.input-range-0015::-webkit-slider-thumb:hover {
    border: 1px solid rgba(0, 83, 128, 1);
    background: rgba(194, 230, 251, 1);
    box-shadow: rgba(194, 230, 251, 0.2) 0 -25px 18px -14px inset,rgba(194, 230, 251, 0.15) 0 1px 2px,rgba(194, 230, 251, 0.15) 0 2px 4px,rgba(194, 230, 251, 0.15) 0 4px 8px,rgba(194, 230, 251, 0.15) 0 8px 16px,rgba(194, 230, 251, 0.15) 0 16px 32px;
    border-radius: 25px 25px 25px 25px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0016-under {
    position: relative;
    width: 260px;
    height: 30px;
    background: rgba(33, 33, 33, 1);
    border-radius: 5px 5px 5px 5px;
    border: 3px double rgba(0, 0, 0, 1);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
    box-sizing: border-box;
    margin: 5px;
}

.input-range-0016-main {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    top: 3px;
    left: 3px;
    background-color: rgba(254, 160, 76, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 3px double rgba(0, 0, 0, 1);
    gap: 10px;
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0016-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 22px;
    color: rgba(0, 83, 128, 1);
    font-size: 16px;
    border-radius: 25px 25px 25px 25px;
    background: rgba(254, 160, 76, 1);
    border: 3px double rgba(0, 0, 0, 1);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0016 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 3px double rgba(0, 0, 0, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(254, 160, 76, 1) 30%, rgba(254, 160, 76, 1) 30%);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0016::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    border: 3px double rgba(0, 0, 0, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 230, 251, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

/* Thumb: for Firefox */
.input-range-0016::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 14px;
    border: 3px double rgba(0, 0, 0, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 230, 251, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0016::-webkit-slider-thumb:hover {
    border: 3px double rgba(0, 0, 0, 1);
    background: rgba(194, 230, 251, 1);
    border-radius: 25px 25px 25px 25px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0017-under {
    position: absolute;
    width: 260px;
    height: 30px;
    bottom: 1px;
    left: 1px;
    background: transparent;
    border-radius: 5px 5px 5px 5px;
    border: 2px dotted rgba(241, 241, 241, 1);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
    box-sizing: border-box;
    z-index: 2;
    pointer-events: none;
    user-select: none;
}

.input-range-0017-main {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(61, 209, 231, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 3px double rgba(0, 0, 0, 1);
    gap: 10px;
    margin: 5px;
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0017-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 22px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 25px 25px 25px 25px;
    background: rgba(0, 83, 128, 1);
    border: 2px dotted rgba(241, 241, 241, 1);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0017 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 2px dotted rgba(241, 241, 241, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(0, 83, 128, 1) 30%, rgba(61, 209, 231, 1) 30%);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0017::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    border: 3px double rgba(0, 0, 0, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 230, 251, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

/* Thumb: for Firefox */
.input-range-0017::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 14px;
    border: 3px double rgba(0, 0, 0, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(194, 230, 251, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0017::-webkit-slider-thumb:hover {
    border: 3px double rgba(0, 0, 0, 1);
    background: rgba(194, 230, 251, 1);
    border-radius: 25px 25px 25px 25px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0018-under {
    position: relative;
    width: 260px;
    height: 30px;
    background: transparent;
    border-radius: 5px 5px 5px 5px;
    border: none;
    box-shadow: rgba(203, 227, 241, 1) 4px 4px 0 0,rgba(0, 0, 0, 1) 4px 4px 0 1px;
    box-sizing: border-box;
    margin: 5px;
}

.input-range-0018-main {
    position: absolute;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    top: 0px;
    left: 0px;
    background-color: rgba(203, 227, 241, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid rgba(203, 227, 241, 1);
    box-sizing: border-box;
    gap: 10px;
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0018-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 22px;
    color: rgba(0, 83, 128, 1);
    font-size: 16px;
    border-radius: 3px 3px 3px 3px;
    background: rgba(203, 220, 241, 1);
    border: 1px solid rgba(203, 220, 241, 1);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0018 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 1px solid rgba(203, 220, 241, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(0, 83, 128, 1) 30%, rgba(203, 220, 241, 1) 30%);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0018::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 14px;
    border: 1px solid rgba(203, 220, 241, 1);
    border-radius: 3px 3px 3px 3px;
    background: rgba(203, 220, 241, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

/* Thumb: for Firefox */
.input-range-0018::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 14px;
    border: 1px solid rgba(203, 220, 241, 1);
    border-radius: 3px 3px 3px 3px;
    background: rgba(203, 220, 241, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0018::-webkit-slider-thumb:hover {
    border: 1px solid rgba(203, 220, 241, 1);
    background: rgba(223, 240, 251, 1);
    border-radius: 3px 3px 3px 3px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0019-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 25px;
    background-color: rgba(241, 241, 241, 1);
    padding: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    border: 1px solid rgba(173, 207, 255, 1);
    gap: 10px;
    margin: 5px;
    box-shadow: inset 0 -4px 2px rgba(173, 207, 255, 255);
}

.input-range-0019-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(82, 63, 63, 1);
    font-size: 16px;
    border-radius: 25px 25px 25px 25px;
    background: rgba(241, 241, 241, 1);
    border: 1px solid rgba(173, 207, 255, 1);
    box-shadow: inset 0 -4px 2px rgba(173, 207, 255, 1);
}

.input-range-0019 {
    appearance: none;
    width: 100%;
    height: 8px;
    border: 1px solid rgba(173, 207, 255, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(82, 63, 63, 1) 30%, rgba(241, 241, 241, 1) 30%);
    box-shadow: inset 0 -2px 1px rgba(173, 207, 255, 255);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0019::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 14px;
    border: 1px solid rgba(173, 207, 255, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(241, 241, 241, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: inset 0 -2px 1px rgba(173, 207, 255, 1);
}

/* Thumb: for Firefox */
.input-range-0019::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 14px;
    border: 1px solid rgba(173, 207, 255, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(241, 241, 241, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: inset 0 -2px 1px rgba(173, 207, 255, 1);
}

.input-range-0019::-webkit-slider-thumb:hover {
    border: 1px solid rgba(173, 207, 255, 1);
    background: rgba(241, 241, 241, 1);
    box-shadow: inset 0 -2px 1px rgba(173, 207, 255, 1);
    border-radius: 5px 5px 5px 5px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0020-under {
    position: absolute;
    bottom: -10px;
    left: -5px;
    width: 270px;
    height: 5px;
    background: rgba(106, 113, 129, 1);
    border-radius: 5px 5px 5px 5px;
    border: none;
    box-sizing: border-box;
}

.input-range-0020-main {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(40, 40, 40, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    gap: 10px;
    margin: 10px;
}

.input-range-0020-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 22px;
    color: rgba(173, 216, 230, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: rgba(106, 113, 129, 1);
    border: none;
}

.input-range-0020 {
    appearance: none;
    width: 100%;
    height: 6px;
    border: 1px solid rgba(173, 216, 230, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(40, 40, 40, 1) 30%, rgba(106, 113, 129, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0020::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 16px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background: rgba(173, 216, 230, 1);   
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0020::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 16px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background: rgba(173, 216, 230, 1);    
    transition: 0.5s ease-in-out; 
}

.input-range-0020::-webkit-slider-thumb:hover {
    border: none;
    background: rgba(173, 216, 230, 1);
    border-radius: 5px 5px 5px 5px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0021-under {
    position: absolute;
    bottom: -10px;
    left: -5px;
    width: 270px;
    height: 5px;
    background: rgba(106, 113, 129, 1);
    border-radius: 5px 5px 5px 5px;
    border: none;
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
    box-sizing: border-box;
}

.input-range-0021-main {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(40, 40, 40, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    gap: 10px;
    margin: 10px;
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0021-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 22px;
    color: rgba(173, 216, 230, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: rgba(106, 113, 129, 1);
    border: none;
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0021 {
    appearance: none;
    width: 100%;
    height: 6px;
    border: 1px solid rgba(173, 216, 230, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(40, 40, 40, 1) 30%, rgba(106, 113, 129, 1) 30%);
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0021::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 16px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background: rgba(173, 216, 230, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

/* Thumb: for Firefox */
.input-range-0021::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 16px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background: rgba(173, 216, 230, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: -2px -2px 5px rgba(64, 75, 78, 0.2), 2px 2px 5px rgba(0, 0, 0, 0.9), inset -2px -2px 5px rgba(64, 75, 78, 0.2), inset 2px 2px 5px rgba(0, 0, 0, 0.9);
}

.input-range-0021::-webkit-slider-thumb:hover {
    border: none;
    background: rgba(173, 216, 230, 1);
    border-radius: 5px 5px 5px 5px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0022-main {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 40px;
    background-color: rgba(17, 17, 17, 0);
    padding: 5px 10px 5px 10px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    margin: 5px;
}

.input-range-0022-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 16px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: rgba(106, 113, 129, 1);
    border: none;
}

.input-range-0022-in-box {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 250px;
    height: 20px;
    background-color: rgba(51, 51, 51, 1);
    border-radius: 5px 5px 5px 5px;
    padding: 5px 5px 5px 5px;
    gap: 10px;
}
                
.input-range-0022-top {
    position: absolute;
    top: 5px;
    left: 0px;
    width: 100%;
    height: 3px;
    border-radius: 3px;
    background: rgba(106, 113, 129, 1);
}

.input-range-0022-bottom {
    position: absolute;
    bottom: 5px;
    left: 0px;
    width: 100%;
    height: 3px;
    border-radius: 3px;
    background: rgba(106, 113, 129, 1);
}

.input-range-0022-left {
    position: absolute;
    top: 0px;
    left: 5px;
    width: 3px;
    height: 100%;
    border-radius: 3px;
    background: rgba(106, 113, 129, 1);
}

.input-range-0022-right {
    position: absolute;
    top: 0px;
    right: 5px;
    width: 3px;
    height: 100%;
    border-radius: 3px;
    background: rgba(106, 113, 129, 1);
}

.input-range-0022 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 2px solid rgba(51, 51, 51, 1);
    border-radius: 25px 25px 25px 25px;
    background: linear-gradient(90deg, rgba(106, 113, 129, 1) 30%, rgba(221, 221, 221, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0022::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(51, 51, 51, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(106, 113, 129, 1);   
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0022::-moz-range-thumb {
    appearance: none;
    width: 20px;
    height: 20px;
    border: 2px solid rgba(51, 51, 51, 1);
    border-radius: 25px 25px 25px 25px;
    background: rgba(106, 113, 129, 1);    
    transition: 0.5s ease-in-out; 
}

.input-range-0022::-webkit-slider-thumb:hover {
    border: 2px solid rgba(106, 113, 129, 1);
    background: rgba(51, 51, 51, 1);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0023-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background: linear-gradient(to bottom, rgba(167, 209, 41, 1) 0%, rgba(97, 111, 57, 1) 100%);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid rgba(97, 111, 57, 1);
    gap: 10px;
    box-shadow: 0 6px 2px -1px rgba(50, 57, 29, 1);
    transform: perspective(400px) rotateX(15deg);
    margin: 5px;
}

.input-range-0023-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 20px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background: linear-gradient(to bottom, rgba(167, 209, 41, 1) 0%, rgba(97, 111, 57, 1) 100%);
    border: 1px solid rgba(97, 111, 57, 1);
    box-shadow: 0 6px 2px -1px rgba(50, 57, 29, 1);
    transform: perspective(50px) rotateX(15deg);
}

.input-range-0023 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 1px solid rgba(50, 57, 29, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(97, 111, 57, 1) 30%, rgba(167, 209, 41, 1) 30%);
    box-shadow: 0 6px 2px -1px rgba(50, 57, 29, 1);
    transform: perspective(200px) rotateX(15deg);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0023::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 16px;
    border: 1px solid rgba(50, 57, 29, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(to bottom, rgba(167, 209, 41, 1) 0%, rgba(97, 111, 57, 1) 100%);   
    box-shadow: 0 6px 2px -1px rgba(50, 57, 29, 1);
    transform: perspective(30px) rotateX(15deg);
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0023::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 16px;
    border: 1px solid rgba(50, 57, 29, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(to bottom, rgba(167, 209, 41, 1) 0%, rgba(97, 111, 57, 1) 100%);    
    box-shadow: 0 6px 2px -1px rgba(50, 57, 29, 1);
    transform: perspective(30px) rotateX(15deg);
    transition: 0.5s ease-in-out; 
}

.input-range-0023::-webkit-slider-thumb:hover {
    border: 1px solid rgba(50, 57, 29, 1);
    background: linear-gradient(to bottom, rgba(97, 111, 57, 1) 0%, rgba(167, 209, 41, 1) 100%);
    box-shadow: 0 6px 2px -1px rgba(50, 57, 29, 1);
    transform: perspective(30px) rotateX(15deg);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0024-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(17, 17, 17, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    gap: 10px;
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    margin: 5px;
}

.input-range-0024-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 20px;
    color: rgba(200, 170, 170, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background-color: rgba(17, 17, 17, 1);
    border: none;
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
}

.input-range-0024 {
    appearance: none;
    width: 100%;
    height: 6px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(160, 130, 130, 1) 30%, rgba(200, 170, 170, 1) 30%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0024::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 12px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background-color: rgba(17, 17, 17, 1);   
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0024::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 12px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background-color: rgba(17, 17, 17, 1);    
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    transition: 0.5s ease-in-out; 
}

.input-range-0024::-webkit-slider-thumb:hover {
    border: none;
    background-color: rgba(17, 17, 17, 1);
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0025-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(17, 17, 17, 1);
    padding: 5px 5px 5px 5px;
    border-radius: 5px 5px 5px 5px;
    border: 1px solid rgba(97, 111, 57, 1);
    gap: 10px;
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    margin: 5px;
}

.input-range-0025-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 20px;
    color: rgba(167, 209, 41, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background-color: rgba(17, 17, 17, 1);
    border: 1px solid rgba(97, 111, 57, 1);
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
}

.input-range-0025 {
    appearance: none;
    width: 100%;
    height: 12px;
    border: 1px solid rgba(50, 57, 29, 1);
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(97, 111, 57, 1) 30%, rgba(167, 209, 41, 1) 30%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0025::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 16px;
    border: 1px solid rgba(50, 57, 29, 1);
    border-radius: 3px 3px 3px 3px;
    background-color: rgba(17, 17, 17, 1);   
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0025::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 16px;
    border: 1px solid rgba(50, 57, 29, 1);
    border-radius: 3px 3px 3px 3px;
    background-color: rgba(17, 17, 17, 1);    
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    transition: 0.5s ease-in-out; 
}

.input-range-0025::-webkit-slider-thumb:hover {
    border: 1px solid rgba(50, 57, 29, 1);
    background-color: rgba(17, 17, 17, 1);
    background-image: radial-gradient(76% 151% at 52% -52%, rgba(255, 255, 255, 0.23) 0%, transparent 100%);
    box-shadow: rgba(255, 255, 255, 0.2) 0px 1px 0px 0px inset, rgba(0, 0, 0, 0.9) 0px 0px 0px 1px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0026-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 25px;
    background-color: rgba(21, 179, 146, 1);
    padding: 8px 8px 8px 8px;
    border-radius: 8px 8px 8px 8px;
    border: 4px solid rgba(115, 236, 139, 1);
    gap: 10px;
    margin: 5px;
    box-shadow: 0 0 4px 1px rgba(21, 179, 146, 146), 0 0 16px 1px rgba(21, 179, 146, 146), inset 0 0 2px 1px rgba(21, 179, 146, 146);
}

.input-range-0026-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 30px;
    color: rgba(115, 236, 139, 1);
    font-size: 16px;
    border-radius: 25px 25px 25px 25px;
    background-color: rgba(21, 179, 146, 1);
    border: 4px solid rgba(115, 236, 139, 1);
    box-shadow: 0 0 4px 1px rgba(21, 179, 146, 1), 0 0 16px 1px rgba(21, 179, 146, 1), inset 0 0 2px 1px rgba(21, 179, 146, 1);
}

.input-range-0026 {
    appearance: none;
    width: 100%;
    height: 8px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(115, 236, 139, 1) 30%, rgba(115, 236, 139, 1) 30%);
    box-shadow: 0 0 4px 1px rgba(21, 179, 146, 146), 0 0 16px 1px rgba(21, 179, 146, 146), inset 0 0 2px 1px rgba(21, 179, 146, 146);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0026::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 14px;
    border: 4px solid rgba(115, 236, 139, 1);
    border-radius: 25px 25px 25px 25px;
    background-color: rgba(21, 179, 146, 1);   
    transition: 0.5s ease-in-out; 
    box-shadow: 0 0 4px 1px rgba(21, 179, 146, 1), 0 0 16px 1px rgba(21, 179, 146, 1), inset 0 0 2px 1px rgba(21, 179, 146, 1);
}

/* Thumb: for Firefox */
.input-range-0026::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 14px;
    border: 4px solid rgba(115, 236, 139, 1);
    border-radius: 25px 25px 25px 25px;
    background-color: rgba(21, 179, 146, 1);    
    transition: 0.5s ease-in-out; 
    box-shadow: 0 0 4px 1px rgba(21, 179, 146, 1), 0 0 16px 1px rgba(21, 179, 146, 1), inset 0 0 2px 1px rgba(21, 179, 146, 1);
}

.input-range-0026::-webkit-slider-thumb:hover {
    border: 4px solid rgba(115, 236, 139, 1);
    background-color: rgba(21, 179, 146, 1);
    box-shadow: 0 0 4px 1px rgba(21, 179, 146, 1), 0 0 16px 1px rgba(21, 179, 146, 1), inset 0 0 2px 1px rgba(21, 179, 146, 1);
    border-radius: 5px 5px 5px 5px;
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0027-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-color: rgba(0, 0, 0, 1);
    padding: 5px 5px 5px 10px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    gap: 10px;
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    margin: 5px;
}

.input-range-0027-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 20px;
    color: rgba(200, 170, 170, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background-color: rgba(0, 0, 0, 1);
    border: none;
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
}

.input-range-0027 {
    appearance: none;
    width: 100%;
    height: 6px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(160, 130, 130, 1) 30%, rgba(200, 170, 170, 1) 30%);
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0027::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 24px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background-color: rgba(0, 0, 0, 1);   
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0027::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 24px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background-color: rgba(0, 0, 0, 1);    
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    transition: 0.5s ease-in-out; 
}

.input-range-0027::-webkit-slider-thumb:hover {
    border: none;
    background-color: rgba(17, 17, 17, 1);
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0028-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 30px;
    background-image: linear-gradient(0deg, rgba(65, 85, 139, 1) 0%, rgba(41, 53, 86, 1) 50%, rgba(89, 131, 252, 1) 50%, rgba(89, 131, 252, 1) 100%);
    padding: 5px 5px 5px 10px;
    border-radius: 5px 5px 5px 5px;
    border: none;
    gap: 10px;
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    margin: 5px;
}

.input-range-0028-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 50px;
    height: 20px;
    color: rgba(241, 241, 241, 1);
    font-size: 16px;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(0deg, rgba(65, 85, 139, 1) 0%, rgba(41, 53, 86, 1) 50%, rgba(89, 131, 252, 1) 50%, rgba(89, 131, 252, 1) 100%);
    border: none;
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
}

.input-range-0028 {
    appearance: none;
    width: 100%;
    height: 6px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(69, 111, 232, 1) 30%, rgba(109, 151, 252, 1) 30%);
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0028::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 14px;
    height: 24px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background-image: linear-gradient(0deg, rgba(65, 85, 139, 1) 0%, rgba(41, 53, 86, 1) 50%, rgba(89, 131, 252, 1) 50%, rgba(89, 131, 252, 1) 100%);   
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0028::-moz-range-thumb {
    appearance: none;
    width: 14px;
    height: 24px;
    border: none;
    border-radius: 25px 25px 25px 25px;
    background-image: linear-gradient(0deg, rgba(65, 85, 139, 1) 0%, rgba(41, 53, 86, 1) 50%, rgba(89, 131, 252, 1) 50%, rgba(89, 131, 252, 1) 100%);    
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    transition: 0.5s ease-in-out; 
}

.input-range-0028::-webkit-slider-thumb:hover {
    border: none;
    background-image: linear-gradient(0deg, rgba(85, 105, 159, 1) 0%, rgba(61, 73, 106, 1) 50%, rgba(109, 151, 254, 1) 50%, rgba(109, 151, 254, 1) 100%);
    box-shadow: inset 0 0px 5px 0px rgba(255, 255, 255, 0.15), inset 0px 3px 5px 0px rgba(255, 255, 255, 0.1), inset 0px 1px 3px 0px rgba(255, 255, 255, 0.4), inset 0px 2px 10px 0px rgba(0, 0, 0, 0.25);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
.input-range-0029-main {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 260px;
    height: 20px;
    background-image: linear-gradient(-75deg, rgba(0, 108, 254, 1) 0%, rgba(236, 255, 207, 1) 50%, rgba(255, 134, 0, 1) 75%, rgba(255, 0, 102, 1) 100%);
    padding: 5px 5px 5px 10px;
    border-radius: 100px 25px 25px 100px;
    border: none;
    gap: 10px;
    margin: 5px;
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
}

.input-range-0029-count {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 60px;
    height: 16px;
    color: rgba(241, 241, 241, 1);
    font-size: 18px;
    border-radius: 100px 25px 25px 100px;
    background-image: linear-gradient(0deg, rgba(255, 0, 0, 1) 0%, rgba(255, 255, 255, 1) 50%, rgba(100, 255, 255, 1) 75%, rgba(0, 0, 255, 1) 100%);
    border: none;
    box-shadow: -5px -5px 15px rgba(64, 75, 78, 0.2), 5px 5px 15px rgba(0, 0, 0, 0.9), inset -5px -5px 15px rgba(64, 75, 78, 0.2), inset 5px 5px 15px rgba(0, 0, 0, 0.9);
}

.input-range-0029 {
    appearance: none;
    width: 100%;
    height: 4px;
    border: none;
    border-radius: 3px 3px 3px 3px;
    background: linear-gradient(90deg, rgba(204, 45, 153, 1) 30%, rgba(100, 221, 221, 1) 30%);
    cursor: pointer;
}

/* Thumb: for Chrome, Safari, Edge */
.input-range-0029::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 24px;
    height: 10px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(-75deg, rgba(0, 108, 254, 1) 0%, rgba(236, 255, 207, 1) 50%, rgba(254, 134, 0, 1) 75%, rgba(254, 0, 102, 1) 100%); 
    transition: 0.5s ease-in-out; 
}

/* Thumb: for Firefox */
.input-range-0029::-moz-range-thumb {
    appearance: none;
    width: 24px;
    height: 10px;
    border: none;
    border-radius: 5px 5px 5px 5px;
    background-image: linear-gradient(-75deg, rgba(0, 108, 254, 1) 0%, rgba(236, 255, 207, 1) 50%, rgba(254, 134, 0, 1) 75%, rgba(254, 0, 102, 1) 100%);  
    transition: 0.5s ease-in-out; 
}

.input-range-0029::-webkit-slider-thumb:hover {
    border: none;
    background-image: linear-gradient(75deg, rgba(0, 108, 254, 1) 0%, rgba(236, 254, 207, 1) 50%, rgba(254, 134, 0, 1) 75%, rgba(254, 0, 102, 1) 100%);
    transition: 0.5s ease-in-out; 
}
/* *********************************************** */
/* *********************************************** */