@import "polices/polices.css";
@import "mosaique.css";

/* ############# Début - taille des padding des encarts de base ############## */
	.panel-front, .panel-selection {
		border:none;
		/* padding: 7px 7px 7px 30px; */
	}
	#portal .panel-body {
/*		padding-top: 5px;*/
	}
	.edutheque .panel-front, .panel-selection {
		border:none;
		padding: 0;
	}
	.edutheque #portal .panel-body {
		padding-top:0;
	}
	
/* ############# Fin - taille des padding des encarts de base ############### */

/* ############# Titre à côté de la Barre de recherche  ###############*/
	#scenario-selected-label {
	    margin-right: 5px !important;
	    font-size: 20px !important;
	}
/* ############# Fin Titre à côté de la Barre de recherche  ###############*/
	
/* ##################### Début - Niveau de titre ############################ */

/*
h1, span, h2, h3, h4, p, a, li, td{
    color:#001b3b;
}
*/
/* ############# Barre de recherche cachée sur les pages de contenus; sauf sur la home ###############*/
	.accueil-modele #search-panel {
		display: inherit;
	}

	.page-contenu #search-panel, .incontournable-modele #search-panel, .mosaique-modele #search-panel, .content-modele #search-panel, .listing-modele #search-panel, .biographie-modele #search-panel, .content-oe-modele #search-panel, .dossier-oe-modele #search-panel, .thematique-modele #search-panel, .parcours-modele #search-panel, .content-catalogue #search-panel, .archives-modele #search-panel, .bibliographie-modele #search-panel, .exposition-modele #search-panel, .histoireinstru-modele #search-panel, .focus #search-panel, .facteur-modele #search-panel{
		display: none;
	}
/* ##################### Début - Niveau de titre ############################ */
	#portal h1{	/* 30 pixel */
		font-size: 2.143em;
		text-transform: uppercase;
	}
#page h1.titre-instance,
#page h1.titre-instance a,
#page h1.titre-instance span{
    font-size: 2.143rem;
    font-family:LinotypeBrewery-Medium;
    text-transform: uppercase;
    text-indent: 0;
    width: auto;
    text-align: left;
    color:#001b3b;
}
#page h1.titre-instance{
    margin-top: 1rem;
    margin-bottom: 1rem;
}

/* ##################### Fin - Niveau de titre ############################## */

/* ##################### Début - Généralités des balises #################### */
	em, i {			/* - généralité sur les em en italique*/
		font-style:italic;
        font-weight: inherit;
	}
	blockquote {
		margin:0;
		border:0;
		margin-bottom: 12px;
		font-style:italic;
	}
    cite{
        font-weight: inherit;
    }
	strong, b{			
		/* - généralité sur les strong et bold en italique*/
		/* ddenocq 20161020 - le bold est forcé par l'utilisation de la police bold - pour Chrome MacOS */
			font-family:"SourceSansPro";
            font-weight: bold;
	}
	sup {
		vertical-align: middle;
	}
	
    /* ddenocq 20160512 - suppression de la bordure grise (changement de charte (?))*/
	/* ccecconi 20160609 - suppression ci-dessous de la bordure grise pour content-modele*/
    figure img {
		border: 10px solid #e4e4e4;
		margin-bottom: 10px;
	}
    /* guillaume 07/2021 - en attendant la suppression partout de la bordure grise (changement de charte) */
    .page-2021 figure img,
    .accueil-metiers figure img {
		border:0;
		margin: 0;
		margin-bottom: 0;
	}
	figcaption {
		font-size: .825rem;
		font-weight: normal;
		font-style: italic;
		color: #808080;
		padding: 0;
        margin-bottom: 5px;
	}
	a {	/* Avoir toujours la main quand lien */
		cursor: pointer;
	}
	h1 sup,h2 sup, h3 sup, h4 sup, h5 sup {	/* Mettre en minuscule le e de XXe par exemple */
		text-transform: lowercase;
	}	
/* ########################## Fin - Généralités des balises ######################################*/
/* ########################### Boutons a #########################################################*/

/* bouton retour haut page PP */
.retourTop {
    display: none;
}
#backtotop {
    background: url(https://edutheque.philharmoniedeparis.fr/ui/skins/CIMU/images/backtotop.png) no-repeat center center;
    background-size: 50px;
    border: 0;
    bottom: 20px;
    cursor: pointer;
    display: none;
    height: 70px;
    position: fixed;
    right: 75px;
    text-indent: -9999px;
    width: 70px;
    z-index: 300;
}
#backtotop:hover {
    opacity: 0.8;
}
#backtotop:focus {
    opacity: 0.6;
    outline: none;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    #backtotop {
        background: url(https://edutheque.philharmoniedeparis.fr/ui/skins/CIMU/images/backtotop2x.png) no-repeat center center;
        background-size: 70px 70px;
    }
}


.btn-info.tarzan{
    /*Titre trop long sur les rebonds - ddenocq 20160926*/
    text-align: left;
    white-space:normal ;
}

a.btn-plus {		/* Bouton fond blanc - texte en noir */
    background-color:#FFF;
    padding:6px 12px;
    color:#001b3b !important;
}

/* Boutons (teaser concert participatif) fond bleu - texte en noir - guillaume*/
.btn-bgBleu,
.dossier-oe-modele .oe-accroche .btn-bgBleu,
.popVideoExtrait.btn-bgBleu,
.dossier-oe-modele .oe-accroche .popVideoExtrait.btn-bgBleu{
    background-color:#b3d6fd;
    padding:7px 5px;
    color:#001b3b;
}
.btn-bgBleu:hover,
.dossier-oe-modele .oe-accroche .btn-bgBleu:hover,
.popVideoExtrait.btn-bgBleu:hover,
.dossier-oe-modele .oe-accroche .popVideoExtrait.btn-bgBleu:hover{
    text-decoration: none;
    color:#001b3b;
}
.popVideoExtrait.btn-bgBleu:before,
.dossier-oe-modele .oe-accroche .popVideoExtrait.btn-bgBleu:before{
    content:'';
    padding:0;
}
/* Boutons effets hover avec transition - sarah*/
a#tous:hover, a.btn-plus-bl:hover, a.btn-plus:hover, a.btn-plusdbl:hover, a.btn-acheter:hover, .btn-default:hover, a.more-info:hover, a.tarzan:hover, a.document-link:hover , a.btn-first:hover, a.musee-btn:hover, .btn-info:hover, a.btn:hover, a.btn.btn-default.btn-xs:hover {	/* A rajouter selon les besoins */
    opacity: 0.70;
    text-decoration: none !important;
    -webkit-transition: all 0.4s ease-in-out 0.1s;
    transition: all 0.4s ease-in-out 0.1s;
}
a.see-biography {	/* 	Bouton depuis notice détaillée collections exemple doc/MUSEE/0158215/0129119-biographie-de-laurens-hammond.aspx */
    font-family:'SourceSansPro', 'Arial', 'Helvetica', sans-serif;
    padding: 2px 8px;
    font-size: 10px;
    margin-top: -25px;
}
a.player-link {	/* Player conférence */
    display: block;
    float: left;
    width: 100%;
    background-color: #b3d6fd;
    cursor: pointer;
    padding: 10px 0px 10px 20px;
    font-size: 18px;
    color: #001b3b;
    margin: 10px 0px;
}
a.download-link::before {
    content: url(/ui/skins/MEDIA/images/icon-download-16px-bleu.png);
    display: inline-block;
    vertical-align: middle;
    margin-right: .75rem;
}

/* ########################### Picto #######################*/
 img.ermes-thumb{
	background-color: transparent !important;
 }

/* ########################### mombre par page #######################*/
.btn-group.pageSize-container button{
	color:#7ab9ff !important;
	font-weight: bold !important;
 }

.btn-group.pageSize-container.open .dropdown-menu > li > a {
    color: #001b3b !important;
    padding: 0 0 0 5px;
}

/* ############################## Début - Ensemble des classes communes ############################################*/
	.line:after{	/* Création du petit trait noir après */
		content:url("images/pp-trait-separateur-noir.png");
		display:block;
	}
	.clear {
		clear:both;
	}

	.upper {	/* En majuscule quand besoin */
		text-transform:uppercase;
	}
	.bckg-bleu {		/* Très utilisés dans les tableaux pour donner un fond bleu, ou dans les rebonds propre à la philha */
	background-color:#b3d6fd;
	padding:12px;
	}
	.bckg-vert {
		background-color:#7bd69d;
	}
	.bckg-peche {
		background-color:#ffbd70;
	}
	.aplat-gris {
		background-color: #EFEFEF;
	}
/* ############################ Fin - Ensemble des classes communes############################################*/
/* ############################ Début - Page accueil - style page .accueil-modele ############################################*/
		/* --- Début Niveau de titre des pages accueils catalogue, digital et collections / Pas pour GPM car style de page no-search----- */
			.accueil-modele h2 {
				text-transform: uppercase;
			}

			.accueil-modele h3 {
				font-family:LinotypeBrewery-Bold;
				text-transform: uppercase;
				color: #001b3b;
				font-size: 1.1em;
			}
			.accueil-modele a:focus {
				text-decoration:none;
			}
		/* ---- Fin Niveau de titre de la page accueil de collections du musée ------- */
			.accueil-modele figure img {
				border:none;
			}
/* ############################ Fin - Page accueil - style page .accueil-modele ########################################################*/

/* ############################ Début Page listing modele - exemple :./expositions-temporaires-du-musee-de-la-musique.aspx ############# */
	.listing-modele #portal .liste h2 {
		margin-bottom: 10px;
		font-size:1.714em;
	}
	.listing-modele #portal .rebond-bleu h2, .listing-modele #portal .rebond-blanc h2{
		font-size: 1.438em;
	}
	.listing-modele h3 {
		font-family: LinotypeBrewery-Regular;
		text-transform: uppercase;
		font-weight: normal;
		font-size: 1.125em;
	}
	.listing-modele  h4 {
		font-family: LinotypeBrewery-bold;
		font-size: 1.125em;
		padding: 8px 0px;
	}

	.listing-modele p {
		font-size: 1.125em;
	}
	
	.listing-modele #portal a {
		color: #1D89DB;
	}
	.listing-modele #portal  li {
/*		font-size:1.071em;*/
		font-size:1rem;
	}
/* ####################### Fin Page listing modele ########################################## */

/* ******************************************** */ 
/* Sidebar REBONDS */
/* ******************************************** */ 
.sidebar-heading .panel-heading h2, .sidebar-heading .panel-heading h2 span, p.sidebar-heading, p.sidebar-heading span {
    font-size: 2rem !important;
    text-transform: none !important;
    font-family: LinotypeBrewery-Regular, sans-serif;
    color: #999;
    font-weight: 600;
    background: transparent!important;
}
/* ******************************************** */ 
/* fin : Sidebar REBONDS */
/* ******************************************** */ 

/* ####################### Début Encart MENU ################################################ */
	/* --- Début Menu à droite ---- */


		/* --- Pour fixer le  Menu à droite ---- 
		.menu nav{
			position:fixed!important;
			  top: auto;
		}
		*/

		.menu nav li {
			display: block;
			padding: 8px 0 !important;
			background-color: #f5f5f5;
			margin: 2px;
			padding-left: 10px !important;
			margin-left: 0px !important;
		}
		.menu nav li:hover {
			opacity: 0.70;
		}
			.menu nav li.menu-blanc {
				background-color: #fff;
				border-top: 1px solid #f5f5f5;
				margin-top: -2px;
				font-size: 1.071em !important;
			}
			.panel-body span.fleche-menu-droite {
				float:right;
			}

				.menu nav ul li a {
					color: #000 !important;
					height: auto;
					text-align: left;
					font-size: 1.200em !important;
					font-family: LinotypeBrewery-regular;
				}
				
				
				.menu nav ul li a:hover {
					color: #1D89DB !important;
					text-decoration: none !important;
				}
		/* ------ Partie responsive avec le menu-------  */
			@media screen and (min-width: 200px) and (max-width: 980px) {
				.exposition-modele .menu,	/* En responsive, le menu de droite disparaît sous les modèles suivants ! */
				.histoireinstru-modele .menu,
				.fiche .menu,
				.content-modele .menu {
					display:none;
				}
			}
/* ####################### FIN Encart MENU ################################################ */

/*************************************************** DEBUT page catalogue mediatheque news***************************************************************************************/
		.mediatheque .info {
		    background-color: #ffbd6f;
		    font-family: LinotypeBrewery-Bold;
		    text-transform: uppercase;
		    color: #000;
		    /*font-size: 20px;*/
			font-size: 20px;
		    padding: 7px;
		    text-align: center;
		    width: 100%;
		}



		/* ------- Début Menu --------------*/
		/* Remove margins and padding from the list, and add a black background color */
		ul.topnav {
		    list-style-type: none;
		    margin: 0;
		    padding: 0;
		    overflow: hidden;
		    padding-bottom: 30px;
		    /*background-color: #333;*/
		}

		/* Float the list items side by side */
		ul.topnav li {
			float: left;
			border-left: 1px solid #000000; 
			height: 20px;
			/* margin-top: 20px;*/

		}
		ul.topnav li:first-child { /* ou :first-of-type inutile dans une liste ou <li> sont les seuls enfants direct possible */
			border:none;
		}


		/* Style the links inside the list items */
		ul.topnav li a {
		    display: inline-block;
		    color: #000000;
		    text-align: center;
		    padding: 0px 20px 0px 20px;
		    text-decoration: none;
		    -webkit-transition: 0.3s;
		    transition: 0.3s;
		    font-size: 15px;
		    font-family: 'Source Sans Pro';

		}

		/* Change background color of links on hover */
		ul.topnav li a:hover {
			/*background-color: #111; */
			text-decoration : underline;
			color: #000; /* On passe le texte en noir... */

		}

		/* Hide the list item that contains the link that should open and close the topnav on small screens */
		ul.topnav li.icon {
			display: none;
			border-left: none;
		}


		/* When the screen is less than 680 pixels wide, hide all list items, except for the first one ("Home"). Show the list item that contains the link to open and close the topnav (li.icon) */
		@media screen and (max-width:800px) {
		  ul.topnav li:not(:first-child) {display: none;}
		  ul.topnav li.icon {
		    float: right;
		    display: inline-block;
		  }
		}

		/* The "responsive" class is added to the topnav with JavaScript when the user clicks on the icon. This class makes the topnav look good on small screens */
		@media screen and (max-width:800px) {
		  
		  ul.topnav.responsive {
		  	position: relative;
		  }

		  ul.topnav.responsive li.icon {
		    position: absolute;
		    right: 0;
		    top: 0;
		    border-left: none;
		    border-right: none;
		  }

		  ul.topnav.responsive li {
		    float: none;
		    display: inline;
		    border-left: none;
		    border-right: none;
		  }

		  ul.topnav.responsive li a {
		    display: block;
		    text-align: left;
		    text-decoration: none;
		    -webkit-transition: 0.3s;
		    transition: 0.3s;
		    font-size: 15px;
		    font-family: 'Source Sans Pro';
		    /*margin-top:25px;*/
		    /*padding: 20px 0px 0px 0px;*/
		
		  }

		  ul.topnav li a {
		    display: inline-block;
		    color: #000000;
		    text-align: center;
		    padding-top: 1.5em;
		    text-decoration: none;
		    -webkit-transition: 0.3s;
		    transition: 0.3s;
		    font-size: 15px;
		    font-family: 'Source Sans Pro';
			}
		}
		/* ------- Fin Menu --------------*/


		/* ------- Début Menu 2--------------*/
		/* Remove margins and padding from the list, and add a black background color */
		ul.topnav2 {
		    list-style-type: none;
		    margin: 25px 0px 45px 0px;
		    padding: 25px 0px 25px 0px;
		    overflow: hidden;
		    background-color: #e4e4e4;
		}

		/* Float the list items side by side */
		ul.topnav2 li {
			float: left;
			width: 130px;
		}

		/* Style the links inside the list items */
		ul.topnav2 li a {
		    display: inline-block;
		    color: #000000;
		    text-align: center;
		    padding: 5px 5px 5px 5px;
		    text-decoration: none;
		    -webkit-transition: 0.3s;
		    transition: 0.3s;
		    font-size: 15px;
		    font-family: 'Source Sans Pro';
		}

		/* Change background color of links on hover */
		ul.topnav2 li a:hover {
			/*background-color: #111; */
			text-decoration : underline;
			color: #000; /* On passe le texte en noir... */
		}

		ul.topnav2 li a img {
	    height: auto;
	    max-width: 100%;
	    padding: 5px 5px 5px 5px;
		}

/* ------- Fin Menu 2 --------------*/

/* ------- Accès ressources numériques -----*/
		@media screen and (min-width: 1000px) {
		.topnav2abo {
			width:70%;
			float:left;
		}
		}
		
		@media screen and (min-width: 1000px) {
		ul.topnav2.topnav2abo li {
			width:14%;
		}
		}
		
		
		@media screen and (min-width: 1000px) {
		.abo-num-homepage{
		width:28%;	
		float:right;
		margin: 25px 0px 45px 0px;
		}
		}
		
		.abo-num-homepage .media-body {
		border: 1px solid #ebebeb;
		height: 195px;
		background:url(https://drop.philharmoniedeparis.fr/homepage/catalogue/pictos/ressources_numeriques_6.png) 0px 35px no-repeat;
		}
		
		.abo-num-homepage .media-body:hover,
		.abo-num-homepage .media-body:focus {
			background-color: #ebebeb;
			opacity:0.5;
		}
		
		.abo-num-homepage .media-body h3 a {
			padding: 45px 20px 0 100px;
		}
		
		@media screen and (min-width: 1000px) {
		.abo-num-homepage .media-body p a {
			padding: 10px 20px 40px 100px;
		}
		}
		
		@media screen and (max-width: 999px) {
		.abo-num-homepage .media-body p a {
			padding: 10px 20px 85px 100px;
		}
		}
		
		.abo-num-homepage .media-body a {
			color:#000000;
			display:block;
		}	
		
		.abo-num-homepage .media-body a:link,
		.abo-num-homepage .media-body a:hover,
		.abo-num-homepage .media-body a:active {
			text-decoration:none;
		}		
		
/* ------- Fin Accès ressources numériques -----*/

/*--------  Page Revue et périodiques  ----------------------*/
		.content-modele .modele_9 .row div.jstor {
			padding:0;
		}
		

/*--------  Fin Page Revue et périodiques  ----------------------*/

/*--------  Page Catalogues de compositeurs  ----------------------*/
		.content-modele div.catalogues-compositeurs figure {
			float:left;
			width:30%;
		}
		
		.content-modele div.catalogues-compositeurs dt {
			font-family:SourceSansPro;
			font-size: 16px;
			font-weight:normal;
			float:left;
			width:20%;
		}
		
		.content-modele div.catalogues-compositeurs dd {
			float:left;
			width:80%;
		}
		
		.content-modele div.catalogues-compositeurs td {
			border:none;
		}
		
		.content-modele div.catalogues-compositeurs td.tableau-en-tete {
			padding-right:10%;
		}
		
		.content-modele div.catalogues-compositeurs td.indice-catalogue,
		.content-modele div.catalogues-compositeurs dd.indice-catalogue,
		.content-modele div.catalogues-compositeurs td.titre-catalogue,
		.content-modele div.catalogues-compositeurs dd.titre-catalogue{
			font-family:"SourceSansPro";
            font-weight: 500;
		}

/*--------  Fin Page Catalogues de compositeurs  ----------------------*/


/* ######################################### Début page de contenu : Les Incontournables ###############################################  */
	/* -------- Niveau de titre pour les incontournables -----------------------*/
		.incontournable-nom h2 {
			text-transform:uppercase;
			background:none;
		}

		.incontournable-modele h3 {
			font-family:LinotypeBrewery-bold;
			font-size:1.438em;
			margin-bottom:15px;
			padding-top:5px;
			font-weight: normal;
			text-transform:uppercase;
		}
		.incontournable-modele h4 {
			font-family: LinotypeBrewery-bold;
		}
	/* -------- Fin Niveau de titre pour les incontournables ---------------- */
		/* ---------  règles  sur les a liens des incontournables  ---------- */
			.incontournable-modele #portal .incontournable-instrument a, .incontournable-accroche a {
				color:#1675e1;
				font-size:1.000em;
			}
			.incontournable-modele  #portal .incontournable-instrument a {
				text-decoration:none;
			}
			.incontournable-modele #portal .incontournable-instrument a:hover {
				text-decoration:underline;
			}
		/* --------- Fin règles  sur les a liens des incontournables ----------- */
	/* --------- Début Paragraphe, images et listes pour incontournables ------- */
		.incontournable-modele p {
			font-size:1rem;
		}
		.incontournable-accroche li {
			font-size:1.143rem;
		}
		
		.incontournable-modele p.inc-chapo{	/* L'accroche - EnricheFromCMS en gras */
			font-family:"SourceSansPro";
            font-weight: 500;
		}
		
		/* Les éléments sur la balise figure - donc image avec légende*/
			.incontournable-modele .incontournable-modele figcaption {
				color:#808285;
				font-style:italic;
				font-size:1.000em;
			}
	/* --------- Fin Paragraphe, images et listes pour incontournables ------- */
	/* --------- Début info incontournable identité ---------------------------*/
		.incontournable-modele .incontournable-identite dl {
			clear:both;
		}
		.incontournable-modele .incontournable-identite dt {
			font-weight: normal;
		}
		.incontournable-modele .inc-facteur dt, .inc-facture dt, .incontournable-identite dt {
			float:left;
						font-family:"SourceSansPro";
            font-weight: 500;

			font-size:1.143em;
			margin-right:5px;
		}
		.incontournable-modele .inc-facteur dt, .inc-facture dt {
			display:none;
		}
		.incontournable-modele .incontournable-identite dd {
			float:left;
			font-size:1.143em;
			margin-right:10px;
		}
	/*  --------------------Fin info incontournable identité -------*/
	/*  -------------------- REBOND incontournable -----------------*/
        .incontournable-modele .incontournable-rebond .notice_corps a > div> div:last-of-type, 
        .incontournable-modele .incontournable-rebond .InstrumentTypeValue, .incontournable-modele #portal .InventoryNumberValue, .incontournable-modele .incontournable-rebond.line, 
		.footer-icon-container, .exposition-modele .incontournable-rebond .InstrumentTypeValue, .exposition-modele #portal .InventoryNumberValue, .exposition-modele .exposition-modele.line,
		.facteur-modele .incontournable-rebond .InstrumentTypeValue, .facteur-modele #portal .InventoryNumberValue, .facteur-modele .facteur-modele.line{  /* Dans rebond, informations cachées dont le flux rss */
			display:none;
		}
		.incontournable-modele #portal .incontournable-rebond h2, .exposition-modele #portal .incontournable-rebond h2,
		.facteur-modele #portal .incontournable-rebond h2 {
			font-size:1.475em;
			margin-top:5px;
		}
				
		.incontournable-modele #portal .incontournable-rebond h3, .exposition-modele #portal .incontournable-rebond h3,
		.facteur-modele #portal .incontournable-rebond h3{
			font-family:LinotypeBrewery-bold;
			font-size:1.150em;
			text-transform:uppercase;
			margin-bottom:5px;
			font-weight: normal;
			color:#000;
		}
		.incontournable-modele #portal .incontournable-rebond li div,.exposition-modele #portal .incontournable-rebond li div,
		.facteur-modele #portal .incontournable-rebond li div {
			color:#000;
			font-size:1.000em;
		}
		.incontournable-modele #portal .img-thumbnail, .exposition-modele #portal .img-thumbnail,
		.facteur-modele #portal .img-thumbnail{
			margin-bottom:17px;
		}
		.incontournable-modele #portal .incontournable-rebond p.CONTRAT_3, .incontournable-modele #portal .incontournable-rebond p.line,
		.exposition-modele #portal .incontournable-rebond p.CONTRAT_3, .exposition-modele #portal .incontournable-rebond p.line, 
		.facteur-modele #portal .incontournable-rebond p.CONTRAT_3, .facteur-modele #portal .incontournable-rebond p.line		{	/* Info enlever : contrat, durée */
			display:none;
		}
	/* -------- Fin Aside Incontournable Rebond ----------- */
/* ################################### Fin PAGE INCONTOURNABLES ######################################  */




/* ############################### Début Fenêtre modale - Pop up / définition ###################### */
	#fade { /*--Masque opaque noir de fond--*/
		display: none; /*--masqué par défaut--*/
		background: #000;
		position: fixed; left: 0; top: 0;
		width: 100%; height: 100%;
		opacity: .70;
		z-index: 9999;
	}
					
	.definition{
		display: none; /*--masqué par défaut--*/
		background: #fff;
		padding: 20px;
		border: 10px solid #e4e4e4;
		float: left;
		font-size: 1rem;
		position: fixed;
		left: 50%;
		z-index: 99999;
		/*--Les différentes définitions de Box Shadow en CSS3--*/
		-webkit-box-shadow: 0px 0px 20px #000;
		box-shadow: 0px 0px 20px #000;
		text-decoration: none !important;
		border-radius: 5px;
		line-height: 22px;
		cursor:context-menu;
        font-family:'SourceSansPro', sans-serif;
	}

	.content-oe-modele .close{
		color:#1D89DB;
		padding-left: 10px;
	}
	#portal a.close {	/* Bouton pour fermer pop up*/
		font-size:22px !important;
	}
	/* --Gérer la position fixed pour IE6-- */					
		html #fade {
			position: absolute;
		}
								
		html .definition {
			position: absolute;
		}

/* #################################Fin Fenêtre modale - Pop up / définition ###################### */
/* ################################# Début Extraits audio avec Soundcite ########################## */
		.soundcite-loaded {	/* Player MP3 exemples de soundcite */
			color: #1D89DB;
		}

		.rubrique-oe .soundcite-loaded  {
			color:#000;
			}
		.soundcite {	/* Player MP3 exemples de soundcite */
			background-color:rgba(0, 0, 0, 0.0470588);
		}
		.SoundciteAudioGlobal {	/* http://admin-ressources.philharmoniedeparis.fr/histoires-d-instruments-la-guitare-electrique.aspx player audio avec metadonnees*/
			padding: 10px 10px 5px 15px;
			background-color: #f7f7f7;
			margin-bottom: 15px;
			border-left: 5px solid #b3d6fd;
		}
		.SoundciteAudioGlobal p.SoundciteAudioDonnees, .SoundciteAudioGlobal p.SoundciteAudioDate  {
			font-style:italic;
		}
		.SoundciteAudioGlobal p {
			margin-bottom:5px;
		}
/* ############################  Fin Extraits audio avec Soundcite ###############################*/
/* ###########################################  POP-UP Vidéo #########################*/
		a.popVideoExtrait:before {
			content:url("images/popVideo.png");
			padding:0 5px;
		}
		.closeV {			/* Bouton fermer pour les pop-up video*/
			float:right;
			color: #fff;
			padding-left: 10px;
			font-size:2em;
		}
		#containerVideo .closeV:hover, #containerImgZoomHD .closeV:hover   { /* Bouton en hover fermer pour les pop-up video*/
			color:#b3d6fd;
		}

        .closeC {			/* Bouton fermer pour les pop-up conferences*/
			float:right;
			color: #fff;
			padding-left: 10px;
			font-size:2em;
		}
		#containerFrame .closeC:hover  {
			color:#b3d6fd;
		}
/* ############################  Fin POP-UP Vidéo #########################*/
/* ############################# Début Home outils éducatifs + page dossier outils éducatifs : http://digital.philharmoniedeparis.fr/outils-educatifs.aspx #################---- */ 
		/* ------------- Début Titres (H2, H3) -  PAGES Home + DOSSIER EDUCATIF -------------------- */
			.dossier-oe-modele h2 {
				font-size:1.7em;
				text-transform:uppercase;
				background: url("images/h2.png") repeat-x scroll left center rgba(0, 0, 0, 0);
				margin-top: 10px;
			}
			.dossier-oe-modele .rsItem h2.h2-boite-outil{	/* Très important : correspond aux titres des oeuvres dans les pages dossier */
				font-size:1.7em;
				background:url("images/h2.png") repeat-x scroll left center rgba(0, 0, 0, 0);
			}
			.dossier-oe-modele .rsItem h2 {		/* Dans la home des outils éducatifs, correspond à toutes les boîtes à outils */
				background:none;
				font-size: 1.4em;
			}
			.dossier-oe-modele .oe-composant h2 {		/* Composant des boîtes à outils : pièces participatives, guide écoute, portraits... */
				height:50px;
				font-size:1.25em;
			}
			.dossier-oe-modele h3 {
				font-family: LinotypeBrewery-Regular;
				text-transform: uppercase;
				font-weight:normal;
				font-size:1.071em;
			}

			.dossier-oe-modele h3.media-heading {	/* Espace dans page home outils + page dossier : niveau titre h3 */
				height:45px;
			}

			div.block-image-compo h3, .oe-fiches-oeuvres-tab h3 {				/* Correspond aux noms des compositeurs dans page portraits + h3 fiches oeuvres */
				font-size: 1em;
				margin-top:10px;
				text-align:center;
				font-family: LinotypeBrewery-Regular;
				text-transform: uppercase;
				font-weight:normal;
			}
			
			.content-modele div.block-image-compo p,
			.facteur-modele div.block-image-compo p{/* Page abonnements et périodiques sur le catalogue et liste des facteurs */
				text-align:center;
			}

			.oe-fiches-oeuvres-tab h3 {
				text-align:left;
			}
		/* ------------- Fin Titres (H2, H3)+ Paragraphes et listes -  PAGES Home + DOSSIER EDUCATIF -------------------- */
		/* --------------Début paragraphe - Page home + dossier éducatif ----------------------------- */
			.dossier-oe-modele .oe-accroche p, .dossier-oe-modele .oe-accroche li { /* Paragraphe de type accroche */
				font-size: 1.125em;
			}

			.dossier-oe-modele .oe-accroche a.billet {
    		background:url("images/picto-billets-blancs.png") no-repeat left center;/* repeat:none;*/
    		padding-left: 25px;
    		padding-top:3px;
    		padding-bottom:3px;

    		/*background-color: #CCCCCC;-*/
			}

			.dossier-oe-modele .oe-accroche a {
				color:#1D89DB;
			}
			.dossier-oe-modele .oe-accroche a:hover {
				text-decoration: underline;
			}


		/* --------------Fin paragraphe - Page home + dossier éducatif ----------------------------- */
		/*---------- Début Outils éducatifs - Home + page dossier / Liste et liens ---------- */
			.dossier-oe-modele .oe-accroche li, .content-oe-modele #portal .only-content li, .content-oe-modele #portal .content-img-dr li, .content-oe-modele #portal .content-img-gch li, .content-oe-modele .rubrique-oe li, .facteur-modele .bckg-bleu li{
				list-style-image: url(images/puces.png);
				margin-left:20px;
			}
            .dossier-oe-modele .oe-accroche li li, .content-oe-modele #portal .only-content li li, .content-oe-modele #portal .content-img-dr li li, .content-oe-modele #portal .content-img-gch li li, .content-oe-modele .rubrique-oe li li, .facteur-modele .bckg-bleu li li{
				list-style-image: none;
				list-style-type:disc;
			}
			.content-oe-modele .rubrique-oe li, .facteur-modele .bckg-bleu li {
				margin-left:10px;
			}
			
			.dossier-oe-modele a.tous {	/* Bouton sur la home des outils éducatifs*/
				float:right;
			}


		/* ----------------- lien billetterie ------------- */



		/*---------- Fin Outils éducatifs - Home + page dossier / Liste et liens ---------- */	
		/* -------------Début  Images dossier-oe-modele ------------ */
				.dossier-oe-modele figure{					/* - généralité sur les images quand figure image à gauche avec légende. espace droite */
					float:left;
					width:30%;
					padding-right: 10px;
				}
				.dossier-oe-modele  .img-responsive {
					width:240px;
					height:240px !important;
				}
				.dossier-oe-modele .modele-4-col img.media-object.img-noresponsive {		/* Encarts de base carré par 4 */
					width:100%;
					height:100%;
				}
		/* -------------Fin  Images dossier-oe-modele ------------ */
		/* -------------Début : Home outils éducatifs : encart guide écoute, portraits, fiche oeuvres, pieces participatives ----------------------*/
				.dossier-oe-modele .oe-composant {
					float: left;
					width: 19.5%;
					border: 1px solid #ebebeb;
					padding: 10px;
					margin: 2px;
				}		
		/* -------------FIN : Home outils éducatifs : encart guide écoute, portraits, fiche oeuvres, pieces participatives ----------------------*/		
		/* ------------- Début page dossier - Encart haut accroche avec image dossier + texte + date concert + oeuvres jouées -------------*/
 					.dossier-oe-modele .oe-accroche .rsItem div {		/* Accroche de l'encart 2 */
  						float:left;
  						width:65%;
  						margin-top: -15px;
 					}

					.dossier-oe-modele .modele-image-gauche-texte-droite {
						  margin-top: 5px;
					}

					.dossier-oe-modele .modele-image-gauche-texte-droite .describe {
/*						height:30px;*/
                        height: auto;
					}
		/* ----------------- Tableaux ------------- */
			.dossier-oe-modele #portal td, .dossier-oe-modele #portal tr  {
				border: 1px solid #b3d6fd;
			}
			.dossier-oe-modele td {
				color: #000;
				padding-left: 10px;
			}
		

			






