﻿@charset "utf-8";
/* -------------------------------------------------------------------------------------------------------------
    TABLE DES MATIÈRES - FLexi CCW V3.0
----------------------------------------------------------------------------------------------------------------*/

@font-face {
  font-family: 'Roboto';
  src:  url('fonts/Roboto-Regular.ttf');
  font-weight:normal;
  font-style: normal;
}

html {
	font-size:100%;
}

.visuallyHidden, .visuallyhidden, .hors_ecran, .hors-champ {
border: 0;
clip: rect(0 0 0 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}

.colonneLogoPiv {
	width: 200px;
	float:left;
	padding-right: 0.9375rem;
	padding-left: 0.9375rem;
}

.nomOrganismeColumns {
	width:54%;
	float:left;
	padding-right: 0.9375rem;
	padding-left: 0.9375rem;
}

.colonneBoutonsPiv {
	width:24%;
	float:right;
	padding-right: 0.9375rem;
	padding-left: 0.9375rem;
}

.bootstrap.container, .row {
    max-width: 1175px;
}

#cssmenu ul li a {
	font-family: 'Roboto', sans-serif;
}

.boutonChangerEntete   {
	margin-right:5px;
}

a img[src="images/icones/lien-externe.png"] {
  margin-top:-1px;
}

.nomOrganismeColumns {
	padding:0;
}

.pivHautHeader .logo-fonce {
	display:none;
}

.pivHautHeader.fondBlanc {
	padding-top:3px;
}

.pivHautHeader.fondBlanc .logo-fonce {
	display:inherit;
}

.pivHautHeader.fondBlanc .logo-blanc {
	display:none;
}

.pivHautBoutonsMobile {
	list-style:none;
	position: absolute;
	left:0px;
	top:0px;
}

.fondBlanc.pivHautBoutonsMobile {
	top:20px;
}

.pivHautBoutonRecherche {
	background-image: url("../images/piv/recherche.svg");
	background-repeat:no-repeat;
	background-color:transparent;
	border:none;
	position:relative;
	width: 26px;
	height:26px;
	background-size: 26px;
	cursor:pointer;
	margin-top:11px;
}

.pivHautBoutonRecherche:hover, .pivHautBoutonRecherche:focus {
	opacity:0.8;
	filter: alpha(opacity=80);
}

.fondBlanc  .pivHautBoutonRecherche{
	background-image: url("../images/piv/rechercheN.svg");
}

#txtSearch {
	padding-right:38px;
	margin-bottom:0;
	width:100%;
	color: #0a0a0a;
	padding: 0.5em;
	border-radius: 3px;
	border: 1px solid #cacaca;
	box-shadow: inset 0 1px 2px rgba(10, 10, 10, 0.1);
}

.champRechercheSubmit {
	background-image: url("../images/piv/rechercheN.svg");
	background-repeat:no-repeat;
	width: 30px;
	height: 30px;
	background-size: 29px;
	position: absolute;
	right: 21px;
	top: 5px;
	cursor:pointer;
	border: 0;
	background-color:transparent;
}

.pivHautBoutonRecherche:hover {
	opacity:0.8;
	filter: alpha(opacity=80);
}

#pivImagePrint {
    display: none;
}

.pivHautHeader,  .pivHautHeader .pivHaut, .pivHautHeader .pivHaut #entetePiv{
    background-color: #095797;
    color: #fff;
}

.pivHautHeader.fondBlanc , .pivHautHeader.fondBlanc  .pivHaut, .pivHautHeader.fondBlanc .pivHaut #entetePiv {
    background-color: #FFFFFF;
    color: #000;
}

.pivHautHeader {
    border-top: 8px solid #095797;
}

.pivHautMenu {
	display: table-cell;
	vertical-align: middle;
	height: 51px;
	padding-bottom:10px;
}

#entetePiv .pivHautMenu ul {
	vertical-align:middle;
}

.liensAlignementsDroits {
	display: inline-block;
	float:right;
	position: relative;
}

.pivHautMenu a {padding:0;color:#fff;text-decoration:none; font-size: 12.8px; font-family: 'Roboto', sans-serif;}
.fondBlanc .pivHautMenu a {color:#000;}
.pivHautMenu a:hover, .pivHautMenu a:focus, .pivHautMenu a:active {background:none;text-decoration:underline;}

#entetePiv .pivHautMenu ul {
	padding-bottom: 0;
	margin-top:1px;
	margin-left:70px;
}

.bootstrap #entetePiv .pivHautMenu ul {
	margin-left:52px;
}

#entetePiv .pivHautMenu ul li {
	display:inline;
	clear:left;
	float:left;
	line-height:22px;
}

#entetePiv .pivHautMenu ul li a {
	line-height:inherit;
	display: inline-block;
}

