﻿



.bordered-table td {
    border: 0px solid #dee2e6;
    height:2em;
}

.bordered-table tr {
    border: 0px solid #dee2e6;
    height: 2em;
}

.centered-td {
    text-align: center;
}

.centered-th {
    text-align: center;
}

.bordered-table th {
    /*border: 2px solid #dee2e6;*/
}

.Ice-cold {
    color: #00bfff !important;
}

.Cold {
    color: #27d1d1 !important; /* Light Blue */
}

.Neutral {
    color: #33cc33 !important; /* Green */
}

.Warm {
    color: #ffaa00 !important; /* Yellow */
}

.Flaming-hot {
    color: #ff6600 !important; /* Orange */
}


.input-group {
    z-index: 0 !important;
}

.cond-border-aqua {
    border-color: #087681;
}

.cond-border-dark {
    border-color: #414042;
}

.cond-border-pink {
    border-color: #ed1b6f;
}

.cond-border-purple {
    border-color: #7156a4;
}

.cond-border-yellow {
    border-color: #febe14;
}

.cond-border-blue {
    border-color: #537dbf;
}

.cond-border-fog {
    border-color: #E6F1F2;
}

.cond-bg-aqua {
    background-color: #087681;
}

.cond-bg-dark {
    background-color: #414042;
}

.cond-bg-pink {
    background-color: #ed1b6f;
}

.cond-bg-purple {
    background-color: #7156a4;
}

.cond-bg-yellow {
    background-color: #febe14;
}

.cond-bg-blue {
    background-color: #537dbf;
}

.cond-bg-fog {
    background-color: #E6F1F2;
}


.cond-aqua {
    color: #087681;
}

.cond-dark {
    color: #414042;
}

.cond-pink {
    color: #ed1b6f;
}

.cond-purple {
    color: #7156a4;
}

.cond-yellow {
    color: #febe14;
}

.cond-blue {
    color: #537dbf;
}

.cond-fog {
    color: #E6F1F2;
}
@keyframes rotate {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

.cond-Spiral {
    animation: rotate 20s infinite linear;
    position: absolute;
    height: 200vh;

    top: 17vh;
    left: 67vw;
    opacity: 1;

}



.container-fluid {
    position: relative;
    overflow: hidden;
}


/* Aqua button */
.btn-cond-aqua {
    background-color: #087681; /* Normal state */
    border-color: #087681;
    font-weight: 600;
}

    .btn-cond-aqua:hover,
    .btn-cond-aqua:focus {
        background-color: #065e67; /* Darker shade on hover */
        border-color: #065e67;
    }

        .btn-cond-aqua:active,
        .btn-cond-aqua:focus:active {
            background-color: #04464d; /* Even darker shade for pressed state */
            border-color: #04464d;
            outline: none; /* Remove the outline to avoid visual distraction */
        }

/* Dark button */
.btn-cond-dark {
    background-color: #414042; /* Normal state */
    border-color: #414042;
    font-weight: 600;
}

    .btn-cond-dark:hover,
    .btn-cond-dark:focus {
        background-color: #333033; /* Darker shade on hover */
        border-color: #333033;
    }

        .btn-cond-dark:active,
        .btn-cond-dark:focus:active {
            background-color: #1f1e1f; /* Even darker shade for pressed state */
            border-color: #1f1e1f;
            outline: none;
        }

/* Pink button */
.btn-cond-pink {
    background-color: #ed1b6f; /* Normal state */
    border-color: #ed1b6f;
    font-weight: 800;
}

    .btn-cond-pink:hover,
    .btn-cond-pink:focus {
        background-color: #cc165e; /* Darker shade on hover */
        border-color: #cc165e;
    }

        .btn-cond-pink:active,
        .btn-cond-pink:focus:active {
            background-color: #a8134f; /* Even darker shade for pressed state */
            border-color: #a8134f;
            outline: none;
        }

/* Purple button */
.btn-cond-purple {
    background-color: #7156a4; /* Normal state */
    border-color: #7156a4;
    font-weight: 600;
}

    .btn-cond-purple:hover,
    .btn-cond-purple:focus {
        background-color: #5e4988; /* Darker shade on hover */
        border-color: #5e4988;
    }

        .btn-cond-purple:active,
        .btn-cond-purple:focus:active {
            background-color: #4c3c6e; /* Even darker shade for pressed state */
            border-color: #4c3c6e;
            outline: none;
        }

/* Yellow button */
.btn-cond-yellow {
    background-color: #febe14; /* Normal state */
    border-color: #febe14;
    font-weight: 600;
}

    .btn-cond-yellow:hover,
    .btn-cond-yellow:focus {
        background-color: #d9a412; /* Darker shade on hover */
        border-color: #d9a412;
    }

        .btn-cond-yellow:active,
        .btn-cond-yellow:focus:active {
            background-color: #b58910; /* Even darker shade for pressed state */
            border-color: #b58910;
            outline: none;
        }

/* Blue button */
.btn-cond-blue {
    background-color: #537dbf; /* Normal state */
    border-color: #537dbf;
}

    .btn-cond-blue:hover,
    .btn-cond-blue:focus {
        background-color: #466a9f; /* Darker shade on hover */
        border-color: #466a9f;
    }

        .btn-cond-blue:active,
        .btn-cond-blue:focus:active {
            background-color: #3a5880; /* Even darker shade for pressed state */
            border-color: #3a5880;
            outline: none;
        }

/* Fog button */
.btn-cond-fog {
    background-color: #E6F1F2; /* Normal state */
    border-color: #E6F1F2;
}

    .btn-cond-fog:hover,
    .btn-cond-fog:focus {
        background-color: #b3c2c4; /* Darker shade on hover */
        border-color: #b3c2c4;
    }

        .btn-cond-fog:active,
        .btn-cond-fog:focus:active {
            background-color: #809899; /* Even darker shade for pressed state */
            border-color: #809899;
            outline: none;
        }


.w-10 {
    width: 10%;
}

.w-15 {
    width: 15%;
}

.w-20 {
    width: 20%;
}

.w-30 {
    width: 30%;
}

.w-35 {
    width: 35%;
}

.w-40 {
    width: 40%;
}

.w-45 {
    width: 45%;
}




.w-55 {
    width: 55%;
}

.w-60 {
    width: 60%;
}

.w-65 {
    width: 65%;
}


.w-70 {
    width: 70%;
}

.w-80 {
    width: 80%;
}

.w-85 {
    width: 85%;
}

.w-90 {
    width: 90%;
}