/* ############################## Fin Home outils éducatifs + page dossier outils éducatifs : http://digital.philharmoniedeparis.fr/outils-educatifs.aspx #################---- */ 
/* ############################## Début outils éducatifs + CONTENUS outils éducatifs : http://digital.philharmoniedeparis.fr/1044744-mille-et-une-nuits.aspx #################---- */ 					
		/* -------------- Début sur padding des pages contenus outils éducatifs-------------------*/
			.content-oe-modele .panel-front.only-content, .content-oe-modele .panel-front.content-img-dr, .content-oe-modele .panel-front.content-img-gch	{
				padding-top:0;
			}
		/* -------------- Fin sur padding des pages contenus outils éducatifs-------------------*/
		/* ------------- Début Titres (H1, H2, H3)+ Paragraphes et listes -  PAGES contenus outils EDUCATIFs -------------------- */	
			.content-oe-modele .only-content h2, .content-oe-modele .content-img-dr h2, .content-oe-modele .content-img-gch h2, .content-oe-modele .oe-accroche h2, .content-oe-modele .rubrique-oe h3, .page-contenu h2, .page-contenu h2 span {
				font-family: LinotypeBrewery-bold;
  				font-size: 1.438rem;
				padding:5px 0 10px 0;
				background: none !important;
				text-transform:uppercase;
			}			
						
			.content-oe-modele .only-content h3, .content-oe-modele .content-img-dr h3, .content-oe-modele .content-img-gch h3, .content-oe-modele .oe-accroche h3, .page-contenu h3:not(.template-title), .page-contenu h3:not(.template-title) span {
				font-family: LinotypeBrewery-bold;
				font-size:1.25rem;
                line-height: 1.3;
			}
			.content-oe-modele .rubrique-oe h3 {
				font-size:1.25rem;
                line-height: 1.3;
			}
			.content-oe-modele h4, .page-contenu h4, .page-contenu h4 span {
				font-family:LinotypeBrewery-regular;
				font-size:1.25rem;
				padding:5px 0 5px 0;
				font-weight:normal;
			}
			.content-oe-modele .rubrique-oe h4 {
			font-family:"SourceSansPro";
            font-weight: 500;
					font-size: 1.143rem;
					padding-bottom:5px;
				}
			/* Partie responsive concernant les titres */
			@media screen and (min-width: 320px) and (max-width: 767px) {
				.dossier-oe-modele #portal h1, .content-oe-modele #portal  h1 {
					font-size:2rem;
				}
			}
		/* ------------- Fin niveau de Titres (H1, H2, H3)  PAGES contenus outils EDUCATIF -------------------- */
		/* ------------- Début paragraphe  PAGES contenus outils éducatifs -------------------- */
			.content-oe-modele .only-content p, 
			.content-oe-modele .content-img-dr p, 
			.content-oe-modele .content-img-gch p,
			.content-oe-modele .only-content li, 
			.content-oe-modele .content-img-dr li,
			.content-oe-modele .content-img-gch li,
			.content-oe-modele .rubrique-oe li, 
			.content-oe-modele .rubrique-oe p, 
			.content-oe-modele .oe-accroche p {
/*  				font-size: 1.125em;*/
                font-size: 1rem;
				margin-top:0;
				margin-right:20px;
			}		
            .content-oe-modele .only-content p.categorie{
                font-size: .825rem;
                font-weight: 600;
            }
			.content-oe-modele .rubrique-oe b em, b em, strong em, em strong, i strong {		/* Dès qu'on trouve des b ou strong avec i ou em, importance d'avoir les gras et italiques */
				font-style:italic;
				font-weight:bold;
			}
			.content-oe-modele .rubrique-oe li {
				padding-bottom:5px;
			}
		/* ------------- Fin paragraphe + liste -  PAGES contenus outils éducatifs -------------------- */
		/* ------------- Début LIENS DANS PAGES Contenus outils EDUCATIF ------------------------------ */
			.content-oe-modele #portal a {							/* Tous les liens des pages contenus dossiers éducatifs sont bleus*/
				color:#1D89DB;
			}
			.content-oe-modele #portal a:hover {						/* Tous les liens des pages contenus dossiers éducatifs en hover sont soulignes*/
  				text-decoration: underline;
			}
			.content-oe-modele a.btn-plus-bl {   /* Couleurs du contenu des boutons en noir*/
				color:#000 !important;
			}
			.content-oe-modele #portal .rebond .rsItem a {				/* Augmentation taille typo lien rebond vers les biographies*/
				font-size:1.125em;
			}
		
			a.guide-contentOe:before {					/* Pour les pages de contenus avec guides d'écoute, système ancre. AJout devant un picto guide ecoute*/
				content:url("images/picto-guide.jpg");
				padding-right:10px;
			}
			a.guide-contentOe {
				font-size:1.125em;
			}
			.content-oe-modele #portal .rubrique-oe  a.popVideoExtrait {
				color:#000;
				background-color: rgba(0, 0, 0, 0.0470588);
			}
			.content-oe-modele .only-content a.play-oe:before, .content-oe-modele .content-img-dr a.play-oe:before, .content-oe-modele .content-img-gch a.play-oe:before, .content-oe-modele .rubrique-oe a.play-oe:before{
					content:url("images/popVideoExtrait.png");
					padding-left:5px;
			}
			.content-oe-modele .only-content a.play-oe:hover:after, .content-oe-modele .content-img-dr a.play-oe:hover:after, .content-oe-modele .content-img-gch a.play-oe:hover:after, .content-oe-modele .rubrique-oe a.play-oe:hover:after{				
				content:"(prochainement disponible)";
				padding-left:5px;
				text-decoration:overline;
			}

			.content-oe-modele div.content-oe-fifty {
				width:49.5%;
				float:left;
			}
			.content-oe-modele div.content-oe-fourty {
				width:45%;
				float:left;
			}

			.content-oe-modele div.content-oe-sixty {
				width:55%;
				float:left;
			}

			.content-oe-modele div.oe-fifty-hauteur p {
				height:110px;
			}
			.content-oe-modele div.content-oe-thirty {
				width:33%;
				float:left;
				margin-right:0.3%;
			}

			.content-oe-modele div.content-oe-thirty:last {
				margin-right:none;
			}

			

		/* -------- Fin LIENS DANS PAGES Contenus outils EDUCATIF --------- */
 		/* -------- Début Image - figure PAGES Contenus outils EDUCATIF --------- */
				.content-oe-modele .oe-accroche figure img{
					  width:100%;
					  height:auto;
				}

				.content-oe-modele .only-content figure {
					padding-bottom:10px;
				}
				
				.content-oe-modele .content-img-gch figure, .content-oe-modele .content-img-dr figure, .content-oe-modele .rubrique-oe figure  {
					width:300px;
					min-width:250px;
					margin: 0 15px 10px 0px;
					clear: both;
				}
				
				.content-oe-modele .content-img-gch figure,  .content-oe-modele .rubrique-oe figure {		/* Images ferrees à gauche dans les encarts contenus concert éducatif */
					 float:left;
				 }
				.content-oe-modele .content-img-dr figure {		/* Images ferrees à droite dans les encarts contenus concert éducatif */
					 float:right;	
					 margin-left: 10px;
				 }

				.content-oe-modele .rubrique-oe,	/* Applat bleu pour les pistes péda. */
				.dossier-oe-modele .rubrique-oe {	/* Applat bleu pour les pistes péda. */
					background-color:#b3d6fd;
                    margin-bottom: 2.5rem;
				}
			/* -------------Fin  Images entre  content-oe-modele ------------ */
			.content-oe-modele article {								/* Infos espacement pour tous les artciles */
				display: inline-block;
				margin-top:0;
				width:100%;
			}
			/* ---------------  Début Carroussel images frise dans page contenu concert éducatif : exemple : orfeo page contexte -------------- */
				.content-oe-modele .rsCaption p {		/* Correspond à la légende*/
					font-family: "SourceSansPro";
					font-size: 1em;
				}
				.content-oe-modele .rsCaption p span {		/*Correspond aux crédits photos*/
					font-style:italic;
					font-size:0.857em;
				}
				.content-oe-modele .rs-ImgCarousel-textualCarousel .rsGCaption {	/* Modifier la largeur du bandeau gris du carroussel */
						padding: 7px 0 7px;
				}

				.content-oe-modele .rsDefaultInv .rsGCaption {
					bottom:0;
				}
				.content-oe-modele #portal ul {
					margin-bottom:5px;
				}
		
				.content-oe-modele ul.rsNav.rsBullets.bs-bullets {
					display:none;
				}
			/* ------------- Fin caroussel page contenu Outils éducatifs -------------- */
		/* -------------- Début Tableau pages contenus outils éducatifs : carte identité oeuvre ------------- */
			.content-oe-modele table, .content-oe-modele tr, .content-oe-modele td {
				border:1px solid #b3d6fd;
			}
			.content-oe-modele #portal table ul li, .content-oe-modele #portal table ol li {
				font-size:14px;
			}
			.content-oe-modele .rubrique-oe table, .content-oe-modele .rubrique-oe tr, .content-oe-modele .rubrique-oe td {
				border:1px solid #fff;
			}
			.content-oe-modele td {
				color:#001b3b;
				padding-left:10px;
                font-family:'SourceSansPro', sans-serif;
			}
		/* -------------- Fin Tableau pages contenus outils éducatifs : carte identité oeuvre ------------- */
		/* --------------- Début CSS - N° Retour à la ligne --------------*/
		.content-oe-modele .retour-ligne, .dossier-oe-modele .retour-ligne, .popVideoExtrait {
			    white-space: nowrap;
		}
		/* --------------- Fin CSS - N° Retour à la ligne --------------*/

   		/* --------------- Début REBOND PAGE DOSSIER EDUCATIF CONTENT - Recherche capturée Guide ecoute, concert vidéo ------------- */
			.content-oe-modele .rebond .rsItem ul li a img {
				width:70px;
				height:auto;
				padding:5px 10px 0 0;
				float:left;
			}
			.content-oe-modele .rebond .cim-short-CONTRAT_1 {	/* Correspond aux contrats */
				display:none;
			}
			.content-oe-modele #portal .frame-ermes-searchcapturemultirender li:before{				/* Petites puces bleues n'apparaîssent pas quand rechetrche capturée */
				content:none;
			}
			.content-oe-modele #portal .frame-ermes-searchcapturemultirender div.webframe-ermes-lastviewedresources-item{
				height:auto;
				width:100%;
				border: none;
				line-height: 17px;
			}
			.content-oe-modele #portal .frame-ermes-searchcapturemultirender a{						/* Couleurs des liens en bnoir pour recherche capturée */
				color:#001b3b;
			}

			.content-oe-modele #portal .frame-ermes-searchcapturemultirender h2{					/* H2 des recherches capturées - modification police...*/
				font-size:1.475em;
			}

			.content-oe-modele img.ermes-thumb-size-MEDIUM {										/* tailles vignettes recherches capturées */
				min-width: 90px !important;
				min-height: 60px !important;
				
			}
			
			.content-oe-modele #portal .template-title{
				font-size:1.1em;
				line-height: 17px;
			font-family:"SourceSansPro";
            font-weight: 500;
				color:#001b3b;
			}

			.content-oe-modele .template-info {	/*.template-info*/					
				color:#001b3b;
				width: 100%;
				padding-left: 100px;
			}
			
			.content-oe-modele .webframe-ermes-lastviewedresources-item .template-auteur{
				margin-top:0px;
				margin-bottom:0px;
			}
			
			.content-oe-modele .notice_corps br{		/* Suppression des espaces en trop dans recherche capturée pour condenser informations */
				display:none;
			}

			.content-oe-modele .footer-icon-container {		/* Icone du flux RSS à cacher - valable pour tous les rebonds dossier educatif*/
				display:none;
			}

			/* ......... rebond extraits audios ........ */
					.content-oe-modele .rebond .vignette_document{		/* Ajout du style rebond pour rebond en audio - car pas la même présentation que guide écoute et extraits vidéo */
						padding-bottom:20px;
						margin: 0 5px 10px 0;
					}

					.content-oe-modele .rebond .rs-staticList .cim-short-contrat, 
					.content-oe-modele .rs-staticList .cim-short-contrat, 
					.content-oe-modele .rs-staticList .line, 
					.content-oe-modele .rs-staticList .cim-short-duree-type-doc, 
					.content-oe-modele .rebond .rs-staticList .template-resume, 
					.content-oe-modele .rebond .rs-staticList .cim-short-genre,
					.content-oe-modele .webframe-ermes-lastviewedresources-item-shadow,
					.content-oe-modele .rebond .CONTRAT_1, .content-oe-modele .rebond h3.title::before{			/* Rebonds audio dans pages de contenus */
						display:none;
					}
			/* ......... Rebond dossier pedgagoqie dans page biographies ........... */
				.content-oe-modele #portal p.template-resume{
					font-size:1em;
					font-weight:normal;
					margin-top:0;
					padding-left: 100px;
					line-height: 17px;
				}


            /* *********************************************************************** */
            /* ENCART "extrait-mea" LISTE SIMPLE RECHERCHE CAPT., "écoutez l'oeuvre"   */
            #portal .frame-ermes-searchcapturemultirender.extrait-mea div.webframe-ermes-lastviewedresources-item{
                border: 1px solid #dedede;
                padding: 10px;
                box-shadow: 0 4px 9px #ccc;
            }
            #portal .frame-ermes-searchcapturemultirender.extrait-mea div.webframe-ermes-lastviewedresources-item .vignette_document{
                padding: 0;
                margin-right: 1rem;
                margin-bottom: 0;
            }
            #portal .frame-ermes-searchcapturemultirender.extrait-mea div.webframe-ermes-lastviewedresources-item .vignette_document img.ermes-thumb{
                padding: 0;
                margin: 0;
                width: 150px;
            }


		/* -------------- FIN REBOND PAGES CONTENUS DOSSIER EDUCATIF ----------------- */
		/* -------------Début Responsive Web HOME + LE DOSSIER ---------------------- */
			@media screen and (min-width: 768px) and (max-width: 980px) {
				.dossier-oe-modele .modele-4-col img.media-object.img-noresponsive {	/* Correspond aux 4 images de la page HOME des outils éducatifs*/
					width:85%;
					height:85%;
				}
				
				.dossier-oe-modele .modele-4-col .border{
					width:85%;
				}
				.dossier-oe-modele a.tous {
  					float: left;
				}
				.dossier-oe-modele .oe-composant {
					width:30%;
				}	


			.content-oe-modele div.content-oe-thirty {
				width:100%;
				float:left;
				margin-bottom:15px;
			}

			}
			
			@media screen and (min-width: 480px) and (max-width: 767px) {
				.dossier-oe-modele figure {
					width:100%;
				}
				.dossier-oe-modele .oe-accroche .rsItem div {
					width:100%;
					margin-top: 10px;
				}

				.dossier-oe-modele .col-xs-12.col-sm-6.col-md-3.media{
					float:left;
					width:48%;
				}
				.dossier-oe-modele .oe-composant {	
						width:45%;
				}


				.content-oe-modele div.content-oe-fifty {
				width:100%;
				float:left;
			}
			.content-oe-modele div.content-oe-thirty {
				width:100%;
				float:left;
				margin-bottom:15px;
			}
			}
			@media screen and (min-width: 200px) and (max-width: 479px){
				.dossier-oe-modele .oe-composant {
						width:100%;
				}
			}
			  	 
		 @media screen and (min-width: 315px) and (max-width: 639px) {
			 .dossier-oe-modele .oe-accroche .rsItem div {
				 width:100%;
				 display:block;
			 }
			 .dossier-oe-modele .media-body{
				 display:block;
			 }
			 .dossier-oe-modele .img-responsive {
  					width: 180px;
 					height: 180px !important;
			}
			.dossier-oe-modele figure {
				width:100%;
			}
			.dossier-oe-modele .modele-image-gauche-texte-droite h3 {
				height:auto;
				font-size:1em;
			}
			.dossier-oe-modele .modele-image-gauche-texte-droite .describe{
				display:none;
			}
			.dossier-oe-modele .modele-image-gauche-texte-droite .btn {
				margin:0;
			}
			.dossier-oe-modele .modele-image-gauche-texte-droite p.evene {
				margin: 5px 12px 5px 0 !important;
			}


			.content-oe-modele div.content-oe-fifty {
				width:100%;
				float:left;
			}
			.content-oe-modele div.content-oe-thirty {
				width:100%;
				float:left;
				margin-bottom:15px;
			}


		}
		@media screen and (min-width: 315px) and (max-width: 375px) {
			.dossier-oe-modele .img-responsive {
  				width: 100%;
  				height: 100% !important;
				margin-top: -20px;
			}
			.content-oe-modele .content-img-dr figure {
				margin:0;
			}
		}
		@media screen and (min-width: 200px) and (max-width: 314px) {
			.dossier-oe-modele figure {
				width:100%;
			}
			.dossier-oe-modele .oe-accroche .rsItem div{
				width:100%;
			}
			.dossier-oe-modele .img-responsive {
				margin-top: -20px;
			}
			.dossier-oe-modele .modele-image-gauche-texte-droite .describe{
				height:auto;
			}
			.dossier-oe-modele .modele-image-gauche-texte-droite .btn{
				margin-top:0;
			}
			.content-oe-modele .content-img-gch figure, .content-oe-modele .content-img-dr figure, .content-oe-modele .rubrique-oe figure {
				width:100%;
				margin:0;
			}
		}
	/* -------------Fin Responsive Web HOME + LE DOSSIER ---------------------- */
	/* ---------- Début - Tableau par ordre alphabétique identique à CSS affichages détaillés - Page portraits ./portraits.aspx + page fiches oeuvres ./les-fiches-oeuvres.aspx -------- */
		.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
			border-bottom: none !important;
			background-color:#FAF8F9;
			color:#001b3b !important;
			border:1px solid;
		}

		.nav-tabs > li > a, .nav-tabs > li > a:hover, .nav-tabs > li > a:focus {
			background-color: #FFF;
			border-color: #001b3b;
			border-top: none;
			border-right: none;
			border-left:none;
			border-radius:0px;
			color: #001b3b !important;
			font-family:LinotypeBrewery-regular;
			font-weight:normal;
			font-size:1.125em;
		}

		.nav > li > a:hover, .nav> li > a:focus {
			outline:0px solid #001b3b !important;
		}
			
	/* Bloc par 3 dans les pages du tableau  toutes lettres A B C par exemple ./les-fiches-oeuvres.aspx */
		.oe-fiches-oeuvres-tab #myTabContent a {
			text-decoration:none;
			padding-left:10px;  
		}		
		article.oe-fiches-oeuvres-tab article {
			width:33%;
			display:inline-block;
			vertical-align:top;
		}
	/* Outils éducatifs - Portraits - Bloc avec image du compositeur + Nom Prénom (XXXX-XXX) */
		div.block-image-compo {		/*Bloc avec image lien + nom compositeur*/
			display: inline-block;
			width:23%;
			padding:5px 5px 5px 0;
			vertical-align: top;
		}
	
	/* Partie responsive de la partie portraits + fiches oeuvres */
		@media screen and (min-width: 320px) and (max-width: 767px) {
			div.block-image-compo {		/*Bloc avec image lien + nom compositeur*/
				width:45%;
			}
			div.block-image-compo h3 {		/* Correspond aux nom des compositeurs*/
				font-size: 12px;
			}

			.dossier-oe-modele .nav-tabs > li > a {
				padding: 5px 15px;
				font-size:1em;
			}
			article.oe-fiches-oeuvres-tab article {
				width:100%;
			}
		}
		@media screen and (min-width: 200px) and (max-width: 319px) {
			div.block-image-compo {		/*Bloc avec image lien + nom compositeur*/
				width:100%;
			}
		}
	/* --------------------------- Fin partie portraits + fiche oeuvre -----------------------------------------------*/
/* ############################## Fin outils éducatifs + CONTENUS outils éducatifs : http://digital.philharmoniedeparis.fr/1044744-mille-et-une-nuits.aspx #################---- */
/* ##############################  Début Partie Accordéon ############################# */
		div.modele_6.model-html {
			border:2px solid #b3d6fd;
			margin:0;
		}
		div.modele_6.model-html .panel-model {
			border-color: #FAF8F9;
		}
		
		div.modele_6.model-html h4, div.modele_6.model-html h3{
			padding:0;
			font-family: LinotypeBrewery-regular;
			font-size: 1.071em;
			text-transform:uppercase;
			font-weight: normal;
			margin:0;
		}
		
		div.modele_6.model-html p, div.modele_6.model-html a, div.modele_6.model-html ol, div.modele_6.model-html li{	/* Correspond à l'accordéon */
			font-size:1.071em !important;
		}
		
		div.modele_6.model-html a {
			color:#1D89DB;
		}
		div.modele_6.model-html div.panel-body {
			padding-bottom:0;
		}
		
		.listing-modele .panel-model > .panel-heading {	/* Fond blanc sur lequel on peut trouver les titres des oeuvres */
			background-color:#FAF8F9;
		}
				
		.listing-modele .panel-model {		/* Bordure blanche sur lequel on peut trouver les titres des oeuvres */
			border-color:#fff;
		}
		
		.listing-modele .panel-model > .panel-heading + .panel-collapse .panel-body {	/* Partie ouevrte avec le contenu de l'accordéon */
			border-top: 1px solid #DDDDDD;
			background-color:#FAF8F9;
		}
/* ##############################  Fin Partie Accordéon ############################# */
/* ############################# Début Affichage court #####################################*/
	div.notice_courte div.actions {	/* Bouton consulter notice courte - déplacé au niveau du texte */
		margin-left: 120px;
	}
	@media screen and (min-width: 200px) and (max-width: 767px) {
		div.notice_courte div.actions {
			margin-left:0;
		}
	}
/* ############################# Fin Affichage court #####################################*/

/* ############################################## Début Selection Anciennement Bibliographie - sélection thématique ################################################################### */
	/* Tous les titres dans sélection thématique */
		
		.bibliographie-modele  p.sous-titre-h1 { /* Sous-titre : "une sélection de la Médiathèque" */
			font-size:2em;
			margin-top:5px;
		}
		
		
		.bibliographie-modele h2, .bibliographie-modele h3, .bibliographie-modele h4 {	/* Tous les titres des sélections thématiques en noir */
			color:#000;
		}
		.bibliographie-modele h2, .bibliographie-modele .rebond h3, .bibliographie-modele .rebond-biblio h3, .bibliographie-modele h3 { 	
			text-transform: uppercase;
		}
		
		.bibliographie-modele h2 {
			font-size: 1.438em;
			font-family: LinotypeBrewery-bold;
		}
		
		
		.bibliographie-modele h2.sous-titre-selection  {
			text-transform: none !important;
			font-family: LinotypeBrewery-regular;
			font-size: 1.438em;
			padding: 5px 0 10px 0px;
			font-weight: normal !important;
			background: none !important;
		}
	 
		/*.bibliographie-modele .frame-ermes-searchcapturemultirender h2 span,  .bibliographie-modele .webframe-ermes-carousel h2, .bibliographie-modele h2, .bibliographie-modele .only-content h2 { /* Titre h2 de la bibliographie, c'est le titre que l'on remplit dans l'encart html
			font-size:1.5em;
			padding:15px 0 5px 0;
			background:none;
		}
		*/

		.bibliographie-modele #portal .rebond h2, .bibliographie-modele #portal .rebond-biblio h2 {		/* Trait sur la droite du titre */
			background: url("images/h2.png") repeat-x scroll left center rgba(0, 0, 0, 0);
			margin-bottom: 15px;
		}

		.bibliographie-modele  h3, .bibliographie-modele .rebond h3, .bibliographie-modele .rebond-biblio h3 {	/* Infos communes pour titre  */
			font-size:1.071em;
			font-family:LinotypeBrewery-regular;
			font-weight: normal;
			line-height:1.15;
		}
		.bibliographie-modele .rebond h3, .bibliographie-modele .rebond-biblio h3 {
			font-family:LinotypeBrewery-Bold;
			margin-top:-10px;
		}

		.bibliographie-modele h3.title::before{	/* Autre trait séparateur qui a été enlevé */
			background-image:none !important;
		}

		.bibliographie-modele .rebond h3, .bibliographie-modele .rebond-biblio h3 {	/* Titre 3 des rebonds - celui fond bleu, celui fond blanc*/
			padding:15px 0px 0px 0px;
		}

		.bibliographie-modele  h4 {
			font-family:LinotypeBrewery-regular;
			font-size:1.438em;
		}
		
		.bibliographie-modele div.img-with-border div.col-xs-12.col-sm-6.col-md-3.media {
			border: 1px solid #ebebeb;
		}
		
		
	/* ------- Fin informations CSS des titres pour bibliographies ------- */
	/* -------- Partie accroche avec image gauche et texte à droite ---------------------*/
				.bibliographie-modele .content-img-gch figure {
					width:300px;
					min-width:250px;
					margin: 0 15px 10px 0px;
					float:left;
					clear: both;
				}
				.bibliographie-modele .content-img-gch p {
					font-size: 1.2em;
				}	
	
	/* ----- Boutons des bibliographies TOUT VOIR - En savoir plus ------- */
		.bibliographie-modele #portal a {
			color: #1D89DB;
		}
		.bibliographie-modele #portal a.btn, .bibliographie-modele #portal .rebond-biblio .btn-default, .content-modele #portal .btn-default, .bibliographie-modele #portal .media-heading a, .bibliographie-modele #portal .title a , .bibliographie-modele #portal .rebond  a.btn-plus   {
			color:#000;
		}
	/* --- Information sur les paragraphes - bibliographies ----- */
		.bibliographie-modele .footer-icon-container, .bibliographie-modele a span.cms-icon-rss {	/*Correspond à la div avec les icônes de type flux RSS qui est caché dans les recherches capturés... */
			display:none;
		} 
		
		/* Petit trait séparateur des typologies au titre */
		/*.bibliographie-modele .sur-titre:after, .bibliographie-modele #sur-titre-detail:after, .bibliographie-modele p.evene:after  {	
			content: url("images/pp-trait-separateur-noir.png");
			display: block;
		}*/
			
		.bibliographie-modele .rs-staticList p, .bibliographie-modele p.template-parent {
			margin:0;
		}
		.bibliograpie-modele .rebond-bleu p, .bibliograpie-modele .rebond-blanc p {
			margin: 12px 0;
		}
			
		.bibliographie-modele p.selection-description {	/*Correspond au paragraphe dans la sous catégorie dans recherche capturée - partie dite "description" après H2 */
			font-size:1.3em;
			margin-top: -5px;
			border:none;
		} 

		.bibliographie-modele p.template-resume {
		    font-style: normal;
		    font-size:1em;
		    line-height: 15px;
		}

		
		.bibliographie-modele p.template-auteur {	/* template-auteur  : correspond aux noms auteurs pour partie guide d'écoute - UNI8C */
			font-family:"SourceSansPro";
            font-weight: 500;
		}
			
		.bibliographie-modele p.template-info, p.info_triptyque_selection, .bibliographie-modele ul.template-info li, .bibliographie-modele p.describe, .bibliographie-modele p.template-auteur {
			padding-bottom:5px;
		}

		.bibliographie-modele .template-physicalDescription {	/* Correspond dans résultat recherche capturée au nombre de pages pour livre, article ... */
			margin-bottom:5px;
		}
		
		.bibliographie-modele .public-dest {	/* Information à afficher dans les résultats de recherche mais pas dans les sélections */
			display:none;
		}

		.bibliographie-modele .frame .only-content{		/* IMPORTANT : marge entre titre + résultats 	margin-top:-25px;*/
			/*margin-top:10px !important;*
			margin-bottom:2em !important;*/
		}

		.bibliographie-modele p.date, .bibliographie-modele p.template-call-number  {		/* Exemple : Cote : 84.15 REV pour template-call-number */
			color:#808285;
		}
		.bibliographie-modele p.template-call-number {	/* Pour mettre à la ligne les cotes */
			display : block;
		}
		
		.bibliographie-modele p.template-summary{	/* Résumé fait par les documentalistes sur les documents - en italique */
			font-style:italic;
			display:initial;
		}

		.bibliographie-modele div.InstrumentTypeValue, .bibliographie-modele li.desc-list-item, .bibliographie-modele div.PlaceOfProductionValue, .bibliographie-modele div.DateOfProductionValue, .bibliographie-modele .template-info, .bibliographie-modele .info_triptyque_selection{
			color:#000;
			font-weight:normal;
			font-family:SourceSansPro;
			font-size: 15px;
		}
		.bibliographie-modele div.InventoryNumberValue, .bibliographie-modele div.DateOfProductionValue, .bibliographie-modele p.template-subject, .bibliographie-modele .cim-short-CONTRAT_1, .bibliographie-modele .cim-short-genre, .bibliographie-modele span.cim-short-duree-type-doc {	/* Ne pas laisser les numéros inventaires apparaître dans la notice détaillée de la recherche capturée*/
			display:none; 
		}

		.bibliographie-modele span.cim-short-duree-type-doc{
				display:block; /* affiche le trait*/
		}

	/* ---------------- Début Encart recherche capturée dans page bibliographie  ----------------*/
	.bibliographie-modele div.webframe-ermes-lastviewedresources-item {	/* Bordure grise claire autour de chaque résultat de la recherche captureé*/
		border: 1px solid #ebebeb;
	}

	.bibliographie-modele .notice_corps {		/* Dans résultat recherche capturée, on met les résultats sur 80 % de la largeur pour image à gauche en float */
		width: 80%;
		float:left;
	}
	.bibliographie-modele .notice_corps br {	/* Certains BR qui trainent, obligé de les cacher en display none */
		display:none;
	}

	.bibliographie-modele	#portal .notice_corps a:hover {
		text-decoration:none;
	}

		/* ---------------- triptyque Encart recherche capturée dans page bibliographie  ----------------*/
	/* -------------Titre h3 recherche capture ------------ */
    .bibliographie-modele .only-content h3.title.template-title,
	.bibliographie-modele .triptyque-lg-resume h3.title.template-title{
		font-family: LinotypeBrewery-regular;
		text-transform: inherit;
		font-weight: normal;
		font-size: 18px;
		color: #000;
		padding-top: 1px;
		}

 /* -------------pour changer la couleur des titres dans l'affichage court ------------ */
    .bibliographie-modele .template-title,
	.bibliographie-modele .title_triptyque_selection	{
     /*color:#7ab9ff !important; bleu clair*/
     color:#000 !important;
     font-weight:bolder !important;
	}

    /* -------------btn recherche capture ------------ */
	.bibliographie-modele .bs-bullets .rsNavSelected button{
		background: none repeat scroll 0 0 #b3d6fd;
		}

	.bibliographie-modele .bs-bullets button, .bibliographie-modele .bs-bullets button:hover {
	    border-color: #999;
		border-radius: 10px;
		margin-top: 25px;
	}
	
	
	/*  On masque les éléments suivants dans les triptyques des sélections : catégorie, collation, etc. */
	.bibliographie-modele .rs-slide3Items p.sur-titre,
	.bibliographie-modele .rs-slide3Items p.template-physicalDescription,
	.bibliographie-modele .rs-slide3Items p.template-call-number,
	.bibliographie-modele .rs-slide3Items span.cim-short-duree-type-doc {
			display:none;
		}	

	/*  On limite la hauteur du titre */
	.bibliographie-modele .rs-slide3Items .div_gradient h3.title.template-title {
	max-height:3.5em;
	text-transform: uppercase;
	font-size: 15px;
	font-weight: normal;
	margin-bottom: 0px;
	}
	
	/*  On limite la hauteur des mentions de responsabilité */
	.bibliographie-modele .rs-slide3Items .div_gradient p.template-info {
	max-height:2.5em;
	font-family:SourceSansPro;
	font-size: 15px;
	font-weight:normal;
	margin:0px;
	}
	
	.bibliographie-modele .rs-slide3Items p.template-editeur{
    color: #808285;
	font-size: 14px;
	}
	
	/*  On floute le texte qui dépasse */
	.bibliographie-modele .rs-slide3Items div.div_gradient {
	overflow:hidden;
	}
	
	.bibliographie-modele .rs-slide3Items div.gradient	{ 
	background-color: transparent !important; 
    display: block;
    position: relative;
    bottom: 0px;
    width: auto;
    height: 24px;
    text-align: right;
	background: url("images/gradient.png");
	
	}
	
	.bibliographie-modele .rs-slide3Items p.template-info /* CC (26/09/2016) : Ligne à supprimer quand l'affichage en triptyque sera affiné */
		{
	margin-bottom:0px;
	}
	
	.bibliographie-modele .rs-slide3Items p.template-editeur {
	margin-top:0.5em;
	}
	
	/* Hauteur d'encart plus grande pour les documents comportant des résumés longs (choisir le style "triptyque-lg-resume" dans l'encart) */
	
		.bibliographie-modele .triptyque-lg-resume .rsVisibleNearbyWrap  {
		height: 35em !important;
		width: 1055px;
		}
		
	.bibliographie-modele .triptyque-lg-resume .rsOverflow.grab-cursor {
		overflow: visible;
		width: 348.15px; 
		height: 35em !important;
		}

	.bibliographie-modele .triptyque-lg-resume .rsOverflow{
		overflow: visible;
		width: 348.15px; 
		height: 35em !important;
		}
	
	/* -----------Fin modifs CC 24/09/2016----------------------*/
	
		/* ---------Affichage des oeuvres du Musée dans les sélections du Catalogue -------------*/
		/* On masque la famille d'instruments*/
		.bibliographie-modele	#portal .slider-notice .InstrumentTypeValue,
		.bibliographie-modele	#portal .rs-staticList .InstrumentTypeValue	{
		display:none;
		}
		
		.bibliographie-modele	#portal .notice_corps .AuthorValue,
		.bibliographie-modele	#portal .notice_corps .PlaceOfProductionValue {
		color:#000000;
}

		/* -------------selection-description ------------ */
	.bibliographie-modele .selection-description {
		background: #F5F5f5;
		border: 1px solid; 
		border-color: #FFFFFF;
		margin: 0 0 12px;
		padding: 5px;
		font-size: 20px;
		font-family: 'Source Sans Pro';
		}

	/* -------------rendre plus visible la description ------------ */
	.bibliographie-modele .rsVisibleNearbyWrap {
		height: 22em !important;
		width: 1055px;
		}
		
	.bibliographie-modele .rsOverflow.grab-cursor {
		overflow: visible;
		width: 348.15px; 
		height: 22em !important;
		}

	.bibliographie-modele .rsOverflow{
		overflow: visible;
		width: 348.15px; 
		height: 22em !important;
		}


	/* -------------separateur concerts videos ------------ */
			/* .bibliographie-modele .line{
   			 content: url("images/pp-trait-separateur-noir.png");
   			 display: block;
			}*/
			
	.bibliographie-modele .slider-notice {
   		width: 200px !important;
		}


	/* --------- Flèches droites et gauches du slider---------*/ 

	.bibliographie-modele .rsDefaultInv .rsArrowIcn {
		width: 32px;
		height: 100%;
		top: 50%;
		left: 50%;
		margin-top: -16px;
		margin-left: -16px;
		position: absolute;
		cursor: pointer;
		outline:none !important;
		}


	.bibliographie-modele .rsDefaultInv.rsHor .rsArrowLeft .rsArrowIcn {
		background: url("images/arrow-left2.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
	    }
	.bibliographie-modele .rsDefaultInv.rsHor .rsArrowRight .rsArrowIcn {
		background: url("images/arrow-right2.png") no-repeat scroll 0 0 rgba(0, 0, 0, 0);
		}
	.bibliographie-modele .rsDefaultInv .rsArrowIcn {
		border-radius:none;
		height:50px;
		}
	.bibliographie-modele button:focus, .accueil-modele .btn:focus {
		outline:none !important;
		}

	/* ---------------- Fin Encart recherche capturée dans page bibliographie  ----------------*/
	
	/* -------------- Informations communes encarts droite rebond et rebond-biblio ------------ */
		.bibliographie-modele .rebond .media-body, .bibliographie-modele .rebond-biblio .media-body  {
			margin:14px;
		}

		.bibliographie-modele .rebond img, .bibliographie-modele .rebond-biblio img  {	/* Image pour la partie des rebonds, en 100 % de largeur */
			width:100%;
		}
	
	/* --------------  Début ENCART PARTAGE sur doite une question à la médiathèque avec fond gris -------------- */
		.bibliographie-modele #portal .rebond {	/* Encart partagé "une question à la médiathèque avec fond gris */
		}
		.bibliographie-modele #portal .rebond div#content-rebond{
			padding:12px;
		}
	/* -------------- Fin ENCART PARTAGE sur doite une question à la médiathèque avec fond gris -------------- */
	
	/* -------------- Début ENCART sur droite avec fond bleu ------------ */
		.bibliographie-modele .rebond .bckg-bleu {	/* Encarts class"rebond" pour tous ce qui concerne des liens vers nos sites - sinon, utiliser même encart mais avec class rebond-biblio */
			padding-bottom: 5px;
			margin-bottom: 10px;
		}
		
		.bibliographie-modele #portal .rebond p {	
			margin-bottom: 5px;
		}

		.bibliographie-modele .rebond p.describe {	
			padding-bottom:10px;
		}
	/* -------------- Fin Début ENCART sur droite avec fond bleu ---------- */
				
	/* -------------- Début ENCART sur droite sans background  ------------ */
		.bibliographie-modele #frame-7537 p.Biblio-selection {
			text-transform: uppercase;
			font-family: LinotypeBrewery-Regular;
			font-size: 2.5em;
			margin-bottom: 0;
		}
		#frame-7537 div.frame-standard.panel.panel-front.webframe-ermes-carousel {
			background: none;
		}
		.bibliographie-modele div.border-gris {
			border: 1px solid #ebebeb;
			margin-bottom: 10px;
		}
	/* -------------- Fin ENCART sur droite sans background  ------------ */

	
	/* -------------- Début ENCART Html en bas------------ */
		.bibliographie-modele .thumbnail {
			margin-bottom:10px;
		}
		
		
		/* Début du MENU DES BIBLIOGRAPHIES - non fixe */		
		.bibliographie-modele .menu nav ul li a {
					font-family: 'Source Sans Pro';
				}
		/* Fin du MENU DES BIBLIOGRAPHIES - non fixe */		

		/* Début du MENU FIXE DES BIBLIOGRAPHIES - class de l'encart : .sommaire-fixe */
		.bibliographie-modele .sommaire-fixe h3 {		/*#menu-fixe-thematique */
			text-transform:uppercase;
			margin-top: 0;
			font-size: 1.143em;
		}

		.bibliographie-modele .sommaire-fixe { /*#menu-fixe-thematique */
			position: fixed;
			width: 300px;
			height: auto;
			right: 1%;
			top: 42%;
			margin-left: -200px;
			padding: 10px;
			background: #b3d6fd;
			border:1px solid #b3d6fd; 
			z-index:1000003;
		}

		.bibliographie-modele .sommaire-fixe p{
			  margin: 10px;
			  margin-top:15px;
		}

		.bibliographie-modele .sommaire-fixe a.retour {
			font-family: LinotypeBrewery-Regular;
			font-size: 1em;
			font-weight: normal;
			background-color:#fff;
		}

		 @media screen and  (min-width: 200px) and (max-width: 1280px){	/* Menu sommaire fixe bibliographies / Responsive */
			 .bibliographie-modele .sommaire-fixe {
			 visibility:hidden;
			  }
		  }
		   @media screen and  (min-width: 200px) and (max-width: 990px){		/* Partie responsive pour les encarts à droite */
				.bibliographie-modele .rebond img, .bibliographie-modele .rebond-biblio img {
					width: 300px;
				}
				.bibliographie-modele div.bckg-bleu {
					width:300px;
				}
				.bibliographie-modele #portal .rebond div.rsItem {
					background: none;
			   }
			   .bibliographie-modele .rebond-biblio div {
				width:300px;
			   }
		   }
	/* ---------------- Fin menu fixe des bibliographies----------------- */