#entetePiv .logo {
	padding-bottom: 0px;
	padding-top: 0px;
	margin-top:-10px;
}

#entetePiv .logo  a{
	display:inline;
}

#entetePiv .logo img{
	max-width: 200px;
}

#entetePiv .nomOrganisme {
	padding-bottom: 9px;
	padding-top: 0px;
	font-family: 'Roboto', sans-serif;
	display:table-cell;
	vertical-align: middle;
	height: 60px;
	padding-left: 67px;
}

#entetePiv .nomOrganisme p {
	margin-bottom:0;
	line-height: 1.1em;
	font-size: 16px;
}

#recherchePiv {
    display: none;
}

#recherchePiv.actif {
    display: inline-block;
	width: 100%;
	margin-bottom:10px;
}

#recherchePiv.actif .contenantRecherche {
	position:relative;
}

.contenant_site {
  float: inherit;
  padding-top: inherit;
  z-index: 100;
}

.contenant_site.avecmenu {
  float: left;
  position:fixed;
  height:100%;
}

.contenant_site.avecmenu a:hover {
  cursor:text;
}

.pivHaut a:focus {outline:dotted 2px;} /* Ajoute un outline encadré pour l'accessibilité lors de la navigation avec le clavier */
.pivHaut a:active {outline:none;} /* Supprimer l'encadré outline pour la navigation avec la souris mais pas pour la navigation par clavier */

.pivHautLogo {
	margin:0;
	padding:0;
	background:#FFF;	
	display:table-cell;
	height:72px;
	vertical-align:bottom;
	bottom: -17px;
	position:relative;
}

.pivHautLogo img {
	max-width:inherit;
}

.pivHautBoutonMenu {display:none;}

@media only screen and (max-width: 1024px) {
	.nomOrganismeColumns {
		width:40%;
	}

	.colonneBoutonsPiv {
		width:30%;
	}
}


