/* utilitaires de masquage fonctionnels pour la fiche uai */

.ac-uai-col {
	position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

@media screen and (min-width:700px) {
	.ac-uai-col-3 {
		flex: 0 0 25%;
    	max-width: 25%;
	}
	.ac-uai-col-3 {
		flex: 0 0 25%;
    	max-width: 25%;
	}
	.ac-uai-col-4 {
		flex: 0 0 33.333333%;
    	max-width: 33.333333%;    }
	.ac-uai-col-5 {
		flex: 0 0 41.666667%;
    	max-width: 41.666667%;
    }
}


.ac-uai-hide { display:none;  }

@media screen and (min-width:700px) {
	.ac-uai-show { display:none; }
	.ac-uai-hide { display:block;  }
}

/* utilitaires de masquage fonctionnels */

@media screen and (min-device-width:1024px) {
/* desktops */
	.ac-sm-show { display:none; }	
	.ac-mobile-show { display:none; }	
}
@media screen and (max-device-width:1024px) and (min-width: 576px) {
/* Mobile en mode paysage */
	.ac-sm-show { display:none; }	
}

.ac-sm-show-portrait { 	display:none; }

@media screen and (max-device-width:1024px) and (max-width : 576px) {
/* Mobile en mode portrait */
	.ac-sm-hide-portrait { display:none;  }
	.ac-sm-show-portrait { display:inherit;  }
}

@media screen and (max-width: 576px) {
	.ac-sm-hide { display:none; }
}

@media screen and (max-device-width:1024px) {
	.ac-sm-hide { display:none; }	
}

/* uniquement pour les mobiles */
@media screen and (max-device-width:1024px) {
/* gestion du passage en cards pour les tables */
		.men_table caption {
    		caption-side: top;
		}
		.table-cards thead {
			display: none;
		}
		.table-cards td {
			display: block;
		}
		.table-cards tr {
			flex-direction: column;
		}
		.table-cards .thead {
			display: inline;
		}

		/* Ici, uniquement de la décoration */
		.table-cards td {
			text-align: left;
		}
		.table-cards tr {
			border-bottom: 5px solid #ccc;
		}
		.table-cards .thead {
			font-weight: bold;
		}
		
		.nav-pills .nav-item {
			margin-top: 2px;
		}
	}
}

/* uniquement pour les desktop */
@media screen and (min-device-width:1024px) {
/*il faut supprimer le collapse qui peut provenir des tests mobiles */
	.table-cards .collapse:not(.show) {
    	display: table-header-group;
	}
}

/* gestion de la taille des facettes versus la liste de resultats. */
/* surcharge de la classe col-... de bootstrap pour pouvoir piloter par rapport
   aux classes .filters et .responses
*/
.mycol {
	position: relative;
    width: 100%;
    padding-right: 15px;
    padding-left: 15px;
}

@media screen and (max-device-width:1024px) {
@media screen and (min-width: 576px) {
	.search_results .facettes {
    	-ms-flex: 0 0 25%;
    	flex: 0 0 25%;
    	max-width: 25%;
	}

	.search_results .responses {
		-ms-flex: 0 0 75%;
    	flex: 0 0 75%;
    	max-width: 75%;
	}
}
}

@media screen and (min-device-width:1024px) {
@media screen and (min-width: 750px) {
	.search_results .facettes {
    	-ms-flex: 0 0 25%;
    	flex: 0 0 25%;
    	max-width: 25%;
	}

	.search_results .responses {
		-ms-flex: 0 0 75%;
    	flex: 0 0 75%;
    	max-width: 75%;
	}
}
}

/* classes de margin pour les colonnes de la recherche avancée */

@media screen and (min-width: 1200px) {
	.search_form .col-label-string {
    	padding-top: calc(0.375rem - 2px);
	}
	
	.search_form .col-label-date {
    	padding-top: calc(0.375rem + 2px);	
	}
	
	.search_form .col-label-large,
	.search_form .col-label-petite {
	    text-align: end;
    	white-space: nowrap;
	}
	
	.search_form .col-label-large {
		-ms-flex: 0 0 16.666667%;
    	flex: 0 0 16.666667%;
    	max-width: 16.666667%;
    }
	.search_form .col-value-large {
		-ms-flex: 0 0 83.333333%;
    	flex: 0 0 83.333333%;
    	max-width: 83.333333%;
	}

	.search_form .col-label-moyen {
		-ms-flex: 0 0 20%%;
    	flex: 0 0 20%;
    	max-width: 20%;
    }
	.search_form .col-value-moyen {
		-ms-flex: 0 0 80%;
    	flex: 0 0 80%;
    	max-width: 80%;
	}

	.search_form .col-label-petite {
    	-ms-flex: 0 0 30%;
    	flex: 0 0 30%;
    	max-width: 30%;
    }
	.search_form .col-value-petite {
		-ms-flex: 0 0 70%;
    	flex: 0 0 70%;
    	max-width: 70%;
   	}

	.search_form .marge1 {
		margin-left: 0.25rem !important;
		margin-right: 0.25rem !important;
	}

	.search_form .marge2 {
	}
	
	.search_form .marge3 {
		margin-left: 0.25rem !important;
		margin-right: 0.25rem !important;
	}
}

@media screen and (max-width: 1200px) {
	.search_form .marge1,
	.search_form .marge2,
	.search_form .marge3 {
		margin-left: 0.25rem !important;
		margin-right: 0.25rem !important;
	}
}