/* ############################################## FIN Bibliographie - sélection thématique ################################################################### */

/* ###############################  Début Exposition modèle ############################### */
	/* ---- Début catégorie presentation exposition - */
		p.presentation-expo, p.presentation-portrait-facteur {	/* Correspond à l'encart partage : toutes les expositions */
			text-transform: uppercase;
			font-family: LinotypeBrewery-Regular;
			font-size: 2.857em !important;
			margin-bottom: 0;
		}
		@media screen and (min-width: 200px) and (max-width: 980px) {
			p.presentation-expo, p.presentation-portrait-facteur  {
				font-size:2em !important;
				margin:0;
				line-height: 1.071em;
			}
		}
		#frame-13494 div.frame-standard.panel.panel-front.webframe-ermes-carousel {
			background:none;
		}
	/* ---- Fin catégorie presentation exposition - */
	/* --- Début Niveaux de titre --*/
		.exposition-modele h1.line, 
		.histoireinstru-modele h1.line{
			margin-bottom:10px;
		}
		
		.exposition-modele p.sous-titre-expo {
			font-size:2em;
			font-style:italic;
			margin-top:5px;
		}
		
		.exposition-modele h2, 
		.histoireinstru-modele h2 {
			font-family: LinotypeBrewery-bold;
			font-size: 1.438em;
			background: none !important;
			text-transform: uppercase;
		}
		.exposition-modele h2.line, 
		.histoireinstru-modele h2.line {
			margin-bottom:12px;
		}
		/* ------------ Début http://collectionsdumusee.philharmoniedeparis.fr/exposition-travelling-guitars-guitares-de-stars.aspx -------------- */
			.exposition-modele article.travelling {
				height:795px;
			}
			.exposition-modele article.travellingEspace{
				height:900px;
			}
			.exposition-modele article.travelling figure {
				padding-bottom:10px;
			}
			.exposition-modele article.travelling h2 {	/* Pour travelling guitars : guitars de stars */
				margin: 0 0 10px 0;
				font-size:1.17em;
			}
			@media screen and (min-width: 200px) and (max-width: 990px) {
				.exposition-modele article.travellingEspace, .exposition-modele article.travelling{
					height: auto;
				}
			}
		/* ------------ Fin http://collectionsdumusee.philharmoniedeparis.fr/exposition-travelling-guitars-guitares-de-stars.aspx -------------- */
		.exposition-modele h3, .exposition-modele h2.expo-lieu-musee, 
		.histoireinstru-modele h3 {
			font-family: LinotypeBrewery-regular;
			font-size: 1.438em;
			padding: 5px 0 10px 0px;
			font-weight:normal;
		}
		.exposition-modele h2.expo-lieu-musee {
			text-transform:none;
		}
		.exposition-modele h4, 
		.histoireinstru-modele h4 {
			font-family: LinotypeBrewery-regular;
			font-size: 1.071em;
			text-transform: uppercase;
			font-weight: normal;
			margin: 10px;
			margin-left:0;
		}
		.exposition-modele h4 span.soundcite, 
		.histoireinstru-modele h4 span.soundcite{	/* + de padding quand extrait audio en H4 */
			padding:5px;
		}
		.exposition-modele div.modele_6.model-html .panel-body h4, 
		.histoireinstru-modele div.modele_6.model-html .panel-body h4{
			padding: 0px 0 10px 0px;
		}
		.exposition-modele div.modele_6.model-html .panel-body h5, .exposition-modele div.modele_6.model-html .panel-body h5 em {
			padding:0px;
			font-size: 1.000em;
		}
		.exposition-modele h5, .exposition-modele h5 em {
			font-family:"SourceSansPro";
			font-size:1.125em;
			margin-bottom:10px;
			font-weight: bold;
			padding: 10px 0px 0px 10px;
		}
	/* --- Fin Niveaux de titre --*/
		.exposition-modele p, 
		.histoireinstru-modele p {
			font-size: 1.125em;
			margin-top: 0;
		}
	/* ---- Début ----- */
		.exposition-modele #portal ul, 
		.histoireinstru-modele #portal ul,
		.facteur-modele #portal ul{
			margin:5px 0px;
		}
		.exposition-modele #portal .rsItem li, 
		.histoireinstru-modele #portal .rsItem li,
		.facteur-modele #portal .rsItem li{
			font-size: 1.125em;
			list-style-image: url(images/puces.png);
			margin-left: 20px;
			padding: 1px 0px;
			font-family:'SourceSansPro', 'Arial', 'Helvetica', sans-serif;
		}
		.exposition-modele #portal a, 
		.histoireinstru-modele #portal a,
		.facteur-modele #portal a{
			color: #1D89DB;
		}
		.histoireinstru-modele #portal section.mosaique a {
			color:#fff;
		}
	/* ---- Fin ----- */
	/* ----- Début ? pour definition historie instru ---*/
		.histoireinstru-modele a.dfnGlossaire:after {
			content: "?";
			font-size: 0.6em;
			color: #fff;
			vertical-align: top;
			background-color: #1D89DB;
			padding:0px 2px;
			margin-left: 2px;
			opacity:0.7;
		}
	/* ---- Début - Dans accordéon, article avec img gauche, texte à droite --- */
		.exposition-modele #portal article.gauche, .exposition-modele #portal article.gauche img {
			float:left;
		}
		.exposition-modele #portal article.gauche p {
			padding:10px;
		}
		.exposition-modele #portal article.gauche img {
			padding:10px 10px 10px 0;
		}
	/* ---- Fin - Dans accordéon, article avec img gauche, texte à droite --- */
		/* ------ Début Liens rebond --- */	
			.exposition-modele #portal a.btn,
			.histoireinstru-modele #portal a.btn			{
				background-color: #b3d6fd;
			}		
		/* ----Fin Liens rebond --- */
		/* -- Début Image rebond --*/
			/*.exposition-modele .rebond-bleu .pull-left, .exposition-modele .rebond-blanc .pull-left,
			.histoireinstru-modele .rebond-bleu .pull-left, .histoireinstru-modele .rebond-blanc .pull-left,
			.listing-modele .rebond-bleu .pull-left, .listing-modele .rebond-blanc .pull-left	{
				float:none !important;
			}*/
	/* ----- Fin rebond bleu ou blanc droite -----------*/
	/* ----- Accordéon -----  */
		.exposition-modele .panel-model,
		.histoireinstru-modele .panel-model	{
			border-color: #F5F5F5;
		}
		.exposition-modele div.modele_6.model-html figure, 
		.histoireinstru-modele div.modele_6.model-html figure{ 
			margin-bottom:10px;		
		}
	/* ---- Image à droite, image à gauche ------ */
		.exposition-modele .content-img-dr figure,
		.histoireinstru-modele .content-img-dr figure,
		.facteur-modele .content-img-dr figure{
			float: right;
			margin: 0 0px 10px 15px;
		}
		.exposition-modele .content-img-gch figure,
		.histoireinstru-modele .content-img-gch figure,
		.facteur-modele .content-img-gch figure {
			float: left;
			margin: 0 15px 10px 0px;
		}
		.exposition-modele .content-img-dr figure, .exposition-modele .content-img-gch figure,
		.histoireinstru-modele .content-img-dr figure, .histoireinstru-modele .content-img-gch figure,
		.facteur-modele .content-img-dr figure, .facteur-modele .content-img-gch figure {
			width: 300px;
			min-width: 250px;
			clear: both;
		}
	/* ---- Image à droite, image à gauche ------ */
	/* ---- Applat bleu -----*/
		.exposition-modele article.applat.bckg-bleu,
		.histoireinstru-modele article.applat.bckg-bleu,
		.facteur-modele	article.applat.bckg-bleu {
			padding:10px;
		}
	/* ----- Partie responsive exposition modèle ! -------------------------*/
		@media screen and (min-width: 200px) and (max-width: 480px) {
			.exposition-modele .content-img-dr figure, .exposition-modele .content-img-gch figure,
			.histoireinstru-modele .content-img-dr figure, .histoireinstru-modele .content-img-gch figure, 
			.facteur-modele .content-img-dr figure, .facteur-modele .content-img-gch figure {
				width:100%;
				min-width: 100%;
			}
		}
		
	/* ----- Pour enlever le cadre gris de certaines images --------- */	
		.exposition-modele figure img.no-border {
				border:none;
			}
			
 
/* ###############################  Fin Exposition modèle ############################### */

/* ############################### Facteur modèle ####################################### */

	#frame-21567 div.frame-standard.panel.panel-front.webframe-ermes-carousel{
		background:none;
	} /* Type de page : #21567 encart partagé donc numéro unique*/
	
	.facteur-modele figure img {
		border:none;
	}
	
	.facteur-modele .incontournable-rebond a.btn-default {  
		color:#000000 !important;
	}
	
	.facteur-modele .incontournable-rebond h3 {
			font-size: 1.1em !important;
			font-family: LinotypeBrewery-Bold !important;
			line-height: 1.15;
			text-transform: uppercase;
			padding-top: 0 !important;
		}
	
/* ############################ Fin de Facteur modèle ################################### */


/* ############################### Début encart du glossaire instrument  ####################### */
	/* Navigation des onglets du tableau */
	#portal .rsItem ul.nav.nav-tabs li {
		margin-left:0;
		padding:0;
	}
	/* --- Partie 1 : termes à définir -- */
	#myTabContent div.TermesGlossaire {	/* Div qui se place à gauche avec tous les termes à définir*/
		display:inline-block;
		width:25%;
		margin-top:20px;
		padding-left: 15px;
	}
	
		#myTabContent .TermesGlossaire h3 {	/* Termes en H3 */
			padding:5px 0px 0px 0px;
						font-family:"SourceSansPro";
            font-weight: 500;

			font-weight:normal;
			font-size:1.075em;
		}
		#myTabContent .TermesGlossaire  a {	/* Lien dans les termes en h3*/
			text-decoration:none;
		}

		#myTabContent div.TermesGlossaire span {	/* span qui correspond aux dates naissances mort des facteurs */
			display:block;
			font-size:0.850em;
			color:#000;
			padding-top:2px;
		}
		/* - Rendre visible quand lien actif--  */
		#myTabContent .TermesGlossaire  a.current, #myTabContent .TermesGlossaire  a.current span {
			border-left:3px solid #7ab9ff;
			padding-left:10px;
			color:#000;
			margin-left: -15px;
		}
		
	/* --- Partie 2 : Définition -- */
		#myTabContent div.DefinitionGlossaire {	/* Div qui englobe toutes les definitions, avec les article pour chaque définition */
			float: right;
			display:inline-block;
			width:70%;
			padding-right:10px;
		}
			#myTabContent div.DefinitionGlossaire article{	/* Le container de la définition - definition cachée jusqu'à action target */
				display:none;
				padding: 0px 10px 0px 0px;
				border-left: 3px solid #7ab9ff;
				right: 5px;
				top: 27px;
				position: relative;
				background-color: #FAF8F9;
			}
			#myTabContent div.DefinitionGlossaire > article:first-child {
				display:inherit;
			}
			#myTabContent div.DefinitionGlossaire article:target {	/* Apparition definition quand Target */
				display:block;
			}
			#myTabContent div.DefinitionGlossaire article * {
				padding-left:10px;
			}
			#myTabContent div.DefinitionGlossaire sup {
				padding-left:0px;
			}
			/*#myTabContent div.DefinitionGlossaire article div p {
				float: left;
				margin-right: 30px;
				margin-top: 0;
			}*/
			#myTabContent .DefinitionGlossaire h3{		/* Correspond aux noms definitions niveau h3 */
				font-size: 1em;
				font-family: LinotypeBrewery-Regular;
				text-transform: uppercase;
				font-weight:normal;
			}
			#myTabContent .DefinitionGlossaire p {
				font-size:1em;
			}
	/* ---- partie responsive sur les tableaux */
	@media screen and (min-width: 200px) and (max-width: 480px) {
		#myTabContent div.TermesGlossaire{
			width:100%;
		}
		#myTabContent div.DefinitionGlossaire {
			width:100%;
			float:none;
		}
	}		
	.x-webkit *:focus, *:focus {
		outline:0px dotted black !important;
	}
/* ############################################### FIN du glossaire instrument  ########################################## */
/* ############# Début encart chronologie / Class .chronologie au niveau de l'encart  /exposition-great-black-music-chronologie.aspx#################################### */
	/* -------- Concerne contenus texte --------- */
		#portal  .chronologie  li h2{
			font-family: LinotypeBrewery-bold;
			font-size: 1.438em;
			padding: 5px 0 10px 0;
			text-transform: uppercase;
			background:none;
		}
		#portal  .chronologie  li h2 span {
			background:none;
		}
		#portal  .chronologie #slider li td h3 {
						font-family:"SourceSansPro";
            font-weight: 500;

			font-size:1.143em;
		}
		#portal  .chronologie  #content p {
			font-size: 1.143em;
		}
	/* -----  Concerne les images ----- */
		#portal  .chronologie #slider {
			float: left;
			position: relative;
			overflow: auto;
			width: 870px;
			height: 550px;
			border: 2px solid #fff;
			background:#f7f7f7;
		}
			/* Version 660px large .slider660: exemple http://collectionsdumusee.philharmoniedeparis.fr/exposition-europunk.aspx*/
				#portal  .chronologie .slider660 {
					width:690px !important;
					height:510px !important;
				}
			/* ----- Fin version diaporama chronologie version 660 px large-------- */
		#portal  .chronologie #slider ul {
			position: absolute;
			list-style: none;
			top: 0;
			left: 0;
		}
		#portal .chronologie #slider li {
			float: left;
			width: 870px;
			height: 550px;
			padding:15px;
			overflow:auto;
			margin-left:0;
			margin-right:0;
		}
		#portal  .chronologie #slider li td * {
			font-family:"SourceSansPro";
		}
	/* ------ Fin partie images --------- */
	/* ------------ Table ------------*/
		.chronologie  table {
			width:100%; 
		}
		.chronologie  td {
			width:30%;
			vertical-align:top;
		}
		.chronologie  td:first-child {
			padding-right:20px;
			width:20%;
		}

		.chronologie  thead tr td {
			border-bottom:solid 3px #b3d6fd;
			padding:0px 0px 10px 0px;
			font-weight:bold;
		}
	/* ------- Pagination à la fin - avec date------- */
		#portal .chronologie #pagination {
			float: left;
			list-style: none;
			margin: 15px 0 0 0px;
			width: 870px;
		}
		#portal .chronologie #pagination li {
			font-size:0.857em;
			cursor: pointer;
			padding: 5px;
			margin:0 4px 4px 0;
			background-color:#b3d6fd;
		}
		#portal .chronologie #pagination li:hover {
			opacity: 0.70;
			text-decoration: none !important;
			-webkit-transition: all 0.4s ease-in-out 0.1s;
			transition: all 0.4s ease-in-out 0.1s;
		}
		#portal .chronologie li.current {
			background: #333333;
			color: #FFF;
		}
	/* ----- Partie responsive ---- */
		@media screen and (min-width: 480px) and (max-width: 768px) {
			#portal .chronologie #slider {
				width: 520px;
				height: 500px;
			}
				/* Version 660px large .slider660: exemple http://collectionsdumusee.philharmoniedeparis.fr/exposition-europunk.aspx*/
				#portal  .chronologie .slider660 {
					width:600px !important;
					height:420px !important;
				}
				#portal .chronologie .slider660 li {
					width: 580px !important;
				}
			/* ----- Fin version diaporama chronologie version 660 px large-------- */
			#portal .chronologie #slider li {
				width: 520px;
				height: 500px;
			}
			#portal .chronologie .pagination {
				width: 520px;
			}
		}
		@media screen and (min-width: 200px) and (max-width: 479px) {
			#portal .chronologie #slider {
				width:400px;
				height:500px;
			}
			#portal .chronologie #slider li {
				width:400px;
				height:500px;
			}
			#portal .chronologie #pagination {
				width: 400px;
			}
			
				.chronologie  td {
					width:100% !important;
					display:inline;
				}
				.chronologie td:first-child {
					padding-right:0;
				}
		}
/* #############################  FIN  CHRONOlogie ########################################## */
/* #############################  Début Encart Accroche ########################################## */
	.accroche figure {
		float: left;
		margin: 0 15px 5px 0;
		clear: both;
		max-width: 300px;
	}
	.accroche img {
		float: left;
		margin-bottom: 10px;
		border:none;
	}
	.accroche p {
			font-family:"SourceSansPro";
            font-weight: 500;
		font-size: 1.143em;
		margin-top: 0;
	}
	#portal .accroche ul li{
		list-style-image: url(images/puces.png);
		margin-left:20px;
		padding: 1px 0px;
	}
	@media (min-width: 200px) and (max-width: 400px) {
		.accroche figure, .accroche figcaption  {
			width:100%;
		}
	}
/* #############################  Fin Accroche ########################################## */
/* ############################# Début ENCART DROITE Rebond bleu, rebond blanc ################ */
		.rebond-bleu h2, .rebond-blanc h2 {
			background: url("images/h2.png") repeat-x scroll left center rgba(0, 0, 0, 0) !important;
			font-family: LinotypeBrewery-regular;
			padding: 15px 0 5px 0;
		}
		.edutheque .rebond-bleu h2, .edutheque .rebond-blanc h2 {
			background:none !important;
			padding: 0px !important;
		}
		.rebond-bleu h3, .rebond-blanc h3 {
			font-size: 1.1em !important;
			font-family: LinotypeBrewery-Bold !important;
			line-height: 1.15;
			text-transform: uppercase;
			padding-top: 0 !important;
		}
		
		.rebond-bleu h3.sans-sur-titre, .rebond-blanc h3.sans-sur-titre {
			padding-top: 10px !important;
		}
		
		/* -- Début paragraphe rebond --*/
			.rebond-bleu .media-body, .rebond-blanc .media-body	{
				margin:14px;
				margin-bottom: 0;
				margin-top:0;
			}
			
			.rebond-bleu p, .rebond-blanc p {
				font-size:1em !important;
				margin: 12px 0;
			}
			.rebond-bleu p.line, .rebond-blanc p.line,
			.rebond-bleu p.sur-titre, .rebond-blanc p.sur-titre{
				padding-top: 10px;
				margin-top:0 !important;
			}
				
			.rebond-bleu p.describe, .rebond-blanc p.describe  {
				height:auto;
			}	

			/* lien - bouton call to action dans rebond */
				#portal .rebond-blanc a.btn {
				color:#000;
			}
			
			.rebond-blanc div.border-gris {	/* Rebond blanc, petit border gris autour */
				/* border: 1px solid #ebebeb !important; */
				margin-bottom: 10px !important;
			}

		/* -- Fin paragraphe rebond --*/
		/* ------ Début image en 100% dans rebond - privilégier 350X350-------*/
			.rebond-bleu img, .rebond-bleu .media-body, .rebond-blanc img, .rebond-blanc .media-body	{
				clear:both;
				border:none;
			}
			.rebond-bleu img{
				padding: 10px 10px 0px 10px;
			}
			.rebond-bleu img, .rebond-blanc img{
				width:100% !important;
				margin-bottom:10px !important;
			}

		/* ------------  DIV Rebond bleu avec margin bottom en bas----------------- */
			.rebond-bleu .bckg-bleu{
				margin-bottom: 10px;
				padding-bottom: 5px;
			}
		/* ------ Fin image en 100% dans rebond - privilégier 350X350-------*/
		@media screen and (min-width: 200px) and (max-width: 980px) {
			.rebond-bleu .panel-body, .rebond-blanc .panel-body {
				width:300px;
			}
			.rebond-bleu .panel-body	{
				float:left;
			}
		}
/* ############################# Fin ENCART DROITE Rebond bleu, rebond blanc ################ */
/* ############################# Début encart partie dédiée au modèle commun content-modele ##################################### */
	/* --- Niveaux de titre ---- */	
		.content-modele  h2 {
			font-family: LinotypeBrewery-bold;
			font-size: 1.438em;
			padding:5px 0 10px 0;
			background: none !important;
			text-transform:uppercase;
		}
		.content-modele #portal .frame-ermes-searchcapturemultirender h2, .content-modele #portal .rebond h2, .content-modele #portal .rebond-blanc h2, .content-modele #portal .rebond-bleu h2, .facteur-modele #portal .rebond-blanc h2, .facteur-modele #portal .rebond-bleu h2{					/* H2 des recherches capturées - modification police...*/
			font-size:1.475em;
			background: url("images/h2.png") repeat-x scroll left center rgba(0, 0, 0, 0) !important;
			font-family: LinotypeBrewery-Regular;
			padding:0;
		}
		.content-modele h3 {
			font-family: LinotypeBrewery-bold;
			font-size:1.22em;
		}

		.content-modele h4			{
			font-family:LinotypeBrewery-regular;
			font-size:1.22em;
			padding:5px 0 5px 0;
			font-weight:normal;
		}
		/* Partie responsive concernant les titres */
		@media screen and (min-width: 320px) and (max-width: 767px) {
			.content-modele #portal  h1 {
				font-size:2em;
			}
		}
	/* ------------- Fin niveau de Titres (H1, H2, H3)  PAGES contenus outils EDUCATIF -------------------- */
	/* ------ Début padding content modele ------- */
		.content-modele .panel-front.only-content, .content-modele .panel-front.content-img-dr, .content-modele .panel-front.content-img-gch	{
				padding-top:0;
			}
	/* --------- Début paragraphe + liste pour la base content modele --------------- */	
		.content-modele  p, /* Début content-modele : la base */
		.content-modele #portal .rsItem li {
/*			font-size: 1.125em;*/
			font-size: 1rem;
			margin-right:20px;
		}	
		.content-modele  .only-content p, .content-modele .content-img-dr p, .content-modele .content-img-gch p {
			margin-top:0;
		}
		.content-modele #portal .rsItem li{
			list-style-image: url(images/puces.png);
			margin-left: 20px;
			margin-top:0;
			padding: 1px 0px;
			font-family:'SourceSansPro', 'Arial', 'Helvetica', sans-serif;
		}
			/*-----Début LISTE avec carrés bleus ---------------------- */	
				.content-modele #portal .liste  ol {	/* Liste à numéro */
					padding:0px 0px 10px 15px;
				}
				.content-modele #portal ul {
					margin-bottom:5px;
				}
				.content-modele #portal ul.nav.nav-tabs, .histoireinstru-modele #portal ul.nav.nav-tabs {
					margin-bottom:0;
				}
				.content-modele #portal ol li {
					list-style-image:none;
					margin-left:10px;
				}
			/* -------------Fin  LISTE numérotées avec carrés bleus ------------ */
	/* ------------- Fin paragraphe + liste -  PAGES Modèle commun -------------------- */
	/* ------------- Début LIENS DANS PAGES Modèle commun ------------------------------ */
			.content-modele #portal a {							/* Tous les liens des pages contenus dossiers éducatifs sont bleus*/
				color:#1D89DB;
			}
			.content-modele #portal a:hover {						/* Tous les liens des pages contenus dossiers éducatifs en hover sont soulignes*/
  				text-decoration: underline;
			}
			.content-modele a.btn-plus-bl {   /* Couleurs du contenu des boutons en noir*/
				color:#000 !important;
			}

			/*.content-modele a.btn-default {   /* Couleurs du contenu des boutons en noir  Rend illisible les boutons du menu
				color:#000 !important;
			}*/
		/* -------- Fin LIENS DANS PAGES content modele  --------- */	
		/* ---------  Infos tableaux --------------- */
			.content-modele #portal td, .content-modele #portal tr  {
				border: 1px solid #b3d6fd;
			}
			.content-modele td {
				color: #000;
				padding-left: 10px;
			}
		
		/*-----Début titre du site------------------------- */
		/*.listing-modele #portal div.frame-standard.panel.panel-front.webframe-ermes-carousel.titre-site,*/
		.content-modele #portal div.frame-standard.panel.panel-front.webframe-ermes-carousel.titre-site,
		.facteur-modele #portal div.frame-standard.panel.panel-front.webframe-ermes-carousel.titre-site{
			background:none;
		}
		
		/*.listing-modele #portal .titre-site p,*/
		.content-modele #portal .titre-site p,
		.facteur-modele #portal .titre-site p {
			text-transform:uppercase;
			font-family: LinotypeBrewery-Regular;
			font-size: 2.857em;
			margin-bottom: 0;
			text-align:center;
		}
		@media screen and (min-width: 200px) and (max-width: 980px) {
			/*.listing-modele #portal .titre-site p,*/
			.content-modele #portal .titre-site p,
			.facteur-modele #portal .titre-site p{
				font-size:2em;
			}
		}
		
		/* -------------Fin  titre du site ------------ */
		/* ------------- Début  Images content-modele ------------ */		
				/* Suppression bordure grise - Ajout ccecconi 20160609 */
				.listing-modele figure img {
					border: none;
				}
				/* Fin Suppression bordure grise*/
				.content-modele .content-img-gch figure, .content-modele .content-img-dr figure {
					width:300px;
					min-width:250px;
					margin: 0 15px 10px 0px;
					clear: both;
				}
				
				.content-modele .content-img-gch figure{		/* Images ferrees à gauche dans les encarts contenus concert éducatif */
					float:left;
				}
				
				.content-modele .content-img-dr figure	 {		/* Images ferrees à droite dans les encarts contenus concert éducatif */
					 float:right;	
					 margin-left: 10px;
				 }
					/* -------- Partie responsive sur les images--------- */
				 	@media (min-width: 200px) and (max-width: 400px) {
						.content-modele .content-img-dr figure {
							width:100%;
							float:none;
							margin:0;
						}
					}
			/* -------------Fin  Images entre  content-modele ------------ */
			.content-modele article {								/* Infos espacement pour tous les articles */
				display: inline-block;
				margin-top:0;
				width:100%;
			}
	/* --------------- Début REBOND PAGE - Recherche capturée Guide ecoute, concert vidéo ------------- */
			.content-modele .rebond .rsItem ul li a img {
				width:70px;
				height:auto;
				padding:5px 10px 0 0;
				float:left;
			}
			.content-modele #portal .frame-ermes-searchcapturemultirender a {	/* Bouton tout voir fond bleu écriture noire*/
				color: #000;
			}
			.content-modele img.ermes-thumb-size-MEDIUM {	/* petite vignette des vidéos, guides écoutes dans les rebonds */
				min-width: 90px !important;
				min-height: 60px !important;
			}
			/* champs que l"on cache à l'affichage avec CSS pour les rebonds  */
				.content-modele .rebond .rs-staticList .cim-short-contrat, 
				.content-modele .rs-staticList .cim-short-contrat, 
				.content-modele .rs-staticList .line, 
				.content-modele .rs-staticList .cim-short-duree-type-doc, 
				.content-modele .rebond .rs-staticList .template-resume, 
				.content-modele .rebond .rs-staticList .cim-short-genre, 
				.content-modele .webframe-ermes-lastviewedresources-item-shadow, 
				.content-modele .rebond .CONTRAT_1, 
				.content-modele .rebond h3.title::before,
				.content-modele .rebond .rs-staticList br {
					display: none;
				}
			.content-modele #portal .template-title {
				font-size: 1.1em;
				line-height: 17px;
			font-family:"SourceSansPro";
            font-weight: 500;
				color: #000;
			}
			.content-modele .template-info {
				color: #000;
				width: 100%;
				padding-left: 100px;
			}
		/* -------------- FIN REBOND PAGES Content modele ----------------- */ 
	/* ###################### Début Encart par 4 blanc ####################*/	
			.enc-4-blanc .encart-par-4-blanc h3 {
				padding-bottom:5px;
				font-family: LinotypeBrewery-Bold;
				text-transform: uppercase;
				color: #000;
				font-size: 1.1em;
			}
			.enc-4-blanc .encart-par-4-blanc p {
				margin:5px 0 15px 0;
				font-size: 1em;
			}
			.enc-4-blanc .encart-par-4-blanc div {
				float:left;
				width:240px;
				margin:1px 1px 10px 1px;
				border: 1px solid #EBEBEB;
				background-color:#fff;
				height: 560px;
			}
			.enc-4-blanc .encart-par-4-blanc img {
				width: 100%;
				border:none;
			}
			.enc-4-blanc .encart-par-4-blanc div.div-content {
				padding: 8px;
				width: 97%;
				margin-top: 0;
				border: none;
				height:270px;
			}
			/* ------- Partie responsive encart fond bleu ou blanc ----------- */
			@media screen and (max-width: 480px) and (min-width: 200px) {
				.enc-4-blanc .encart-par-4-bleu div  {
					width:100%;
					height:auto;
				}
				.enc-4-blanc.encart-par-4-blanc div  {
					width:100%;
					height:auto;
					padding-bottom:10px;
				}
				.enc-4-blanc.encart-par-4-blanc div.div-content {
					height:auto;
				}
			}
	/* ###################### Début Encart par 4 blanc ####################*/
/* ###################### Par 4 TOUTES LES EXPOSITIONS TEMPORAIRES  ####################*/	
	.modele-4-col.vignette-expo .media-body {
		height:215px;
	}	
	.dossier-oe-modele .modele-4-col.vignette-expo  h3.media-heading {
		height:65px;
	}
	
	.dossier-oe-modele .modele-4-col.vignette-expo  h3.media-heading span {
		font-size:0.820em !important;
		display:block;
	}

	.dossier-oe-modele .modele-4-col.model-html.vignette-expo div.col-xs-12.col-sm-6.col-md-3.media {
		height:600px;
	}
	@media screen and (min-width: 980px) and (max-width: 990px) {
		.dossier-oe-modele .modele-4-col.model-html.vignette-expo div.col-xs-12.col-sm-6.col-md-3.media {
		height:750px;
		}
	}
	@media screen and (min-width: 768px) and (max-width: 979px) {
		.dossier-oe-modele .modele-4-col.model-html.vignette-expo div.col-xs-12.col-sm-6.col-md-3.media {
		height:660px;
		}
	}
	@media screen and (min-width: 650px) and (max-width: 767px) {
		.dossier-oe-modele .modele-4-col.model-html.vignette-expo div.col-xs-12.col-sm-6.col-md-3.media {
			height:720px;
		}
	}
	@media screen and (min-width: 480px) and (max-width: 649px) {
		.dossier-oe-modele .modele-4-col.model-html.vignette-expo div.col-xs-12.col-sm-6.col-md-3.media {
			height:610px;
		}
	}
	@media screen and (min-width: 150px) and (max-width: 479px) {
		.dossier-oe-modele .modele-4-col.model-html.vignette-expo div.col-xs-12.col-sm-6.col-md-3.media {
			height:auto;
		}
	}
	/* ###################### Par 4 TOUTES LES EXPOSITIONS TEMPORAIRES  ####################*/	



	/** Metascore modele **/


