.memento_couleurs {
	display: inline-block;
	text-align: center;
	font-weight: bold;
	width: 100%;
	margin: 10px 0;
}

.memento_couleurs_petits {
	line-height: 40px;
	border: solid 1px;
	float: left;
	margin: 0 0 0 60px;
	width: 40%;
}

.status_select {
	display: inline-flex;
	margin-right: 5px;
}

.status_select select {
	width: 94%;
}

@media only screen and (max-width: 650px), only screen and (max-device-width: 650px) {
	.memento_couleurs_petits {
		margin: 5px 12px;
		width: 94%;
	}
}

.titre_status_sites {
	text-align: center;
	font-size: 200%;
	padding: 10px 0;
	border: solid 1px;
}

.non_renseigne {
	font-style: italic;
	color: #29994A;
}

.bloc_statistiques {
	width: 100%;
	display: inline-block;
}

.bloc_statistiques_ss {
	width: 49%;
	display: inline-flex;
	float: left;
	margin: 0 5px;
}

@media only screen and (max-width: 1000px), only screen and (max-device-width: 1000px) {
	.bloc_statistiques_ss {
		width: 48%;
		margin: 0 7px;
	}
}

@media only screen and (max-width: 650px), only screen and (max-device-width: 650px) {
	.bloc_statistiques_ss {
		width: 98%;
	}
}

.bloc_statistiques_ss_col_1 {
	float: left;
	width: 84%;
}

@media only screen and (max-width: 1000px), only screen and (max-device-width: 1000px) {
	.bloc_statistiques_ss_col_1 {
		width: 78%;
	}
}

@media only screen and (max-width: 650px), only screen and (max-device-width: 650px) {
	.bloc_statistiques_ss_col_1 {
		width: 74%;
	}
}

.bloc_statistiques_ss_col_2 {
	font-weight: bold;
	background-color: #DBEDFF;
	width: 15%;
	float: right;
}

@media only screen and (max-width: 1000px), only screen and (max-device-width: 1000px) {
	.bloc_statistiques_ss_col_2 {
		width: 16%;
	}
}

.bloc_statistiques_ss_col_1, .bloc_statistiques_ss_col_2 {
	border: 1px solid #CCCCCC;
	margin: 1px;
	padding-left: 5px;
	line-height: 30px;
}

input[type=number] {
	width: 50px;
}

input[name=phoneNumber], input[name=phonePortableNumber], input[name=faxNumber] {
	width: 110px;
}

input[type=radio] {
	width: 20px;
	vertical-align: middle;
}

.entete {
	font-weight: bold;
	background-color: #EAE5E5;
	color: #000000 !important;
}

.liste_acp {
	display: table;
	border-collapse: separate;
	border-spacing: 0 4px;
	width: 100%;
}

.liste_acp > div {
	display: ligne_liste_acp;
}

.liste_acp > div:hover {
	background-color: #EAE5E5;
}

.liste_acp > div > div {
	display: table-cell;
	padding: 10px;
	vertical-align: middle;
}

.ligne_liste_acp_col_1 {
	color: #6A95C7;
}

.ligne_liste_acp_col_2 {
	min-width: 170px;
}

.ligne_liste_acp_col_1, .ligne_liste_acp_col_2 {
	width: 100%;
}

.ligne_liste_acp_col_2 iconify-icon {
	font-size: 300%;
}

div.icone_suppr a {
	color: #FF0000;
}

div.icone_suppr_historique a {
	color: #FF8400;
}

div.icone_ticket a {
	color: #5F58E4;
}

div.icone_suppr a,
div.icone_suppr_historique a,
div.icone_ticket a {
	font-size: 150%;
}

.ligne_liste_acp {
	border: 1px #CCCCCC solid;
	margin: 2px 0;
}

.ligne_liste_acp a {
	text-decoration: none;
}

@media only screen and (max-width: 650px), only screen and (max-device-width: 650px) {
	.ligne_liste_acp_col_2, .ligne_liste_acp_col_1 {
		float: left;
		width: 94%;
	}

	.ligne_liste_acp_col_2 > div {
		display: inline-flex;
	}

	.ligne_liste_acp {
		display: inline-block;
	}

	.entete {
		display: none;
	}
}

#div_webmasters {
	display: inline-block;
	width: 100%;
}

.div_webmasters {
	width: 32%;
	float: left;
	color: #222222;
	height: 60px;
	line-height: 60px;
	overflow: hidden;
}

.div_webmasters iconify-icon {
	font-size: 250%;
	color: #969696;
}

.titre_commentaire {
	color: #435D77;
	font-weight: bold;
}

.bouton_align {
	text-align: center;
	margin-top: 20px;
}

.bouton_align a {
	text-decoration: none;
}