@media only screen and (max-width: 750px) {
		
	.champRechercheSubmit {
		right: 16px;
	}
	
	.main_menu {
		padding: 0;
	}
	
	.pivHautHeader .pivHaut {
		border-top: none;
	}
	
	.pivHautHeader.fondBlanc .pivHaut {
		border-top: 10px solid #095797;
	}
	
	.pivHautHeader.fondBlanc {
		padding-top:0px;
	}
	
	.pivHautHeader .pivHaut.avecmenu {
		border-top: none;
		background-color: #2D405E;
	}
	
	.pivHautHeader  {
		border-top: none;
	}
	
	.navigation-principale-mobile .columns {
		padding-left:0;
		padding-right:0;
	}
	
	.avecmenu #entetePiv .liPivHautBoutonRecherche,
	.avecmenu #entetePiv .nomOrganisme,
	.avecmenu #entetePiv .logo {
		display:none;
	}
	
	.pivHautHeader .avecmenu.pivHaut #entetePiv{
		border-top: 10px solid #2D405E;
		background-color: #2D405E;
	}	
	
	.pivHautHeader  .avecmenu.pivHaut  {
		border-left:16px solid #095797;
	}
	
	.boutonChangerMenu  {
		display:none;
	}
		
	.mobileResponsivePresent .pivHautFonctionnalites {text-align:center;margin: 0;}
	.mobileResponsivePresent .pivHaut ul, .pivHautFonctionnalites ul {list-style:none;}
		
	.mobileResponsivePresent .pivHaut {
		min-height:82px;
		position:fixed;
		width:100%;
		z-index: 1000;
	}
	
	.mobileResponsivePresent #entetePiv {
		position: relative;
		width: 100%;
	}
	
	.mobileResponsivePresent .bootstrap #entetePiv {
		width: auto;
	}
	
	.mobileResponsivePresent .contenant_site.mobile {
  		padding-top: 137px;
		z-index: 700;
	}
	
	.mobileResponsivePresent .contenant_site.mobile.avecmenu .boiteParDessusContenu {
		position:absolute;
		width:100%;
		height:100%;
		z-index: 800;
	}
	
	.mobileResponsivePresent .contenant_site.mobile.avecrecherche {
		padding-top:180px;
	}
	
		
	.mobileResponsivePresent .pivHaut .menu_mobile {
		background-color: #095797;
		right: 0;
		top: 80px;
		bottom: 0;
		border:0px;
		padding: 0px 0px 10px 0px;
		position: fixed;
		width: 100%;
		display:none;
		z-index:100;
		overflow-y:auto;
		overflow-x:hidden;
		border-left: 16px solid #FFF;
	}
			
	.mobileResponsivePresent .pivHaut .menu_mobile .navigation-principale-mobile {
		display:inline-block;
		width:100%;
	}
	
	.mobileResponsivePresent .pivHaut.menu .menu_mobile {
	  display:block;
	}
	
	.nomOrganismeColumns {
		padding-left: 15px;
		padding-right: 5px;
	}
	
	.mobileResponsiveNonPresent #entetePiv .nomOrganismeColumns {
		width:75%;
	}
			
	.mobileResponsivePresent #entetePiv .nomOrganismeColumns {
		width:100%;
	}
	
	.fondBlanc #cssmenu ul li a {
		border-color: #000;
	}
	
	#entetePiv .nomOrganisme {
		padding-bottom: 7px;
		padding-top: 5px;
		padding-left:0px;
		display: block;
		vertical-align: inherit;
		height: auto;
		margin-top: -9px;
	}
	
	#entetePiv .logo {
		width: 100%;
		margin-top:inherit;
	}
	
	.fondBlanc #entetePiv .logo {
		margin-top:-8px;
	}
	
	#entetePiv .boutonsPiv {
		position:absolute;
		top: 3px;
		z-index: 1000;
		right:0px;
	}
			
	.boutonsPiv {
		padding: 0;
	}
	
	.mobileResponsivePresent .boutonsPiv {
		padding-right: 0.9375rem;
		padding-left: 0.9375rem;
	}
	
	.mobileResponsiveNonPresent #entetePiv .pivHautMenu ul {
		padding-right: 0.9375rem;
		padding-left: 0px;
		display: inline-block;
		margin-left:-10px;
		/*margin-top: 11px;*/
	}
	
	.mobileResponsiveNonPresent .fondBlanc #entetePiv .pivHautMenu ul {
		margin-top: 17px;
	}
	
	.mobileResponsivePresent #entetePiv .pivHautMenu ul {
		display: inline-block;
		margin-left:0;
	}
	
	#entetePiv .pivHautMenu ul {
		display:none;
	}
			
	.mobileResponsivePresent #entetePiv .pivHautMenu ul {
		display:none;
	}
		
	.mobileResponsiveNonPresent #entetePiv .pivHautMenu ul,
	.mobileResponsivePresent .avecmenu #entetePiv .pivHautMenu ul {
		display:block;
	}
	
	.mobileResponsivePresent .bootstrap.avecmenu #entetePiv .pivHautMenu ul {
		display:inline;
	}
	
	.pivHautMenu {
		height: 71px;
		padding-bottom:10px;
	}
	
	.avecmenu .pivHautMenu {
		display: block;
	}
	
	.avecmenu #entetePiv .pivHautMenu ul li a,
	.avecmenu #cssmenu ul li a {
		font-size:1.4rem;
	}
	
	.avecmenu #entetePiv .pivHautMenu ul li a {
		outline:none;
		line-height:inherit;
		color:#FFFFFF;
	}
	
	.avecmenu #entetePiv .pivHautMenu ul li a:hover, .avecmenu #entetePiv .pivHautMenu ul li a:focus {
		background-color: #213653;
	}
	
	.avecmenu #entetePiv .pivHautMenu ul li  {
		display:block;
		width:100%;
		border-bottom: 1px solid #3A79AC;
	}
	
	.mobileResponsivePresent .pivHautBoutonsMobile {
		margin-left:0;
		margin-bottom:0;
		margin-top:0;
		padding:0;
		display:block;
		list-style:none;
		right:8px;
		line-height:inherit;
	}
	
	.mobileResponsiveNonPresent .pivHautBoutonsMobile {
		top:15px;
	}
	
	.pivHautBoutonsMobile li button {
		border-radius:0;
		bottom:0;
		width:29px;
		height:29px;
		text-indent:-9999px;
		outline:none;
		border:none;
		padding:0;
		margin:0;
		z-index: 1000;
		cursor:pointer;
	}
	
	.pivHautBoutonsMobile li button.pivHautBoutonMenu {
		margin-right: 0px;
		margin-top: 1px;
	}
	
	.avecmenu .pivHautBoutonsMobile li button.pivHautBoutonMenu {
		width:26px;
		height:26px;
		margin-right: 5px;
	}
	
	.avecmenu  .pivHautBoutonMenu:focus span.outline {
		display:block;
		width: 30px;
		height:30px;
		border: 1px dotted #FFFFFF;
		top: -3px;
		left: -3px;
		position: absolute;
	}
	
	.liPivHautBoutonMenu {
		display:none;
	}
	
	.mobileResponsivePresent .liPivHautBoutonMenu {
		display:inherit;
	}
	
	.mobileResponsivePresent .pivHautBoutonMenu {
		display:block;
		background-color:transparent;
		background-image: url('../images/piv/ico-menuB.svg');
		background-repeat:no-repeat;
		background-position:0px 0px;
		background-size:23px;
		position: absolute;
		right: -6px;
		top: 22px;
	}
	
	.mobileResponsivePresent .fondBlanc .pivHautBoutonMenu {
		top: 15px;
	}
	
	.mobileResponsivePresent .bootstrap .pivHautBoutonMenu {
		right: 0px;
	}
	
	.mobileResponsivePresent .fondBlanc .pivHautBoutonMenu {
		background-image: url('../images/piv/ico-menuN.svg');
	}
		
	.mobileResponsivePresent .pivHautBoutonMenu:hover, .mobileResponsivePresent .pivHautBoutonMenu:focus, .pivHautBoutonMenu:active {
		opacity:0.8;
		filter: alpha(opacity=80);
	}
	
	.mobileResponsivePresent .pivHautBoutonMenu:hover {
		opacity:0.8;
		filter: alpha(opacity=80);
	}
	
	.mobileResponsivePresent .avecmenu .pivHautBoutonMenu {
		background-image: url('../images/piv/ico-fermerB.svg');
		background-size:25px;
		top: 9px;
	}
	
	.mobileResponsivePresent .pivHautBoutonMenu:focus span.outline {
		display:block;
		width: 40px;
		height:38px;
		border:1px dotted #FFFFFF;
		top: -8px;
		left: -9px;
		position: absolute;
	}
	
	.mobileResponsivePresent .fondBlanc .pivHautBoutonMenu:focus span.outline {
		border:1px dotted #000000;
	}

	.mobileResponsivePresent .avecmenu .pivHautBoutonMenu:focus span.outline {
		display:block;
		width: 33px;
		height:34px;
		border:1px dotted #FFFFFF;
		top: -5px;
		left: -4px;
		position: absolute;
	}
	
	.mobileResponsivePresent .fondBlanc  .avecmenu .pivHautBoutonMenu:focus span.outline {
		border:1px dotted #FFFFFF;
	}
	
	.menu a, .menu .button {
		padding: 0;
	}
	.mobileResponsivePresent .menu_mobile_actif .menu {
		display:block;
	}
	
	
	.pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 73px;
		top: 9px;
	}
		
	.mobileResponsivePresent .pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 70px;
		top: 21px;
	}	
	
	.mobileResponsivePresent .fondBlanc .pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 70px;
		top: 14px;
	}
	
	.mobileResponsivePresent .bootstrap .pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 76px;
		top: 22px;
	}
	
	.mobileResponsivePresent .fondBlanc .bootstrap .pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 76px;
		top: 12px;
	}
	
	.mobileResponsiveNonPresent .pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 78px;
		top: 2px;
	}	
	
	.mobileResponsiveNonPresent  .bootstrap .pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 92px;
		top: 2px;
	}
	
	.mobileResponsiveNonPresent .fondBlanc .pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 78px;
		top: 7px;
	}
	
	.mobileResponsiveNonPresent .fondBlanc  .bootstrap .pivHautBoutonsMobile li button.pivHautBoutonRecherche {
		right: 88px;
		top: 8px;
	}	
	
	.pivHautBoutonRecherche:focus span.outline {
		display: block;
		width: 40px;
		height: 40px;
		border: 1px dotted #FFFFFF;
		top: -8px;
		left: -8px;
		position: absolute;
	}
	
	.fondBlanc .pivHautBoutonRecherche:focus span.outline {
		border:1px dotted #000000;
	}
	
	.avecmenu .pivHautMenu ul li a {
		width: 100%;
		padding: 20px 20px 16px 20px;
	}

}