#frame-19486 div.frame-standard.panel.panel-front.webframe-ermes-carousel{
		background:none;
	}

#frame-19486 p.presentation-oe,
.bandeau-metascore p.presentation-oe{
    text-transform: uppercase;
    font-family: LinotypeBrewery-Regular;
    font-size: 2.857em;
    margin-bottom: 0;
}


.metascore-modele #search-panel{
	display: none;
}

/*	.metascore-modele .panel{
	background: none;
}*/

.metascore-modele .navbar-header-after {
    font-family: LinotypeBrewery-Regular;
    font-size: 40px;
    /* font-weight: bold; */
    margin-left: 20px;
    margin-top: 10px;
    text-transform: uppercase;
}

.metascore-modele .panel-body{
	background: none;
}

	.metascore-modele .rsItem h1{
		color:red;
		font-size: 40px !important;
		text-transform: uppercase;
		background:none;
		/*background-color: transparent !important;*/


	}

	.metascore-modele.frame {
    margin: 0 0 10px !important;
}


.metascore-modele h3{
   font-size: 1.429em;
    text-transform: uppercase;
    font-family: LinotypeBrewery-regular;
    font-weight: normal;
    margin: 5px 0 0 0;
}

.metascore-modele h4{
	    font-size: 21px;
    font-weight: bold;
}

/*corps de texte*/
/*
.metascore-modele p{
	font-size: 1.125em;
}
*/

.metascore-modele nav.sommaireMS{
	width: 346px;
	padding: 0 25px 0 5px;
	text-transform: uppercase;
	/*    font-family: 'LinotypeBrewery';*/
	font-family: 'LinotypeBrewery-Regular';

	font-size: 15px;
	/*font-weight:light;*/
}

.metascore-modele nav.sommaireMS header{
	background-color: #4d4d4d;
	padding: 9px 10px 9px 15px;
	color: #FFF;
	border-bottom: 2px solid #fff;
}

.metascore-modele #portal nav.sommaireMS ul li{
	list-style: none;
	margin-left:0px;
	border-bottom: 2px solid #fff;
	background-color: #f5f5f5;
	padding: 9px 15px;

}

.metascore-modele #portal nav.sommaireMS ul li a{
	color: #000;
}

.metascore-modele #portal nav.sommaireMS ul li.current{
	background-color: #dfefff;
}

.metascore-modele #portal nav.sommaireMS ul li li {
    list-style: none;
    margin-left: 0px;
    border-bottom: 1px solid #fff;
    padding: 6px 15px;
    text-transform: none;
}
.metascore-modele #portal nav.sommaireMS ul li li a{
    color:#555;
}
.metascore-modele #portal nav.sommaireMS ul li li a:hover{
    color:#1D89DB;
}

.metascore-modele .selection-description{
	display:none;
}

.metascore-modele .content-img-dr figure {
	float:right;	
	margin-left: 10px;
}

.metascore-modele .content-img-gch figure {
	float:left;
}

.metascore-modele  #portal ul li{
	list-style-image: url(images/puces.png);
	margin-left:20px;
}


.metascore-modele #portal ol li{
	list-style: decimal; /* !important;*/
}

.metascore-modele ol{
	margin-top: 0px;
	padding-top: 0px;
	padding-left:14px;
}

.metascore-modele dl{

}

.metascore-modele dt {
			font-family:"SourceSansPro";
            font-weight: 500;
}

.metascore-modele dt, .metascore-modele dd {
    line-height: 1.5em;
}

.metascore-modele dd {
	margin:0 0 15px 0;
 }

.metascore-modele pre{
	font-family: Courier, monospace;
}

/*
.metascore-modele iframe:before{
	border: 5px solid #f5f5f5 !important;
	padding:20px;
	margin:250px !important;
	background-color: lime;
}
*/
.metascore-embed{

	border: 5px solid #f5f5f5;
}
.metascore-embed.survol{
    position:relative;
	border: 5px solid #b3d6fd;
/*	border: 5px solid rgb(29, 137, 219);*/
/*	border: 5px solid rgba(29, 137, 219, 0.6);*/
}

/* -----------------  Début Toutes les expo http://collectionsdumusee.philharmoniedeparis.fr/expositions-temporaires-du-musee-de-la-musique.aspxEXPO  ------------------ */
	article.expo-en-cours {
		width:49%;
		float:left;
	}
	 article.expo-en-cours figure {
		float: left;
		width: 50%; 
		padding-right: 10px;
	}
	article.expo-en-cours figure img {
		border:none;
	}
	article.expo-en-cours {
		width:49%;
		float:left;
	}
	 article.expo-en-cours a.btn-plus-bl {
		margin-left:0;
	}
	
	@media screen and (min-width: 200px) and (max-width: 1024px) {
		article.expo-en-cours {
			width:100%;
			float:left;
		}
		 article.expo-en-cours figure {
			float: left;
			width: 25%; 
			padding-right: 10px;
		}
	}
/* ----------- Fin toutes les expos (sarah)----------- */
/* ------- Ajouter une marge en haut à certains encarts (pour Floriane, modèle des vidéos concerts)---------------------*/
.Marg-Top {
	margin-top:30px;
}
	@media screen and (min-width: 200px) and (max-width: 720px) {
		.Marg-Top {
			margin-top:0;
		}
	}
/* ----------------- Fin margin Top-------------------------- */


/* masonry */
.grid-item { width: 20%; margin:1%;}
.grid-item--width2 { width: 400px; }



/* ************************************************************************************** */
/* classes pour masquer/afficher des éléments de PAD sur les autres instances (guillaume) */
/* **********************  ne pas effacer  ********************************************** */
/* ************************************************************************************** */

/*! éléments présents dans les sites PP à masquer dans PAD : */
.hideInPAD,
.hideInPAD .container{
    display: block!important;
}
.hideInPAD-inline{
    display: inline-block!important;
}
/*! éléments présents dans PAD et masqués dans les autres sites PP : */
.hideSaufPAD,
.hideSaufPAD-inline,
.hideSaufPAD .container {
    display: none!important
}


a#tous.conf-droite-pad{
    display:none;
}
a#tous.conf-droite-pp{
    display:inline;
}


/* encart ".listeSimple" (recherche capturee liste statique) : affichage des rebonds fiches d'oeuvres (guillaume) : */
.listeSimple .rs-staticList li {
    border-bottom: 1px solid #ddd;
}
.listeSimple .rs-staticList li:last-of-type {
    border-bottom: 0;
}

.listeSimple .webframe-ermes-lastviewedresources-item .vignette_document img.ermes-thumb {
    width: 50px;
    min-width: 50px !important;
    min-height: 50px !important;
}
.listeSimple .webframe-ermes-lastviewedresources-item .notice_corps h3.template-title {
    font-family: "SourceSansPro", "Source Sans Pro", sans-serif!important;
    padding-top: 8px;
    font-weight: normal!important;
    text-transform: none;
}
.listeSimple .webframe-ermes-lastviewedresources-item .notice_corps p.template-resume,
.listeSimple .webframe-ermes-lastviewedresources-item .notice_corps p.page-cms {
    display:none;
}


/* encart "liste2niveaux" (recherche capturée liste statique) : affiche seulement image + titre + auteur principal*/
.liste2niveaux .notice_corps .template-resume,
.liste2niveaux .notice_corps .template-info,
.liste2niveaux .notice_corps .cim-short-genre{
    display:none;
}
.liste2niveaux .notice_corps .template-info:first-of-type{
    display:block;
}
.liste2niveaux .notice_corps .template-info:nth-of-type(2){
    display:block;
}
.liste2niveaux .notice_corps .template-info:nth-of-type(2) li{
    display:none;
}
.liste2niveaux .notice_corps .template-info:nth-of-type(2) li:first-child,
.liste2niveaux .notice_corps .template-info:nth-of-type(2) li:nth-child(2){
    display:block;
}

/* REBONDS EXTERNES */
.suggestion,
.suggestion li{
    position: relative;
}
.suggestion.rebond-ext li .webframe-ermes-lastviewedresources-item:after {
    content: url(images/icon-extlink-14px.png);
    display: block;
    position: absolute;
    bottom: 1rem;
    right: 1rem;
}
div#page > div.container .btn.lien-externe::before {
    content: url(/ui/skins/MEDIA/images/icon-extlink-14px.png);
    display: inline-block;
    margin-right: 1rem;
}
/* fin : REBONDS EXTERNES */

/**/
.fixedpanel {
    position: relative;
    top: 0px;
}

/* ************************************************************************************** */
/* Compte utilisateur (Catalogue, Digital, Collections) */
/* ************************************************************************************** */

/* **Panier utilisateur** */

#documents_memorises .btn-info.btn-xs .label_label {
    color: #000!important;
}

/* **Chargement lors de l'export** */
h2.modal-title {
	background: none repeat scroll 0 0 #ffffff;
}

.frame-ermes-myaccountprofile div.myaccount-rights {
	display:none!important;
}


/* ###################### Début - Par 4 TOUS LES DOSSIERS HISTOIRE INSTRUMENT - 24-11-17 Sarah ####################*/	

	.dossier-oe-modele .modele-4-col.vignette-expo.vignette-instru  h3.media-heading {
			height: initial;
	}
	.modele-4-col.vignette-expo.vignette-instru .media-body {
	    height: 270px;
	}
	.dossier-oe-modele .modele-4-col.model-html.vignette-expo.vignette-instru div.col-xs-12.col-sm-6.col-md-3.media {
			height:initial;
	}
	.modele-4-col.model-html.vignette-expo.vignette-instru .describe {
		height:110px;
	}
	.modele-4-col.model-html.vignette-expo.vignette-instru .describe.longtexte {
		height:95px;
	}
/* modifications a cause des redacteurs de texte qui ecrivent de trop logues descriptions : */
	.dossier-oe-modele .modele-4-col.vignette-expo.vignette-instru  h3.media-heading {
			height: initial;
	}
	.modele-4-col.vignette-expo.vignette-instru .media-body {
	    height: 320px;
	}
	.dossier-oe-modele .modele-4-col.model-html.vignette-expo.vignette-instru div.col-xs-12.col-sm-6.col-md-3.media {
			height:initial;
	}
	.modele-4-col.model-html.vignette-expo.vignette-instru .describe {
		height:auto;
	}
	.modele-4-col.model-html.vignette-expo.vignette-instru .describe.longtexte {
		height:auto;
	}
/* \ fin : modifications a cause des redacteurs de texte qui ecrivent de trop logues descriptions : */
/* ###################### FIN - Par 4 TOUS LES DOSSIERS HISTOIRE INSTRUMENT - 24-11-17 Sarah ####################*/	




/*.prochainement{

}
*/
.prochainement::before {
    content:"Prochainement disponible";
	display: block;
	padding-top:50%;
	text-align: center;
    height: 100%;
    position: absolute;
    top: 0;
    left: 4px;
    width: 100%;
    z-index: 1;
    background-color: rgba(177, 174, 174, 0.7);
    width: calc(100% - 8px);
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
}

/*
.block-image-compo.prochainement::before {
    content:"Prochainement disponible";
	display: block;
	padding-top:50%;
	text-align: center;
    height: 100%;
	width: 100%;
    position: relative;
    top: 0;
    left: 4px;
   
    z-index: 1;
    background-color: rgba(177, 174, 174, 0.7);
    width: calc(100% - 8px);
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
}
*/

/* test ddenocq 20180910 <quote> <cite> et <blockquote> */
blockquote {
    font-style: italic
}

blockquote::before {
    content: "\00AB\00A0";
    font-style: normal;
}
blockquote:after {
    content: "\00A0\00BB";
    font-style: normal;
}

blockquote cite,
blockquote em,
blockquote i,
blockquote .regular{
    font-style: normal;
}

blockquote.exergue {
	text-align: right;
}

cite{
    font-style: italic;
}

cite em, cite i, cite .regular{
    font-style: normal;
}

figcaption i,
figcaption em,
figcaption q,
figcaption cite {
	font-style: normal;
}

q cite {
    font-style: normal;
}

q {
    font-style: italic;
}

q::before {
    content: "\00AB\00A0";
    font-style: normal;
}
q::after {
    content: "\00A0\00BB";
    font-style: normal;
}

q em, q i, q .regular {
    font-style: normal;
}

.regular cite,
.regular em,
.regular i,
.regular q
{
    font-style: italic;
}

/* ---- */


/* lecteurs audio et video */
.embed-responsive{
    display: block;
    float: none;
    clear: both;
    max-height: 476px;
    overflow: hidden;
}
#player-tracklist{
    /*display: none;*/
	background-color: #FFF;
}
.concert_rec{
    float: none;
    clear: both;
}

.toto{
    display: none!important;
}


div#page > div.container {
    min-height: auto;
}




/* **************************************** */
/* ******** TYPE DE PAGE "CONTENU" ******** */
/* **************************************** */
/*
.page-contenu #page .frame :not(.btn){
    margin:0;
    padding:0;
    box-sizing: border-box;
}
.page-contenu #page .frame:not(.frame-ermes-sommaire) .frame-standard {
    padding:.5rem;
}
*/
/* ********************************************* */
/* ********  MODELE de PAGE SELECTION   ******** */
/* ********************************************* */
#ext-gen1018 .menu-selectionsEN #menu-side.in,
.menu-selectionsEN #menu-side.in,
.menu-selectionsEN #menu-side{
/*    display: none!important;*/
    position: static;
    width: 100%;
}
.page-selection #layout-2,
.page-selection-EN #layout-2{
    padding-bottom: 2rem;
}
@supports (display:flex){
    .page-selection #layout-2 > .row,
    .page-selection-EN #layout-2 > .row{
        display: flex;
    }
    .page-selection #layout-2 #zone-4,
    .page-selection-EN #layout-2 #zone-4{
        display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    }
}
.page-selection #menu-side--trigger,
.page-selection-EN #menu-side--trigger{
    background: #B3D6FD;
    padding: .35rem 1.25rem;
    border-radius: 1rem;
    margin-top: 1rem;
}
.page-selection #menu-side--trigger:before,
.page-selection-EN #menu-side--trigger:before{
    content: "";
    display: inline-block;
    font-size: 1rem;
    width: .875rem;
    height: .875rem;
    background: url(https://pad.philharmoniedeparis.fr/ui/skins/MEDIA/images/filtre.png) no-repeat center;
    background-size: auto;
    background-size: contain;
    vertical-align: middle;
    margin-right: 1rem;
}
/*
.page-selection #page #portal .panel-heading h2,
.page-selection-EN #page #portal .panel-heading h2{
    margin-bottom: .5rem;
}
*/

/*
.page-selection #page #portal .panel-heading h3,
.page-selection #page #portal .panel-heading h4,
.page-selection #page #portal .frame-ermes-openfindselection .webframe-ermes-commonviewedresources .panel-body,
.page-selection-EN #page #portal .panel-heading h3,
.page-selection-EN #page #portal .panel-heading h4,
.page-selection-EN #page #portal .frame-ermes-openfindselection .webframe-ermes-commonviewedresources .panel-body{
    padding-left:.75rem;
}
*/
.page-selection #page .frame-ermes-openfindselection .rs-staticList > ul > li,
.page-selection-EN #page .frame-ermes-openfindselection .rs-staticList > ul > li{
    margin-top: 2rem;
    margin-bottom: 2rem;
}
.page-selection #page .frame-ermes-openfindselection .rs-staticList .vignette_container img.img-thumbnail,
.page-selection-EN #page .frame-ermes-openfindselection .rs-staticList .vignette_container img.img-thumbnail{
    margin-right: .5rem;
}
/*
.page-selection #page .frame-ermes-openfindselection .rs-staticList .notice_corps > a > *,
.page-selection-EN #page .frame-ermes-openfindselection .rs-staticList .notice_corps > a > *{
    padding: .25rem .5rem;
}
*/

/* ********* */
/* MENU SIDE */

/* Reset */
#menu-side,
#menu-side--body *{
    margin:0;
    padding:0;
}

#menu-side{
    background: #fff;
    display: block;
    position:fixed;
    z-index: 101;
    top:0;left:0;bottom:0;
    width:100%;
    overflow-x: hidden;
    overflow-y: auto;
    transform: translateX(0);
    transition: transform .25s ease-out;
}
#menu-side.closed{
    transform: translateX(-100%);
}
#menu-side.in{
    box-shadow: 4px 0 9px rgba(0,0,0,.3);
    transform: translateX(0);
}
@media (min-width:555px){
    #menu-side{
        display: block;
        position:fixed;
        top:0;left:0;bottom:0;
        width:100%;
    }
}
@media (min-width:992px){
    #menu-side{
        display: block;
        position:fixed;
        top:0;left:0;bottom:0;
        width:940px;
        width:90%;
    }
}
#menu-side--controls{
    width: 100%;
}
.layer-close--menu-side{
    display: none;
    background: rgba(0,0,0,0.5);
    position: fixed;
    top:0;left: 0;right: 0;bottom: 0;
    z-index: 9;
}
.layer-close--menu-side.in{
    display: block;
}


/* Header menu side */
#menu-side--header {
	height: 5rem;
	display: flex;
	justify-content: space-between;
	background: #001b3b;
	position: sticky;
	top: 0;
    z-index: 10;
    padding-left:1rem;
    padding-right:1rem;
	box-shadow: 0 4px 9px rgba(0,0,0,.1);
}
#menu-side--body{
    padding:2rem 1rem;
    background: #d4d9de;
}
@media (min-width: 768px){
    #menu-side--header,
    #menu-side--body{
        padding-left:1.5rem;
        padding-right:1.5rem;
    }
}
@media (min-width: 992px){
    #menu-side--body{
        background: #d4d9de;
        display: flex;
/*        height: calc(100% - 80px);*/
    }
    #menu-side--body #zone-1{
        flex: 3;
        margin-right: 1rem;
    }
    #menu-side--body #zone-1+div{
        flex: 2;
    }
}
#zone-2-niveau.inactif{
    opacity: .5;
}
#zone-2-niveau.actif{
    opacity: 1;
}
#menu-side--header .menu-side--fermer,
#menu-side--header .filtres-controls,
#menu-side--body #zone-valid .filtres-controls {
	display: flex;
	align-items: center;
}
#menu-side--header .menu-side--fermer a {
	display: flex;
    align-items: center;
}
#menu-side--header .menu-side--fermer figure {
	width: 36px;
	height: 36px;
    margin-right: 1rem;
	border-radius: 18px;
    background: rgba(255,255,255,.8);
    border: 0;
	display: flex;
}
#menu-side--header .menu-side--fermer figure img{
	width: 18px;
	height: 18px;
	background: transparent;
	border: 0;
    margin: auto!important;
}
#menu-side--header .menu-side--fermer span{
	font-size: .875rem;
    text-transform: uppercase;
    color: #fff;
    display: none;
}
@media (min-width:7680px){ 
    #menu-side--header .menu-side--fermer span{
        display: block;
    }
}
#menu-side--header .filtres-controls .btn-valid,
#menu-side--body #zone-valid .filtres-controls .btn-valid{
	font-size: .875rem;
    color: #001b3b;
    font-weight: 600;
    padding: .5rem 1.5rem;
    background-color:#fff; 
    border: 1px solid #001b3b;
}
#menu-side--header .filtres-controls .btn-valid{
	border-radius: 1rem;
}
#menu-side--header .filtres-controls .btn-valid.inactif,
#menu-side--body #zone-valid .filtres-controls .btn-valid.inactif{
	opacity:.3;
    background-color:#fff;
    cursor: default;
}
#menu-side--header .filtres-controls .btn-valid.actif,
#menu-side--body #zone-valid .filtres-controls .btn-valid.actif{
	opacity:1;
    background-color:#B3D6FD;
    cursor: pointer;
}

/* *************** */
/* CONTENU DU MENU */

/* sections */
#menu-side--body > [id^="zone-"].inactif > div{
    display: none;
}
#page #menu-side--body > #zone-valid > div.filtres-controls{
    display: flex;
}
#menu-side--body [id^="zone-"]{
    margin-bottom: 1.5rem;
}
#menu-side--body > [id^="zone-"]{
    margin-bottom: 2rem;
}

/* titres et corps de texte des sections */
#menu-side--body h2,
#menu-side--body h3,
#menu-side--body .menu-side--instruction{
    margin-bottom: 1rem;
}
#menu-side--body h2,
#menu-side--body h2 span{
    font-size: 1.25rem;
    line-height: 1.5;
    color:#001b3b;
    font-family: LinotypeBrewery-bold, sans-serif;
    background: none !important;
    text-transform: uppercase;
    border-top: 0;
    text-align: left;
}
#menu-side--body h2 span.decompte1,
#menu-side--body h2 span.decompte2{
    color:#B3D6FD;
    font-weight: bold;
}
#menu-side--body h2 span.decompte1{
    font-size: 1.5rem;
}
#menu-side--body h2 span.decompte2{
    margin-right: 1rem;
}
#menu-side--body h3,
#menu-side--body h3 span{
    font-family: 'SourceSansPro', 'Source sans pro', sans-serif;
    font-weight: 600;
    font-size: .875rem;
    text-transform: none;
    color:#000;
}
#menu-side--body li a,
#menu-side--body li button,
#menu-side--body .menu-side--instruction{
    color:#545454;
    font-size: .875rem;
    font-weight: normal;
}
[id^="zone-"].actif > .menu-side--instruction{
    display: none;
}
/* Gestion des grilles de filtres */
#menu-side [class*="grid-"] {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  margin-left: 0rem;
}
#menu-side [class*="grid-"] > * {
  flex: 0 0 auto;
  display: block;
  /* IE fix */

  width: calc(100% * 1 / 4 - 0rem);
  margin-left: 0rem;
}
#menu-side .grid-6 > * {
  width: calc(100% * 1 / 5 - .2rem);
}
#menu-side .grid-6 > .flexitem-double {
  width: calc(100% * 2 / 6 - 0rem);
}
#menu-side .grid-6 > .flexitem-first {
  order: -1;
}
@media (min-width: 481px) and (max-width: 640px) {
  #menu-side .grid-6 > * {
    width: calc(100% * 1 / 2 - 0rem);
  }
  #menu-side .grid-6 > .flexitem-double {
    width: calc(100% - 0rem);
  }
}
@media (max-width: 480px) {
  #menu-side .grid-6 > * {
    width: calc(100% - 0rem);
  }
  #menu-side .grid-6 > .flexitem-double {
    width: calc(100% - 0rem);
  }
}

/* Apparence des filtres */
#menu-side .grid-6 li {
	border: 1px solid #B3D6FD;
	text-align: center;
	height: 2.25rem;
    overflow: hidden;
	display: flex;
	justify-content:center;
	align-items: stretch;
    margin-right: .2rem;
    margin-bottom: .2rem;
}
#menu-side--body li a,
#menu-side--body li button,
#menu-side--body li a.inactif,
#menu-side--body li button.inactif{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    background: #fff;
    border: 0;
}
#menu-side--body li a:hover,
#menu-side--body li button:hover,
#menu-side--body li a.actif,
#menu-side--body li button.actif,
#menu-side--body li a:focus,
#menu-side--body li button:focus{
    text-decoration: none;
    background: #B3D6FD;
}
#menu-side--body li a:hover span,
#menu-side--body li button:hover span,
#menu-side--body li a.actif span,
#menu-side--body li button.actif span,
#menu-side--body li a:focus span,
#menu-side--body li button:focus span{
    font-weight: 600;
    color:#000;
}
#menu-side--body li a,
#menu-side--body li button,
#menu-side--body li a span,
#menu-side--body li button span{
    line-height: 1;
}
/* Apparence des bouton radio */
#menu-side--body ul[class^="grid-"] li {
    position: relative;
}
#menu-side--body ul[class^="grid-"] li [type="radio"]:not(:checked),
#menu-side--body ul[class^="grid-"] li [type="radio"]:checked {
    position: absolute;
    left: 0;
    opacity: 0.01;
}
#menu-side--body ul[class^="grid-"] li [type="radio"]:not(:checked) + label,
#menu-side--body ul[class^="grid-"] li [type="radio"]:checked + label {
    position: relative;
    font-size: .875rem;
    color:#545454;
    line-height: 1;
    cursor: pointer;
    display: flex;
    width: 100%;
    font-weight: normal;
    justify-content: center;
    align-items: center;
}
/* radio aspect */
#menu-side--body ul[class^="grid-"] li [type="radio"]:disabled + label {
    color: #aaa;
}



/* MENU SIDE V2 dec2020 */
.home-selectionEN #menu-side{
    display: block;
    position: static!important;
    transform: translateX(0);
}
.home-selectionEN #menu-side #menu-side--header,
.home-selectionEN #menu-side .layer-close--menu-side,
.page-selection-EN #menu-side .filtres-controls--pageHome{
    display: none!important;
}
/* recapitulatif des choix */
.filtres-controls--pageHome{
    padding:0 1rem;
/*    opacity: .5;*/
}
.filtres-controls--pageHome.actif{
    opacity: 1;
}
.recap-wrap {
	line-height: 1;
	align-self: center;
	text-align: right;
	padding-right: 1rem;
	color: #fff;
	flex: 1;
}
.recap-wrap p {
	color: #fff;
	margin: .35rem;
}
.home-selectionEN .recap-wrap {
	text-align: left;
	color: #001b3b;
}
.home-selectionEN #menu-side .recap-wrap > p:first-of-type {
	margin-top: 0;
}
.home-selectionEN #menu-side .recap-wrap p {
	color: #001b3b;
	margin: .5rem 0;
}
#menu-side .recap .recap-sep {
  display: none!important;
}
#menu-side .recap > :before {
  content: "•";
  margin-right: .5rem;
}
.home-selectionEN #menu-side .recap :first-of-type:before {
  display: none;
}
.home-selectionEN #menu-side .recap-wrap.actif .recap .actif {
	display: inline!important;
}
.home-selectionEN #menu-side .recap-1{
	margin-left: 0;
}

.recap-wrap p:first-of-type {
	font-family: LinotypeBrewery-bold, sans-serif;
	opacity: .5;
    display: none;
}
.home-selectionEN .recap-wrap p:first-of-type {
    display: block;
}
@media (min-width:768px){
    
}
#menu-side .recap {
	display: flex;
	flex-wrap: wrap;
	line-height: 1;
	justify-content: flex-end;
	text-align: right;
	align-items: center;
	color: #fff;
}
.home-selectionEN #menu-side .recap {
	justify-content: flex-start;
	text-align: left;
	align-items: center;
	color: #001b3b;
}
#menu-side .recap * {
	line-height: 1;
	margin: 0 .25rem;
    font-size: 12px;
}
.recap-wrap.activating .recap-0, .recap-wrap.actif .recap-0 {
	display: none;
}
#menu-side .recap-2 {
/*
	text-transform: uppercase;
	font-weight: 700;
*/
}
#menu-side .recap-3 {
/*	font-style: oblique;*/
    margin-right: 0;
}
@media (min-width: 768px){
    
}
@media (min-width:992px){
    .page-selection-EN #menu-side .filtres-controls--pageHome{
        display: block!important;
    }
    #menu-side--header .filtres-controls,
    #menu-side--header .recap-wrap.actif,
    #menu-side--header .recap-wrap{
        display: none!important
    }
    .recap-wrap {
        text-align: left;
        color: #001b3b;
    }
    #menu-side .recap {
        display: inline;
    }
    #menu-side .recap-wrap > p:first-of-type {
        display: block;
        margin-top: 0;
    }
    #menu-side .recap-wrap p {
        color: #001b3b;
        margin: .5rem 0;
    }
    #menu-side .recap :first-of-type:before {
      display: none;
    }
    #menu-side .recap-wrap.actif .recap .actif {
        display: inline!important;
    }
    #menu-side .recap-1{
        margin-left: 0;
    }
    #menu-side .recap {
        justify-content: flex-start;
        text-align: left;
        align-items: center;
        color: #001b3b;
    }
    #menu-side .btn.btn-valid {
        margin-top: 1rem;
    }
}
#menu-side--body #zone-1,
#menu-side--body #zone-2-niveau,
#menu-side--body .filtres-controls{
	margin-bottom: 2rem;
    padding: 1rem;
    border-radius: 1rem;
    background: #fff;
}
#menu-side--body .yoyo-trigger{
	margin-bottom: 1rem;
    display: block;
    border-bottom: 1px solid #B6BEC7;
    padding-bottom: .5rem;
}
#menu-side--body .yoyo-trigger:hover,
#menu-side--body .yoyo-trigger:focus,
#menu-side--body .yoyo-trigger:focus-within,
#menu-side--body .yoyo-trigger:active,
#menu-side--body .yoyo-trigger.in{
	text-decoration: none;
    font-weight: 700;
    border-bottom-color: #001b3b;
}
#menu-side--body .yoyo-trigger,
#menu-side--body .yoyo-trigger span {
    font-family: LinotypeBrewery-regular, sans-serif;
	font-weight: 500;
	font-size: 1rem;
	text-transform: none;
	color: #001b3b;
}
#menu-side [class*="grid-"] {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin-left: 0rem;
    justify-content: flex-start;
}

#menu-side .grid-6 li,
#menu-side .grid-liste li {
    border:0;
    text-align: center;
    height: unset;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: stretch;
    margin-right: .5rem;
    margin-bottom: .5rem;
    display: inline-block;
    width: auto;
    padding: 0;
    border-radius: 1rem;
}
#menu-side .grid-liste li:last-of-type {
    margin-right: 0;
}

#menu-side--body ul[class^="grid-"] li [type="radio"]:not(:checked)+label,
#menu-side--body ul[class^="grid-"] li [type="radio"]:visited +label,
#menu-side--body ul[class^="grid-"] li [type="radio"]:checked+label {
    background:transparent;
    border: 1px solid #001b3b;
    position: relative;
    font-size: .875rem;
    color: #001b3b;
    line-height: 1;
    cursor: pointer;
    display: flex;
    width: 100%;
    font-weight: normal;
    justify-content: center;
    align-items: center;
    font-size: .825rem;
    padding: .25rem 1rem;
    border-radius: 1rem;
}
#menu-side--body ul[class^="grid-"] > li > [type="radio"]:hover + label,
#menu-side--body ul[class^="grid-"] > li > [type="radio"]:focus + label {
    border: 1px solid #0095da;
    background:transparent;
    color:#0095da;
}
#menu-side--body ul[class^="grid-"] > li > [type="radio"]:checked + label,
#menu-side--body ul[class^="grid-"] > li > [type="radio"].actif + label {
    border: 1px solid #0095da;
    background:#0095da;
    color:#fff;
}
#menu-side--body ul[class^="grid-"] li li [type="radio"]:checked + label,
#menu-side--body ul[class^="grid-"] li li [type="radio"]:hover + label,
#menu-side--body ul[class^="grid-"] li li [type="radio"]:focus + label,
#menu-side--body ul[class^="grid-"] li li [type="radio"].actif + label {
    background:#f2f3ee;
}


#menu-side--body .grid-liste > li > ul {
    display: flex;
    flex-direction: column;
    position: absolute;
    margin-top: .25rem;
    align-items: stretch;
    background: #fff;
    box-shadow: 0 3px 8px #ccc;
    z-index: 2;
    width: 260px;
    padding: 12px .875rem;
    border-radius: 1rem;
}
#menu-side--body .grid-liste > li[aria-expanded="true"] {
    overflow: visible;
}
#menu-side--body .grid-liste > li[aria-expanded="false"] ul{
    display: none;
}
#menu-side--body .grid-liste > li[aria-expanded="true"] ul{
    display: flex;
    flex-direction: column;
    position: absolute;
    margin-top: .25rem;
    align-items: stretch;
    background: #fff;
    box-shadow: 0 3px 8px #ccc;
    z-index: 2;
    width: 260px;
    padding: 12px .875rem;
    border-radius: 1rem;
}
#menu-side--body .grid-liste > li[aria-haspopup="true"] > label:after {
    content: " ";
    margin-left: 1rem;
	width: 0;
	height: 0;
	vertical-align: middle;
	border-top: 6px solid #001b3b;
	border-right: 5px solid transparent;
	border-bottom: 0;
	border-left: 5px solid transparent;
}
#menu-side--body ul[class^="grid-"] > li[aria-haspopup="true"] > [type="radio"]:hover + label:after,
#menu-side--body ul[class^="grid-"] > li[aria-haspopup="true"] > [type="radio"]:focus + label:after{
    content: " ";
    margin-left: 1rem;
	width: 0;
	height: 0;
	vertical-align: middle;
	border-top: 6px solid #0095da;
	border-right: 5px solid transparent;
	border-bottom: 0;
	border-left: 5px solid transparent;

}
#menu-side--body .grid-liste > li[aria-haspopup="true"] > [type="radio"]:checked > label:after,
#menu-side--body .grid-liste > li[aria-expanded="true"] > label:after {
    content: " ";
    margin-left: 1rem;
	width: 0;
	height: 0;
	vertical-align: middle;
	border-top: 6px solid #fff;
	border-right: 5px solid transparent;
	border-bottom: 0;
	border-left: 5px solid transparent;

}
#menu-side--body .grid-liste > li > ul > li {
	margin-right: 0;
}
#menu-side--body ul[class^="grid-"] li[aria-haspopup="true"] li{
    border-radius: 0;
    margin-bottom: 0;
}
#menu-side--body ul[class^="grid-"] li[aria-haspopup="true"] label[for^="niveau-detail-"]{
    text-align: left;
    justify-content: flex-start;
    border: 0;
    border-bottom: 1px solid #c4c4c4;
    border-radius: 0;
    padding: .5rem 0 .5rem;
}
#menu-side--body ul[class^="grid-"] li[aria-haspopup="true"] li:last-of-type label[for^="niveau-detail-"]{
    border-bottom: 0;
}