.bouton_align button {
	display: inline-block;
	margin-top: 0;
	font-size: 300%;
	border-radius: 20px;
	margin-right: 30px;
	padding: 5px 15px;
}

.bouton_align button iconify-icon {
	font-size: 150%;
	margin-top: -1px;
}

.bouton_align_oui {
	color: green;
	border: 2px solid;
}

.bouton_align_non {
	color: #FF0000;
	border: 2px solid;
	margin-right: 0 !important;
}

.bouton_align_oui,
.bouton_align_non {
	opacity: 0.7;
}

.bouton_align_oui:hover,
.bouton_align_non:hover {
	opacity: 1;
	cursor: pointer;
}

/***************************************************
La vérification des changements dans la description
***************************************************/
	.date_historique {
		color:#882ADE;
		font-weight: bold;
		font-size: 110%;
	}

	.date_historique_right {
		color:#129d05;
		font-weight: normal;
		font-size: 80%;
		float: right
	}

	.date_historique_right a {
		background-color: transparent !important;
		border: 0 !important;
		font-size: 150%;
		vertical-align: middle;
	}

	.description_liste_sites_en_attente.avec_historique {
		border:1px solid #882ADE;
		padding: 7px;
	}

	.avec_historique button {
		border: 1px solid #d3a2ff;
		padding: 7px;
		margin: 0 auto;
		display: block;
	}

	.avec_historique button iconify-icon {
		font-size: 200%;
	}

	.avec_historique button:hover {
		cursor: pointer;
	}

	ins {
		color:#026202;
		text-decoration: none;
	}

	ins,
	ins p,
	ins ul,
	ins ol,
	ins li {
		background-color:#C5F9C5;
	}

	del {
		color:#FF0000;
	}

	del,
	del p,
	del ul,
	del ol,
	del li {
		background:#F8D7D7;
	}
/***************************************************
****************************************************
***************************************************/

/**************************************************************
Liste des categories lors d'une recherche pendant l'inscription
**************************************************************/
	.div_categories_ariane {
		margin: 15px 10px;
	}
	
	.div_categories_ariane a {
		text-decoration: none;
		color:#005BAB;
	}

	.div_categories_ariane iconify-icon:first-child {
		font-size: 200%
	}

	.div_categories_ariane a:last-child {
		text-shadow: 0px 0px 2px;
	}
	
	.div_categories_ariane iconify-icon:first-child,
	.div_categories_ariane a:last-child {
		color: #017701;
	}
/**************************************************************
***************************************************************
**************************************************************/

.input_search_sites_webmaster {
	margin: 10px auto;
	display: table;
}

.input_search_sites_webmaster input {
	height: 25px;
	font-size: 140%;
	text-align: center;
}

/**************************************************************
Le filigrane des étapes de l'inscription
**************************************************************/
	.filigrane_etapes {
		margin-bottom: 15px;
		color: #102D7D;
	}

	.filigrane_etapes > span {
		border-top: 1px solid #B9B8B8;
		border-bottom: 1px solid #B9B8B8;
		border-right: 1px solid #B9B8B8;
		padding: 10px 10px 10px 20px;
		border-radius: 0 20px 20px 0;
		margin: 0 -20px 0 0;
		position: relative;
		display: inline-block;
	}

	.filigrane_etapes > span:first-of-type {
		border-left: 1px solid #B9B8B8;
		padding-left: 8px;
	}

	.class_a_utiliser_reste_a_faire {
		background-color: #EAEAEA;
		opacity: 0.4;
	}

	.filigrane_etapes .filigrane_etapes_en_cours,
	.filigrane_etapes > span.filigrane_etapes_en_cours:first-of-type {
		background: #F0D8D8;
		color: #006E21;
		border: 1px solid;
	}

	.filigrane_etapes .filigrane_etapes_en_cours,
	.filigrane_etapes .filigrane_etapes_fait {
		opacity: 1;
		font-weight: bold;
	}

	.filigrane_etapes .filigrane_etapes_fait {
		background: linear-gradient(-45deg, #D6D6D6 25%, #EAEAEA 25%, #EAEAEA 50%, #D6D6D6 50%, #D6D6D6 75%, #EAEAEA 75%, #EAEAEA);
		background-size: 20px 20px;
		border: 1px solid #7F7F7F;
	}
/**************************************************************
***************************************************************
**************************************************************/

/**************************************************************
Zone historique
**************************************************************/
	.liste_historique th {
		font-style: normal;
		min-width: 160px;
	}

	.liste_historique td {
		font-style: italic;
		padding-left: 10px;
	}

	.liste_historique th,
	.liste_historique td {
		padding-bottom: 10px;
		vertical-align: top;
	}

	.liste_historique td:nth-child(3) {
		display: none;
		opacity: 0.5;
	}

	#afficherColonneIntervenants {
		display: block;
		text-align: center;
		margin-bottom: 20px;
	}
