/* filtres_categorie.css */
/* STYLE COMMUN */
/* filtres */
#filtres_categorie { margin-bottom: 20px; }
#filtres_categorie > .filtre:first-child { margin-top: 0; }
#filtres_categorie > .filtre:last-child { margin-bottom: 0; }

/* liste tags */
#bloc_tag_categorie .liste_tag {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
		flex-wrap: wrap;
	-webkit-box-pack: center;
	   -ms-flex-pack: center;
	 justify-content: center;
	margin: -4px -8px;
	padding: 0;
	list-style: none;
}
#bloc_tag_categorie .bloc_tag {
	-webkit-box-flex: 1;
			-ms-flex: auto 0 0px;
				flex: auto 0 0;
	padding: 4px 8px;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
}
#bloc_tag_categorie .bloc_tag .tag {
	padding: 7px;
	border: 2px solid #204182;
	border-radius: 17px;
	-webkit-user-select: none;
	   -moz-user-select: none;
		-ms-user-select: none;
			user-select: none;
	font-size: 15px;
	line-height: 18px;
	font-weight: 500;
	box-shadow: 2px 2px 2px #acacac;
	background-color: #fff;
	color: #204182;
	cursor: pointer;
	
	-webkit-transition: background-color .3s ease, color .3s ease;
		 -o-transition: background-color .3s ease, color .3s ease;
			transition: background-color .3s ease, color .3s ease;
}
#bloc_tag_categorie .bloc_tag .tag.actif,
#bloc_tag_categorie .bloc_tag .tag:hover {
	background-color: #204182;
	color: #fff;
}
#bloc_tag_categorie .bloc_tag .tag.actif { cursor: default; }

#page_categorie .liste_contenu_item .bloc_contenu_item.hidden-tag { display: none; }


/* message filtre */
#bloc_message_filtre { 
	text-align: center;
	margin-bottom: 10px;
	color: #083c6b;
}

#bloc_message_filtre p { margin: 5px 0; }
#bloc_message_filtre .tag_actif {
	font-size: 15px;
    font-weight: 500;
	line-height: 18px;
	margin: 5px 0;
}
#bloc_message_filtre .tag_actif .tag {
	display: inline-block;
    padding: 2px 4px;
    border: 1px solid #204182;
    border-radius: 12px;
    font-size: 15px;
    line-height: 18px;
    background-color: #204182;
    color: #fff;
}
#bloc_message_filtre p.prochaine_date .complet {
	font-size: 18px;
	line-height: 22px;
	color: #606060;
}
#bloc_message_filtre p.depart_date,
#bloc_message_filtre p.prochaine_date .prochaine_date {
	font-size: 22px;
	line-height: 28px;
}
#bloc_message_filtre p.prochaine_date .prochaine_date .date {
	font-weight: 500;
	color: #dc0000;
}
#bloc_message_filtre p.prochaine_date .prochaine_date .sep::before { content: ', '; }
#bloc_message_filtre p.prochaine_date .prochaine_date::after { content: ' :'; }