#menu-side--body .grid-liste li li a {
    text-align: left;
    justify-content: flex-start;
}

/* bouton de validation des choix, apparaissant juste apres l'encart choix du niveau */
#menu-side .btn.btn-valid,
#menu-side .btn.btn-valid.actif {
	font-size: 1rem;
	font-weight: 500;
	background: #B3D6FD;
	color: #001b3b;
	padding: .25rem 1.5rem;
	border-radius: 1rem;
	border: 1px solid #B3D6FD;
    opacity: 1;
    cursor: pointer;
}
.home-selectionEN #menu-side .btn.btn-valid {
	margin-top: 1rem;
}
.home-selectionEN #menu-side .btn.btn-valid.actif {
	font-size: 1rem;
	font-weight: 500;
	background: #001b3b;
	color: #fff;
	padding: .25rem 1.5rem;
	border-radius: 1rem;
	border: 1px solid #001b3b;
    opacity: 1;
    cursor: pointer;
}
.home-selectionEN #menu-side .btn.btn-valid.inactif {
	border: 1px solid #001b3b;
	background: transparent;
	color: #001b3b;
    opacity: .5;
    cursor: not-allowed;
}
#menu-side .btn.btn-valid.inactif {
	border: 1px solid #B3D6FD;
	background: transparent;
	color: #B3D6FD;
    opacity: .5;
    cursor: not-allowed;
}


/* **************************************** */
/* ***** SOMMAIRE STICKY (EDUTHEQUE) ****** */
/* **************************************** */
/*
body[id^="ext-gen"] .main-float-menu {
    display: none;
}
*/
.float-frame-menu .text-info.glyphicon.glyphicon-repeat.gly-spin.spinner,
.float-frame-menu .text-info.glyphicon.glyphicon-repeat.gly-spin.spinner:before{
    font-size: 2rem;
}
.float-frame-menu .text-info.glyphicon.glyphicon-repeat.gly-spin.spinner{
    top: calc(50% - 1rem);
    left: calc(50% - 1rem);
}
.float-frame-menu.vue-affix.affix-top,
.float-frame-menu.vue-affix.affix-bottom{
    width:100%!important;
    max-width: 320px;
    background: #f4f4f4;
    /* transition: all .5s ease-in-out; */
    box-shadow: 0 4px 9px #ccc;
}
.affix{
    overflow-y: auto;
    overflow-x: hidden;
    /* height: 95%; */
    width:320px!important;
    top: 120px !important; 
/*    bottom: 0;*/
    box-shadow: 0 4px 9px #ccc;
    /*background: #f3f2ee!!important;*/
    background-color: #f4f4f4 !important;
    top: 50px !important;
    overflow-y: scroll;
    max-height: 85vh;
}
.affix[aria-expanded="false"]{
    bottom: unset;
}
#page .main-float-menu .menu-label {
    cursor: pointer;
}
#page .main-float-menu .menu-label.in:before,
#page .main-float-menu .menu-label:before {
    font-family: ermes-font-update;
    content: '\e85a';
    font-size: 2rem;
    display: inline-block;
    position: absolute;
    -webkit-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
    vertical-align: top;
    top: 0;
    right: 1rem;
    -webkit-transform-origin: center;
    -ms-transform-origin: center;
    transform-origin: center;
    -webkit-transition: -webkit-transform .15s ease-in-out, -webkit-transform .15s ease-in-out;
    transition: transform .15s ease-in-out, -webkit-transform .15s ease-in-out;
	display: none;
}
#page .main-float-menu .menu-label.in:before{
    -webkit-transform: rotate(-90deg);
    -ms-transform: rotate(-90deg);
    transform: rotate(-90deg);
    margin-left: .25rem;
	display: none;
}

#page .main-float-menu .menu-label h2{
    font-size: 1.5rem !important;
    font-family: LinotypeBrewery-Bold;
    text-transform: none !important;
    color: #999999;
    background: transparent !important;
    padding: .25rem .5rem;
}
#page #portal .float-frame-menu{
    padding: .5rem;
    z-index: 9;
}
.float-frame-menu .menu-list a {
    padding: .2em .75em;
    font-size: .825rem;
}
#page #portal .frame-ermes-sommaire .frame-head a{
    padding-top: .25rem;
    padding-bottom: .25rem;
}
#page #portal .frame-ermes-sommaire .head-H1{
    display: none;
}
#page #portal .frame-ermes-sommaire .frame-head.head-H2{
    border-top: 1px solid #FFF;
}
#page #portal .frame-ermes-sommaire .head-H2 > a {
    text-transform: uppercase;
    font-family: SourceSansPro-SemiBold, sans-serif;
    padding: .5rem;
    color:#333;
}

#page #portal .frame-ermes-sommaire .float-frame-menu .head-H3 > a{
    text-transform: none;
    padding-left: 1rem;
    color: #333;
    font-weight: 500;
}
#page #portal .frame-ermes-sommaire .float-frame-menu .head-H4 > a{
    padding-left: 1.5rem;
    color:#555;
}
.float-frame-menu .menu-list a:hover,
.float-frame-menu .menu-list a:active,
#page .float-frame-menu .menu-list a.is-active,
.float-frame-menu .menu-list a:focus {
    background-color: #fff;
    color: #000;
    text-decoration: none;
}
#page .float-frame-menu .menu-list a.is-active{
    font-family: SourceSansPro-SemiBold, sans-serif;
}

/* Test - Sommaire Edutheque - après désactivation des classes affix-top, affix-bottom... "Maj" */
 .float-frame-menu.vue-affix {
	overflow-x: hidden;
	box-shadow: 0 4px 9px #ccc;
	background-color: #f4f4f4 !important;
	overflow-y: scroll;
	max-height: 92vh;
} 



/* *************************************** */
/* NAVIGATION PRINCIPALE CUSTOM     PAR PP */
/* *************************************** */

/* ******************************************************************** */
/* **************************   NAV -- CUSTOM  ************************ */
/* ******************************************************************** */
.nav--rubriques{
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
}
#main-nav{
    margin: 0 auto;
}
@media (min-width:768px){
    /* menus */
    #main-menu > li {
        text-align: center;
    }
    #main-menu > li > a {
        display: -ms-flexbox;
        display: flex;
        justify-content: space-around;
        align-items: center;
    }
    .sm-clean a.has-submenu {
        padding-right: 12px;
    }

    #main-menu > li > a::before {
        /* content: url(images/icon-extlink-14px.png); */
        margin-right: 1rem;
        max-height: 24px;
    }
    #main-menu.sm-clean > li > a .sub-arrow {
        position: static;
        margin-left: 1rem;
    }
}
/* sous menus */
.sm-clean ul a, .sm-clean ul a:hover, .sm-clean ul a:focus, .sm-clean ul a:active, .sm-clean ul a.highlighted {
/*
    border: 0 !important;
    padding: 1rem;
    padding-right: 2rem;
    color: #555555;
        text-transform: none;
        font-weight: normal;
*/
}
.sm-clean a, .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active {
  padding: 13px 20px;
  /* make room for the toggle button (sub indicator) */
  padding-right: 58px;
  color: #333 !important;
    text-transform: none;
  font-size: 16px;
  font-weight: normal;
  line-height: 17px;
  text-decoration: none;
}
#main-menu > li > a, #main-menu > li > a:hover, #main-menu > li > a:focus, #main-menu > li > a:active {
  padding: 13px 20px;
  color: #000!important;
    text-transform: uppercase;
  font-size: 12px;
  font-weight: 600;
}
@media (min-width:768px){
    #main-menu > li > a.highlighted, #main-menu > li > a:hover, #main-menu > li > a:focus, #main-menu > li > a:active {
      background:#333;
        color:#fff!important;
    }
    #main-menu > li.rechercheMusee > a.highlighted, #main-menu > li.rechercheMusee > a:hover, #main-menu > li.rechercheMusee > a:focus, #main-menu > li.rechercheMusee > a:active {
        background: url(/ui/skins/CIMU/images/icon-loupe-blanc.svg) no-repeat scroll center center #333;
        height: 43px;
        background-position-x: .75rem;
    }
    #main-menu > li > a.highlighted .sub-arrow, #main-menu > li > a:hover .sub-arrow, #main-menu > li > a:focus .sub-arrow, #main-menu > li > a:active .sub-arrow {
      border-color: #fff transparent transparent transparent;
    }
}
.sm-clean a.current {
  color: #D23600;
}
.sm-clean a.disabled {
  color: #bbbbbb;
}
.sm-clean a .sub-arrow {
  position: absolute;
  top: 50%;
  margin-top: -17px;
  left: auto;
  right: 4px;
  width: 34px;
  height: 34px;
  overflow: hidden;
  font: bold 16px/34px monospace !important;
  text-align: center;
  text-shadow: none;
  background: rgba(255, 255, 255, 0.5);
  border-radius: 0;
}
.sm-clean a .sub-arrow::before {
  content: '+';
}
.sm-clean a.highlighted .sub-arrow::before {
  content: '-';
}
.sm-clean > li:first-child > a, .sm-clean > li:first-child > :not(ul) a {
  border-radius: 0;
}
.sm-clean > li:last-child > a, .sm-clean > li:last-child > *:not(ul) a, .sm-clean > li:last-child > ul, .sm-clean > li:last-child > ul > li:last-child > a, .sm-clean > li:last-child > ul > li:last-child > *:not(ul) a, .sm-clean > li:last-child > ul > li:last-child > ul, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > a, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul {
  border-radius: 0 ;
}
.sm-clean > li:last-child > a.highlighted, .sm-clean > li:last-child > *:not(ul) a.highlighted, .sm-clean > li:last-child > ul > li:last-child > a.highlighted, .sm-clean > li:last-child > ul > li:last-child > *:not(ul) a.highlighted, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > a.highlighted, .sm-clean > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > ul > li:last-child > *:not(ul) a.highlighted {
  border-radius: 0;
}
.sm-clean li {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}
.sm-clean > li:first-child {
  border-top: 0;
}
.sm-clean ul {
  background: rgba(162, 162, 162, 0.1);
}
.sm-clean ul a, .sm-clean ul a:hover, .sm-clean ul a:focus, .sm-clean ul a:active {
  font-size: 16px;
  border-left: 8px solid transparent;
}
.sm-clean ul ul a,
.sm-clean ul ul a:hover,
.sm-clean ul ul a:focus,
.sm-clean ul ul a:active {
  border-left: 16px solid transparent;
}
.sm-clean ul ul ul a,
.sm-clean ul ul ul a:hover,
.sm-clean ul ul ul a:focus,
.sm-clean ul ul ul a:active {
  border-left: 24px solid transparent;
}
.sm-clean ul ul ul ul a,
.sm-clean ul ul ul ul a:hover,
.sm-clean ul ul ul ul a:focus,
.sm-clean ul ul ul ul a:active {
  border-left: 32px solid transparent;
}
.sm-clean ul ul ul ul ul a,
.sm-clean ul ul ul ul ul a:hover,
.sm-clean ul ul ul ul ul a:focus,
.sm-clean ul ul ul ul ul a:active {
  border-left: 40px solid transparent;
}
.main-menu-btn {
    position: relative;
    display: block;
    padding: 0.815em 48px;
    height: 24px;
    overflow: hidden;
    line-height: 26px;
    text-align: center;
    cursor: pointer;
    color: #BBB1A3;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}
@media (min-width: 768px) {
  /* Switch to desktop layout
  -----------------------------------------------
     These transform the menu tree from
     collapsible to desktop (navbar + dropdowns)
  -----------------------------------------------*/
  /* start... (it's not recommended editing these rules) */
  .sm-clean ul {
    position: absolute;
    width: 12em;
  }

  .sm-clean li {
    float: left;
  }

  .sm-clean.sm-rtl li {
    float: right;
  }

  .sm-clean ul li, .sm-clean.sm-rtl ul li, .sm-clean.sm-vertical li {
    float: none;
    border: 1px solid #FFF;
  }

  .sm-clean a {
    white-space: nowrap;
  }

  .sm-clean ul a, .sm-clean.sm-vertical a {
    white-space: normal;
  }

  .sm-clean .sm-nowrap > li > a, .sm-clean .sm-nowrap > li > :not(ul) a {
    white-space: nowrap;
  }

  /* ...end */
  .sm-clean {
    padding: 0 10px;
  }
  .sm-clean a, .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active, .sm-clean a.highlighted {
    padding: 12px 12px;
    color: #555555;
    border-radius: 0 !important;
  }
  .sm-clean a:hover, .sm-clean a:focus, .sm-clean a:active, .sm-clean a.highlighted {
    color: #D23600;
  }
  .sm-clean a.current {
    color: #D23600;
  }
  .sm-clean a.disabled {
    color: #bbbbbb;
  }
  .sm-clean a.has-submenu {
    padding-right: 24px;
  }
  .sm-clean a .sub-arrow {
    top: 50%;
    margin-top: -2px;
    right: 12px;
    width: 0;
    height: 0;
    border-width: 4px;
    border-style: solid dashed dashed dashed;
    border-color: #333 transparent transparent transparent;
    background: transparent;
    border-radius: 0;
  }
  .sm-clean a .sub-arrow::before {
    display: none;
  }
  .sm-clean li {
    border-top: 0;
  }
  .sm-clean > li > ul::before,
  .sm-clean > li > ul::after {
    position: absolute;
    top: -18px;
    left: 30px;
    width: 0;
    height: 0;
    overflow: hidden;
    border-width: 9px;
    border-style: dashed dashed solid dashed;
    border-color: transparent transparent #bbbbbb transparent;
  }
  .sm-clean > li > ul::after {
    top: -16px;
    left: 31px;
    border-width: 8px;
    border-color: transparent transparent #fff transparent;
  }
  .sm-clean ul {
    border: 1px solid #fff;
    padding: 5px 0;
    background: #F3F2EE;
    border-radius: 0!important;
    box-shadow: 0 5px 9px rgba(0, 0, 0, 0.2);
    min-width: 100% !important;
    width:          auto !important;
    max-width: unset !important;
  }
  .sm-clean ul ul{
    background: #FFF;
    width: 280px !important;
    border: 1px solid #ddd;
  }
  .sm-clean ul ul li{
    background: #FFF;
    padding: 1rem 1.5rem;
    font-size: .875rem;
      font-style: italic;
      color:#666;
      line-height: 1.6;
      letter-spacing: .02rem;
  }
  .sm-clean ul a, .sm-clean ul a:hover, .sm-clean ul a:focus, .sm-clean ul a:active, .sm-clean ul a.highlighted {
    border: 0 !important;
    padding: 1rem;
    color: #555555;
  }
  .sm-clean ul a:hover, .sm-clean ul a:focus, .sm-clean ul a:active, .sm-clean ul a.highlighted {
    background: #fff;
    color: #D23600;
  }
  .sm-clean ul a.current {
    color: #D23600;
  }
  .sm-clean ul a.disabled {
    background: #fff;
    color: #cccccc;
  }
  .sm-clean ul a.has-submenu {
    padding-right: 2rem;
  }
  .sm-clean ul a .sub-arrow {
    right: 8px;
    top: 50%;
    margin-top: -5px;
    border-width: 5px;
    border-style: dashed dashed dashed solid;
    border-color: transparent transparent transparent #555555;
    display: none;
  }
  .sm-clean .scroll-up,
  .sm-clean .scroll-down {
    position: absolute;
    display: none;
    visibility: hidden;
    overflow: hidden;
    background: #fff;
    height: 20px;
  }
  .sm-clean .scroll-up:hover,
  .sm-clean .scroll-down:hover {
    background: #eeeeee;
  }
  .sm-clean .scroll-up:hover .scroll-up-arrow {
    border-color: transparent transparent #D23600 transparent;
  }
  .sm-clean .scroll-down:hover .scroll-down-arrow {
    border-color: #D23600 transparent transparent transparent;
  }
  .sm-clean .scroll-up-arrow,
  .sm-clean .scroll-down-arrow {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -6px;
    width: 0;
    height: 0;
    overflow: hidden;
    border-width: 6px;
    border-style: dashed dashed solid dashed;
    border-color: transparent transparent #555555 transparent;
  }
  .sm-clean .scroll-down-arrow {
    top: 8px;
    border-style: solid dashed dashed dashed;
    border-color: #555555 transparent transparent transparent;
  }
  .sm-clean.sm-rtl a.has-submenu {
    padding-right: 12px;
    padding-left: 24px;
  }
  .sm-clean.sm-rtl a .sub-arrow {
    right: auto;
    left: 12px;
  }
  .sm-clean.sm-rtl.sm-vertical a.has-submenu {
    padding: 10px 20px;
  }
  .sm-clean.sm-rtl.sm-vertical a .sub-arrow {
    right: auto;
    left: 8px;
    border-style: dashed solid dashed dashed;
    border-color: transparent #555555 transparent transparent;
  }
  .sm-clean.sm-rtl > li > ul::before {
    left: auto;
    right: 30px;
  }
  .sm-clean.sm-rtl > li > ul::after {
    left: auto;
    right: 31px;
  }
  .sm-clean.sm-rtl ul a.has-submenu {
    padding: 10px 20px !important;
  }
  .sm-clean.sm-rtl ul a .sub-arrow {
    right: auto;
    left: 8px;
    border-style: dashed solid dashed dashed;
    border-color: transparent #555555 transparent transparent;
  }
  .sm-clean.sm-vertical {
    padding: 10px 0;
    border-radius: 0;
  }
  .sm-clean.sm-vertical a {
    padding: 10px 20px;
  }
  .sm-clean.sm-vertical a:hover, .sm-clean.sm-vertical a:focus, .sm-clean.sm-vertical a:active, .sm-clean.sm-vertical a.highlighted {
    background: #fff;
  }
  .sm-clean.sm-vertical a.disabled {
    background: #eeeeee;
  }
  .sm-clean.sm-vertical a .sub-arrow {
    right: 8px;
    top: 50%;
    margin-top: -5px;
    border-width: 5px;
    border-style: dashed dashed dashed solid;
    border-color: transparent transparent transparent #555555;
  }
  .sm-clean.sm-vertical > li > ul::before,
  .sm-clean.sm-vertical > li > ul::after {
    display: none;
  }
  .sm-clean.sm-vertical ul a {
    padding: 10px 20px;
  }
  .sm-clean.sm-vertical ul a:hover, .sm-clean.sm-vertical ul a:focus, .sm-clean.sm-vertical ul a:active, .sm-clean.sm-vertical ul a.highlighted {
    background: #eeeeee;
  }
  .sm-clean.sm-vertical ul a.disabled {
    background: #fff;
  }
}

/*# sourceMappingURL=sm-clean.css.map */
/* Mobile first layout SmartMenus Core CSS (it's not recommended editing these rules)
   You need this once per page no matter how many menu trees or different themes you use.
-------------------------------------------------------------------------------------------*/

.sm{box-sizing:border-box;position:relative;z-index:9999;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.sm,.sm ul,.sm li{display:block;list-style:none;margin:0;padding:0;line-height:normal;direction:ltr;text-align:left;}
.sm-rtl,.sm-rtl ul,.sm-rtl li{direction:rtl;text-align:right;}
.sm>li>h1,.sm>li>h2,.sm>li>h3,.sm>li>h4,.sm>li>h5,.sm>li>h6{margin:0;padding:0;}
.sm ul{display:none;}
.sm li,.sm a{position:relative;}
.sm a{display:block;}
.sm a.disabled{cursor:default;}
.sm::after{content:"";display:block;height:0;font:0px/0 serif;clear:both;overflow:hidden;}
.sm *,.sm *::before,.sm *::after{box-sizing:inherit;}

.main-nav:after {
    clear: both;
    content: "\00a0";
    display: block;
    height: 0;
    font: 0px/0 serif;
    overflow: hidden;
}

.nav-brand {
    /*          float: left;*/
    margin: 0;
}

.nav-brand a {
    display: block;
    padding: 12px 12px 12px 20px;
    color: #777;
    /*          font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;*/
    font-size: 22px;
    font-weight: normal;
    line-height: 17px;
    text-decoration: none;
}

#main-menu {
    clear: both;
    background: #FFF;
}

#main-menu > li {
    -ms-flex: 1 1 100%;
    flex: 1 1 100%;
    border: 1px solid #000;
    border-bottom: 0;
}
#main-menu > li:last-of-type {
    border-bottom: 1px solid #000;
}

@media (min-width: 768px) {
    #main-menu {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    #main-menu > li{
        border: 1px solid #000;
        border-right: 0;
    }
    #main-menu > li:last-of-type {
        border-right: 1px solid #000;
    }
}
/* Mobile menu toggle button */

.main-menu-btn {
  /* float: right; */
  margin: 6px 10px;
  position: relative;
  display: inline-block;
  width: 100%;
  height: 29px;
  text-indent: 29px;
  white-space: nowrap;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.main-menu-labelo {
  position: absolute;top: 3px;left: 10px;color: #000;
}


/* hamburger icon */

.main-menu-btn-icon,
.main-menu-btn-icon:before,
.main-menu-btn-icon:after {
  position: absolute;
  top: 50%;
  left: 2px;
  height: 2px;
  width: 24px;
  background: #555;
  -webkit-transition: all 0.25s;
  transition: all 0.25s;
}

.main-menu-btn-icon:before {
  content: '';
  top: -7px;
  left: 0;
}

.main-menu-btn-icon:after {
  content: '';
  top: 7px;
  left: 0;
}


/* x icon */

#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon {
  height: 0;
  background: transparent;
}

#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:before {
  top: 0;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

#main-menu-state:checked ~ .main-menu-btn .main-menu-btn-icon:after {
  top: 0;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}


/* hide menu state checkbox (keep it visible to screen readers) */

#main-menu-state {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  border: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
}


/* hide the menu in mobile view */

#main-menu-state:not(:checked) ~ #main-menu {
  display: none;
}

#main-menu-state:checked ~ #main-menu {
  display: block;
}

@media (min-width: 768px) {
    /* hide the button in desktop view */
    .main-menu-btn {
      position: absolute;
      top: -99999px;
      display: none;
    }

    /* always show the menu in desktop view */
    #main-menu-state:not(:checked) ~ #main-menu {
      display: block;
    }

    /* always show the menu in desktop view */
    @supports (display:flex) {
          #main-menu-state:not(:checked) ~ #main-menu {
              display: flex;
          }

          #main-menu-state:not(:checked) ~ #main-menu li {
              flex: 1;
          }
    }
    nav.main-nav{
        margin-bottom: 4rem;
    }
    /* menus */
    #main-menu > li {
        text-align: center;
    }    
    #main-menu > li > a {
        display: flex;
        justify-content: space-around;
        justify-content: center;
        align-items: center;
        overflow:hidden;
    }
    .sm-clean a.has-submenu {
        padding-right: 12px;
    }
    #main-menu.sm-clean > li > a .sub-arrow {
        position: static;
        margin-left: 1rem;
    }
    
    /* item rechercher (pour musée) */
    #main-menu > li.rechercheMusee {
        width: 75px;
        max-width: 75px;
    }
    #main-menu > li.rechercheMusee > a{
        background: url(/ui/skins/CIMU/images/icon-loupe-blanc.svg) no-repeat scroll center center #000;
        height: 43px;
        background-position-x: .75rem;
    }
    #main-menu > li.rechercheMusee > a > span:not(.sub-arrow){
        display: none;
    }
    #main-menu > li.rechercheMusee > a > span.sub-arrow{
        margin-left:2rem;
        border-color: #999 transparent transparent transparent;
    }
    
}

@media (max-width:767px){
    nav.main-nav, .nav--rubriques{
        /* display: none; */
    }
}


/* Marges autour du titre "incontournable rebond" PAD------------*/

div.border-gris div.media-body.border h3, div.border-gris div.media-body.border h2 {
    padding-top: 12px!important;
}

/* Fin - Marges autour du titre "incontournable rebond" PAD-----------*/

/* encart intro */
.frame-standard.panel.panel-front.webframe-ermes-carousel.intro.center {
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
    padding-bottom: 2rem;
    text-align: center;
    font-weight: 600;
}

/* *************************************************************************** */
/* Modèle d'encart ermes/tinymce : mosaique 2020 img gauche - texte droite -- 2x2   */
/* *************************************************************************** */
.model-html[class*="modele_horiz-"] h2{
    background:transparent;
    font-weight: 600;
    color:#666;
}
.model-html[class*="modele_horiz-"] .media{
    padding: 0;
    padding-right: 1rem;
}
.model-html[class*="modele_horiz-"] .media > a{
	display: flex;
	border-radius: 1rem;
    text-decoration: none;
    border:1px solid transparent;
    position: relative;
}
.model-html[class*="modele_horiz-"] .media > a:hover,
.model-html[class*="modele_horiz-"] .media > a:focus,
.model-html[class*="modele_horiz-"] .media > a:focus-within,
.model-html[class*="modele_horiz-"] .media > a:active{
	background: #f3f2ee;
/*    border:1px solid #ddd;*/
}

.model-html[class*="modele_horiz-"] .media > a.lien-externe:hover:after,
.model-html[class*="modele_horiz-"] .media > a.lien-externe:focus:after,
.model-html[class*="modele_horiz-"] .media > a.lien-externe:focus-within:after,
.model-html[class*="modele_horiz-"] .media > a.lien-externe:active:after{
	content: url(/ui/skins/MEDIA/images/icon-extlink-noir.png);
	position: absolute;
	right: .5rem;
	top: .5rem;
}
.model-html[class*="modele_horiz-"] .pull-left {
/*    margin-right: .75rem;*/
    margin-right: .25rem;
    border-radius: 1rem;
    overflow: hidden;
    flex-basis: 128px;
/*    background: #b3d6fd;*/
    background: #f3f2ee;
}
.model-html[class*="modele_horiz-"] .media-object {
	object-fit: cover;
	width: 128px;
	height: 128px;
	border: 0;
	margin: 0;
}
.model-html[class*="modele_horiz-"] .media-body {
    flex:1;
	margin-right: .5rem;
    padding-top:.5rem;
    padding-left: .5rem;
    border-radius: 1rem;
}
.modele_horiz-1col.model-html .media-body {
	max-width: 100%;
}
.modele_horiz-2col.model-html .media-body {
	max-width: 300px;
}
.model-html[class*="modele_horiz-"] .docType {
	line-height: 1;
	font-weight: 600;
	font-size: 12px;
	padding-bottom: .5rem;
	margin-bottom: .5rem;
	position: relative;
	margin-top: .25rem;
    color:#001b3b;
}
.model-html[class*="modele_horiz-"] .docType::after {
	line-height: 1;
	height: 1px;
	width: 30px;
	position: absolute;
	background: #000;
	content: "";
	float: none;
	clear: both;
	display: block;
	bottom: 0;
}
.model-html[class*="modele_horiz-"] .media-body h3.media-heading {
    padding: 0;
    font-family: LinotypeBrewery-Medium;
    text-transform: uppercase;
    font-weight: normal;
    font-size: 1rem;
    color:#001b3b;
}
.model-html[class*="modele_horiz-"] p.detail {
	line-height: 1;
    font-size: 13px;
    color: #777;
    margin-bottom: 0;
}
/* ******************************************************************** */
/* Modèle d'encart ermes/tinymce : mosaique d'images verticales masonry */
/* ******************************************************************** */
.mosaique-images-verticales .masonry-with-columns {
    columns: 6 200px;
    column-gap: 1rem;
}

.mosaique-images-verticales .masonry-with-columns>div {
    width: 150px;
    background: #ec985a;
    color: white;
    margin: 0 1rem 1rem 0;
    display: inline-block;
    width: 100%;
/*    text-align: center;*/
    font-family: system-ui;
    font-weight: 900;
    font-size: 2rem;
    position: relative;
}

.mosaique-images-verticales .mosaiq-item .conteneur-texte {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}

.mosaique-images-verticales .mosaiq-item {
    border-radius: 16px;
    overflow: hidden;
}

    /* modifs inspecteur */
    /*
body {
	 margin: 0;
	 padding: 1rem;
}
*/
.mosaique-images-verticales .masonry-with-columns {
    columns: 6 200px;
    column-gap: 1rem;
}

.mosaique-images-verticales .masonry-with-columns>div {
    width: 150px;
    background: #ec985a;
    color: white;
    margin: 0 1rem 1rem 0;
    display: inline-block;
    width: 100%;
/*    text-align: center;*/
    font-family: system-ui;
    font-weight: 900;
    font-size: 2rem;
    position: relative;
}

.mosaique-images-verticales .mosaiq-item .conteneur-texte {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    position: absolute;
    z-index: 1;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: end;
    -webkit-justify-content: flex-end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    text-decoration: none;
    -webkit-transition: padding .3s ease-in-out;
    transition: padding .3s ease-in-out;
    /*! padding: .5rem; */
}

.mosaique-images-verticales .conteneur-texte .cadre {
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-decoration: none;
    -webkit-transition: padding .3s ease-in-out;
    transition: padding .3s ease-in-out;
    position: relative;
    /*!    border: 1px solid rgba(255, 255, 255, .4);*/
    border: 0;
}

.mosaique-images-verticales .conteneur-texte .texte {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: end;
    -webkit-align-items: flex-end;
    -ms-flex-align: end;
    align-items: flex-end;
    background: rgba(255, 255, 255, .75);
    /*    height: 74px;*/
    height: 55px;
    overflow: hidden;
    position: absolute;
    bottom: 0;
    width: 100%;
    -webkit-transition: height .3s ease-in-out;
    transition: height .3s ease-in-out;
    box-sizing: border-box;
    height: 0;
    background: rgba(0, 27, 59, .75);
}

/*
.mosaique-images-verticales .liste-fichesThema li.double .conteneur-texte .texte {
    -webkit-box-pack: justify;
    -webkit-justify-content: space-between;
    -ms-flex-pack: justify;
    justify-content: space-between
}
*/

.mosaique-images-verticales .mosaiq-item:hover .conteneur-texte .texte {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    height: 100%;
}
.mosaique-images-verticales .conteneur-texte a .item-titre{
    font-family: LinotypeBrewery-bold;
    text-transform: uppercase;
    text-decoration: none;
    font-size: 12px;
    letter-spacing: .5px;
    color: #fff !important;
    margin-bottom: .5rem;
}
.mosaique-images-verticales .conteneur-texte span.descriptionFiche {
    font-family: 'Source Sans Pro', SourceSansPro, arial, Helvetica, sans-serif;
    font-size: 14px;
    /*!    font-size: .825rem; */
    margin: 0;
    opacity: 0;
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    display: none;
    text-transform: none;
    color: #ddd !important;
    letter-spacing: normal;
    font-weight: normal;
    text-align: left;
}

.mosaique-images-verticales .mosaiq-item:hover .conteneur-texte span.descriptionFiche {
    opacity: 1;
    -webkit-transition: opacity .3s ease-in-out;
    transition: opacity .3s ease-in-out;
    -webkit-transition-delay: 0s;
    transition-delay: 0s;
    display: block;
    max-height: 200px;
}
.mosaique-images-verticales .mosaiq-item:hover .conteneur-texte span.descriptionFiche.item-lien {
    text-decoration: underline;
    font-size: .825rem;
    margin-top: 1rem;
}

.mosaique-images-verticales .conteneur-texte a{
    width: 100%;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-justify-content: space-around;
    -ms-flex-pack: distribute;
    justify-content: center;
    color: #000;
    font-family: 'Source Sans Pro', SourceSansPro, arial, Helvetica, sans-serif;
    text-decoration: none;
    padding: 0 1rem;
    margin: 0;
    /*!    font-size: 16px;*/
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-transition: padding .3s ease-in-out;
    transition: padding .3s ease-in-out;
    height: 55px;
    font-family: LinotypeBrewery-bold, sans-serif;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: .5px;
    max-height: 100%;
    color: #fff !important;
}

.mosaique-images-verticales .mosaiq-item:hover .conteneur-texte a {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
    padding: 0 1rem;
    /*!    padding: 0 .5rem;*/
}

.mosaique-images-verticales .conteneur-img img {
    -o-object-fit: cover;
    object-fit: cover;
    margin-bottom: 0;
    max-width: none;
    width: auto;
    min-width: 100%;
}


.mosaique-images-verticales .masonry-with-columns .mosaiq-item-petit {
    height: 250px;
}

.mosaique-images-verticales .masonry-with-columns .mosaiq-item-moyen {
    height: 320px;
}

.mosaique-images-verticales .masonry-with-columns .mosaiq-item-grand {
    height: 400px;
}

.mosaique-images-verticales .conteneur-img {
    display: flex;
    height: 100%;
}

.mosaique-images-verticales .conteneur-img img {
    -o-object-fit: cover;
    object-fit: cover;
    margin-bottom: 0;
    /* max-width: none; */
    /* width: auto; */
    min-width: 100%;
    /* height: 100%; */
}
/* fin : mosaique d'images verticales masonry */
/* ****************************************** */

/* *************************************************************** */
/* Modele d'encart ermes/tinymce : MOSAIQUE image haut - texte bas */
/* *************************************************************** */
.mosaique-imgHaut-txtBas ul {
	display: flex;
	flex-wrap: wrap;
    margin: 0 auto;
    width: auto;
}
.mosaique-imgHaut-txtBas ul li {
    display: flex;
    justify-content: center;
    flex-basis: 100%;
    list-style: none;
    margin-bottom: 24px;
}
@media (min-width:480px) {
    .mosaique-imgHaut-txtBas ul li {
        flex-basis: 50%;
    }
}
@media (min-width:768px) {
    .mosaique-imgHaut-txtBas ul li {
        flex-basis: 33.333%;
    }
}
@media (min-width:992px) {
    .mosaique-imgHaut-txtBas ul li {
        flex-basis: 25%;
    }
}

.mosaique-imgHaut-txtBas li > a {
	display: flex;
	flex-direction: column;
    padding: .5rem;
    background: transparent;
}
.mosaique-imgHaut-txtBas li > a:hover {
/*    background: #f3f2ee;*/
}
.mosaique-imgHaut-txtBas li > a *{
	margin:0;
    padding: 0;
    border:0;
}
.mosaique-imgHaut-txtBas .imgHaut {
	display: flex;
	height: 150px;
	border-radius: 1rem;
	overflow: hidden;
}
.mosaique-imgHaut-txtBas img {
	object-fit: cover;
    width: 100%;
}
.mosaique-imgHaut-txtBas .txtBas {
    padding:.825rem 0; 
}
.mosaique-imgHaut-txtBas .txtBas p {
	font-size: 1rem;
/*	font-weight: 600;*/
    font-family: LinotypeBrewery-bold, sans-serif;
    color:#001B3B;
}