/**************************************************************
***************************************************************
**************************************************************/

/****************************************
Début - liste des thumbs en plus
****************************************/
	.liste_des_thumbs_supp > div {
		display: flex;
		flex-wrap: wrap;
		justify-content: center; /* Centre chaque ligne */
		gap: 20px;
		padding: 5px;
	}

	.liste_des_thumbs_supp > div > div {
		flex: 0 1 280px; /* This flex basis should be re-evaluated if you want a strict image size, as it refers to the container, not the image itself */
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 10px;
		position: relative; /* Ajouté: Rend ce conteneur parent pour le positionnement absolu */
		box-shadow: 1px 1px 5px #6481BC;
		border-radius: 20px;
		width: 320px;
		height: 240px;
		overflow: hidden; /* Hide anything that overflows if the container has a fixed size */
	}

	.liste_des_thumbs_supp > div > div:hover {
		box-shadow: 1px 1px 5px #000000;
	}

	.liste_des_thumbs_supp > div.messages_infos,
	.liste_des_thumbs_supp .image-row > div.messages_infos {
		display: block;
	}

	.liste_des_thumbs_supp .image-row > div.messages_infos {
		height: auto;
		border-radius: 0;
	}

	.liste_des_thumbs_supp img {
		max-width: 320px; /* Maximum width for the image */
		max-height: 240px; /* Maximum height for the image */
		width: auto; /* Ensures the width adjusts to maintain aspect ratio */
		height: auto; /* Ensures the height adjusts to maintain aspect ratio */
		display: block;
		object-fit: contain; /* This is key to maintaining aspect ratio and fitting within the bounds */
	}

	.liste_des_thumbs_supp img:hover {
		cursor: zoom-in;
	}

	.liste_des_thumbs_supp > div > div > a .icon_suppr {
		right: 5px; /* Aligné à 5px de la droite */
	}

	.liste_des_thumbs_supp > div > div > a .icon_ok {
		left: 5px; /* Aligné à 5px de la droite */
	}

	.liste_des_thumbs_supp > div > div > a .icon_voir_fiche {
		left: 5px; /* Aligné à 5px de la droite */
		top: 5px; /* Aligné à 5px du haut */
	}

	.liste_des_thumbs_supp > div > div > a .icon_suppr,
	.liste_des_thumbs_supp > div > div > a .icon_ok {
		bottom: 5px; /* Aligné à 5px du bas */
	}

	.liste_des_thumbs_supp > div > div > a .icon_suppr,
	.liste_des_thumbs_supp > div > div > a .icon_ok,
	.liste_des_thumbs_supp > div > div > a .icon_voir_fiche {
		position: absolute; /* Positionnement absolu par rapport au parent relatif */
		z-index: 10; /* Assure que le bouton est au-dessus de l'image */
		font-size: 24px; /* Exemple de taille pour l'icône */
		background-color: #FFFFFF; /* Fond semi-transparent pour la visibilité */
		border-radius: 50%; /* Rend l'arrière-plan circulaire */
		padding: 5px; /* Espacement autour de l'icône */
		display: flex; /* Pour centrer l'icône si nécessaire */
		align-items: center;
		justify-content: center;
		border: 1px solid;
	}

	/* Styles pour le filigrane */
	.watermark {
		position: absolute; /* Positionnement absolu par rapport à son parent relatif (le div qui contient l'image) */
		top: 50%; /* Centre verticalement */
		left: 50%; /* Centre horizontalement */
		transform: translate(-50%, -50%) rotate(-45deg); /* Décale et tourne le texte */
		color: #FF0000; /* Couleur blanche avec transparence */
		font-size: 20px; /* Taille de police du filigrane, ajustez selon vos besoins */
		font-weight: bold; /* Gras */
		text-transform: uppercase; /* Met le texte en majuscules */
		pointer-events: none; /* Empêche le filigrane d'intercepter les événements de la souris */
		z-index: 5; /* Assure que le filigrane est au-dessus de l'image mais en dessous du bouton de suppression */
		white-space: nowrap; /* Empêche le texte de se casser sur plusieurs lignes */
		background-color: rgba(238, 179, 179, 0.66); /* Fond semi-transparent pour le texte */
		padding: 5px 10px; /* Espacement autour du texte du filigrane */
		border-radius: 20px; /* Bords légèrement arrondis */
		border: 1px solid;
	}

	.hover_selection {
		border: 5px solid #FF0000;
	}

	.input_ajout_thumbs {
		margin: 20px 0;
	}

	.input_ajout_thumbs p {
		display: block;
		width: 100%;
		text-align: center;
		font-size: 120%;
		margin-bottom: 0;
	}
/****************************************
Fin - liste des thumbs en plus
****************************************/