body
{
	font-size: 16px;
	color:#000C56;
	font-family: 'Lato', sans-serif;
}

#main
{
	padding-top: 100px;
}

#logo
{
	float: left;
	padding-top: 15px;
}

#branding 
{
	position: fixed;
	background: #fff;
	height: 100px;
	width: 100%;
	z-index: 99999;
}

.picto
{
	margin-bottom: 20px;
}

#access
{
	float: right;
	z-index: 9999;
	clear: none;
}

#access > div > ul > li > a
{
	margin:0 8px;
	text-transform: uppercase;
	line-height: 100px;
	height: 100px;
	font-family: 'Lato', sans-serif;
	font-size: 13px;
	color:#000657;
	text-decoration: none;
	background: none;
	background-position: center bottom -1px;
}

#access > div > ul > li.lien-bouton > a
{
	line-height: 35px;
	height: 35px;
	margin-top: 32px;
	border-radius: 10px;
	background: #3075B6;
	padding: 0 20px;
	color:#fff;
}

#access > div > ul > li > a:hover
{
	background: url('images/fond-hover.svg') no-repeat center bottom -1px;
	background-size: 100% auto;
}

#access > div > ul > li.lien-bouton > a:hover
{
	background: #000C56;
}



.bloc-accueil
{
	background: url('images/fond-accueil.jpg') no-repeat center;
	height: 700px;
	position: relative;
}

.bloc-texte, .bloc-pictos, .bloc-chiffres, .bloc-mosaique
{
	padding-top: 110px;
	padding-bottom: 90px;
	background-position: center;
	background-repeat: no-repeat;
}

.bloc-texte-image
{
	padding-top: 70px;
	padding-bottom: 50px;
	background-position: center;
	background-repeat: no-repeat;
}



.bloc-image
{
	background-position: center;
	background-repeat: no-repeat;
}

.bloc-accueil .centrer
{
	height: Y00px;
	position: relative;
}

.bloc-accueil .contenu
{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	right: 0;

	text-align: right;
}

.bloc-accueil h1
{
	color:#fff;
}

.bloc-accueil h1 strong
{
	color:#DC5E5E;
	font-weight: 900;
}


.bloc-accueil .contenu em
{
	font-size: 16px;
	color:#fff;
	letter-spacing: 0.5em;
	text-transform: uppercase;
	font-style: normal;
	font-weight: 900;
}

.bouton
{
	background: #3075B6;
	font-size: 16px;
	text-align: center;
	text-transform: uppercase;
	width: 300px;
	color:#fff;
	line-height: 50px;
	font-weight: bold;
	border-radius: 10px;
	margin-bottom: 20px;

	text-decoration: none!important;
}


.bouton:hover
{
	background: #000C56;
}

.ancre-accueil
{
	position: absolute;
	top:50%;
	transform: translateY(-50%);
	left: 0;
}

.ancre-accueil a
{
	display: block;
	background:url('images/image-liens.svg') no-repeat left center;
	padding-left: 22px;
	line-height: 40px;
	color:#FFF;
	font-size: 16px;
	text-decoration-color: #3667AF;

}

.ancre-accueil a:hover
{
	text-decoration: underline;
	text-decoration-color: #3667AF;
}

.ancre-accueil span
{
	display: block;
	background:url('images/image-liens.svg') no-repeat left top;
	padding-left: 22px;
	height: 20px;
	width: 20px;
}

.bloc-accueil .fleche
{
	background: url('images/fleche-accueil.svg') no-repeat center center;
	width: 40px;
	height: 30px;
	left: 50%;
	transform: translateX(-50%);
	position: absolute;
	bottom: 15px;
}

p
{
	font-size: 16px;
	overflow: hidden;
	color:#000C56;
}

a
{
	color:#000C56;
	text-decoration: none;
}

a:hover
{
	color:#000C56;
	text-decoration: underline;
}


h1
{
  font-size: 60px;
  line-height: 60px;
  padding-bottom: 20px;
  font-weight: 700;
  color:#000C56;
  text-transform: none;
}