/* modifs guillaume 10 / 12 / 2020 */
body .cms-preview-mask-text-back {
    position: fixed;
    top: 50px;
    left: 0;
    width: 50px!important;
    height: 50px!important;
    z-index: 200000;
    background: rgba(255,0,0,.5)!important;
}
body .cms-preview-mask-text {
    position: fixed;
    top: 70px!important;
    left: 0px;
    width: 50px!important;
    padding: 0;
    text-align: center;
    font: 12px 'trebuchet ms',verdana,arial,sans-serif !important;
    color: #fff;
    background: none;
    z-index: 200000;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    -o-box-sizing: content-box;
    box-sizing: content-box;
    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    transform: rotate(-45deg);
    -webkit-transform-origin: 50% 0 0;
    -moz-transform-origin: 50% 0 0;
    -o-transform-origin: 50% 0 0;
    transform-origin: 50% 0 0;
}







 /* test affichage docu notice courte */
.template-datePubli,
.template-datePubliAloes{
    display: none;
}


/* ******************************************************************** */
/* ******************************************************************** */
/* REFONTE v2021 */
/* ******************************************************************** */
/* ******************************************************************** */


/* FONTS */
body.page-2021 #page h1,
body.page-2021 #page h1 *,
body.page-2021 #page .contenu h2,
body.page-2021 #page .contenu h2 *,
body.page-2021 #page h3,
body.page-2021 #page h3 *{
	font-family: LinotypeBrewery-Bold, sans-serif;
	text-transform: none;
	background-color: transparent;
}
body.page-2021 #page .contenu h2,
body.page-2021 #page .contenu h2 *{
	font-size: 2.5rem;
	line-height: 2.5rem;
    margin: 0;
	background: transparent;
}
body.page-2021 #page .contenu .panel > .panel-heading h2
body.page-2021 #page .contenu .panel-front > .x-panel-header span{
	background: transparent;
}
body.page-2021 .rebond-bleu h2, body.page-2021 .rebond-blanc h2 {
	background: transparent!important;
}
body.page-2021 #page .contenu h2{
	font-size: 2.5rem;
	line-height: 2.5rem;
	padding:1rem 0;
    margin: 0;
}
body.page-2021 #page #zone-5 h2,
body.page-2021 #page #zone-5 h2 *{
	font-size: 1.875rem;
	font-family: LinotypeBrewery-Regular, sans-serif;
	font-weight: 400;
	line-height: 1.29;
}
body.page-2021 #page #zone-5 h2{
	padding: 1rem 0;
    margin-bottom: 1rem;
    border-bottom: 1px solid #001B3B30;
}
body.page-2021 #page h3,
body.page-2021 #page h3 *{
	font-size: 1.5rem;
	font-family: LinotypeBrewery-Medium, sans-serif;
    line-height: 1.25;
}
body.page-2021 #page #zone-5 h3,
body.page-2021 #page #zone-5 h3 *{
	font-size: 1.375rem;
	font-family: LinotypeBrewery-Regular, sans-serif;
	font-weight: 400;
	line-height: 1.29;
	padding: .5rem 0;
    margin: 0;
}
/* ACCORDEON "DETAILS" */
details {
    border-bottom: 1px solid #001B3B30;
    margin-bottom: 0;
}
summary {
    padding: 1.125rem 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
details summary:hover{
    cursor: pointer;
    background: #F5F6F7;
}
details summary .icon.icon-right{
    transform: rotate(180deg);
}
details[open] summary .icon.icon-right{
    transform: rotate(270deg);
}
details > :not(summary){
    padding-left:2rem;
}
details li{
    font-size: .875rem;
	line-height: 1.5;
	margin-bottom: .875rem;
	list-style-type: disc;
}
details li::marker {
    color: #cd2453;
}

/* CONTENU PAGE */
#page > div.contenu {
	margin-top: 0;
}
#page > div.contenu .layout.row {
    background-color: #d4d9de;
	padding-bottom: 2rem;
}
/* GESTION DU SYSTEME DE COLONNES ET ENCARTS D'ERMES */
div.contenu #portal {
    /* effacer aussi les premieres lignes de edutheque.css et master.css pour portal padding */
    padding-top: 0!important;
}

#page > div.contenu #portal .frame,
#page > .contenu > main > .searchContainer,
#page > .contenu > main > div > .searchContainer,
#page > .contenu .layout,
#page > .contenu [id^="layout-"],
#page > .contenu [id^="layout-"] .row,
.page-2021-1colonne #page > .contenu #zone-6 {
    margin: 0 auto;
    max-width: 100%;
    width: 100%;
}
#page > div.contenu #portal .panel-front,
#page > .contenu > main > .searchContainer,
#page > .contenu > main > div > .searchContainer,
#page > .contenu [id^="layout-"] .row,
.page-2021-1colonne #page > .contenu #zone-6 {
    margin: 0 auto;
    max-width: 1170px;
    width: 100%;
}
.page-2021-1colonne #page > .contenu #layout-3 .row,
.page-2021-2colonnes #page > .contenu #layout-3 .row {
    margin-top: -110px;
}
@media (min-width: 768px) {
    #page > div.contenu #portal .panel-front,
    #page > .contenu > main > .searchContainer,
    #page > .contenu > main > div > .searchContainer,
    #page > .contenu [id^="layout-"] .row,
    .page-2021-1colonne #page > .contenu #zone-6 {
        width: 750px;
        max-width: 100%;
    }
}
@media (min-width: 992px) {
    #page > div.contenu #portal .panel-front,
    #page > .contenu > main > .searchContainer,
    #page > .contenu > main > div > .searchContainer,
    #page > .contenu [id^="layout-"] .row,
    .page-2021-1colonne #page > .contenu #zone-6 {
        width: 970px;
        max-width: 100%;
    }
}
@media (min-width: 1200px) {
    #page > div.contenu #portal .panel-front,
    #page > .contenu > main > .searchContainer,
    #page > .contenu > main > div > .searchContainer,
    #page > .contenu [id^="layout-"] .row,
    .page-2021-1colonne #page > .contenu #zone-6
    {
        width: 1170px;
        max-width: 100%;
/*
		width: 100%;
		max-width: 1600px;
		margin: 0 auto;
*/
    }
}
#page > div.contenu .panel-front/*,
#page > div.contenu .panel-selection */{
    background: transparent;
    padding: 0;
}
#page > div.contenu figure img {
	border: 0;
	margin-bottom: 0;
}
.page-selection-EN #page > div.contenu .panel-front.filtres-matiere{
	padding: 0;
    margin: 0;
    height: 0;
}

/* FIL D'ARIANE 2021 */
.page-Recherche-PAD .contenu main #ariane,
.page-notice-PAD .contenu main #ariane,
.home .contenu main #ariane {
    visibility: hidden;
    display: none;
}
.contenu main #ariane {
    visibility: visible;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    position: absolute;
    z-index: 1;
}
#ariane * {
  line-height: 1;
}
@media (max-width:767px){
    .listing #ariane .container {
        margin-top: 2.5rem;
        text-align: center;
    }
    .listing #page > div.contenu #portal .frame.hero .hero {
      padding-top: 8rem;
    }
}
.contenu main #ariane span,
.contenu main #ariane a:hover,
.contenu main #ariane a:focus{
	background: transparent;
    color:#eee;
    font-size: 11px;
	color: #fff;
    opacity: .9;
}
.contenu main #ariane a:hover,
.contenu main #ariane a:focus {
	text-decoration: underline;
}
.dossier-oe-modele.chant-travail-home .contenu main #ariane span,
.dossier-oe-modele.litte-orale-home .contenu main #ariane span,
.dossier-oe-modele.chant-travail-home .contenu main #ariane span,
.dossier-oe-modele.home-selectionEN .contenu main #ariane span,
.dossier-oe-modele.home-selectionEN .contenu main #ariane a:hover,
.dossier-oe-modele.home-selectionEN .contenu main #ariane a:focus{
	color: #fff;
}
.dossier-oe-modele .contenu main #ariane span,
.dossier-oe-modele .contenu main #ariane a:hover,
.dossier-oe-modele .contenu main #ariane a:focus {
	color: #001b3b;
}

/* ZONE TITRE HERO */
body.page-2021 .frame.hero {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,27,59,0.4)), color-stop(99%, #001b3b));
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
body.page-2021 #page > .contenu .frame.hero .panel-front {
	padding: 3rem 0 166px;
	margin: 0 auto -120px;
}
body.page-2021 #page > .contenu .frame.hero .panel-front .heroTexte * {
	color: #fff;
}
.page-2021 #page .hero .typeDoc,
.page-2021 #page .hero .typeDoc *{
    font-weight: bold;
    font-size: 14px !important;
    text-transform: none !important;
    font-family: 'Source Sans Pro', SourceSansPro !important;
	color:#fff;
}
.page-2021 #page .hero .typeDoc::after {
	content: '';
	height: 1px;
	width: 40px;
	display: block;
	margin: 0px auto;
	margin-top: 0px;
	background-color: #fff;
	margin-top: 10px;
}

/* ZONE PAGE - GESTION DES MARGES EXTERIEURES */
.page-2021 #page > div.contenu .panel-front {
    background: transparent;
    margin-right: auto;
    margin-left: auto;
}

/* ZONE CONTENU - GESTION DES COLONNES */
.page-2021-2colonnes #zone-4,
.page-2021-2colonnes #zone-5,
.page-2021-2colonnes #zone-6{
	background: #fff;
	padding: 0;
	margin-bottom: 2rem;
	min-height: 0!important;
}
/* MODELE DE PAGE "2021 - 2 colonnes" */
.page-2021-2colonnes #zone-4 [id^="frame-"] .frame,
.page-2021-2colonnes #zone-5 [id^="frame-"] .frame{
	padding:1rem;
}
.page-2021-2colonnes #zone-4 [id^="frame-"] .frame{
	padding:1rem 2rem;
}
.page-2021 #zone-4 [id^="frame-"] .frame.sommaire{
	margin:0 0 1rem;
	padding: 0;
}
.page-2021 #zone-4 [id^="frame-"] .panel-front,
.page-2021 #zone-5 [id^="frame-"] .panel-front{
	padding: 0;
}
.page-2021-2colonnes #zone-5{
	border-radius: 1rem;
}
@media(min-width:992px) {
	.page-2021-2colonnes #zone-4.col-md-9 {
		width: calc(75% - 1rem);
		margin-right: 1rem;
	}
	.page-2021-2colonnes #zone-4.col-md-8 {
		width: calc(66.66666666666666% - 1rem);
		margin-right: 1rem;
	}
}

/* ***** ************** ***** */
/* ***** PAGE BAC V2021 ***** */
/* ***** ************** ***** */
.icon-resize-small::before {
	content: "";
	display: none;
}
.page-2021[class*="bac20"] .frame.hero {
	background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,27,59,0.4)), color-stop(99%, #001b3b));
	background: -webkit-gradient(linear, left top, left bottom, from(rgba(0,27,59,0.4)), color-stop(99%, #001b3b)),url(https://edutheque.philharmoniedeparis.fr/ui/skins/CIMU/images/photos-illus/clavier-ecouteurs-partition.jpg);
	background: -o-linear-gradient(top, rgba(0,27,59,0.4) 0%, #001b3b 99%),url(https://edutheque.philharmoniedeparis.fr/ui/skins/CIMU/images/photos-illus/clavier-ecouteurs-partition.jpg);
	background: linear-gradient(to bottom, rgba(0,27,59,0.4) 0%, #001b3b 99%),url(https://edutheque.philharmoniedeparis.fr/ui/skins/CIMU/images/photos-illus/clavier-ecouteurs-partition.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

@media (max-width:767px){
    body.page-2021 #page h3, body.page-2021 #page h3 * {
        font-size: 1.375rem;
    }
	summary {
		padding: 2rem 0;
	}
    details summary .icon.icon-right {
        width: 2rem;
        height: 2rem;
        min-width: 2rem;
    }
}
/* LISTE HORIZONTALE : vignette à gauche texte à droite */
.list-horiz-item {
	list-style-type: none;
	margin-bottom: .5rem;
	border-radius: 1rem;
}
.list-horiz-item a {
	display: flex;
}
[class*="bac20"] .list-horiz-item a {
	margin-left: 2rem;
}
.list-horiz-item figure {
	position: relative;
  height: 120px;
  width: 150px;
  border-radius: 1rem;
  overflow: hidden;
  display: flex;
  min-width: 150px;
  max-width: 150px;
}
.list-horiz-item .lien-externe figure:before {
	content:"";
	display: block;
	position: absolute;
	left:1rem;
	bottom: 1rem;
	line-height: 1;
	width: 2rem;
	height: 2rem;
	box-sizing: border-box;
	background-image: url(/ui/skins/CIMU/images/icon-external-link-pastille.svg);
	background-size: contain;
}
@media screen and (max-width:767px){
	.list-horiz-item .lien-externe figure:before {
		content: "";
		display: block;
		position: absolute;
		left: .5rem;
		bottom: .5rem;
		line-height: 1;
		width: 1.5rem;
		height: 1.5rem;
		box-sizing: border-box;
		background-image: url(/ui/skins/CIMU/images/icon-external-link-pastille.svg);
		background-size: contain;
	}
}
.list-horiz-item img {
  object-fit: cover;
  width: 150px;
  min-width: 150px;
  max-width: 150px;
}
[class*="bac20"] .list-horiz-item figure {
  height: 100px;
  width: 100px;
  border-radius: 1rem;
  overflow: hidden;
  display: flex;
  min-width: 100px;
  max-width: 100px;
}
[class*="bac20"] .list-horiz-item img {
  object-fit: cover;
  width: 100px;
  min-width: 100px;
  max-width: 100px;
}
.list-horiz-item a:hover .list-horiz-text {
  background:#f4f5f6;
}
.list-horiz-text {
  	padding: .5rem;
	margin-left: 1rem;
	border-radius: 1rem;
}
[class*="bac20"] .list-horiz-text {
  	
}
.list-horiz-text * {
  margin:0 0 .5rem;
}
.list-horiz-text p {
	font-family: 'Source Sans Pro', SourceSansPro, sans-serif;
}
.list-horiz-item a:hover,
.list-horiz-item a:hover p,
.list-horiz-item a:focus p{
	text-decoration: none;
}
.list-horiz-text p.docType {
	font-size: .825rem;
	font-weight: 500;
}
.list-horiz-text p.docType:after {
	content:"";
	width: 2rem;
	height: 1px;
	display: block;
	background: #001b3b;
	margin-top: .35rem;
}
.list-horiz-text h3 {
	font-size: 1.125rem;
	text-transform: none;
	font-family: LinotypeBrewery-Bold, sans-serif;
}
.list-horiz-item a:hover h3,
.list-horiz-item a:hover h4{
	text-decoration: underline;
}
.lien-externe .list-horiz-text h3:after{
	content:"";
	display: inline-block;
	width: .875rem;
	height: .825rem;
	line-height:1;
	margin: 0 0 0 .25rem;
	background-image: url(/ui/skins/CIMU/images/icon-external-link.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	opacity:0;
}
.lien-externe:hover .list-horiz-text h3:after,
.lien-externe:focus .list-horiz-text h3:after{
	content:"";
	display: inline-block;
	width: .875rem;
	height: .825rem;
	line-height:1;
	margin: 0 0 0 .25rem;
	background-image: url(/ui/skins/CIMU/images/icon-external-link.svg);
	background-size: contain;
	background-position: center;
	background-repeat: no-repeat;
	opacity:1;
}
.list-horiz-text h4 {
	font-size: 1rem;
	text-transform: uppercase;
	font-family: 'Source Sans Pro', SourceSansPro, sans-serif;
}
@media (max-width:767px){
    .list-horiz-item a {
        display: flex;
        margin-left:0;
    }
    .list-horiz-item figure {
      height: 60px;
      width: 60px;
      border-radius: 1rem;
      overflow: hidden;
      display: flex;
      min-width: 60px;
      max-width: 60px;
    }
    .list-horiz-item img {
      object-fit: cover;
      width: 60px;
      min-width: 60px;
      max-width: 60px;
    }
    .list-horiz-text {
      	padding: .25rem;
		margin-left: .5rem;
    }
	.lien-externe .list-horiz-text h3:after{
		content:"";
		display: inline-block;
		width: .825rem;
		height: .825rem;
		line-height:1;
		margin: 0 0 0 .25rem;
		background-image: url(/ui/skins/CIMU/images/icon-external-link.svg);
		background-size: contain;
		opacity:1;
	}
    .list-horiz-text h4 {
        font-size: .875rem;
        text-transform: uppercase;
    }
    .list-horiz-text p {
        font-size: .825rem;
    }

}

/* REBONDS SIDEBAR */
.page-2021.bac2021 #zone-5 a:not(.btn),
.page-2021 a.ext-link:not(.btn), .page-2021 a.ext-link--pad:not(.btn), .page-2021 a.ext-link--collecMusee:not(.btn), .page-2021 a.ext-link--catalogue:not(.btn)
{
    color: #1D5CFF;
    text-decoration: underline;
    line-height: 1.75;
}
.page-2021 a.ext-link:not(.btn):before, .page-2021 a.ext-link--pad:not(.btn)::before, .page-2021 a.ext-link--collecMusee:not(.btn)::before, .page-2021 a.ext-link--catalogue:not(.btn)::before {
    content:"";
    display: none;
}
.page-2021 a.ext-link:not(.btn):after, .page-2021 a.ext-link--pad:not(.btn)::after, .page-2021 a.ext-link--collecMusee:not(.btn)::after, .page-2021 a.ext-link--catalogue:not(.btn)::after {
    content: url(/ui/skins/MEDIA/images/icon-extlink-bleu.png);
    display: inline-block;
    margin-left: 1rem;
}

/*
a.ext-link:not(.btn)::before, a.ext-link--pad:not(.btn)::before, a.ext-link--collecMusee:not(.btn)::before, a.ext-link--catalogue:not(.btn)::before {
    content: url(/ui/skins/MEDIA/images/icon-extlink-bleu.png);
    display: inline-block;
    margin-right: 1rem;
}
*/


/* ********************************************** */
/* V2021 HEADER (logo, nom de site et navigation) */
/* ********************************************** */

/* ***************** */
/* ZONE TITRE + LOGO */
body.page-2021 #page .brand-conteneur {
    padding: 1.75rem 0;
}
body.page-2021 #page .brand-conteneur .logo {
    max-width: 250px;
}
body.page-2021 #page .brand-conteneur h1,
body.page-2021 #page .brand-conteneur h1 span {
    font-size: 2.5rem;
    text-transform: uppercase;
    color: #001B3B;
}
body.page-2021 #page .brand-conteneur h1 a {
    display: flex;
    justify-content: space-between;
    align-items:center;
    margin: 0 auto;
    text-indent: 0;
    max-width: 100%;
    width: 1070px;
}
body.page-2021 #page .brand-conteneur h1 a:hover,
body.page-2021 #page .brand-conteneur h1 a:focus {
    color: #001B3B;
    opacity: .75;
}

/* *************** */
/* MAIN MENU ERMES */
/* *************** */
@media (max-width:767px){
    .header-2021 #menu-panel {
        height: 0;
        -webkit-box-shadow: none;
                box-shadow: none;
/*	    position: relative;*/
    }
    .header-2021 #menu-panel .navbar-inverse {
        display: none;
    }
}
.header-2021 .navbar-collapse.bs-navbar-collapse.collapsing,
.header-2021 .navbar-collapse.bs-navbar-collapse.in {
	position: fixed;
	z-index: 99;
	background: #fff;
	width: 100%;
	height: calc(100% - 80px)!important;
	left: 0;
    top: 80px;
}
@media (min-width:768px){
    .header-2021 #menu-panel,
    .page-admin .header-2021 #menu-panel{
            position: static;
            -webkit-transition: top 0.35s ease-in-out;
            -o-transition: top 0.35s ease-in-out;
            transition: top 0.35s ease-in-out;
            background: #fff;
            border-top: 1px solid #dedede;
            border-bottom: 1px solid #dedede;
            width: 100%;
        }

    .header-2021 #menu-panel.menuCIMU__wrapper {
        -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between; -ms-flex-wrap: wrap; -o-flex-wrap: wrap; flex-wrap: wrap;
            /* background: #f3f2ee;*/
            padding: 0;
            margin-bottom: 0;
            /* pour search over nav : */
            /* position: relative;*/
    }
    .header-2021 #menu-panel.menuCIMU__wrapper.container:before,
    .header-2021 #menu-panel.menuCIMU__wrapper.container:after {
        display: none;
        visibility: hidden;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper .navbar-inverse{
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
    }
    .header-2021 .navbar-collapse.bs-navbar-collapse.collapsing,
    .header-2021 .navbar-collapse.bs-navbar-collapse.in {
        position: static;
    }
    #ermes_main_menu li.LEVEL1:first-child {
        border: medium none;
        flex: unset;
    }
}

@media (min-width:1200px){
    .header-2021 #menu-panel.menuCIMU__wrapper.container {
/*
        width: 100%;
		max-width: 1600px;
*/
		margin: 0 auto;
    }
}

.header-2021 #menu-panel.menuCIMU__wrapper .container {
	width: 100%;
    margin: 0 auto;
}
.header-2021 #menu-panel.menuCIMU__wrapper #menu-panel {
	background: none;
	border: 0;
    margin:0;
	position: static;
    width: auto; 
}
.header-2021 #menu-panel.menuCIMU__wrapper #menu-panel .panel-body {
	background-color: transparent;
	margin-top: 0;
	padding: 0;
}
.header-2021 #ermes_main_menu {
	position: static;
}
.header-2021 #ermes_main_menu:before,
.header-2021 #ermes_main_menu:after {
	display: none;
}
.nav .open > a, .nav .open > a:hover,
.nav .open > a:focus,
#ermes_main_menu li.LEVEL1 a:hover {
    background:transparent;
}
#ermes_main_menu li.LEVEL1 li.LEVEL2 a:hover {
    background: transparent;
    color: #ffffff;
}
/* masquer temporairement l'onglet connexion du menu */
/*
.header-2021 #ermes_main_menu li.LEVEL1:last-child,
#ermes_main_menu li.LEVEL1::last-child > a:hover {
	background-color: transparent;
}
.header-2021 #ermes_main_menu li.LEVEL1:last-child a:before{
    content: url("images/icon-loupe-bleu.svg");
}
*/
.header-2021 #ermes_main_menu .LEVEL1 span {
    font-size: 0.875em;
    color: #001B3B;
    font-family: LinotypeBrewery-Bold;
}
.header-2021 #ermes_main_menu .LEVEL1{
    margin-right: 0;
    margin: 0;
	background-color: transparent;
    text-align: center;
	border:0;
}
.header-2021 #ermes_main_menu li.LEVEL1 .caret {
    display: block; 
    margin-left: .5rem;
}
.header-2021 #ermes_main_menu li.LEVEL1 .caret, #ermes_main_menu li.LEVEL1 a:hover .caret {
	border-bottom-color: #001b3b;
	border-top-color: #001b3b;
}
.header-2021 #ermes_main_menu .LEVEL1 > a{
    -webkit--webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex; -moz--webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex; -ms--webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex; -o--webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex; -webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    text-align: center;
    justify-content: center;
    height: 100%;
}
.header-2021 #ermes_main_menu li.LEVEL2 > a {
	color: #001b3b;
	background: #e9e9e9;
}
.header-2021 #ermes_main_menu .LEVEL1 span{
    font-size: .875rem;
    color:#001b3b;
}

.header-2021 #ermes_main_menu .intitule-home{
	display: none;
}
@media (min-width:768px){
    .header-2021 #ermes_main_menu {
        position: static;
/*        height: 90px;*/
        -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        justify-content: space-between;
    }
/*
    .header-2021 #ermes_main_menu li.LEVEL1:last-child a span{
        display: none;
    }
*/
    #ermes_main_menu li.LEVEL1 > a {
        padding: 1rem;
    }
}
@media (min-width:768px) and (max-width:991px){
    .header-2021 .navbar-header h1 {
        width: 162px;
        min-width: 162px;
    }
    .header-2021 .navbar-header .sous-titre span {
	    font-size: 12px;
    }
    .header-2021 #ermes_main_menu .LEVEL1 > a {
        padding: .75rem;
    }
    .header-2021 #ermes_main_menu .LEVEL1 span {
        font-size: .825rem;
    }
}
@media (min-width:1201px){
    .header-2021 #ermes_main_menu .LEVEL1 span {
		font-size: 1rem;
	}
}


/* ajouts gestion des sous-menus 2021 */
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu {
    border: 0;
    border-top: 0;
    border-bottom: 1px solid #fff;
}
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu.LEVEL1{
    -webkit-box-shadow: 0 3px 8px rgba(0,0,0,.5);
            box-shadow: 0 3px 8px rgba(0,0,0,.5);
}
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1:last-of-type .dropdown-menu.LEVEL1,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1.open:last-of-type .dropdown-menu.LEVEL1{
    right: 0;
	left:unset;
}
/* .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu.LEVEL1.Type{
    right: 0;
	left:unset;
    width: 570px;
    height: 335px;
    -webkit-box-shadow: 0 3px 8px rgba(0,0,0,.5);
            box-shadow: 0 3px 8px rgba(0,0,0,.5);
} */
/* .header-2021 #menu-panel.menuCIMU__wrapper .open > .dropdown-menu.LEVEL1 {
    right: 0;
    left: unset;
 } */
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li {
    font-size: .875rem;
    background: #EBEDF0;
    border-bottom: 1px solid #fff;
}

.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li.LEVEL2.dropdown-submenu,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li.LEVEL3 {
	background: #F7F7F9;
    border-bottom: 0;
}

.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 a:visited,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2 a:visited {
	background: transparent;
}
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 a:active,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 a:hover,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 a:focus{
	background: transparent;
}
@media (min-width:768px){
	.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 > a:active,
	.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 > a:hover,
	.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 > a:focus{
		box-shadow: 0 -2px 0 0 #001b3b inset;
	}
}
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2 a:focus,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2 a:active,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2 a:hover,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2:focus,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2:active,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2:hover,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL3:focus,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL3:active,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL3:hover,
.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
	background: #fff;
}
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2.menuCIMU-item__fiches:focus,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2.menuCIMU-item__fiches:hover,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2.menuCIMU-item__fiches > a:focus,
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 li.LEVEL2.menuCIMU-item__fiches > a:hover{
    background: #F7F7F9;
}
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL2 span {
    font-size: 0.875rem;
    font-family: "SourceSansPro", "Arial", "Helvetica", sans-serif;
	text-transform: none;
    font-weight: 500;
}
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu span.detail {
	display: block;
	font-style: italic;
	font-weight: 400;
	font-size: .825rem;
}
.header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL3 span {
    padding-left: 1.25rem;
    line-height: 1;
    opacity: .7;
}
@supports (display:flex){
    .header-2021 #menu-panel.menuCIMU__wrapper .open > .dropdown-menu.LEVEL1 {
        -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
            -ms-flex-direction: column;
                flex-direction: column;
/*        max-height: 350px;*/
        -ms-flex-wrap: wrap-reverse; -o-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
    }
    @media (min-width:768px){
        .header-2021 #menu-panel.menuCIMU__wrapper .open > .dropdown-menu.LEVEL1 {
            -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex;
            -webkit-box-orient: vertical;
            -webkit-box-direction: normal;
                -ms-flex-direction: column;
                    flex-direction: column;
/*
            max-height: 350px;
            min-height: 336px;
*/
            -ms-flex-wrap: wrap-reverse; -o-flex-wrap: wrap-reverse; flex-wrap: wrap-reverse;
            -webkit-box-pack: justify;
                -ms-flex-pack: justify;
                    justify-content: space-between;
        }
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        -webkit-display: flex; -moz-display: flex; -o-display: flex; 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-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li a {
        padding: 1rem 2rem;
        background: transparent;
		text-align: left;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper .dropdown-menu.LEVEL2 {
        display: block;
        position: static;
    }
}
.header-2021 #ermes_main_menu li.LEVEL2 > a::after {
	content: "";
	display: none;
}
/* fin 1/2 ajouts gestion des sous-menus 2021 */

@media (max-width:767px){
    #nav-rich-menu, #ermes_main_menu {
        background-color: #fff;
        padding-top: 2rem;
        overflow-x: hidden;
    }
    .navbar-collapse.bs-navbar-collapse.collapsing,
    .navbar-collapse.bs-navbar-collapse.in {
        overflow:auto;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu.LEVEL1 {
        margin: 0;
        -webkit-box-shadow: none;
                box-shadow: none;
        width: 100%;
        max-width: 100%;
        height: auto;
        max-height: unset;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li {
        font-size: .875rem;
        /* background: #fff; */
        border-bottom: 1px solid #EBEDF0;
        max-width: 100%;
    }
/*
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li.LEVEL2:last-of-type {
        background: #fff;
        border-top: 1px solid #EBEDF0;
    }
*/
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li a{
        text-align: center;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1,
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1:first-child {
        margin: .5rem;
        margin-left: .5rem;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1 > a{
        padding: 1.5rem;
        border: solid 1px rgba(0,27,59,0.15);
        border-radius: .5rem;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1 > a,
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1 > a > span{
        font-size: 1rem;
        font-family: 'LinotypeBrewery-Bold';
        color: #001b3b;
        text-align: center;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1 > a > span{
        display: inline-block;
/*        margin: 0 auto;*/
        text-align: center;
        text-transform: uppercase;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1 > a > span.caret{
        margin: 0;
        border: 0;
        opacity: 1;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1 > a > span.caret:after{
        font-family: ermes-font-update;
        content: '\e85a';
        display: inline;
        position: absolute;
        -webkit-transform: rotate(0deg);
        -ms-transform: rotate(0deg);
        transform: rotate(0deg);
        vertical-align: top;
        right: .5rem;
        -webkit-transform-origin: center;
        -ms-transform-origin: center;
        transform-origin: center;
        -webkit-transition: -webkit-transform .15s ease-in-out, -webkit-transform .15s ease-in-out;
        transition: transform .15s ease-in-out, -webkit-transform .15s ease-in-out;
        font-size: 2rem;
        top: calc(50% - 10px);
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1.open > a > span.caret:after{
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu .LEVEL3 > a {
        padding: .75rem;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL3 span {
        padding-left: 0;
    }
/*
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1:last-child,
    #ermes_main_menu li.LEVEL1:last-child > a:hover {
        background: #b3d6fd;
        margin-top: 3rem;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1:last-child a span{
        display: block;
    }
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1:last-child > a > span{
        margin: 0 1.25rem;
    }

    .header-2021 #ermes_main_menu li.LEVEL1:last-child a::before {
        content: url("images/icon-loupe-dark.svg");
    }
*/
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li.LEVEL2.dropdown-submenu,
    .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .dropdown-menu li.LEVEL2:last-of-type {
        /* background: #fff; */
    }
}
@supports (display:flex){
    @media (max-width:767px){
        .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1 > a {
            -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex;
            -webkit-box-pack: center;
                -ms-flex-pack: center;
                    justify-content: center;
        }
/*
        .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu li.LEVEL1:nth-child(4) a span {
            margin: 0;
        }
        .header-2021 #ermes_main_menu li.LEVEL1:nth-child(4) a::before {
            content: url("images/icon-loupe.svg");
            display: inline;
            position: static;
            margin-right: 2rem;
        }
*/
    }
}
/* fin 2/2 ajouts gestion des sous-menus 2021 */

/* old // gestion des sous-menus façon "megamenu" */
/*
@media (min-width:768px){
    @supports (display:flex){
        .header-2021 #menu-panel.menuCIMU__wrapper #ermes_main_menu .LEVEL1.display-type-0.open .dropdown-menu.LEVEL1 {
            -webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex;
            flex-direction: column;
            -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; -o-flex-wrap: wrap; flex-wrap: wrap;
            height: 348px;
            left: unset;
            right: 0;
            width: 500px;
            box-sizing: border-box;
            justify-content: space-evenly;
            overflow: hidden;
            align-items: stretch;
            background: #EBEDF0;
        }

        .nav-MAIN-edtq #ermes_main_menu .LEVEL2.dropdown-submenu.open, .LEVEL2.dropdown-submenu {
            flex: 1;
            position: static;
            padding: 1.75rem 0;
            background: antiquewhite;
            box-sizing: border-box;
            display: block;
        }
        .nav-MAIN-edtq #ermes_main_menu .LEVEL2.dropdown-submenu:first-of-type {
            height: 120px;
        }
        .nav-MAIN-edtq #ermes_main_menu .LEVEL2.dropdown-submenu:nth-of-type(2) {
            height: 290px;
        }
        .nav-MAIN-edtq #ermes_main_menu .dropdown-menu.LEVEL2 {
            position: static;
            display: block !important;
        }
        .nav-MAIN-edtq #ermes_main_menu .LEVEL3.display-type-0 {
            max-width: 160px;
        }
        .nav-MAIN-edtq #ermes_main_menu .dropdown-menu.LEVEL1:after {
            display: block;
            content: " ";
            margin: 0;
            flex: 999 999 auto;
        }
    }
}
*/
/* déclencheur de la recherche depuis le menu MAIN d'ermes */
.header-2021 #ermes_main_menu .icon-loupe {
    display: inline-block;
    width: 16px;
    height:18px;
    background:url(images/icon-loupe-bleu.svg) no-repeat center;
    background-size: contain;
    vertical-align: sub;
}
.header-2021 #ermes_main_menu .nav-Main--item-Search {
/*    display: none;*/
}







/* ******************************************** */
/* PAGES résultats de recherche */
/* ******************************************** */
#page > div.contenu .mobile-navigation {
    background-color: #001b3b;
    margin-top: 2rem;
    display: none!important;
}
#page > div.contenu .mobile-navigation > .btn-group,
#page > div.contenu .mobile-navigation .btn {
    color: white;
    background-color: #001b3b;
}

/* intitulé de la recherche + facettes sélectionnées */

#page > .contenu #resultsContainer #criteres_recherche {
    padding-left: 0;
    padding-right: 0;
    float: none!important;
    clear: both;
    margin: 0;
}

#page > .contenu #resultsContainer #criteres_recherche>p:first-of-type {
    display: none
}

#page > .contenu #resultsContainer #criteres_recherche>ul>li:first-of-type {
    display: block;
    width: 100%;
    background-color: #001b3b;
/*
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0,27,59,0.4)), color-stop(99%, #001b3b));
    background: linear-gradient(to bottom, rgba(0,27,59,0.4) 0%, #001b3b 99%);
*/
    border: 0;
    padding: .25rem;
    margin-bottom: .75rem;
    text-align: center;
    color: #fff;
}

#page > .contenu #resultsContainer #criteres_recherche>ul>li:first-of-type a {
    opacity: 1;
    padding-top: 0;
    max-width: 100%;
    overflow: hidden;
    white-space: unset;
    border: 0;
    background: transparent;
}

#page > .contenu #resultsContainer #criteres_recherche > ul > li:first-of-type a span {
	font-family: LinotypeBrewery-bold, sans-serif;
	text-transform: uppercase;
	font-weight: normal;
	font-size: 2rem;
	text-transform: none;
	color: #fff;
}

#page > .contenu #resultsContainer #resultats_recherche .search-icon-container .search-icon-container--icon {
	color: #ffffff75;
}
#page > .contenu #resultsContainer #criteres_recherche>ul>li:nth-of-type(2) {
/*    margin-left: 20px;*/
}

