.switch {
    font-size: 1rem;
    position: relative;
}
.switch input {
    position: absolute;
    height: 1px;
    width: 1px;
    background: none;
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden;
    padding: 0;
}
.switch input + label {
    position: relative;
    min-width: calc(calc(2.375rem * .8) * 2);
    border-radius: calc(2.375rem * .8);
    height: calc(2.375rem * .8);
    line-height: calc(2.375rem * .8);
    display: inline-block;
    cursor: pointer;
    outline: none;
    user-select: none;
    vertical-align: middle;
    text-indent: calc(calc(calc(2.375rem * .8) * 2) + .5rem);
}
.switch input + label::before,
.switch input + label::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: calc(calc(2.375rem * .8) * 2);
    bottom: 0;
    display: block;
}
.switch input + label::before {
    right: 0;
    background-color: #dee2e6;
    border-radius: calc(2.375rem * .8);
    transition: 0.2s all;
}
.switch input + label::after {
    top: 2px;
    left: 2px;
    width: calc(calc(2.375rem * .8) - calc(2px * 2));
    height: calc(calc(2.375rem * .8) - calc(2px * 2));
    border-radius: 50%;
    background-color: white;
    transition: 0.2s all;
}
.switch input:checked + label::before {
    background-color: #08d;
}
.switch input:checked + label::after {
    margin-left: calc(2.375rem * .8);
}
.switch input:focus + label::before {
    outline: none;
    box-shadow: 0 0 0 0.2rem rgba(0, 136, 221, 0.25);
}
.switch input:disabled + label {
    color: #868e96;
    cursor: not-allowed;
}
.switch input:disabled + label::before {
    background-color: #e9ecef;
}
.switch.switch-sm {
    font-size: 0.875rem;
}
.switch.switch-sm input + label {
    min-width: calc(calc(1.9375rem * .8) * 2);
    height: calc(1.9375rem * .8);
    line-height: calc(1.9375rem * .8);
    text-indent: calc(calc(calc(1.9375rem * .8) * 2) + .5rem);
}
.switch.switch-sm input + label::before {
    width: calc(calc(1.9375rem * .8) * 2);
}
.switch.switch-sm input + label::after {
    width: calc(calc(1.9375rem * .8) - calc(2px * 2));
    height: calc(calc(1.9375rem * .8) - calc(2px * 2));
}
.switch.switch-sm input:checked + label::after {
    margin-left: calc(1.9375rem * .8);
}
.switch.switch-lg {
    font-size: 1.25rem;
}
.switch.switch-lg input + label {
    min-width: calc(calc(3rem * .8) * 2);
    height: calc(3rem * .8);
    line-height: calc(3rem * .8);
    text-indent: calc(calc(calc(3rem * .8) * 2) + .5rem);
}
.switch.switch-lg input + label::before {
    width: calc(calc(3rem * .8) * 2);
}
.switch.switch-lg input + label::after {
    width: calc(calc(3rem * .8) - calc(2px * 2));
    height: calc(calc(3rem * .8) - calc(2px * 2));
}
.switch.switch-lg input:checked + label::after {
    margin-left: calc(3rem * .8);
}
.switch + .switch {
    margin-left: 1rem;
}

@keyframes yellowfade {
    from {
        background: yellow;
    }
    to {
        background: transparent;
    }
}

.yellow-fade {
    animation-name: yellowfade;
    animation-duration: 3.5s;
}


@-webkit-keyframes animate-slide-right {
    from {
        left: 0;
    }
    to {
        left: 100%;
    }
}

@keyframes animate-slide-right {
    from {
        left: 0;
    }
    to {
        left: 100%;
    }
}

.animation-slide-right {
    left: 0%;
    opacity: 0.5;
    position: absolute;
    -webkit-animation: animate-slide-right 25s;
    animation: animate-slide-right 25s;
}


