.svg-opac-50 img.card { opacity: 0.2; } 
.svg-opac-50:hover img.card { opacity: 0.5; } 
.svg-opac-50 svg.card { opacity: 0; } 
.svg-opac-50 .card { opacity: 0.8; } 
.svg-opac-100 .card { opacity: 1; } 
.svg-opac-100 { border: 1px solid #8B5CF6; }
.svg-not-100 { border: 1px solid #D1D5DB; }
.svg-not-100 .card { opacity: 1; } 

.click-animation { transition: transform 0.5s ease-out; } 
.click-animation:active { transform: scale(1.07); }</style>

div#chat-messages strong {
    font-weight: 500;
}

div#chat-messages p {    
    margin-top: 12px;
    margin-bottom: 5px;
}

div#chat-messages ol {    
    margin-top: 12px;
}

div#chat-messages ul {    
    list-style-type: disc;
     margin-left: 20px;
}

div#chat-messages li {
    margin-top: 0px;
    margin-bottom: 5px;
}


.preloader-logo-cycle {
    animation: logoCycle 8s infinite;
}

@keyframes logoCycle {
    0% { 
        opacity: 0;
    }
    30% { 
        opacity: 1;
    }
    85% { 
        opacity: 1;
    }
    100% { 
        opacity: 0;
    }
}

.preloader-bg-cycle {
    animation: bgCycle 8s infinite;
}

@keyframes bgCycle {
    0% { 
        opacity: 1;
    }
    20% { 
        opacity: 0.1;
    }
    45% { 
        opacity: 1;
    }
    100% { 
        opacity: 1;
    }
}