/* slideshow dates */
#filtre_date_dispo .bloc_selection_dates { position: relative; }
#filtre_date_dispo .bloc_slideshow_dates { padding: 7px 65px 7px 0; }
#filtre_date_dispo .slideshow_dates {
	position: relative;
	overflow: hidden;
	background-color: #fff;
	border: 1px solid #003366;
	border-radius: 16px;
	height: 31px;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;

	-webkit-transition: opacity .5s ease-in;
		 -o-transition: opacity .5s ease-in;
			transition: opacity .5s ease-in;
}
#filtre_date_dispo .slideshow_dates .conteneurDates,
#filtre_date_dispo .slideshow_dates .lSSlideOuter,
#filtre_date_dispo .slideshow_dates .lSSlideWrapper,
#filtre_date_dispo .slideshow_dates .liste_dates,
#filtre_date_dispo .slideshow_dates .lslide { height: 100% !important; }
#filtre_date_dispo .slideshow_dates .conteneurDates {
	margin: 0 45px;
	border-left: 1px solid #003366;
	border-right: 1px solid #003366;
}
#filtre_date_dispo .slideshow_dates .liste_dates {
	width: 100%;
	background-color: #003366;
	list-style: none;
	padding: 0;
	margin: 0;
}
#filtre_date_dispo .slideshow_dates .date {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	   -ms-flex-pack: center;
	 justify-content: center;
	-webkit-box-align: center;
	   -ms-flex-align: center;
	      align-items: center;
	background-color: #fff;
	font-family: "Roboto Condensed", sans-serif;
    font-weight: 300;
    font-size: 18px;
	color: #283c51;
	text-align: center;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
	
}
#filtre_date_dispo .slideshow_dates .date.selected {
	position: relative;
	background-color: #669acc;
	color: #fff;
	-webkit-transition: background-color .3s ease-in;
		 -o-transition: background-color .3s ease-in;
			transition: background-color .3s ease-in;
}
#filtre_date_dispo .slideshow_dates .date .deselect {
    display: none;
    position: absolute;
    right: 3px;
    font-family: "Arial", Baskerville, monospace;
    font-weight: bold;
    font-size: 16px;
    line-height: 16px;
    width: 14px;
    height: 16px;
    background-color: #dc0000;
    color: #fff;
    padding: 4px 5px;
    text-align: center;
    border-radius: 12px;
    cursor: pointer;
}
#filtre_date_dispo .slideshow_dates .date.selected .deselect { display: block; }
#filtre_date_dispo .slideshow_dates .date,
#filtre_date_dispo .slideshow_dates .controls {
	padding: 0px 3px;
	line-height: 16px;
}
#filtre_date_dispo .slideshow_dates .date:not(.selected),
#filtre_date_dispo .slideshow_dates .controls:not(.disabled) { cursor: pointer; }
#filtre_date_dispo .slideshow_dates .controls {
	position: absolute;
	top: 0;
	bottom: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	   -ms-flex-pack: center;
	 justify-content: center;
	-webkit-box-align: center;
	   -ms-flex-align: center;
	      align-items: center;
	width: 45px;
	font-family: "Arial", sans-serif;
	font-size: 15px;
	font-weight: bold;
	background-color: #003366; 
	color: #fff;
	-webkit-box-sizing: border-box;
			box-sizing: border-box;
	text-align: center;
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
		-ms-user-select: none;
			user-select: none;
}
#filtre_date_dispo .slideshow_dates .controls.previous { left: 0; }
#filtre_date_dispo .slideshow_dates .controls.next { right: 0; }
#filtre_date_dispo .slideshow_dates .controls.disabled { 
	background-color: #cdcbcc; 
	cursor: default;
}

/* bouton calendrier */
#filtre_date_dispo .bloc_autre_date {
	position: absolute;
	top: -3px;
	right: 0;
}
#filtre_date_dispo .bloc_autre_date > .ui-datepicker-trigger {
	display: block;
	width: 55px;
	height: 45px;
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
		-ms-user-select: none;
			user-select: none;
}

/* LIBELLE */
#filtre_date_dispo .bloc_filtre_date_dispo > .libelle p {
	margin: 0;
	font-size: 15px;
	font-weight: 500;
	color: #083c6b;
}

#page_categorie .liste_contenu_item .bloc_contenu_item.hidden-dispo { display: none; }

/* BLOC AUTRES OFFRES */
#contenu_categorie .liste_contenu_item.autres_offres .entete_decoree {
	background-color: transparent;
	padding: 0;
	margin-top: 30px;
	margin-bottom: 30px;
}


/* STYLE DESKTOP */
@media only screen and (min-width: 1025px) {
	/* filtres */
	#filtres_categorie { position: relative; }
	#filtres_categorie > .filtre { margin: 10px 0; }
	
	/* date dispo */
	#filtre_date_dispo .disable_layer {
		position: absolute;
		top: -5px;
		left: 0;
		right: 0;
		bottom: -5px;
		z-index: 1;
		background-color: rgba(0, 0, 0, .8);
		border-radius: 2px;
	}
	#filtre_date_dispo .disable_layer.hidden { display: none; }
	#filtre_date_dispo .disable_layer .loading {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
			-ms-transform: translate(-50%,-50%);
				transform: translate(-50%,-50%);
	}
	#filtre_date_dispo .disable_layer .loading img {
		width: 45px;
		-webkit-animation: spin 1s linear infinite;
				animation: spin 1s linear infinite;
	}
	#filtre_date_dispo .bloc_filtre_date_dispo { 
		display: -webkit-box; 
		display: -ms-flexbox; 
		display: flex; 
		-webkit-box-pack: center; 
		   -ms-flex-pack: center; 
		 justify-content: center;
		margin: 0 -7.5px;
	}
	#filtre_date_dispo .bloc_filtre_date_dispo > .bloc { padding: 0 7.5px; }
	#filtre_date_dispo .bloc_filtre_date_dispo > .calendrier { -webkit-box-flex: 1; -ms-flex: auto 1 1; flex: auto 1 1; }
	#filtre_date_dispo .bloc_filtre_date_dispo > .libelle { 
		display: -webkit-box; 
		display: -ms-flexbox; 
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		   -ms-flex-direction: column;
		       flex-direction: column;
		-webkit-box-pack: center;
		   -ms-flex-pack: center;
	     justify-content: center;
		-webkit-box-flex: 1;
				-ms-flex: auto 0 0px;
					flex: auto 0 0; 
	}

	/* DATEPICKER */
	#ui-datepicker-div.filtre-date-dispo {
		-webkit-box-sizing: border-box; 
				box-sizing: border-box; 
	}
	#ui-datepicker-div.filtre-date-dispo .ui-datepicker-header {
		background-color: #083c6b;
		border: 1px solid #e89f2b;
		color: #fff;
	}
	#ui-datepicker-div.filtre-date-dispo .ui-icon, 
	#ui-datepicker-div.filtre-date-dispo .ui-widget-content .ui-icon { background-image: url('../js/jquery-ui-1.12.1/images/ui-icons_ffffff_256x240.png'); }
	#ui-datepicker-div.filtre-date-dispo td a, 
	#ui-datepicker-div.filtre-date-dispo td span { 
		padding: .5em;
		text-align: center; 
	}
	#ui-datepicker-div.filtre-date-dispo .ui-datepicker-prev-hover,
	#ui-datepicker-div.filtre-date-dispo .ui-datepicker-next-hover { 
		background-color: transparent; 
		border-color: transparent;
	}

	/* ANIMATIONS */
	@-webkit-keyframes spin { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }
	@keyframes spin { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }
	
	/* bloc calendrier */
	#filtre_date_dispo .bloc.calendrier { max-width: 635px; }
}