.bg-black {
    background: #333333 !important;
}
.text-black {
    color: #333333 !important;
}
.bg-blue {
    background: #007bff !important;
}
.text-blue {
    color: #007bff !important;
}
.outline-blue {
    border-radius: 10px !important;
    border: 1px solid #007bff !important;
    padding: 10px !important;
}
.bg-indigo {
    background: #6610f2 !important;
}
.text-indigo {
    color: #6610f2 !important;
}
.outline-indigo {
    border-radius: 10px !important;
    border: 1px solid #6610f2 !important;
    padding: 10px !important;
}
.bg-purple {
    background: #6f42c1 !important;
}
.text-purple {
    color: #6f42c1 !important;
}
.outline-purple {
    border-radius: 10px !important;
    border: 1px solid #6f42c1 !important;
    padding: 10px !important;
}
.bg-pink {
    background: #e83e8c !important;
}
.text-pink {
    color: #e83e8c !important;
}
.outline-pink {
    border-radius: 10px !important;
    border: 1px solid #e83e8c !important;
    padding: 10px !important;
}
.bg-pink-hot {
    background: #ff69b4 !important;
}
.text-pink-hot {
    color: #ff69b4 !important;
}
.outline-pink-hot {
    border-radius: 10px !important;
    border: 1px solid #ff69b4 !important;
    padding: 10px !important;
}
.bg-pink-deep {
    background: #ff1493 !important;
}
.text-pink-deep {
    color: #ff1493 !important;
}
.outline-pink-deep {
    border-radius: 10px !important;
    border: 1px solid #ff1493 !important;
    padding: 10px !important;
}
.bg-red {
    background: #dc3545 !important;
}
.text-red {
    color: #dc3545 !important;
}
.outline-red {
    border-radius: 10px !important;
    border: 1px solid #dc3545 !important;
    padding: 10px !important;
}
.bg-red-bright {
    background: #ff0000 !important;
}
.text-red-bright {
    color: #ff0000 !important;
}
.outline-red-bright {
    border-radius: 10px !important;
    border: 1px solid #ff0000 !important;
    padding: 10px !important;
}
.bg-orange {
    background: #fd7e14 !important;
}
.text-orange {
    color: #fd7e14 !important;
}
.outline-orange {
    border-radius: 10px !important;
    border: 1px solid #fd7e14 !important;
    padding: 10px !important;
}
.bg-yellow {
    background: #ffc107 !important;
}
.text-yellow {
    color: #ffc107 !important;
}
.outline-yellow {
    border-radius: 10px !important;
    border: 1px solid #ffc107 !important;
    padding: 10px !important;
}
.bg-yellow-bright {
    background: #ffff00 !important;
}
.text-yellow-bright {
    color: #ffff00 !important;
}
.outline-yellow-bright {
    border-radius: 10px !important;
    border: 1px solid #ffff00 !important;
    padding: 10px !important;
}
.bg-green {
    background: #28a745 !important;
}
.text-green {
    color: #28a745 !important;
}
.outline-green {
    border-radius: 10px !important;
    border: 1px solid #28a745 !important;
    padding: 10px !important;
}
.bg-green-bright {
    background: #00ff00 !important;
}
.text-green-bright {
    color: #00ff00 !important;
}
.outline-green-bright {
    border-radius: 10px !important;
    border: 1px solid #00ff00 !important;
    padding: 10px !important;
}
.bg-teal {
    background: #20c997 !important;
}
.text-teal {
    color: #20c997 !important;
}
.outline-teal {
    border-radius: 10px !important;
    border: 1px solid #20c997 !important;
    padding: 10px !important;
}
.bg-cyan {
    background: #17a2b8 !important;
}
.text-cyan {
    color: #17a2b8 !important;
}
.outline-cyan {
    border-radius: 10px !important;
    border: 1px solid #17a2b8 !important;
    padding: 10px !important;
}
.bg-white {
    background: #ffffff !important;
}
.outline-white {
    border-radius: 10px !important;
    border: 1px solid #ffffff !important;
    padding: 10px !important;
}
.bg-grey {
    background: #6c757d !important;
}
.text-grey {
    color: #6c757d !important;
}
.outline-grey {
    border-radius: 10px !important;
    border: 1px solid #6c757d !important;
    padding: 10px !important;
}
.bg-grey-light {
    background: #cccccc !important;
}
.text-grey-light {
    color: #cccccc !important;
}
.outline-grey-light {
    border-radius: 10px !important;
    border: 1px solid #cccccc !important;
    padding: 10px !important;
}
.bg-grey-dark {
    background: #343a40 !important;
}
.text-grey-dark {
    color: #343a40 !important;
}
.outline-grey-dark {
    border-radius: 10px !important;
    border: 1px solid #343a40 !important;
    padding: 10px !important;
}
.bg-blue-bright {
    background: #1bbae1 !important;
}
.text-blue-bright {
    color: #1bbae1 !important;
}
.outline-blue-bright {
    border-radius: 10px !important;
    border: 1px solid #1bbae1 !important;
    padding: 10px !important;
}
.bg-blue-ultra {
    background: #00ddff !important;
}
.text-blue-ultra {
    color: #00ddff !important;
}
.outline-blue-ultra {
    border-radius: 10px !important;
    border: 1px solid #00ddff !important;
    padding: 10px !important;
}
.bg-purple-light {
    background: #7289da !important;
}
.text-purple-light {
    color: #7289da !important;
}
.outline-purple-light {
    border-radius: 10px !important;
    border: 1px solid #7289da !important;
    padding: 10px !important;
}
.bg-purple-dark {
    background: #394263 !important;
}
.text-purple-dark {
    color: #394263 !important;
}
.outline-purple-dark {
    border-radius: 10px !important;
    border: 1px solid #394263 !important;
    padding: 10px !important;
}
.bg-brown {
    background: #8b4513 !important;
}
.text-brown {
    color: #8b4513 !important;
}
.outline-brown {
    border-radius: 10px !important;
    border: 1px solid #8b4513 !important;
    padding: 10px !important;
}
.box-shadow {
    box-shadow: 1px 1px 1px #666666 !important;
}
.text-shadow {
    text-shadow: 1px 1px 4px rgba(0, 0, 1, .71) !important;
}
.text-bold {
    font-weight: bolder !important;
}

.btn-group-full-width {
    display: flex;
}

.btn-group-full-width .btn {
    flex: 1;
}

.rainbow1 {
    background-color: #ff1493;
    background-image: linear-gradient(319deg, #ff1493 0%, #0000ff 37%, #ff8c00 100%);
}
