.align-middle text-center h5 cinq {
	color: #198754;
}
.quatre {
	color: #d63384;
}
.trois {
	color: #fd7e14;
}

.bi-5-circle-fill {
	color: #198754;
  font-size: 4rem;
}
.bi-4-circle-fill {
	color: #d63384;
  font-size: 4rem;
}
.bi-3-circle-fill {
	color: #fd7e14;
  font-size: 4rem;
}



.bi-5-circle {
	color: #198754;
  font-size: 4rem;
}
.bi-4-circle {
	color: #d63384;
  font-size: 4rem;
}
.bi-3-circle {
        color: #fd7e14;
        font-size: 4rem;
}
.bi-5-circle:hover,.bi-4-circle:hover,.bi-3-circle:hover {
	color: #000091;
	cursor: pointer;
  
}



body {
  overflow: auto !important;
}

#Data{

  margin-left: 1em;
  margin-right :1em;
}


h5 {
	color: #164092;
    text-decoration: underline;
}

h2 {color: #228bcc ;	
}
.titre{
   font-family: Georgia;
}
.t1{ 
    color: #299dcc;
}

.t2{
    color: #d6356f;  
}

  .item {
    display: flex;
    align-items: center;
}


 
 
 
  thead td.vrtcl div {
    background:none;
    padding:0 1em;
    border:none;
  }
  /* mise en place pour rotation */
  td.vrtcl div {
    margin:0 -999px;/* largeur necessaire reduite virtuellement */
    display:inline-block;
    white-space:nowrap; /* on bloque en 1 seul ligne */
  }
  /* on adapte la hauteur des cellules sur la base de la largeur du contenu */
  td.vrtcl div:before {
    content:'';
    padding-top:110%;
    display:inline-block;
    vertical-align:middle;
  }
  /* enfin , on applique la rotation */
  td.vrtcl div {
    transform:rotate(-90deg);
  }
  
  #c,#q,#t {
      margin-right: 15%; /* marge de départ */
      transition: margin 0.3s;
    }
.fond{
background-color: #588fc1;

}
.copy-container {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
}
.copy-feedback {
  font-size: 0.8rem;
  color: green;
  text-align: center;
  white-space: nowrap;
}

.card-header {
      border: 0; border-top-left-radius: 1rem; border-top-right-radius: 1rem;
      background: linear-gradient(135deg, #0d6efd 0%, #6610f2 100%);
      color: #fff;
    }
    .list-icon { width: 1.25rem; display: inline-flex; justify-content: center; }
    .kbd { font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; }
        .accordeon-header {
            height: 2px;
            background-color: #ccc;
            position: relative;
            cursor: pointer;
            width: 100%;
            margin: 0;
            padding: 0;
        }
        .accordeon-header::after {
            content: "▼";
            position: absolute;
            top: -10px;
            left: 50%;
            transform: translateX(-50%);
            font-size: 16px;
            background-color: white;
            padding: 0 5px;
            transition: transform 0.3s ease;
        }
        .accordeon-header.ferme::after {
            transform: translateX(-50%) rotate(180deg);
        }
        .accordeon-content {
            padding: 10px;
            max-height: 500px;
            overflow: hidden;
            transition: max-height 0.3s ease-out, padding 0.3s ease;
            border: 1px solid #ccc;
            border-top: none;
            background-color: #f9f9f9;
        }
        /* État fermé : padding et max-height à 0 */
        .accordeon-content.ferme {
            max-height: 0;
            padding: 0;
            border: none;
        }