/* STYLE RESPONSIVE */
@media only screen and (max-width: 1024px) {
	/* filtres */
	#filtres_categorie { position: relative; }
	#filtres_categorie > .filtre { margin: 15px 0; }
	
	/* date dispo */
	#filtre_date_dispo .disable_layer {
		position: absolute;
		top: -5px;
		left: -10px;
		right: -10px;
		bottom: -5px;
		z-index: 1;
		background-color: rgba(0, 0, 0, .8);
		border-radius: 2px;
	}
	#filtre_date_dispo .disable_layer.hidden { display: none; }
	#filtre_date_dispo .disable_layer .loading {
		position: absolute;
		top: 50%;
		left: 50%;
		-webkit-transform: translate(-50%,-50%);
			-ms-transform: translate(-50%,-50%);
				transform: translate(-50%,-50%);
	}
	#filtre_date_dispo .disable_layer .loading img {
		width: 55px;
		-webkit-animation: spin 1s linear infinite;
				animation: spin 1s linear infinite;
	}
	#filtre_date_dispo .bloc_filtre_date_dispo {
		max-width: 430px;
		margin: 0 auto;
	}
	#filtre_date_dispo .bloc_filtre_date_dispo > .libelle p { 
		text-align: center; 
		padding-right: 65px;
	}
	
	#filtre_date_dispo .slideshow_dates { text-transform: uppercase; }

	/* DATEPICKER */
	#ui-datepicker-div.filtre-date-dispo { 
		max-width: calc(100% - 20px);
		-webkit-box-sizing: border-box; 
				box-sizing: border-box; 
	}
	#ui-datepicker-div.filtre-date-dispo .ui-datepicker-header {
		background-color: #083c6b;
		border: 1px solid #e89f2b;
		color: #fff;
	}
	#ui-datepicker-div.filtre-date-dispo .ui-icon, 
	#ui-datepicker-div.filtre-date-dispo .ui-widget-content .ui-icon { background-image: url('../js/jquery-ui-1.12.1/images/ui-icons_ffffff_256x240.png'); }
	#ui-datepicker-div.filtre-date-dispo td a, 
	#ui-datepicker-div.filtre-date-dispo td span { 
		padding: .5em;
		text-align: center; 
	}
	#ui-datepicker-div.filtre-date-dispo .ui-datepicker-prev-hover,
	#ui-datepicker-div.filtre-date-dispo .ui-datepicker-next-hover { 
		background-color: transparent; 
		border-color: transparent;
	}

	/* ANIMATIONS */
	@-webkit-keyframes spin { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }
	@keyframes spin { 100% { -webkit-transform: rotate(-360deg); transform:rotate(-360deg); } }
}

@media only screen and (max-width: 480px) {
	#bloc_message_filtre p.prochaine_date .complet {
		font-size: 3.75vw;
		line-height: initial;
	}
	#bloc_message_filtre p.depart_date,
	#bloc_message_filtre p.prochaine_date .prochaine_date {
		font-size: 4.6vw;
		line-height: initial;
	}
	#bloc_message_filtre p.prochaine_date .prochaine_date .date {
		display: block;
		width: fit-content;
		margin: 0 auto;
		background-color: #669acc;
		color: #fff;
		font-weight: 300;
		font-family: "Roboto Condensed", sans-serif;
		text-transform: uppercase;
		margin-top: 5px;
		font-size: 18px;
		line-height: 20px;
		padding: 5px;
		border-radius: 2px;
	}
	#bloc_message_filtre p.prochaine_date .prochaine_date .sep::before { content: ' :'; }
	#bloc_message_filtre p.prochaine_date .prochaine_date::after { content: none; }
}