#page > .contenu #resultsContainer #criteres_recherche>ul>li:nth-of-type(n+2) {
    display: inline-block;
    border: 0;
    margin-top: .25rem;
    margin-right: .325rem
}

#page > .contenu #resultsContainer #criteres_recherche>ul>li:nth-of-type(n+2) button.removeFacetFilter {
    background-color: #fff;
    padding: 0 .5rem;
    border: 1px solid #ccc!important;
    border-radius: 1rem;
}

#page > .contenu #resultsContainer #criteres_recherche>ul>li:nth-of-type(n+2) button.removeFacetFilter span {
    font-size: .825rem
}

#page > .contenu #resultsContainer #criteres_recherche>ul>li:nth-of-type(n+2) button.removeFacetFilter span.icon-remove {
    font-size: 1rem;
    margin-left: 1rem
}
/* *********************************************** */
/* navigation résultats + critères tri/affichage : */

.page-Recherche-PAD #page > .contenu #criteres_recherche p, .page-Recherche-PAD #page > .contenu #description_resultats, .page-Recherche-PAD #page > .contenu .taille_page {
    padding: .5rem 0;
    margin:0 1rem 0 0;
}
.page-Recherche-PAD #page > .contenu .navigation-page,
.page-Recherche-PAD #page > .contenu .criteres_tri {
    position: static;
	display: inline-block!important;
    padding: 0 .5rem;
    margin: 0;
}
.page-Recherche-PAD #page > .contenu .navigation-page .pagination-container.col-md-7{
	width: auto;
}
.page-Recherche-PAD #page > .contenu .pagination{
	border-bottom: 0;
	border-radius: 0;
}

#page > .contenu #resultsContainer #documents_memorises .navigation-page #description_resultats span,
#page > .contenu #resultsContainer #resultats_recherche .navigation-page #description_resultats span {
    font-weight: 500;
    font-size: .875rem;
    text-transform: uppercase
}
#page > .contenu #resultsContainer .pagination button.btn-link-like {
    padding: .5rem;
    color: #001b3b;
    font-size: 12px;
    border:0;
}
#page > .contenu #resultsContainer .pagination > li:first-of-type button.btn-link-like,
#page > .contenu #resultsContainer .pagination button.btn-link-like.suivant {
    padding: 0;
    font-size: 2rem;
    line-height: 1;
}
#page > .contenu #resultsContainer .pagination button.btn-link-like:hover,
#page > .contenu #resultsContainer .pagination button.btn-link-like:focus,
#page > .contenu #resultsContainer .pagination button.btn-link-like:focus-within {
    background: rgba(0, 0, 0, 0.5);
    background: transparent;
    -webkit-box-shadow: 0 4px 0 #001b3b;
            box-shadow: 0 4px 0 #001b3b;
}
#page > .contenu #resultsContainer .pagination button.btn-link-like span{
    border-bottom: 0;
}
#page > .contenu #resultsContainer .pagination li{
    vertical-align: middle;
}
#page > .contenu #resultsContainer .pagination > .disabled button.btn-link-like:hover,
#page > .contenu #resultsContainer .pagination > .disabled button.btn-link-like:focus,
#page > .contenu #resultsContainer .pagination > .disabled button.btn-link-like:focus-within {
    -webkit-box-shadow: none;
            box-shadow: none;
}
.pagination > .disabled > span, .pagination > .disabled > span:hover, .pagination > .disabled > span:focus, .pagination > .disabled > a, .pagination > .disabled > a:hover, .pagination > .disabled > a:focus, #page > .contenu #resultsContainer .pagination li.disabled, .pagination > li.disabled > button.btn-link-like {
	color: inherit;
	cursor: default;
	background-color: transparent;
	border:0;
    opacity: .8;
    -webkit-box-shadow: none;
            box-shadow: none;
}

#page > .contenu #resultsContainer .pagination > .active > a,
#page > .contenu #resultsContainer .pagination > .active > span,
#page > .contenu #resultsContainer .pagination > .active > a:hover,
#page > .contenu #resultsContainer .pagination > .active > span:hover,
#page > .contenu #resultsContainer .pagination > .active > a:focus,
#page > .contenu #resultsContainer .pagination > .active > span:focus {
    border-bottom: 0;
    color: #001b3b;
    font-size: 12px;
    padding: 0;
}
#page > .contenu #resultsContainer .pagination > .active > a:hover,
#page > .contenu #resultsContainer .pagination > .active > span:hover,
#page > .contenu #resultsContainer .pagination > .active > a:focus,
#page > .contenu #resultsContainer .pagination > .active > span:focus {
    background: rgba(0, 0, 0, 0.5);
     background: transparent;
    -webkit-box-shadow: 0 4px 0 #001b3b;
            box-shadow: 0 4px 0 #001b3b;
}
#page > .contenu #resultsContainer .pagination > .active > span,
#page > .contenu #resultsContainer .pagination > .active > span:hover,
#page > .contenu #resultsContainer .pagination > .active > span:focus {
    border-bottom: 0;
    color: #001b3b;
    font-size: 12px;
    padding: .5rem;
    background: rgba(0, 0, 0, 0.5);
    background: transparent;
    -webkit-box-shadow: 0 4px 0 #001b3b;
            box-shadow: 0 4px 0 #001b3b;
}

/*
#page > .contenu #resultsContainer #documents_memorises .navigation-page #description_resultats span.additional-infos,
#page > .contenu #resultsContainer #resultats_recherche .navigation-page #description_resultats span.additional-infos {
    display: inline-block;
    position: relative
}

#page > .contenu #resultsContainer #documents_memorises .navigation-page #description_resultats span.additional-infos::before,
#page > .contenu #resultsContainer #resultats_recherche .navigation-page #description_resultats span.additional-infos::before {
    content: "(";
    width: 1rem;
    display: inline-block;
    position: absolute;
    z-index: 22;
    background-color: #fff;
    text-align: right;
    left: -8px
}

#page > .contenu #resultsContainer #documents_memorises .navigation-page #description_resultats span.additional-infos::after,
#page > .contenu #resultsContainer #resultats_recherche .navigation-page #description_resultats span.additional-infos::after {
    content: ")"
}

#page > .contenu #resultsContainer #documents_memorises .navigation-page #description_resultats>span span:not(.additional-infos),
#page > .contenu #resultsContainer #resultats_recherche .navigation-page #description_resultats>span span:not(.additional-infos) {
    display: none
}


#page > .contenu #resultsContainer #documents_memorises .panel-search-container>.panel-body>#resultats+div.navigation .navigation-page #description_resultats>span span:not(.additional-infos),
#page > .contenu #resultsContainer #resultats_recherche .panel-search-container>.panel-body>#resultats+div.navigation .navigation-page #description_resultats>span span:not(.additional-infos) {
    display: inline-block;
    font-weight: 700
}
*/
#page > .contenu #resultsContainer .navigation .criteres_tri {
    display: -webkit-box;
    display: -ms-flexbox;
    -webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    padding-right: 2.5rem;
    float: none!important;
    clear: both;
    min-height: 30px;
    -webkit-box-flex: 4;
    -ms-flex: 4;
    flex: 4
}
#page > .contenu #resultsContainer .navigation .icon-arrow-bottom::before {
	line-height: 1;
}

#page > .contenu #resultsContainer .navigation .criteres_tri:before {
    float: none!important;
    clear: both
}
#page > .contenu #resultsContainer .criteres_tri .displaymode-icon-container {
	margin-left: 1rem;
	margin-top: 0;
}
#page > .contenu #resultsContainer .select-all {
	display: none!important;
}
/* ajout bouton pour faire apparaitre les facettes sur mobile :*/
.navigation .criteres_tri .filterAside {
    display: inline-block;
    float: right;
}
#page > .contenu #resultsContainer .navigation .criteres_tri .filterAside {
    display: inline-block;
    float: right;
    padding: 0 .5rem 0 1rem;
}
#page > .contenu #resultsContainer .navigation .criteres_tri .filterAside .icon-filter:before {
	content: '\e81f';
	display: inline-block;
	font-family: 'ermes-font-base';
	font-style: normal;
	font-weight: normal;
	min-width: 1rem;
	font-size: 1rem;
	content: '\e81f';
	color: #001b3b;
	vertical-align: sub;
	margin-top: -2px;
}
@media (min-width:768px){
    #page > .contenu #resultsContainer .navigation.hidden-xs .criteres_tri {
        display: none!important;
    }
}
@media (min-width:992px){
    .page-Recherche-PAD #page > .contenu .navigation{
        -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex;
        margin: 1.75rem 0 2.5rem;
    }
    .page-Recherche-PAD #page > .contenu .pagination{
/*        border-bottom: 1px solid #001b3b;*/
    }
    #page > .contenu #resultsContainer .navigation .criteres_tri .searchList-btn>button {
        background-color: transparent;
        border: 1px solid #001b3b;
        border-radius: 1rem;
        padding: 0 2rem 0 1rem;
    }
     #page > .contenu .criteres_tri .sort-order {
        background-color: transparent;
    }
    #page > .contenu #resultsContainer .navigation .criteres_tri {
        padding-right: 0;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
        display: flex !important;
    }
    #page > .contenu #resultsContainer .navigation .criteres_tri .filterAside {
        display: none;
    }
}

@media (max-width:991px) {
    #page > .contenu #resultsContainer #criteres_recherche>ul>li:first-of-type {
        padding: 2rem .25rem;
        margin-bottom: .25rem;
    }
    /* criteres recherche */
    .page-Recherche-PAD #page > .contenu #criteres_recherche p, .page-Recherche-PAD #page > .contenu #description_resultats, .page-Recherche-PAD #page > .contenu .taille_page {
        padding: .5rem 1.5rem;
        display: none; 
    }
    #page > .contenu #resultsContainer #criteres_recherche > ul {
        margin-bottom: 1rem;
    }
    #page > .contenu #resultsContainer #criteres_recherche > ul > li:nth-of-type(2) {
        margin-right: .325rem;
    }
    .page-Recherche-PAD #page > .contenu #criteres_recherche p, .page-Recherche-PAD #page > .contenu #description_resultats, .page-Recherche-PAD #page > .contenu .taille_page {
        font-weight: bold;
        padding: .5rem;
        color: #001b3b;
        text-transform: uppercase;
        display: none;
    }
    /*! navigation résultats : */
    #page > .contenu #resultsContainer .navigation{
        margin: 0;
        background: #001b3b;
        margin-bottom: 2.5rem;
    }
    #page > .contenu #resultsContainer .navigation > .navigation-page.hidden-sm.hidden-xs{
        display: block!important;
        padding: 0;
        margin: .5rem 0;
    }
    #page > .contenu #resultsContainer .navigation > .navigation-page .pagination-container,
    #page > .contenu #resultsContainer .navigation > .navigation-page .pagination{
        width: 100%;
    }
    .pagination > li:first-of-type {
        float: left;
    }
    .pagination > li:last-of-type {
        float: right;
    }
    #page > .contenu #resultsContainer .pagination button.btn-link-like {
        padding: .5rem;
        color: #fff;
        font-size: 12px;
        border:0;
    }
    #page > .contenu #resultsContainer .pagination > li:first-of-type button.btn-link-like,
    #page > .contenu #resultsContainer .pagination button.btn-link-like.suivant {
        padding: 0;
        font-size: 2rem;
        line-height: 1;
    }
    #page > .contenu #resultsContainer .pagination button.btn-link-like:hover,
    #page > .contenu #resultsContainer .pagination button.btn-link-like:focus,
    #page > .contenu #resultsContainer .pagination button.btn-link-like:focus-within {
/*        background: rgba(255, 255, 255, 0.5);*/
        -webkit-box-shadow: 0 -3px 0 #fff inset;
                box-shadow: 0 -3px 0 #fff inset;
    }
    #page > .contenu #resultsContainer .pagination button.btn-link-like span{
        border-bottom: 0;
    }
    #page > .contenu #resultsContainer .pagination li{
        vertical-align: middle;
    }
    #page > .contenu #resultsContainer .pagination > .active > a, #page > .contenu #resultsContainer .pagination > .active > span, #page > .contenu #resultsContainer .pagination > .active > a:hover, #page > .contenu #resultsContainer .pagination > .active > span:hover, #page > .contenu #resultsContainer .pagination > .active > a:focus, #page > .contenu #resultsContainer .pagination > .active > span:focus {
        border-bottom: 0;
        color: #fff;
        font-size: 12px;
        padding: 0;
    }
     #page > .contenu #resultsContainer .pagination > .active > a:hover, #page > .contenu #resultsContainer .pagination > .active > span:hover, #page > .contenu #resultsContainer .pagination > .active > a:focus, #page > .contenu #resultsContainer .pagination > .active > span:focus {
/*        background: rgba(255, 255, 255, 0.5);*/
         -webkit-box-shadow: 0 -3px 0 #fff inset;
                 box-shadow: 0 -3px 0 #fff inset;
    }
    #page > .contenu #resultsContainer .pagination > .active > span,
    #page > .contenu #resultsContainer .pagination > .active > span:hover,
    #page > .contenu #resultsContainer .pagination > .active > span:focus {
        border-bottom: 0;
        color: #fff;
        font-size: 12px;
        padding: .5rem;
/*        background: rgba(255, 255, 255, 0.5);*/
        -webkit-box-shadow: 0 -3px 0 #fff inset;
                box-shadow: 0 -3px 0 #fff inset;
    }
    
    /* criteres de tri */
    #page > .contenu #resultsContainer .navigation .criteres_tri {
        margin: 0;
        position: absolute;
        top: -2.5rem;
        right: .5rem;
        padding: 0;
    }
    #page > .contenu #resultsContainer .navigation .criteres_tri .sort-order {
        background-color: transparent;
        padding-left: 0;
        float: right!important;
    }
    #page > .contenu #resultsContainer .navigation .criteres_tri .sort-order .searchList-btn > button {
        background: transparent;
    }
    #page > .contenu #resultsContainer .navigation .criteres_tri .sort-order .searchList-btn span.labelSelect.sort {
        display: none;
    }
    .sort-order .icon-arrow-bottom {
        font-size: 1rem;
        position: absolute;
        top: 0;
    }
    #page > .contenu #resultsContainer .navigation .criteres_tri .sort-order .dropdown-toggle .icon-arrow-bottom::before {
        display: inline-block;
        font-family: 'ermes-font-base';
        font-style: normal;
        font-weight: normal;
        min-width: 1rem;
        font-size: 1rem;
        content: '\e81f';
        content:url(images/icon-sort.svg);
        color: #001b3b;
        vertical-align: middle;
    }
}
#page > .contenu #resultsContainer .navigation .criteres_tri .displaymode-icon-container .dropdown-menu,
#page > .contenu #resultsContainer .navigation .criteres_tri .sort-order .searchList-btn .dropdown-menu {
    left: unset;
    right: 0;
}
#page > .contenu #resultsContainer .navigation .criteres_tri .displaymode-icon-container .dropdown-menu li,
#page > .contenu #resultsContainer .navigation .criteres_tri .sort-order .searchList-btn .dropdown-menu li {
    background: #EBEDF0;
    color:#001b3b75;
    padding: 0;
    border-bottom: 1px solid #fff;
}
#page > .contenu #resultsContainer .navigation .criteres_tri .displaymode-icon-container .dropdown-menu li a,
#page > .contenu #resultsContainer .navigation .criteres_tri .sort-order .searchList-btn .dropdown-menu li a {
    padding: .5rem;
}
.dropdown-menu > li > a:hover, .dropdown-menu > li > a:focus {
	color: #001b3b;
	text-decoration: none;
	background-color: #fff;
}
.displaymode-icon-container .active, .siteRestriction-icon-container .active, .pageSize-container .active, .sort-order .active {
	background-color: #fff !important;
	color: #001b3b !important;
}
/* ************************************ */
/* RESULTATS RECHERCHE : ASIDE FACETTES */
.facetList.nav-pills.nav-stacked span {
	font-size: .875rem;
	line-height: 1;
}



/* ********************************** */
/* V2021 RESULTATS DE RECHERCHE */
/* ********************************** */

/* ************* */
/* NOTICE COURTE */
.page-Recherche-PAD #page > .contenu{
    background: #d4d9de;
}
/*.page-Recherche-PAD #page > .contenu #resultats_recherche,*/
#page > .contenu #resultsContainer #aside {
	background: #fff;
}

#page > .contenu #resultsContainer #aside .badge {
	color: #555;
}
#page > .contenu #resultsContainer #aside {
	border-radius: 1rem;
}
#page > .contenu #resultsContainer #resultats_recherche .panel-search-container .panel-heading,
#page > .contenu #resultsContainer #resultats_recherche .panel-search-container .panel-body {
	padding: 0;
    margin-top: 0;
}
#page > .contenu #resultsContainer #resultats_recherche .panel-search-container .panel-heading .search-icon-container {
	position: absolute;
	right: 1rem;
	top: 1rem;
}
#page > .contenu #resultsContainer #criteres_recherche > ul > li:nth-of-type(n+2) button.removeFacetFilter {
	background-color: #fff;
	padding: .125rem 1.5rem;
	border: 1px solid #ccc !important;
    border-radius: 1rem;
}
#page > .contenu #resultsContainer #criteres_recherche > ul > li:nth-of-type(n+2) button.removeFacetFilter span {
	font-size: .825rem;
	color: #001b3b;
}
#page > .contenu #resultsContainer #criteres_recherche p,
#page > .contenu #resultsContainer #description_resultats,
#page > .contenu #resultsContainer .taille_page {
	font-weight: bold;
    font-size: .875rem;
	padding: .5rem 1.5rem;
	color: #001b3b;
	text-transform: uppercase;
}
#page > .contenu #resultsContainer #resultats_recherche .navigation-page #description_resultats span.additional-infos {
	color: #001b3b;
    opacity: .75;
	font-weight: normal;
}

#page > .contenu #resultsContainer .panel-search-container,
#page > .contenu #resultsContainer .panel-search-container #resultats > ul > li,
#page > .contenu #resultsContainer .panel-search-container #resultats > ul > li.on,
#page > .contenu #resultsContainer #documents_memorises,
#page > .contenu #resultsContainer #documents_memorises #resultats > ul > li,
#page > .contenu #resultsContainer #documents_memorises #resultats > ul > li.on{
    background: transparent;
    border: 0;
}
#page > .contenu #resultsContainer #documents_memorises #resultats > ul > li,
#page > .contenu #resultsContainer #documents_memorises #resultats > ul > li.on {
	margin-bottom: 1rem;
}
.edutheque#page > .contenu #resultsContainer #documents_memorises .search-icon-container.mobile{
	display: none!important;
}
#page > .contenu #resultsContainer #documents_memorises,
#page > .contenu #resultsContainer #options_document,
#page > .contenu #resultsContainer #documents_memorises .panel-front,
#page > .contenu #resultsContainer #options_document .panel-front{
    padding: 0;
}
@media (min-width:992px){
    #page > .contenu #resultsContainer #documents_memorises,
    #page > .contenu #resultsContainer #options_document{
        padding: 0 1rem;
    }
}
#page > .contenu #resultsContainer #documents_memorises > .global_content > .panel-front > .panel-heading > h2,
#page > .contenu #resultsContainer #documents_memorises .intro {
	padding: 0;    
    text-align: center;
}
#page > .contenu #resultsContainer #documents_memorises .intro {
	font-family: LinotypeBrewery-regular, sans-serif;
    font-size: 1rem;
}
#page > .contenu #resultsContainer #aside #options_document h3,
#page > .contenu #resultsContainer #aside #options_document h3 span {
	font-family: LinotypeBrewery-regular, sans-serif;
    font-size: 1.25rem;
}
#page > .contenu #resultsContainer #aside #options_document .btn-info {
	background: transparent;
	border-color: #001b3b;
	color: #001b3b;
    border-radius: 1rem;
    padding: 0 1rem;
    margin: 0 .5rem .5rem 0;
}
#page > .contenu #resultsContainer #aside #options_document .remove-label {	
    padding: 0 .125rem;
}
#page > .contenu #resultsContainer #aside #options_document .vider_panier,	
#page > .contenu #resultsContainer #aside #options_document .btn-dark {
	background: #001b3b;
	border-color: #001b3b;
	color: #fff;
    border-radius: 1rem;
    padding: .25rem 1.5rem;
}
#page > .contenu #resultsContainer #aside #options_document #user_labels {
    margin-bottom: 2rem;
}
#page > .contenu #resultsContainer #aside #options_document #user_labels > .input-group {
    overflow: hidden;
    border-radius: 1rem;
}
#page > .contenu #resultsContainer #aside #options_document #user_labels > .input-group #addLabelField {
    border-radius: 1rem 0 0 1rem;
}
#page > .contenu #resultsContainer #aside #options_document #user_labels > .input-group #confirm_addLabel {
    background: #001b3b;
	border-color: #001b3b;
	color: #fff;
}
@media (max-width:991px){
    #page > .contenu #resultsContainer #resultats_recherche{
        background: transparent;
    }
    #page > .contenu #resultsContainer #criteres_recherche p,
    #page > .contenu #resultsContainer #description_resultats,
    #page > .contenu #resultsContainer .taille_page {
        display: none;
    }
    #page > .contenu #resultsContainer > main > .searchContainer #aside {
         width: 100%; 
    }
}

#page > .contenu #resultsContainer #resultats .notice_corps{
    width: 100%;
    position: relative;
    padding: 0;
}
#page > .contenu #resultsContainer #resultats .notice_corps .media-body{
    background:#fff;
    border-radius: 0;
    padding:1rem;
}
@media (min-width:768px){
    #page > .contenu #resultsContainer #resultats .notice_corps .media-body {
        padding-right: 2.5rem;
        border-radius: 1rem;
        background: rgb(244,244,244);
        background: -moz-linear-gradient(-90deg, rgba(244,244,244,1) 0%, rgba(244,244,244,1) 2.5rem, rgba(255,255,255,1) 2.5rem, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(-90deg, rgba(244,244,244,1) 0%, rgba(244,244,244,1) 2.5rem, rgba(255,255,255,1) 2.5rem, rgba(255,255,255,1) 100%);
        background: linear-gradient(-90deg, rgba(244,244,244,1) 0%, rgba(244,244,244,1) 2.5rem, rgba(255,255,255,1) 2.5rem, rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f4f4f4",endColorstr="#ffffff",GradientType=1);
        border: 1px solid #ddd;
    }
}

#page > div.contenu .media, #page > div.contenu .media .media {
    margin-top: 0;
    margin-bottom: 2rem;
}

#page > .contenu .notice_courte .notice_corps .media-body *{
    color:#001b3b;
}
#page > .contenu #resultsContainer #resultats .notice_corps .vignette_document {
	background: #fff;
	border-radius: 1rem;
	overflow: hidden;
}
#page > .contenu #resultsContainer #resultats .notice_corps .vignette_document img.ermes-thumb {
	width: 100px !important;
	height: auto !important;
}
#page > .contenu #resultsContainer #resultats .notice_corps .line {
	font-size: 12px;
    font-weight: 700;
    color:#001b3b;
    line-height: 1;
    margin-bottom: .5rem;
}
#page > .contenu #resultsContainer #resultats .notice_corps .line:after {
    line-height: 1;
}
#page > .contenu .notice_courte .notice_corps .cim-short-duree-type-doc,
#page > .contenu .rs-staticList .notice_corps .cim-short-duree-type-doc {
	position: absolute;
	top: .5rem;
	left: .5rem;
	font-size: 11px;
	color: #fff;
	background: rgba(0, 27, 59, 0.85);
	width: auto;
	padding: 0 .25rem;
}
#page > .contenu #resultsContainer #resultats .notice_corps h3 {
    font-size: 1rem;
    font-family: LinotypeBrewery-bold;
    margin-bottom: 10px;
}
#page > .contenu #resultsContainer #resultats .notice_corps .cim-short-genre {
    display: none;
}
#page > .contenu #resultsContainer #resultats .notice_corps .cim-short-genre.uni100 {
    display: block;
}
#page > .contenu #resultsContainer #resultats .notice_corps .template-resume {
    font-size: 1rem;
    font-family: LinotypeBrewery-regular;
    font-weight: normal;
    line-height: 1.25;
    opacity: .7;
    margin-bottom: 10px;
}
/* "fait partie de..." : il faut changer la classe template-resume en partOfDoc */
#page > .contenu #resultsContainer #resultats .notice_corps .template-resume + .template-resume,
#page > .contenu #resultsContainer #resultats .notice_corps .partOfDoc {
    font-family: "sourceSansPro", sans-serif;
    opacity: .7;
    font-size: .875rem;
    margin-bottom: 10px;
}
#page > .contenu #resultsContainer #resultats .notice_corps .template-info {
    font-size: .875rem;
    line-height: 1.5;
}
#page > .contenu #resultsContainer #resultats .notice_corps .media-body p.page-cms {
    display: none;
}

/* METADATA (panier etc) */
.anonyme #page > div.contenu #resultats .notice_courte .notice_metadata {
    display: none !important;
}
#page > div.contenu .notice-actions {
  padding: 0;
}
#page > div.contenu #resultats .notice_courte .notice_metadata {
    display: block !important;
    position: absolute;
    right: .25rem;
    top: 2.5rem;
    width: 2rem;
}
#page > div.contenu #resultats .notice_courte .notice_metadata *,
#page > div.contenu #resultats .notice_courte .notice_metadata :before{
  padding: 0;
  margin:0;
  font-size: 1rem;
  line-height: 1;
  background: transparent;
  border: 0;
  color: #001b3b;
}
#page > div.contenu #resultats .notice_courte .notice_metadata li{
	  margin-bottom: .5rem;
}
#page > div.contenu #resultats .notice_courte .notice_metadata .icon-basket:before {
    color:#0095DA;
}
#page > div.contenu #resultats .notice_courte .notice_metadata .icon-basket-empty:before {
    color:#001b3b;
}
#page > div.contenu #resultats .notice_courte .notice_metadata .btn-basket .caret {
	display: inline-block;
	width: 0;
	height: 0;
	margin-left: 2px;
	vertical-align: middle;
	border-top: 4px solid #001b3b;
	border-right: 4px solid transparent;
	border-bottom: 0 dotted;
	border-left: 4px solid transparent;
    vertical-align: top;
    opacity: 1;
}
#page > div.contenu #resultats .notice_courte .notice_metadata .memoriser .dropdown-menu {
	padding: .5rem;
	background: #fff;
	box-shadow: 0 3px 8px #ccc;
}
#page > div.contenu #resultats .notice_courte .notice_metadata .memoriser .dropdown-menu li {
	display: block;
}
#page > div.contenu #resultats .notice_courte .notice_metadata .memoriser .dropdown-menu .basket-label.btn-link-like {
	padding: .35rem;
    margin: .125rem;
	font-size: .825rem;
}
#page > div.contenu #resultats .notice_courte .notice_metadata .memoriser .dropdown-menu .basket-label.btn-link-like:hover,
#page > div.contenu #resultats .notice_courte .notice_metadata .memoriser .dropdown-menu .basket-label.btn-link-like:focus {
	background: #f4f4f4;
}
@media (max-width:767px){
    #page > .contenu #resultsContainer #resultats .notice_container {
        cursor: pointer;
         padding-bottom: 0; 
    }
    #page > .contenu #resultsContainer #resultats .notice_corps .media-body {
        padding-bottom: 2.5rem;
        background: rgb(244,244,244);
        background: -moz-linear-gradient(0deg, rgba(244,244,244,1) 0%, rgba(244,244,244,1) 2.5rem, rgba(255,255,255,1) 2.5rem, rgba(255,255,255,1) 100%);
        background: -webkit-linear-gradient(0deg, rgba(244,244,244,1) 0%, rgba(244,244,244,1) 2.5rem, rgba(255,255,255,1) 2.5rem, rgba(255,255,255,1) 100%);
        background: linear-gradient(0deg, rgba(244,244,244,1) 0%, rgba(244,244,244,1) 2.5rem, rgba(255,255,255,1) 2.5rem, rgba(255,255,255,1) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f4f4f4",endColorstr="#ffffff",GradientType=1);
    }
    #page > .contenu #resultsContainer #resultats .notice_corps .vignette_document {
        margin: .5rem;
    }
    #page > .contenu #resultsContainer #resultats .notice_corps .cim-short-duree-type-doc {
        top: .75rem;
        left: 1rem;
    }
}

@media (max-width:991px){
    #page > div.contenu #resultats .notice_courte .notice_metadata #dropBasketList {
        position: absolute;
    }
}
#page > div.contenu #resultats .notice_courte .notice_metadata ul.metadata-actions > li > a,
#page > div.contenu #resultats .notice_courte .notice_metadata ul.metadata-actions > li > button,
#page > div.contenu #resultats .notice_courte .notice_metadata .memoriser > button,
#page > div.contenu #resultats .notice_courte .notice_metadata .modify-selection {
    height: 1rem;
    width: 2rem;
    margin-bottom: .25rem;
}
/* ICON SELECTION COURANTE */
#page > div.contenu #resultats .select {
    background-color: transparent;
    height: 1.5rem;
    width: 1rem;
    position: absolute;
    right: .75rem;
    top: .75rem;
}
#page > div.contenu #resultats .select input[type="checkbox"],
#page > div.contenu .ajouter_selection input[type="checkbox"] {
    float: none;
    height: 1rem;
    width: 1rem;
    margin: 0;
    position: relative;
    border-color: #fff;
    vertical-align: middle;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}
#page > div.contenu #resultats .select .ermes-label {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    width: 1rem;
    height: 1.5rem;
    border-radius: 1rem;
    box-sizing: border-box;
    overflow: hidden;
    font-size: .0001rem;
    background: transparent;
    color: transparent;
    z-index: 1;
}
#page > div.contenu #resultats .select .ermes-label span {
    opacity: 0;
}
#page > div.contenu #resultats .select .ermes-label:after {
    position: absolute;
    left: calc(50% - 14px / 2);
    top: calc(50% - 12px / 2);
    content: "";
    background: url(images/icon-playlist-add.svg) no-repeat center;
    width: 1rem;
    height: 1rem;
    cursor: pointer;
    background-size: contain;
}
#page > div.contenu #resultats .select input:checked + .ermes-label:after {
    position: absolute;
    left: calc(50% - 14px / 2);
    top: calc(50% - 12px / 2);
    content: "";
    background: url(images/icon-playlist-added.svg) no-repeat center;
    width: 1rem;
    height: 1rem;
    cursor: pointer;
    background-size: contain;
}


@media (max-width:767px){
    #page > .contenu #resultsContainer .panel-search-container, #page > .contenu #resultsContainer .panel-search-container #resultats > ul > li, #page > .contenu #resultsContainer .panel-search-container #resultats > ul > li.on {
        margin-bottom: 1.5rem;
    }
    #page > .contenu #resultsContainer #resultats .notice_corps {
        margin: 0;
    }
    #page > div.contenu #resultats .notice_courte .notice_metadata {
        width: auto;
        height: 2.5rem;
        margin: 0 0 0 1.5rem;
        background: #f4f4f4;
        padding: .5rem;
        bottom: 0;
        left: 0;
        top: unset;
    }
    #page > div.contenu #notice_longue .metadata-actions li,
    #page > div.contenu #document_actions .metadata-actions li,
    #page > div.contenu #resultats ul.metadata-actions li {
        display: inline-block;
    }
    #page > div.contenu #resultats .select.hidden-xs {
        background-color: transparent;
        height: 2.5rem;
        width: 2rem;
        position: absolute;
        left: 0;
        bottom: 0;
        top: unset;
        background: #f4f4f4;
        display: block !important;
    }
    
    #page > div.contenu #resultats .select input[type="checkbox"], #page > div.contenu .ajouter_selection input[type="checkbox"] {
        height: 100%;
        width: 100%;
        margin: 0;
        border-color: transparent;
    }
    #page > div.contenu #resultats .select .ermes-label {
        position: absolute;
        left: .5rem;
        top: .5rem;
        right: .5rem;
        bottom: .5rem;
        width: 1rem;
        height: 1.5rem;
        border-radius: 0;
        margin: 0;
    }
    #page > div.contenu #multi_selection_simple, #multi_selection {
        display: block!important;
    }
}
/*
#page > div.contenu #panel-selection-detail.sel_reduced {
	width: 2rem;
	height: 2rem;
	overflow: hidden;
    border: 1px solid #001b3b;
	background: #b3d6fd;
	 opacity:1; 
	border-radius: 50%;
	margin: 0;
	padding: 0;
}
*/
#multi_selection_simple, #multi_selection {
	bottom: 20px;
	right: 20px;
}
#page > div.contenu #panel-selection-detail.sel_reduced {
	width: 50px;
	height: 50px;
	overflow: hidden;
	background: rgba(0, 27, 59, 0.6);
	opacity: 1;
	border-radius: 50%;
	margin: 0;
	padding: 0;
}
#page > div.contenu #panel-selection-detail.sel_reduced:hover,
#page > div.contenu #panel-selection-detail.sel_reduced:focus {
	background: rgba(0, 27, 59, 0.85);
}
#page > div.contenu #panel-selection-detail.sel_reduced * {
    margin: 0 !important;
    padding: 0;
    height: 100%;
    width: 100%;
    text-align: center;
    background:transparent;
}
#page > div.contenu #panel-selection-detail.sel_reduced button {
    color:transparent;
    font-size: 0.0001rem;
}
#page > div.contenu #panel-selection-detail.sel_reduced button:before {
	content: "";
	background: url(images/icon-playlist-see-blanc.svg) no-repeat center;
	width: 1.25rem;
	height: 1.25rem;
    margin: 0;
	cursor: pointer;
	background-size: contain;
}


