/*****************************************************************
OpenQuizzDB
Fichier CSS pour la page d'affichage des quizz disponibles
(c)Copyright 2007-2024 Philippe Bresoux
Dernière mise à jour : 17/03/2024
*****************************************************************/

table { 
    border-spacing: 2px;
    border-collapse: separate;
}

.mytt_box {
    border: 2px solid #3f55c3;
    border-radius: 9px;
    padding: 15px;
}
.mytt_categ {
    font-weight: bold;
    vertical-align: bottom;
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 19px;
    color: #0045c3;
}
.mytt_title1 {
    font-family: 'Roboto Condensed',sans-serif;
    font-size: 24px;
    font-weight: bold;
    color: #cf4f2b;
}
.mytt_title2 {
    font-family: 'Open Sans Condensed', sans-serif;
    font-size: 20px;
    color: #25c300;
}
.mytt_title3 {
    color: #aaaaaa;
    font-size: 12px;
}
.mytt_theme {
    font-family: 'Open Sans Condensed', sans-serif;
    font-size: 17px;
    text-shadow: 1px 1px 2px grey;
    padding: 2px;
    text-indent: 3px;
    max-width: 100%;
    width: 200px;
    height: 40px;
    border-radius: 4px;
}
.mytt_theme:hover {
    background-color: #cf4f2b;
    color: white;
    cursor: pointer;
    font-weight: bold;
}
.mytt_box:has(.mytt_theme:hover)
.mytt_theme:not(:hover) {
    filter: grayscale(50%) brightness(90%);
}
.mytt_circle {
    color: #cf4f2b;
    width: 25px;
    text-align: center;
    background-color:rgba(0, 0, 0, 0.1);
    cursor: help;
    border-radius: 4px;
}
.mytt_circle_1 {
    color: #36cf18;
}   
.mytt_circle_2 {
    color: #fff800;
}     
.mytt_circle_3 {
    color: #ffb300;
}  
.mytt_circle_4 {
    color: #a51e88;
}                                            
.mytt_circle_5 {
    color: red;
}           
.mytt_label {
    background-color: #eeeeee;
    padding: 3px;
    writing-mode: vertical-rl;
    transform: scale(-1);
    font-family: 'Fjalla One';
    border-radius: 0px 0px 9px 9px;
    width: 40px;
    height: 150px;
    text-align: right;
}
.mytt_carre {
    width: 32px;
    border-radius: 6px 0px 0px 6px; 
    text-align: right;
}
.mytt_tabcar {
    background-color: white;
    width: 40px;
    text-align: right;
}
.mytt_logo {
    text-align: center;
    background-color: #eeeeee;
    width:40px;
    height: 40px;
    cursor: help;
    border-radius: 6px 6px 0px 0px;
}
.mytt_line {
    background-color: #cf4f2b;
    height: 2px;
}
@media(max-width: 600px) {
    .mytt_title2 {
        display: none;
    }    
    .mytt_title3 {
        display: none;
    }        
}