h2
{
  font-size: 24px;
  line-height: 30px;
  padding-bottom: 20px;
  font-weight: bold;
  color:#3075B6;
  text-transform: uppercase;
}

h3
{	
  font-size: 30px;
  line-height: 40px;
  font-weight: bold;
  padding-bottom: 20px;
  color:#000C56;
}

h4
{

  font-size: 20px;
  line-height: 24px;
  font-weight: normal;
  padding-bottom: 20px;
  color:#000C56;
}

.picto-chiffre
{
	font-size: 30px;
	font-weight: 900;
	border:2px solid #000;
	border-radius: 100px;
	width: 75px;
	height: 75px;
	line-height: 75px;
}


.content-blanc
{
	background-color: #FFF;
}

.content-blanc .picto-chiffre
{
	color:#000C56;
	border-color: #000C56;
}





.content-bleu-fonce
{
	background-color: #000C56;
}

.content-bleu-fonce h3
{
	color:#fff;
}

.content-bleu-fonce blockquote h3
{
	color:#fff;
}

.content-bleu-fonce h2,
.content-bleu-fonce h1,
.content-bleu-fonce h4
{
	color: #fff;
}

.content-bleu-fonce p
{
	color:#fff;
}

.content-bleu-fonce a
{
	color:#000C56;
	text-decoration: underline;
}

.content-bleu-fonce .picto-chiffre
{
	color:#fff;
	border-color: #fff;
}

.content-bleu-fonce .bouton
{
	background: #fff;
	color:#000C56;
}

.content-bleu-fonce .bouton:hover
{
	background: #3075B6;
	color:#fff;
}


.content-bleu-clair
{
	background-color: #3075B6;
}

.content-bleu-clair h2,
.content-bleu-clair h1,
.content-bleu-clair h3,
.content-bleu-clair h4
{
	color: #fff;
}

.content-bleu-clair p
{
	color:#fff;
}

.content-bleu-fonce a
{
	color:#fff;
	text-decoration: underline;
}
.content-bleu-clair .picto-chiffre
{
	color:#fff;
	border-color: #fff;
}

.content-bleu-clair .bouton
{
	background: #fff;
	color:#000C56;
}

.content-bleu-clair .bouton:hover
{
	background: #000C56;
	color:#fff;
}



.content-gris
{
	background-color: #E6EEF6;
}

.content-gris h2,
.content-gris h1,
.content-gris h3,
.content-gris h4
{
	color: #000C56;
}

.content-gris p
{
	color:#000C56;
}

.content-bleu-fonce a
{
	color:#000C56;
	text-decoration: underline;
}

.content-gris .picto-chiffre
{
	color:#000C56;
	border-color: #000C56;
}

.liste-picto .display-inline-block
{
	padding-bottom: 80px;
}


.liste-picto-2 .display-inline-block
{
  padding-bottom: 20px;
}

.liste-picto .texte
{
	min-height: 160px;
}