/* *********************************************************************** */
/* *********************************************************************** */
/* *************** MENU CIMU (refonte du menu ermes) ********************* */
/* *********************************************************************** */
/* *********************************************************************** */

.header-edutheque #ermes_main_menu li.LEVEL1:last-child a::before {
	display: none!important;
}
.menuCIMU-item span.caret {
	opacity: 1;
}
.menuCIMU-item__fiches > a:hover {
	cursor: default;
}
.menuCIMU-item i.icon {
	margin-right: 1.5rem;
    font-style: normal!important;
}
.menuCIMU-item i.icon,
.menuCIMU-item.display-type-TEXTE > a > i.icon {
	display: none;
}
.menuCIMU-item.display-type-ICON_TEXTE > a > i.icon,
.menuCIMU-item.display-type-ICON > a > i.icon {
	display: inline-block;
}
.menuCIMU-item.display-type-ICON > a > span {
	display: none;
}
@media (max-width:767px){
    .menuCIMU-item.display-type-ICON > a > span {
	    display: inline-block;
    }
    .nav-MAIN-edtq #ermes_main_menu .LEVEL1:last-child > a > span {
        margin: 0;
    }
}
.menuCIMU-item .glyphicon:before {
	color: #001b3b;
	font-size: 1rem;
	display: inline-block;
	vertical-align: text-top;
}
@media (min-width:768px){
    .menuCIMU-item.display-type-ICON i.icon {
        margin-right: 0;
    }
    .menuCIMU-item.menuCIMU-item__search .glyphicon:before {
        color: #0095da;
    }
}


/*

.menuCIMU-item i.icon {
	margin-right: 1.5rem;
}
.menuCIMU-item i.icon,
.menuCIMU-item.display-type-TEXTE > a > i.icon {
	display: none;
}
.menuCIMU-item.display-type-ICON_TEXTE > a > i.icon,
.menuCIMU-item.display-type-ICON > a > i.icon {
	display: inline-block;
}
.menuCIMU-item.display-type-ICON > a > span {
	display: none;
}
@media (max-width:767px){
    .menuCIMU-item.display-type-ICON > a > span {
	    display: inline-block;
    }
}
.menuCIMU-item .glyphicon:before {
	color: #001b3b;
	font-size: 1rem;
	display: inline-block;
	vertical-align: text-top;
}
@media (min-width:768px){
    .menuCIMU-item.menuCIMU-item--search .glyphicon:before {
        color: #0095da;
    }
}

*/



/* ********************************************************************** */
/* ************************* MOSAIQUE 2021 ****************************** */
/* ********************************************************************** */

/* Mosaïque */

.page-2021 .mosaique {
	margin: 0;
}


.page-2021 .mosaique ul {
	padding: 0 !important;
	-webkit-display: flex;
	-moz-display: flex;
	-o-display: flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	-ms-flex-wrap: wrap;
	-o-flex-wrap: wrap;
	flex-wrap: wrap;
	max-width: 100%;
}

.page-2021 .mosaique li {
	-webkit-display: flex;
	-moz-display: flex;
	-o-display: flex;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin: 1rem;
	/* width: 220px; */
	/* -webkit-box-flex: 1; */
	-ms-flex: 1 20%;
	 flex: 1 20%; 
	/* flex: auto; */
	width: auto;
	/* min-width: 230px; */
}

.page-2021 .mosaique img {
	width: 100%;
	height: 220px;
	-o-object-fit: cover;
	object-fit: cover;
}

.page-2021 .mosaique .double {
	 flex: 1 40%;
	 /* min-width: 40%; */
}

.page-2021 .mosaique .prochainementDispo {
	display: none;
}

.page-2021 .mosaique .positionTop img {
	-o-object-position: top;
	   object-position: top;
}

.page-2021 .mosaique .positionBottom img {
	-o-object-position: bottom;
	   object-position: bottom;
}


/* 
@media only screen and (max-width: 767px) {
	.page-2021 .mosaique li {
	-webkit-box-flex: 1;
		-ms-flex: 1 30%;
			flex: 1 30%;
	}

	.page-2021 .mosaique .double {
	-webkit-box-flex: 1;
		-ms-flex: 1 60%;
			flex: 1 60%;
	}
}

@media only screen and (max-width: 421px) {
	.page-2021 .mosaique li {
	-webkit-box-flex: 1;
		-ms-flex: 1 50%;
			flex: 1 50%;
	}

	.page-2021 .mosaique .double {
	-webkit-box-flex: 1;
		-ms-flex: 1 50%;
			flex: 1 50%;
	}
} */



/* Survol Vignettes */

.page-2021 .mosaique li {
	position: relative;
	overflow: hidden;
	border-radius: .5rem;
	box-shadow: 0 3px 8px #ccc;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	height: 285px;
}
.incontournables2021.page-2021 .mosaique li {
	height: 350px;
}

.page-2021 .mosaique a {
	background-color: rgba(255, 255, 255, 0.9);
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 10px 0;
	height: 56px;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}           

.page-2021 .mosaique p {
	position: absolute;
	color: white;
	top: 30px;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	left: 10px;
	margin-right: 10px;
}
.page-2021 .mosaique p {
	color:#001b3b;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}

.page-2021 .mosaique h3 {
	position: absolute;
	top: 7px;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	left: 10px;
	margin-top: 0;
	font-family: LinotypeBrewery-Bold;
	text-transform: none;
	letter-spacing: 0;
	text-align: left;
	font-size: .875rem;
	font-weight: normal;
	color:#000;
	line-height: 1.5;
}
.page-2021 #page .mosaique  h3,
.page-2021 #page .mosaique  h3 * {
	font-size: .825rem;
    font-family: LinotypeBrewery-Bold, sans-serif;
	color:#001b3b;
}
.page-2021 .mosaique h4 {
	color: white;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	margin-right: 10px;
	font-family: 'SourceSansPro-Light', 'Source Sans Pro', SourceSansPro-Light, sans-serif;
	font-family: 'SourceSansPro', sans-serif;
	font-weight: 100;
	font-size: 13px;
	text-transform: uppercase;
	padding-left: 10px;
	padding-top: 13px;
}

.page-2021 .mosaique p.detail {
	color: rgba(255, 255, 255, 0) !important;
	padding-top: 1.5rem;
	font-size: .825rem!important;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
	line-height: 1.2;
	margin: 0;
}

.page-2021 .mosaique li:hover p.detail {
	color: rgba(0, 0, 0, 0) !important;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}

.page-2021 .mosaique li:hover p.detail {
	color: rgba(0, 0, 0, 1) !important;
}
@media (min-width:768px){
	.page-2021 .mosaique a {
		/* height: 2.5rem; */
	}
	.page-2021 #page .mosaique  h3,
	.page-2021 #page .mosaique  h3 * {
		font-size: 1rem;
    	font-family: LinotypeBrewery-Bold, sans-serif;
		color:#001b3b;
	}
	.page-2021 .mosaique p.detail {
		font-size: .875rem!important;
		line-height: 20px;
	}
}

.page-2021 .mosaique li:hover a {
	background-color: rgba(255, 255, 255, 0.77);
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 10px 0;
	height: 100%;
	-webkit-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}

/* ******************* FIN : MOSAIQUE 2021 ****************************** */
/* ********************************************************************** */

/* ********************************************************************** */
/* ******************* REBOND BANDEAU BAS dE PAGE *********************** */
/* ********************************************************************** */
.rebond-bandeau {
	background: #d4d9de;
	padding-bottom: 2rem;
}
body.page-2021 #page .contenu .rebond-bandeau h2,
body.page-2021 #page .contenu .rebond-bandeau h2 *{
	text-align: center;
    text-transform: uppercase;
	margin: 1rem auto;
	font-size: 2.125rem;
    font-family: LinotypeBrewery-Bold, sans-serif;
}
.rebond-bandeau .bloc-txtDroite-imgGauche {
	display: flex;
	justify-content: flex-start;
	width: 100%;
	min-width: 100%;
	max-width: 100%;
}
.rebond-bandeau .bloc-txtDroite-imgGauche .bloc--image{
	border-radius: 1rem;
	overflow: hidden;
	display: flex;
	max-height: 300px;
}
.rebond-bandeau .bloc-txtDroite-imgGauche .bloc--image img {
    object-fit: cover;
    object-position: center;
}
.rebond-bandeau .bloc-txtDroite-imgGauche .bloc--texte{
	order:2;
	padding: 1rem;
}
.rebond-bandeau .bloc-txtDroite-imgGauche .bloc--texte .categorie{
	font-weight: 600;
	font-size: .875rem;
}
#page .rebond-bandeau .bloc-txtDroite-imgGauche .bloc--texte h3,
#page .rebond-bandeau .bloc-txtDroite-imgGauche .bloc--texte h3 *{
	font-size: 1.5rem;
    font-family: LinotypeBrewery-Bold, sans-serif;
}
.rebond-bandeau .bloc-txtDroite-imgGauche p{
	font-size: 1rem;
}
@media (max-width:599px){
	.rebond-bandeau .bloc-txtDroite-imgGauche{
		flex-wrap: wrap;
	}
	.rebond-bandeau .bloc-txtDroite-imgGauche > *{
		flex:1 100%;
	}
}
@media (min-width:768px){
	#page .rebond-bandeau .bloc-txtDroite-imgGauche .bloc--texte h3,
	#page .rebond-bandeau .bloc-txtDroite-imgGauche .bloc--texte h3 *{
		font-size: 1.75rem;
		font-family: LinotypeBrewery-Bold, sans-serif;
	}
}


/* ********************************************************************** */
/* **************** Sommaire horizontal avec defilement ***************** */
/* ********************************************************************** */

.Slider {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    border-bottom: 1px solid #b5c0ce;
    width: 100%;
    z-index: 10;
    background-color: white;
    overflow-x: scroll;
    scrollbar-width: none;
    -ms-overflow-style: none;
    padding: 0 40px;
}

.Slider::-webkit-scrollbar {
    display: none;
}

.Slider .Slider-item {
    padding: 3rem 3rem 0 0;
}

.Slider .Slider-item .Slider-link {
    text-transform: uppercase;
    font-size: 13px;
    text-align: left;
    font-family: LinotypeBrewery-regular, sans-serif;
    padding-bottom: 3rem;
    display: block;
    white-space: nowrap;
}
.Slider .Slider-item .Slider-link > img{
    transform: rotate(-90deg);
    margin-left: 1rem;
	vertical-align: sub;
}
.Slider .Slider-item .Slider-link.active,
.Slider .Slider-item .Slider-link:hover {
    border-bottom: 2px solid #000;
}

.Slider .Slider-item .Slider-link.active {
    font-family: LinotypeBrewery-bold, sans-serif;
	font-weight: 700;
}

@media all and (max-width: 739px) {
    .Slider {
        z-index: 0;
    }
}

.Slider-controls .scroll-slider-button {
    height: 97%;
    padding: 0 5px;
    position: absolute;
    top: 0;
    background: white;
    z-index: 8;
    border: 0;
}

.Slider-controls .scroll-slider-button:focus {
    border: 1px solid white;
}

.Slider-controls .scroll-slider-button .icon {
    height: 25px;
}

.Slider-controls .scroll-slider-button.scroll-right-slider-button {
    -webkit-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
        transform: rotate(180deg);
    right: 0;
}

.Slider-controls .scroll-slider-button.scroll-right-slider-button .icon {
    margin-bottom: -6px;
}

.Slider-controls .scroll-slider-button.scroll-left-slider-button {
    left: 0;
}


/* ********************************************************************** */
/* ***************** Modeles de page 1 & 2 colonnes 2021 ***************** */
/* ********************************************************************** */
/* provisoire en attendant la refonte :*/
.page-2021:not(.edutheque) header > #search-panel{
	display: none;
}
.page-2021:not(.edutheque) .img-overlay {
	display: none;
}
/* fin : provisoire en attendant la refonte :*/
.page-2021 .heroTexte {
	text-align: center;
}
.page-2021 #portal .heroTexte h1{
	font-family: LinotypeBrewery-Bold, sans-serif;
	font-size: 3.25rem;
}
.page-2021 .heroTexte .sousTitre,
.page-2021 .heroTexte .chapo{
	font-family: LinotypeBrewery-Regular, sans-serif;
}
@media (min-width:768px){
	.page-2021 .hero-vignette .heroTexte {
		text-align: left;
	}
}

/* HERO : zone titre + vignette illustration */
.hero:not(.hero-vignette) .wrap-hero .wrap-img-text {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.wrap-hero .wrap-img-text:before,
.wrap-hero .wrap-img-text:after {
    display: none;
}
#page > div.contenu #portal .hero .heroTexte {
/*    padding-bottom: 120px;*/
}
hero figure.heroVignette{
		min-width: 250px;
	}

/* test hero 2 */
body.b-a-o #page > div.contenu #portal .panel-front.hero {
	width: 100%;
	max-width: 100%;
    padding: 0;
}
.wrap-hero {
    z-index: 0;
/*    padding: 3rem 0;*/
    position: relative;
    width: 100%;
    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-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    overflow: hidden;
    font-family: "Brewery No2 W06 Regular",Arial,Helvetica,sans-serif;
}
.wrap-hero .overlay-gradient {
    background-image: -webkit-gradient(linear,left top,left bottom,from(rgba(0,27,59,.4)),color-stop(99%,#001b3b));
    background-image: linear-gradient(to bottom,rgba(0,27,59,.4) 0%,#001b3b 99%);
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
}
.wrap-hero .img-overlay {
    position: absolute;
    max-width: none;
    min-width: 100%;
    width: auto;
    min-height: 100%;
}
.hero-vignette .wrap-hero .img-overlay {
    -webkit-filter: blur(20px);
    filter: blur(20px);
}
.wrap-hero .wrap-img-text {
    z-index: 2;
    position: relative;
    color: white;
/*    width: 100%;*/
    min-height: 400px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    align-items: flex-start;
    -webkit-box-pack: flex-start;
    -ms-flex-pack: flex-start;
    justify-content: flex-start;
    padding: 3rem 0 8rem;
}
.hero:not(.hero-vignette) .wrap-hero .wrap-img-text .heroVignette{
    display: none;
}
.hero:not(.hero-vignette) .wrap-hero .wrap-img-text .heroTexte{
    margin: 0 auto;
}
.hero:not(.hero-vignette) .heroTexte, .hero:not(.hero-vignette) .heroTexte *, #page > div.contenu #portal .hero:not(.hero-vignette) .heroTexte h1 {
    text-align: center;
}

@media (max-width:767px){
    .hero-vignette .wrap-hero .img-overlay {
        -webkit-filter: blur(1px);
        filter: blur(1px);
    }
    .wrap-hero .wrap-img-text {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .wrap-hero .wrap-img-text .heroTexte{
        margin: 0 auto;
    }
    .heroVignette{
        display: none;
    }
    .hero .heroTexte, .hero .heroTexte *, #page > div.contenu #portal .hero .heroTexte h1 {
		text-align: center;
	}
}
@media (min-width:768px){
	.b-a-o #page > div.contenu #portal .hero .rsItem{
		display: flex;
		align-items: flex-end;
	}
	.b-a-o #page > div.contenu #portal .hero figure{
		margin-right: 2rem;
		align-items: flex-end;
	}
	.b-a-o #page > div.contenu #portal .hero figure img{
		width: 250px;
	}
	#page > div.contenu #portal .hero.hero-vignette .heroTexte, #page > div.contenu #portal .hero.hero-vignette .heroTexte *, #page > div.contenu #portal .hero .heroTexte h1 {
		text-align: left;
	}
	#page .hero.hero-vignette .hero .typeDoc::after {
		margin: 10px 0 0;
	}
	#page .hero:not(.hero-vignette) .hero .typeDoc::after {
		margin: 10px auto 0;
	}
}
/* fin : test hero 2 */
.b-a-o #page > div.contenu .only-content figure,
.content-oe-modele #page > div.contenu .only-content figure {
	padding-bottom: 0;
}

@media (max-width:319px){
    body.b-a-o .iframe-responsive iframe,
    body[class*="bao-"] .iframe-responsive iframe,
    .bao-marseillaise .iframe-responsive iframe{
        height: 189px;
    }
}
@media (min-width:320px) and (max-width:379px){
    body.b-a-o .iframe-responsive iframe,
    body[class*="bao-"] .iframe-responsive iframe,
    .bao-marseillaise .iframe-responsive iframe{
        height: 219px;
    }
}
@media (min-width:380px) and (max-width:544px){
    body.b-a-o .iframe-responsive iframe,
    body[class*="bao-"] .iframe-responsive iframe,
    .bao-marseillaise .iframe-responsive iframe{
        height: 269px;
    }
}
@media (min-width:545px) and (max-width:645px){
    body.b-a-o .iframe-responsive iframe,
    body[class*="bao-"] .iframe-responsive iframe,
    .bao-marseillaise .iframe-responsive iframe{
        height: 369px;
    }
}
@media (min-width:992px) and (max-width:1200px){
    body.b-a-o .iframe-responsive iframe,
    body[class*="bao-"] .iframe-responsive iframe,
    .bao-marseillaise .iframe-responsive iframe{
        height: 369px;
    }
}
.bao-marseillaise #page .contenu h2,
.bao-marseillaise #page .contenu h2 span,
.bao-marseillaise .dossier-oe-modele #page .contenu h2,
.bao-marseillaise .dossier-oe-modele #page .contenu h2 span,
body.b-a-o #page .contenu h2,
body.b-a-o #page .contenu h2 span,
body.b-a-o .dossier-oe-modele #page .contenu h2,
body.b-a-o .dossier-oe-modele #page .contenu h2 span
body[class*="bao-"] #page .contenu h2,
body[class*="bao-"] #page .contenu h2 span,
body[class*="bao-"] .dossier-oe-modele #page .contenu h2,
body[class*="bao-"] .dossier-oe-modele #page .contenu h2 span {
	font-size: 2.5rem;
	text-transform: none;
	font-weight: 500;
	width: 100%;
	max-width: 970px;
	background: transparent;
	margin: .5rem 0;
}
@media (max-width:529px){
    .bao-marseillaise #page > div.contenu .carte-horiz-big,
    body[class*="bao-"] #page > div.contenu .carte-horiz-big,
    body[class*="bao-"] #page > div.contenu .carte-horiz-big {
        height: auto;
        -webkit-box-shadow: 0 3px 8px #ccc;
                box-shadow: 0 3px 8px #ccc;
        padding: 0;
        max-width: 280px;
        margin: 0 auto 2rem;
    }
    #page > div.contenu .carte-horiz-big .bloc--image {
        -webkit-box-ordinal-group: 2;
            -ms-flex-order: 1;
                order: 1;
        width: 100%;
        height: 250px;
        overflow: hidden;
        -webkit-box-flex: unset;
            -ms-flex: unset;
                flex: unset;
    }
}
@media (min-width:530px){
    .bao-marseillaise #page .carte-horiz-big,
    body.b-a-o #page .carte-horiz-big,
    body[class*="bao-"] #page .carte-horiz-big {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        -webkit-box-align: stretch;
            -ms-flex-align: stretch;
                align-items: stretch;
        padding: 0;
        border-radius: 1rem;
        background: #fff;
        overflow: hidden;
        height: 200px;
        width: 100%;
    }
}
.bao-marseillaise .carte-horiz-big,
body.b-a-o .carte-horiz-big,
body[class*="bao-"] .carte-horiz-big {
/*	height: auto;*/
    -webkit-box-shadow: 0 3px 8px #ccc;
            box-shadow: 0 3px 8px #ccc;
}
/* .bao-marseillaise .carte-horiz-big .bloc--image img,
body.b-a-o .carte-horiz-big .bloc--image img,
body[class*="bao-"] .carte-horiz-big .bloc--image img {
	-o-object-position: top;
	   object-position: top;
} */
.bao-marseillaise .carte-horiz-big .bloc--texte,
body.b-a-o .carte-horiz-big .bloc--texte,
body[class*="bao-"] .carte-horiz-big .bloc--texte {
	padding: 1rem;
    width: 100%;
}
.bao-marseillaise .carte-horiz-big h3,
body.b-a-o .carte-horiz-big h3,
body[class*="bao-"] .carte-horiz-big h3 {
	font-weight: 500;
}
.bao-marseillaise .carte-horiz-big h3,
.bao-marseillaise .carte-horiz-big p,
body.b-a-o .carte-horiz-big h3,
body.b-a-o .carte-horiz-big p,
body[class*="bao-"] .carte-horiz-big h3,
body[class*="bao-"] .carte-horiz-big p {
	margin-bottom: .5rem;
	margin-top: 0;
}
.bao-marseillaise .carte-horiz-big .btn,
body.b-a-o .carte-horiz-big .btn,
body[class*="bao-"] .carte-horiz-big .btn {
	margin-top: .5rem;
}
/* ************************************************************ */
/* SIDEBAR bloc infos du concerts (infos / distrib / programme) */
@supports (display:flex) {
    @media (max-width: 991px) {
        .content-oe-modele.bao-marseillaise #page > div.contenu #zone-5,
        body.b-a-o  #page > div.contenu #zone-5,
        body.content-oe-modele[class*="bao-"]  #page > div.contenu #zone-5 {
            border-radius: 0;
        }
        .content-oe-modele.bao-marseillaise #page > div.contenu #layout-3 > .row,
        body.b-a-o  #page > div.contenu #layout-3 > .row,
        body.content-oe-modele[class*="bao-"]  #page > div.contenu #layout-3 > .row{
/*
            -webkit-display: flex; -moz-display: flex; -o-display: flex; display: flex;
            flex-direction: column;
*/
        }
        .content-oe-modele.bao-marseillaise #page > div.contenu #zone-4,
        body.b-a-o  #page > div.contenu #zone-4,
        body.content-oe-modele[class*="bao-"]  #page > div.contenu #zone-4 {
/*            order:2;*/
        }
    }
}

/* *************************************************************************** */
/* *********************** PAGE INCONTOURNABLES 2021 ************************* */
/* *************************************************************************** */
.incontournables2021 .mosaique img {
	height: 295px;
/*
	width: 100%;
	height: 100%;
	-o-object-fit: cover;
	object-fit: cover;
*/
	
	/* flex: 1; */
	/* max-width: 100%; */
}


/* *************************************************************************** */
/* *************************** PAGE INSTRUMENTS 2021 ************************* */
/* *************************************************************************** */

.instruments2021 .Slider-wrapper {
    display: flex;
	align-items: center;
	border-bottom: 1px solid #b5c0ce;
    overflow: hidden;
}
.instruments2021 .Slider {
/*	border-bottom: 1px solid #b5c0ce;*/
	flex: 1;
}
.instruments2021 .Slider-wrapper .pinned {
    font-family: LinotypeBrewery-Regular, sans-serif;
	font-size: .825rem;
	padding-left: 2rem;
	padding-right: 2rem;
/*	border-bottom: 1px solid #b5c0ce;*/
	border-left:1px solid #b5c0ce;
	align-self: stretch;
	display: flex;
    justify-content: flex-end;
    align-items: center;
	flex-wrap: wrap;
}
@media (max-width:768px){
	.instruments2021 .Slider-wrapper .pinned {
		flex: 1;
	}
}
@media (max-width:599px){
	.instruments2021 .Slider-wrapper .pinned {
		display: none;
	}
}

.instruments2021 .Slider-wrapper .pinned > p{
    text-align: right;
}
.instruments2021 .Slider-wrapper .pinned > p > *{
    display: inline-block;
}
.instruments2021 .Slider-wrapper .pinned a{
    text-decoration: underline;
	margin-left: .5rem;
}
.instruments2021 .Slider-wrapper .pinned a span:first-of-type{
    text-transform: uppercase;
}
@media (min-width:992px){
	.instruments2021 .Slider{
/*
		width: calc(100% - 400px);
		min-width: 750px;
*/
		width: unset;
	}
}
.instruments2021 .Slider .Slider-item .Slider-link.active,
.instruments2021 .Slider .Slider-item .Slider-link:hover {
    border-bottom: 0;
    box-shadow: inset 0 -2px 0 #000;
}



/* *********************** */
/* CARTES : images + texte */
/* *********************** */

/* cartes ermes */
.contenu .modele-image-gauche-texte-droite .thumbnail {
	border-radius: 1rem;
}
/* cartes GG */
.card{
    border-radius: 1rem;
    border:0;
    overflow: hidden;
    /* min-width: 242px;
    max-width: 242px;
    width: 242px; */
    margin: .5rem;
    background: #fff;
    /* min-width: 280px;
    max-width: 280px; */
	flex:1;
}
.card.dark{
    background: #001b3b;
}
.card figure{
    height: 242px;
    -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex;
    position: relative;
}
.card figure > img{
    -o-object-fit: cover;
       object-fit: cover;
    width: 100%;
    height: 101%;
}
.card .layer-over{
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 27, 59, 0.75);
    color: #fff;
    -webkit-display: flex; -moz-display: flex; -o-display: flex; 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: space-evenly;
        -ms-flex-pack: space-evenly;
            justify-content: space-evenly;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: none;
/*
    background: -webkit-linear-gradient(bottom, rgba(0,27,59,0.75) 0%, rgba(0,27,59,0) 100%);
    background: -o-linear-gradient(bottom, rgba(0,27,59,0.75) 0%, rgba(0,27,59,0) 100%);
    background: linear-gradient(to top, rgba(0,27,59,0.75) 0%, rgba(0,27,59,0) 100%);
*/
}
.card .layer-over *{
    text-align: center;
}
/* cartes horrizontales */
@media(min-width:992px){
    .card.horiz {
        -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
            -ms-flex-direction: row;
                flex-direction: row;
        width:unset;
        max-width: 100%;
    }
  
    .card.horiz figure{
        width: 230px;
        max-width: 230px;
        min-width: 220px;
        height: 100%;
    }
}
@media(min-width:1200px){
    .card.horiz figure{
        width: 255px;
        max-width: 255px;
        min-width: 255px;
        height: 100%;
    }
}
/* carte "accès limité, connectez vous" */
body.anonyme .card.layer-lock .btn.connected,
body.connecte .card.layer-lock .btn.btn-connexion {
	display: none;
}
body.connecte .card.layer-lock .btn.connected,
body.anonyme .card.layer-lock .layer-over,
body.anonyme .card.layer-lock .btn.btn-connexion {
	display: inline-block;
}
body.anonyme .card.layer-lock .layer-over {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
body.connecte .card.layer-lock .layer-over {
	display: none;
}

.card.layer-lock .layer-over {
    -webkit-display: flex; -moz-display: flex; -o-display: flex; display: -webkit-box; display: -ms-flexbox; display: flex; 
}
.card.layer-lock .layer-over *{
    display: none;
}
.card.layer-lock .layer-over img:first-of-type{
    display: block;
}
.card.layer-lock .layer-over span:first-of-type{
    font-family: LinotypeBrewery-bold, sans-serif;
    font-size: 12px;
    text-transform: uppercase;
}
.card.layer-lock .layer-over span:nth-of-type(2){
    font-size: .875rem;
}
.card.layer-lock .layer-over span:nth-of-type(3){
    font-size: .825rem;
}
.card.layer-lock:hover .layer-over *,
.card.layer-lock a:hover .layer-over *,
.card.layer-lock a:focus .layer-over *,
.card.layer-lock a:focus-within .layer-over *,
.card.layer-lock a:active .layer-over *,
.card.layer-lock:focus .layer-over *,
.card.layer-lock:focus-within .layer-over *,
.card.layer-lock:active .layer-over *{
    display: block;
}
.card.layer-lock:hover .layer-over img:first-of-type,
.card.layer-lock a:hover .layer-over img:first-of-type,
.card.layer-lock a:focus .layer-over img:first-of-type,
.card.layer-lock a:focus-within .layer-over img:first-of-type,
.card.layer-lock a:active .layer-over img:first-of-type,
.card.layer-lock:focus .layer-over img:first-of-type,
.card.layer-lock:focus-within .layer-over img:first-of-type,
.card.layer-lock:active .layer-over img:first-of-type{
    display: none;
}
.card .texte{
    padding: 1rem;
}
.card p{
    margin: 0 0 .5rem;
}
.card.dark p{
    color:#fff;
}
.card .categorie{
    font-size: .825rem;
    font-weight: 600;
    line-height: 1;
    color:#001b3b;
	margin-bottom: .5rem;
}
.categorie:after {
	content: "";
	display: block;
    width: 2rem;
    height: 1px;
    background: #001b3b;
	line-height: 1;
    margin-top: .5rem;
}
.card.dark .categorie:after {
	content: "";
	display: block;
    width: 2rem;
    height: 1px;
    background: #fff;
	line-height: 1;
    margin-top: .5rem;
}
.card .titre {
	font-family: LinotypeBrewery-bold, sans-serif;
    color:#001b3b;
    font-size: 1.125rem;
    line-height: 1.25;
}
.card .sous-titre {
    color:#001b3b;
    opacity: .8;
    font-family: LinotypeBrewery-regular, sans-serif;
}
.card.txtOverImg.full .sous-titre,
.card.txtOverImg.big .sous-titre {
    font-size: 1rem;
}
.card .description {
    color:#001b3b;
    font-size: .875rem;
    opacity: .8;
}
@media (min-width:1200px){
    .card .description {
        font-size: .875rem;
    }
}
.card .lieu,
.card .date {
    color:#001b3b;
    font-size: .875rem;
	font-weight: 500;
    opacity: 1;
    margin: 0;
}
.card .lieu:before {
    content:url(images/icon-geolocalisation.svg);
    margin-right: .5rem;
    vertical-align: sub;
}
.card .date:before {
    content:url(images/icon-date.svg);
    margin-right: .5rem;
    vertical-align: sub;
}
.card.txtOverImg.full .date:before,
.card.txtOverImg.big .date:before {
	content: url(images/icon-date-blanc.svg);
	margin-right: 1rem;
	vertical-align: sub;
}
.card.dark .description {
    color:#b5c2d3;
    font-size: .825rem;
}

button:focus, .btn:focus {
/*	outline: none!important;*/
}
/* Carte texte sur l'image */
.card.txtOverImg {
	height: 484px;
	position: relative;
}
.card .layer-over{
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0, 27, 59, .75);
    color: #fff;
    -webkit-display: flex; -moz-display: flex; -o-display: flex; 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: space-evenly;
        -ms-flex-pack: space-evenly;
            justify-content: space-evenly;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    display: none;
}

.card.txtOverImg figure {
	height: 484px;
}
.card.txtOverImg .texte {
	position: absolute;
	bottom: 0;
    padding: 1rem;
    width: 100%;
    height: 100%;
    background: rgb(0,27,59);
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(0,27,59,1)), to(rgba(0,27,59,.3)));
    background: -o-linear-gradient(bottom, rgba(0,27,59,1) 0%, rgba(0,27,59,.3) 100%);
    background: linear-gradient(0deg, rgba(0,27,59,1) 0%, rgba(0,27,59,.3) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#001b3b",endColorstr="#001b3b",GradientType=1);
    display: block;
}
@supports (display:flex){
    .card.txtOverImg .texte {
        position: absolute;
        bottom: 0;
        padding: 2rem 1rem;
        width: 100%;
        height: 100%;
        background: rgb(0,27,59);
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(0,27,59,1)), to(rgba(0,27,59,.3)));
		background: -webkit-linear-gradient(0deg, rgba(0,27,59,1) 0%, rgba(0,27,59,.3) 75%, rgba(0,27,59,.0) 100%);
        background: -o-linear-gradient(bottom, rgba(0,27,59,1) 0%, rgba(0,27,59,.3) 75%, rgba(0,27,59,.0) 100%);
        background: linear-gradient(0deg, rgba(0,27,59,1) 0%, rgba(0,27,59,.3) 75%, rgba(0,27,59,.0) 100%);
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#001b3b",endColorstr="#001b3b",GradientType=1);
        -webkit-display: flex; -moz-display: flex; -o-display: flex; 
        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:end;
            -ms-flex-pack:end;
                justify-content:flex-end;
        -webkit-box-align: start;
            -ms-flex-align: start;
                align-items: flex-start;
    }
}
.card.txtOverImg.full .texte,
.card.txtOverImg.big .texte {
    padding: 4rem 2rem;
}
.card.txtOverImg .texte *{
	color:#fff;
}
.card .texte > *{
	margin-bottom: .5rem;
}
.card.txtOverImg .categorie:after {
	content: "";
    background: #fff;
}
.card.txtOverImg.full {
    width: 100%;
    min-width: 100%;
    margin: 0 auto;
    max-width: 1600px;
	border-radius: 0;
}
@media screen and (min-width:992px){
	/* pour desktop, la carte "full" place le visuel à gauche et le texte à droite */
	.card.txtOverImg.full {
		display: flex;
		align-items: stretch;
	}
	.card.txtOverImg.full figure {
    	flex: 2;
	}
	.card.txtOverImg.full .texte {
		position: static;
    	flex: 1;
		background: #001B3B;
		justify-content: flex-start;
	}
	.card.txtOverImg.full .texte > *{
		margin-bottom: .825rem;
	}
}
@media screen and (min-width:1600px){
	.card.txtOverImg.full {
		border-radius: 1rem;
	}
}
.card.txtOverImg.full .titre,
.card.txtOverImg.big .titre {
    font-size: 2rem;
    font-weight: bold;
    text-transform: uppercase;
}
@media screen and (max-width:767px){
	.card.txtOverImg.full .titre,
	.card.txtOverImg.big .titre {
		font-size: 1.5rem;
	}
}
/* conteneur de la carte plein ecran (ex : 1ere ligne des mosaiques homepage) */
.page-2021 #page > div.contenu #portal .panel-front.bloc-actu-1 {
    margin: 0 auto;
    padding: 0;
    width: 100%;
    max-width: 1600px;
}