#cards {
 display: flex;
 justify-content: center;
 flex-wrap: wrap;
 gap: 18px;
}

.card {
 display: flex;
 flex-direction: column;
 flex: 1 1 300px; /* flex-grow: 1; flex-shrink: 1; flex-basis: 300px; */
 color: var(--eagles_gray_extremely_light_color);
 background-color: var(--eagles_gray_dark_color);
 border: 3px solid var(--eagles_black_color);
 border-radius: 10px;
 box-shadow: 7px 8px 9px 1px rgba(0,0,0,0.75);
 padding-top: 3px;
 position: relative;
 text-align: center;
 max-width: 374px;
}

.card h3 {
 color: var(--eagles_gray_extremely_light_color);
 margin: 10px 0;
 font-size: 20px;
}

.card h4 {
 margin: 5px 0;
 text-transform: uppercase;
}

.card h6 {
 margin: 5px 0;
 text-transform: uppercase;
}

.card p {
 text-align: justify;
 padding: 0px 10px;
}

.no-justify {
 text-align: left !important;
}

.card .pro {
 background-color: var(--eagles_white_color);
 color: var(--eagles_red_dark_color);
 border-radius: 3px;
 position: absolute;
 top: 10px;
 left: 10px;
 padding: 3px;
 display: flex;
 flex-direction: column;
 min-width: 30px;
}

.card .pro img{
  margin: 3px;
}

.card .admin {
 background-color: var(--eagles_admin_color);
 border-radius: 3px;
 padding: 3px;
 position: absolute;
 top: 10px;
 right: 10px;
}

.card .round {
 border: 1px solid var(--eagles_pink_color);
 border-radius: 10%;
 padding: 3px;
 max-width: 75%;
 height: auto;
 display: block;
 margin: 0 auto;
}

.card > div {
 color: var(--eagles_black_color);
 background-color: var(--eagles_gray_extremely_light_color);
 text-align: left;
 padding: 0 5px; /* haut/bas droite/gauche */
}

.card > div:first-of-type {
 margin-top: auto;
}

.card > div:last-child {
 border-radius: 0 0 5px 5px;
 padding-bottom: 5px;
}


.card > div > h4 {
 color: var(--eagles_red_dark_color);
}

.card > div ul {
 list-style-type: none;
 margin: 0;
 padding: 0;
}

.card > div ul li {
 border: 1px solid var(--eagles_red_dark_color);
 border-radius: 4px;
 display: inline-block;
 margin: 0 2px 2px 0; /* top, right, bottom, left */
 padding: 3px;
}

.card .contact {
 margin-top: auto;
}

.card .devise p {
 padding: 0px;
}

.card .equipes {
 border-radius: 0 0 5px 5px; /* top-left top-right bottom-right bottom-left*/
}