/*---------------------------------------------------------------------------------------------------- 
        :: FLEXI.CSS.3.2 - PIV Bas
 -----------------------------------------------------------------------------------------------------*/        
.pivBas {
	text-align:center;
	margin:10px 0;
	clear:left;
	font-size:medium; /* font-size medium pour fixer la taille du texte à la taille par défaut fourni dans le navigateur (normalement 16px), et ce peu importe la taille du font-size sur l'élément HTML. Permet de zoomer le texte du PIV sans avoir à fixer la taille en pixels ni être influencé par le root HTML */
}
.pivBas p {
	margin:0;
	font-size:70%; /* simule font-size:11px en fonction du font-size:medium du conteneur parent .pivHautMenu. Donc 70% de 16px = 11px; */
}
.pivBas ul {
	list-style-type:none;
	margin:0;
	padding:0;
	text-align:center;
	font-size:70%; /* simule font-size:11px en fonction du font-size:medium du conteneur parent .pivHautMenu. Donc 70% de 16px = 11px; */
}
.pivBas ul li {margin:0;padding:0;display:inline;}
.pivBas a:link, .pivBas a:visited {color:#003399;font-size: 0.8rem;margin-right:8px;margin-left:8px; font-family: 'Open Sans', sans-serif;}
.pivBas a:hover, .pivBas a:focus {text-decoration:none;}

.pivBas .pivBasLogo img {border:none;}