#picto-efface .picto
{
	opacity: .5;
	-webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -ms-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

#picto-efface .texte,
#picto-efface .bouton
{
	opacity: 0;
	-webkit-transition: all 0.3s ease-in-out 0s;
  -moz-transition: all 0.3s ease-in-out 0s;
  -ms-transition: all 0.3s ease-in-out 0s;
  -o-transition: all 0.3s ease-in-out 0s;
  transition: all 0.3s ease-in-out 0s;
}

#picto-efface .col:hover .texte,
#picto-efface .col:hover .bouton,
#picto-efface .col:hover .picto
{
	opacity: 1;
}

#picto-efface .liste-picto .texte
{
	min-height: 100px;
	padding-top: 20px;
}

.bloc-debut-page
{
	color:#fff;
	height: 500px;
}

.bloc-debut-page .breadcrumb
{
	font-style: italic;
	font-weight: 300;
	line-height: 40px;
	margin-bottom: 20px;
	border-bottom: 1px solid #fff;
}

.bloc-debut-page .breadcrumb a
{
	color:#fff;
}

.bloc-debut-page .centrer
{
	position: relative;
	height: 100%;
}

.bloc-debut-page .col
{
	float: none;
	margin:0 auto;
	position: absolute;
	left: 0;
	top:50%;
	transform: translateY(-50%);
}

blockquote
{
	padding: 0 160px;
	position: relative;
}

blockquote::after
{
	content: ' ';
	background: url('images/quote-close.svg') no-repeat center center;
	position: absolute;
	width: 40px;
	height: 30px;
	right: 290px;
	bottom: 0;
}


blockquote::before
{
  content: ' ';
	background: url('images/quote-open.svg') no-repeat center center;
	position: absolute;
	width: 40px;
	height: 30px;
	left: 210px;
	top: 0;
}


.content-bleu-clair .chiffre,
.content-bleu-fonce .chiffre
{
  color:#DC5E5E;
}

.content-blanc .chiffre
{
  color:#0F3772;
}

.content-rouge .chiffre
{
  color:#fff;
}

.chiffre
{
  font-size: 48px;
  text-align: center;
  font-weight: bold;
  padding-bottom: 20px;
}

.ui-accordion h3
{
	height: 50px;
	line-height: 50px;
	padding: 0;
	padding-left: 20px;
	color:#fff;
	cursor: pointer;
	font-weight: 900;
	background-image: url('images/accordeon-plus.svg');
	background-repeat: no-repeat;
	background-position: right 20px center;

	outline: none;
}

.ui-accordion p
{
	color:#414141;
}

.content-blanc .ui-accordion h3
{
	background-color: #0F3772;
}

.content-bleu-fonce .ui-accordion h3
{
	background-color: #3667AF;
}

.content-bleu-clair .ui-accordion h3
{
	background-color: #0F3772;
}

.content-rouge .ui-accordion h3
{
	background-color: #0F3772;
}

.ui-accordion h3~h3
{
	margin-top: 30px;
}

.ui-accordion h3.ui-state-active
{
	background-image: url('images/accordeon-croix.svg');
}

.ui-accordion > div
{
	background: #fff;
	padding: 20px;
	padding-bottom: 0;
}

#image-rond img
{
	border-radius: 400px;
}

.bloc-texte-map
{
	height: 500px;
	padding: 0;
}

.bloc-texte-map .centrer
{
	height: 500px;
	position: relative;
}

.bloc-texte-map iframe
{
	height: 500px;
	width: 100%;
}

.bloc-texte-map .col-5
{
	position: absolute;
	right: 0;
	top:50%;
	transform: translateY(-50%);
}

.bloc-texte-map .image-semi-full
{
}

#colophon
{
	background: #000C56;
	padding: 40px 0;
	color:#fff;
	min-height: 20px;
	font-size: 13px;
	overflow: hidden;
}

#colophon a
{
	display: block;
	font-size: 16px;
	line-height: 24px;
	padding-bottom: 5px;
	color:#fff;
}

.footer
{
	padding-top: 40px;
}

.page-categorie
{
	padding: 40px 0;
}

article .miniature img
{
	display: block;
	padding-bottom: 20px;
}

article .date
{
	font-size: 16px;
	color: #3667AF;
	letter-spacing: 0px;
	line-height: 24px;
}

article h2
{
	font-size: 30px;
	color: #0F3772;
	padding-top: 20px;
	line-height: 36px;
}

article .extrait
{
}

article+article
{
	margin-top: 40px;
}

ol
{
	
}

ol li
{
	color:#fff;
	padding-bottom: 40px;
	position: relative;
	padding-left: 90px;
	line-height: 1.4em;
}

ol li::before
{
	content:"1";
	position: absolute;
	width: 50px;
	height: 50px;
	border:2px solid #fff;
	border-radius: 100px;
	left: 0;
	top:-10px;
	line-height: 50px;
	text-align: center;
	font-size: 20px;
	font-weight: 900;
}

ol li+li::before
{
	content:"2";
}

ol li+li+li::before
{
	content:"3";
}

ol li+li+li+li::before
{
	content:"4";
}

#no-padding-bottom
{
	padding-bottom: 0;
}

#no-padding
{
	padding: 0;
}

#no-padding-top
{
	padding-top: 0;
}

.liens
{
	padding-top: 50px;
}

.bloc-accueil .centrer
{
	position: absolute;
	text-align: center;
	transform: translate(-50%, -50%);
	left: 50%;
	top:050%;

}

.widget-title
{
	display: block;
	font-size: 24px;
	color: #000C56;
	line-height: 40px;
	border-bottom: 1px solid #000C56;
	text-transform: uppercase;
	margin-bottom: 20px;
}

.widget_archive a
{
	display: block;
	margin-bottom: 20px;
}

.filiale
{
	background: url('images/filiale.jpg') no-repeat center center;
	height: 100px;
	width: 100%;
	display: block;
}














/*************************************************************
************************** MOBILE ****************************
*************************************************************/






@media (max-width: 1024px)
{


  #access .burger
  {
    width: 50px;
    height: 50px;
    background: url('images/burger.svg') no-repeat center;
    position: absolute;
    right:20px;
    top:20px;
    cursor: pointer;
  }

  #branding .container
  {
  	position: relative;
  }

  .ancre-accueil
  {
  	display: none;
  }

  h1
  {
  	font-size: 28px;
  	line-height: 32px;
  }

  h2
  {
  	font-size: 20px;
  	line-height: 24px;
  }


  .bloc-accueil .contenu em
  {
  	font-size: 16px;
  	color:#fff;
  	letter-spacing: 0.5em;
  	text-transform: uppercase;
  }

  .bouton
  {
  	font-size: 14px;
  	padding:0 20px;
  	width: 260px;
  }

  .bloc-accueil .fleche
  {
  	bottom: 55px;
  }

  .bloc-accueil .centrer,
  .bloc-accueil
  {
  	background-size: auto 100%;

  }

  .bloc-accueil
  {
  	height: 500px;
  }

  .picto
  {
  	background-size: auto 70px;
  	height: 80px;
  }



	.liste-picto .display-inline-block
	{
		padding-bottom: 40px;
	}

	#picto-efface .picto,
	#picto-efface .texte, #picto-efface .bouton
	{
		opacity: 1;
	}

	#access #menu-menu-principal > li > a
	{
		font-size: 16px;
	}

	#access #menu-menu-principal > li+li > a
	{
		border-top: 1px solid #eee;
		padding-top: 10px;
	}

	.bloc-texte-image .col-right .image-semi-full,
	.bloc-texte-image .col-left .image-semi-full
	{
		background-size: auto 100%;
	}

	.chiffre
	{
		font-size: 38px;
	}

	.bloc-texte+.bloc-pictos,
	.bloc-texte+.bloc-pictos-slideshow,
	.bloc-texte+.bloc-mosaique
	{
		/*padding-top: 0;*/
	}

	.liste-picto .texte
	{
		min-height: auto;
	}

	.liste-picto .col
	{
		padding-bottom: 20px;
	}

	.liste-picto .display-inline-block
	{
		padding: 0;
	}

	.liste-mosaique .detail-mosaique .contenu
	{
		width: 280px;
	}

	#access #menu-menu-principal
	{
		display: none;
		width: 240px;
		background: #fff;
		padding-left: 20px;
		padding-right: 20px;
		position: absolute;
		right:0;
		top:100px;

		overflow: hidden;
	}

	#access > div > ul > li
	{
		float: none;
		padding-bottom: 10px;
	}

	#access.active #menu-menu-principal
	{
		display: block;
	}

	#access #menu-menu-principal > li > a
	{
		width: 240px;
		line-height: 20px;
		background: none!important;
		color:#000657!important;
		padding: 0;
		margin: 0;
	}

	#access #menu-menu-principal > li > a:hover
	{
		text-decoration: underline;
	}

	#access #menu-menu-principal > li > ul > li > a
	{
		padding-left: 20px;
	}

	.bloc-debut-page
	{
		padding-top: 40px;
		height: 150px;
		padding-bottom: 40px;
		background-size:  100% auto;
	}

	blockquote::before
	{
		left: 0;
	}

	blockquote::after
	{
		right: 0;
	}

	blockquote
	{
		padding: 0 50px;
	}

	.formulaire-contact .textarea-bloc textarea
	{
		width: 598px;
	}

	#logo
	{
		top:20px;
		width: 150px;
	}

	.bloc-texte-image .col-right .image-small
	{
		width: 300px;
	}

	.bloc-texte-image .image-semi-full
	{
		background-size: auto 100%;
	}

}

@media (max-width: 660px)
{

	header .container
	{
		position: relative;
	}

	#access .burger
	{
		/*width: 50px;
		height: 50px;
		background: url('images/burger.svg') no-repeat center center;
		cursor: pointer;
		position: absolute;
		right: 0;
		top:0;*/
		z-index: 99;
	}

	#access.active .burger
	{
		/*background-image: url(images/croix-menu.svg);*/
	}

	#access #menu-menu-principal
	{
		position: absolute;
		left: 0;
		top:100px;
		z-index: 9;
		display: none;
		padding-top: 10px;
	}

	#access.active #menu-menu-principal
	{
		display: block;
		text-align: center;
	}


	#access #menu-menu-principal > li
	{
		float: none;
		height: auto;
	}

	#access #menu-menu-principal > li > a
	{
		height: auto;		
	}


	#access #menu-menu-principal > li:hover > ul
	{
		display: none;
	}

	#access #menu-menu-principal > li > ul
	{
		position: static;
		background: none;
	}

	#access #menu-menu-principal > li > ul.active
	{
		display: block;
	}

	#access #menu-menu-principal > li > ul > li > a
	{
		background: none;
		padding-left: 30px;
		font-size: 16px;
		color:#fff;
		line-height: 40px;
	}

	#access #menu-menu-principal > li > ul > li > a:hover
	{
		color:#DC5E5E;
	}

	#access #menu-menu-principal > li > ul > li > a::before
	{
		content:"> ";
		color:#FFF!important;
	}
	
	.bloc-accueil .contenu
	{
		position: static;
		transform: none;
		margin-top: 100px;
	}

	.bloc-accueil .centrer, .bloc-accueil
	{
		height: auto;
		padding: 40px 0;
	}

	.bloc-accueil
	{
		height: 150px;
	}

	.bloc-accueil img
	{
		max-width: 70%;
	}

	.bloc-accueil .fleche
	{
		transform: none;
		position: static;
		display: block;
		margin: 40px auto;
	}
	
	.footer
	{
		text-align: center;
	}

	#colophon .logo-footer
	{
		display: inline-block;
	}

	#colophon .sociaux
	{
		text-align: center;
		padding: 20px 0;
	}

	.bloc-texte-map .centrer
	{
		height: auto;
		padding: 40px 0;
	}

	.bloc-texte-map .col-5
	{
		position: static;
		transform: none;
	}

	.bloc-texte-map
	{
		height: auto;
		text-align: center;
	}

	.formulaire-contact .textarea-bloc textarea
	{
		width: 258px;
	}

	h3
	{
		line-height: 30px;
		font-size: 20px;
	}

	.bouton
	{
		width: 240px;
	}

	.col-right
	{
		padding-bottom: 20px;
	}

	.bloc-texte, .bloc-pictos, .bloc-chiffres, .bloc-mosaique
	{
		padding-top: 70px;
		padding-bottom: 50px;
	}

	.liste-picto .col
	{
		float: left;
	}

	#colophon
	{
		text-align: center;
	}

	.bloc-debut-page
	{
		background-size: auto 100%;
	}

	.bloc-texte-image .image-semi-full
	{
		background-size: 100% auto;
		background-position: center;
	}
}