/***************************************   */

/********** Styles CCM 2017 *************/

/***************************************   */

/* Description :                        */

/*  - Styles CCM 2017                   */

/* Responsabilité :                     */

/*  - Équipe DIGITALE CM-CIC/SMB        */

/* Historique :                         */

/*  - 26/04/2017 : création             */

/***************************************   */

/***************************************   */

/* ==============================================
. Break
============================================== */

/* ==============================================
. Fonts
============================================== */

/* @extra-large:    ~"only screen and (min-width: @{lg-min})"; */

/* Bleu */

/* Rouge */

/* Vert */

/* Bleu Clair */

/* Noir */

/* Blanc */

/* ------------------------------------ */

/* ==Pictos de la font fts-commun		*/

/* ------------------------------------ */
.cc .picto {
  font-size: 18px;
  font-family: fts_picto;
}

.cc .picto.green {
  color: #393;
}

.cc .picto.orange {
  color: #ff5400;
}

.cc .picto.red {
  color: #d15462;
}

.cc div.font {
  display: inline-block;
  color: #393;
  font-size: 18px;
  font-family: fts_picto;
}

.cc div.font::before {
  speak-as: none;
}

.cc div.font.agence::before {
  content: '\e62f';
}

.cc div.font.facile::before {
  content: '\E826';
}

.cc div.font.pratique::before {
  content: '\EBA4';
}

.cc div.font.proximite::before {
  content: '\EC61';
}

.cc div.font.utile::before {
  content: '\ED4F';
}

.cc div.font.reconnu::before {
  content: '\EB83';
}

.cc div.font.rejoindre::before {
  content: '\E902';
}

.cc div.font.dispo::before {
  content: '\EA47';
}

.cc div.font.securite::before {
  content: '\EB9F';
}

.cc div.font.personnalise::before {
  content: '\E65D';
}

.cc div.font.performance::before {
  content: '\EB0C';
}

.cc div.font.transparence::before {
  content: '\E833';
}

.cc div.font.protection::before {
  content: '\ECCE';
}

.cc div.font.mesure::before {
  content: '\ED27';
}

.cc div.font.flexible::before {
  content: '\E808';
}

.cc div.font.reactivite::before {
  content: '\ECDB';
}

.cc div.font.expertise::before {
  content: '\E829';
}

.cc div.font.avec-vous::before {
  content: '\E820';
}

.cc div.font.osez::before {
  content: '\ED88';
}

.cc div.font.Musique::before {
  content: '\EC28';
}

/*
@glyphe_ic_cancel: @glyphe_ic_close_circle;
@glyphe_ic_help:@glyphe_ic_help_circle; */

/***************************************   */

/********** Styles CCM 2017 *************/

/****************************************
/* Description :                        */

/*  - Styles CCM 2017/Core              */

/* Responsabilité :                     */

/*  - Équipe DIGITALE CM-CIC/SMB        */

/* Historique :                         */

/*  - 26/04/2017 : création             */

/***************************************   */

/***************************************   */
#CMSD_MENU > ul > li:first-child {
  flex: 1 0 0%;
}

#CMSD_MENU > ul > li:first-child a {
  text-align: center;
}

#ei_tpl_search {
  display: none;
}

.cc {
  padding: 0;

  /* img{
		max-width:none;
	} */

  /* Inserts  */

  /* Colonnages */

  /* Rebonds */

  /* ==========================================================================
	19. collapsed
	========================================================================== */

  /* Pour collapse dans un table */
}

.cc .RWD-M-alt {
  display: none;
}
@media only screen and (max-width: 970px) {
  .cc .RWD-M-alt {
    display: block;
  }
}

.cc .padding {
  padding-top: 10px;
  padding-bottom: 10px;
}
@media only screen and (max-width: 970px) {
  .cc .RWD-M {
    display: none;
  }
}

.cc table caption .soft {
  color: #fff;
  font-weight: 300;
}

.cc h1,
.cc h2,
.cc h3 {
  font-weight: 300;
}

.cc h1 > strong,
.cc h2 > strong,
.cc h3 > strong {
  font-weight: 600;
}

.cc h1 {
  /* px */
  font-size: 40px;

  /* rem */
  font-size: 40 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc h1 {
    /* px */
    font-size: 30px;

    /* rem */
    font-size: 30 / 16rem;
  }
}

.cc h3,
.cc p {
  color: #414141;
}

.cc section.body p.legal {
  /* px */
  margin: 20px 0 10px;

  /* rem */
  margin: 20 / 16rem 0 / 16rem 10 / 16rem 0 / 16rem;
  margin-bottom: -32px;
  padding: 20px;
  background-color: #f1f1f1;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  text-align: center;
}
@media only screen and (max-width: 970px) {
  .cc section.body p.legal {
    /* px */
    margin: 20px 28px 10px;

    /* rem */
    margin: 20 / 16rem 28 / 16rem 10 / 16rem 28 / 16rem;
  }
}
@media only screen and (max-width: 768px) {
  .cc section.body {
    top: 115px;
  }
}

.cc footer p {
  /* px */
  margin: 20px 12px 10px;

  /* rem */
  margin: 20 / 16rem 12 / 16rem 10 / 16rem 12 / 16rem;
}

.cc footer .legal,
.cc footer .note {
  /* px */
  margin: 20px 12px 10px;

  /* rem */
  margin: 20 / 16rem 12 / 16rem 10 / 16rem 12 / 16rem;
}
@media only screen and (max-width: 970px) {
  .cc footer .legal,
  .cc footer .note {
    /* px */
    margin: 20px 28px 10px;

    /* rem */
    margin: 20 / 16rem 28 / 16rem 10 / 16rem 28 / 16rem;
  }
}

.cc .example {
  color: #6c6c6c !important;
}

.cc .example strong {
  font-size: 1.2em;
}

.cc .ctxt-CP {
  justify-content: center;
  margin-top: 70px;
  padding-bottom: 200px;
  background: transparent url(../../CCM/assets/charte/img-home-map.png) no-repeat top right;
  text-align: center;
}
@media only screen and (max-width: 970px) {
  .cc .ctxt-CP {
    background: none;
  }
}

.cc .ctxt-CP + div.tiles {
  margin-top: -180px;
}

.cc .ctxt-CP .tile {
  flex: 1 1 0%;
  background: transparent;
  box-shadow: 0 0 0 0;
}

.cc .ctxt-CP h2 {
  margin-top: 35px;
  margin-bottom: 10px;
  color: #414141;
  font-size: 36px;
}

.cc .ctxt-CP h2::before {
  content: ' ';
  bottom: 4px;
  left: 0;
  display: inline-block;

  /* px */
  width: 24px;

  /* rem */
  width: 24 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  margin-right: 5px;
  background-color: #d15462;
}

.cc .ctxt-CP h2::after {
  content: ' ';
  right: 0;
  bottom: 4px;
  display: inline-block;

  /* px */
  width: 24px;

  /* rem */
  width: 24 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  margin-left: 5px;
  background-color: #d15462;
}
@media only screen and (max-width: 400px) {
  .cc .ctxt-CP h2 {
    font-size: 25px;
  }
}

.cc .ctxt-CP h3 {
  font-size: 16px;
}

.cc ol.styled {
  margin: 0;

  /* px */
  margin-left: 35px;

  /* rem */
  margin-left: 35 / 16rem;
  padding: 0;
  list-style-type: none;
  counter-reset: li-counter;
}

.cc ol.styled > li {
  position: relative;

  /* px */
  min-height: 24px;

  /* rem */
  min-height: 24 / 16rem;

  /* px */
  margin-bottom: 16px;

  /* rem */
  margin-bottom: 16 / 16rem;

  /* px */
  padding-left: 8px;

  /* rem */
  padding-left: 8 / 16rem;
  border-left: 2px solid #ccc;
}

.cc ol.styled > li::before {
  content: counter(li-counter);
  position: absolute;
  top: 0;

  /* px */
  left: -45px;

  /* rem */
  left: -45 / 16rem;

  /* px */
  width: 35px;

  /* rem */
  width: 35 / 16rem;
  color: #b8b8b8;
  font-weight: bold;

  /* px */
  font-size: 32px;

  /* rem */
  font-size: 32 / 16rem;
  line-height: 1;
  counter-increment: li-counter;
  text-align: right;
}

.cc ol.styled > li:only-child::before {
  content: '';
}

.cc ol.styled strong {
  color: #4471a8;
  font-weight: bold;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
}

.cc ol.landing {
  display: flex;
  align-items: stretch;

  /* px */
  margin: 8px 16px;

  /* rem */
  margin: 8 / 16rem 16 / 16rem;
  list-style-type: none;
  line-height: 1.2;
  counter-reset: li-counter;
}
@media only screen and (max-width: 768px) {
  .cc ol.landing {
    flex-direction: column;
    margin: 0;
  }
}

.cc ol.landing li {
  flex: 1 1 1%;

  /* px */
  padding: 0 16px;

  /* rem */
  padding: 0 / 16rem 16 / 16rem;

  /* px */
  font-size: 12px;

  /* rem */
  font-size: 12 / 16rem;
  text-align: center;
}
@media only screen and (max-width: 768px) {
  .cc ol.landing li {
    flex: none;
    padding: 8px 0;
    text-align: left;
  }
}

.cc ol.landing li::before {
  content: counter(li-counter);
  top: 0;

  /* px */
  left: -45px;

  /* rem */
  left: -45 / 16rem;

  /* px */
  width: 35px;

  /* rem */
  width: 35 / 16rem;
  border-bottom: 2px solid #ccc;
  color: #b8b8b8;
  font-weight: bold;

  /* px */
  font-size: 45px;

  /* rem */
  font-size: 45 / 16rem;
  line-height: 1;
  counter-increment: li-counter;
  text-align: center;
}
@media only screen and (max-width: 768px) {
  .cc ol.landing li::before {
    border-right: 2px solid #ccc;
    border-bottom: 0;
  }
}

.cc ol.landing li p {
  margin-top: 7px;
  padding-top: 22px;
  padding-bottom: 3px;
}
@media only screen and (max-width: 768px) {
  .cc ol.landing li p {
    margin-top: 0;
    padding: 0;
  }
}

.cc .button {
  display: inline-block;

  /* px */
  margin: 16px 0 0;

  /* rem */
  margin: 16 / 16rem 0 / 16rem 0 / 16rem 0 / 16rem;

  /* px */
  padding: 7px 32px;

  /* rem */
  padding: 7 / 16rem 32 / 16rem;
  border: 1px solid #4471a8;
  background-color: #4471a8;
  color: #fff;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  text-align: center;
  text-decoration: none;
}

.cc .button:hover,
.cc .button:focus {
  border-color: #4471a8;
  background-color: #fff;
  color: #4471a8;
}

.cc .btninvert {
  display: inline-block;

  /* px */
  margin: 16px 0 0;

  /* rem */
  margin: 16 / 16rem 0 / 16rem 0 / 16rem 0 / 16rem;

  /* px */
  padding: 7px 32px;

  /* rem */
  padding: 7 / 16rem 32 / 16rem;
  border: 1px solid #4471a8;
  background-color: #fff;
  color: #4471a8;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  text-align: center;
  text-decoration: none;
}

.cc .btninvert:hover,
.cc .btninvert:focus {
  border-color: #fff;
  background-color: #4471a8;
  color: #fff;
}

.cc .lien {
  display: inline-block;
  width: 100%;

  /* px */
  margin: 16px 0 0;

  /* rem */
  margin: 16 / 16rem 0 / 16rem 0 / 16rem 0 / 16rem;

  /* px */
  padding: 7px 32px 7px 8px;

  /* rem */
  padding: 7 / 16rem 32 / 16rem 7 / 16rem 8 / 16rem;
  background-color: rgb(0 0 0 / 50%);
  color: #fff;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  text-decoration: none;
}

.cc .lien::after {
  content: '\EBB6';
  display: inline-block;
  vertical-align: middle;

  /* px */
  width: 20px;

  /* rem */
  width: 20 / 16rem;

  /* px */
  height: 24px;

  /* rem */
  height: 24 / 16rem;
  padding-top: 1px;
  color: #fff;

  /* px */
  font-size: 22px;

  /* rem */
  font-size: 22 / 16rem;
  font-family: fts_commun;
  transition: color 0.2s linear;
}

.cc .lien:hover::after,
.cc .lien:focus::after {
  padding-left: 5px;
  color: #4471a8;
}
@media only screen and (max-width: 400px) {
  .cc .lien {
    /* px */
    font-size: 12px;

    /* rem */
    font-size: 12 / 16rem;
  }
}

.cc header {
  /* &.dossier, &.article {
			background-color: @C15;
			border-radius: 3px;
			.px-to-rem(margin-bottom, @grid*6);
			div.banner {
				.px-to-rem(margin-bottom, @grid*4);
				.px-to-rem(padding-top, @grid*4);
				h1 {
					.px-to-rem(padding, @grid*2 0 @grid*2 @grid*5);
					color: @C1;
					line-height: 1.1;
					position: relative;
					margin-right: 30%;
					&:before {
						display: block;
						content: " ";
						position: absolute;
						left: 0;
						top: 51px;
						.px-to-rem(height, @grid/4);
						.px-to-rem(width, @grid*5);
						background-color: @C2;
					}
				}
				p.chapo {
					.px-to-rem(font-size, 20);
					position: relative;
					line-height: 1.5;
					margin-right: 25%;
					.px-to-rem(padding-top, @grid);
					.px-to-rem(padding-left, @grid*5);
				}
				.surtitre {
					color: @C4;
					text-transform: uppercase;
					.px-to-rem(font-size, 14);
					.px-to-rem(padding, @grid 0 @grid @grid*4);
				}
			}
		} */
}

.cc header.hero {
  /* px */
  min-height: 400px;

  /* rem */
  min-height: 400 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc header.hero {
    min-height: auto;
  }
}

.cc header.hero div.img {
  position: absolute;
  top: 100px;
  left: 0;
  overflow: hidden;
  width: 100%;
  padding: 0;
}

.cc header.hero div.img figure {
  overflow: hidden;
  text-align: center;
}

.cc header.hero div.img img {
  position: relative;
  left: 100%;

  /* max-width: unset; */
  max-width: none;
  margin-left: -200%;
}
@media only screen and (max-width: 768px) {
  .cc header.hero div.img img {
    width: 200%;
    height: auto;
    margin-left: -240%;
  }
}

.cc header.hero div.img img {
  position: relative;
  left: 100%;

  /* max-width: unset; */
  max-width: none;
  margin-left: -200%;
}
@media only screen and (max-width: 768px) {
  .cc header.hero div.img img {
    width: 200%;
    height: auto;
    margin-left: -240%;
  }
}
@media only screen and (max-width: 970px) {
  .cc header.hero div.img {
    top: 60px;
  }
}
@media only screen and (max-width: 768px) {
}

.cc header.hero div.img-landing {
  position: absolute;
  top: 0;
  left: 0;
  overflow: hidden;
  width: 100%;
  padding: 0;
}

.cc header.hero div.img-landing figure {
  overflow: hidden;
  text-align: center;
}

.cc header.hero div.home {
  width: 35%;

  /* px */
  margin-top: 48px;

  /* rem */
  margin-top: 48 / 16rem;

  /* px */
  margin-right: 32px;

  /* rem */
  margin-right: 32 / 16rem;

  /* px */
  margin-bottom: 32px;

  /* rem */
  margin-bottom: 32 / 16rem;

  /* px */
  margin-left: 32px;

  /* rem */
  margin-left: 32 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc header.hero div.home {
    width: calc(100% - 32px);

    /* px */
    margin-top: 20px;

    /* rem */
    margin-top: 20 / 16rem;

    /* px */
    margin-right: 16px;

    /* rem */
    margin-right: 16 / 16rem;

    /* px */
    margin-left: 16px;

    /* rem */
    margin-left: 16 / 16rem;
  }
}

.cc header.hero div.home p.intro,
.cc header.hero div.home h1 {
  /* px */
  margin-top: 8px;

  /* rem */
  margin-top: 8 / 16rem;

  /* px */
  margin-right: 24px;

  /* rem */
  margin-right: 24 / 16rem;

  /* px */
  margin-bottom: 16px;

  /* rem */
  margin-bottom: 16 / 16rem;

  /* px */
  margin-left: 32px;

  /* rem */
  margin-left: 32 / 16rem;
  color: #4471a8;
  font-weight: 300;
  font-weight: normal;

  /* px */
  font-size: 30px;

  /* rem */
  font-size: 30 / 16rem;
  line-height: 1.1;
}
@media only screen and (max-width: 400px) {
  .cc header.hero div.home p.intro,
  .cc header.hero div.home h1 {
    /* px */
    font-size: 26px;

    /* rem */
    font-size: 26 / 16rem;
  }
}

.cc header.hero div.home .button {
  display: inline-block;

  /* px */
  margin: 16px 0;

  /* rem */
  margin: 16 / 16rem 0 / 16rem;

  /* px */
  padding: 16px 32px;

  /* rem */
  padding: 16 / 16rem 32 / 16rem;
  border: 1px solid #4471a8;
  background-color: #4471a8;
  color: #fff;
  box-shadow: 0 8px 6px -6px #d2d0cc;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  text-align: center;
  text-decoration: none;
}

.cc header.hero div.home .button:hover,
.cc header.hero div.home .button:focus {
  border-color: #4471a8;
  background-color: #fff;
  color: #4471a8;
}

.cc header.hero div.banner {
  /* px */
  margin-bottom: 160px;

  /* rem */
  margin-bottom: 160 / 16rem;

  /* px */
  padding-top: 32px;

  /* rem */
  padding-top: 32 / 16rem;
}
@media only screen and (max-width: 970px) {
  .cc header.hero div.banner {
    position: absolute;
    top: 110px;
  }
}
@media only screen and (max-width: 768px) {
  .cc header.hero div.banner {
    top: 75px;
  }
}
@media only screen and (max-width: 400px) {
  .cc header.hero div.banner {
    top: 40px;
  }
}

.cc header.hero div.banner h1 {
  position: relative;

  /* px */
  padding: 32px 480px 8px 40px;

  /* rem */
  padding: 32 / 16rem 480 / 16rem 8 / 16rem 40 / 16rem;
  color: black;
  line-height: 1.1;
  text-transform: uppercase;
}
@media only screen and (max-width: 768px) {
  .cc header.hero div.banner h1 {
    /* px */
    padding: 0 0 0 32px;

    /* rem */
    padding: 0 / 16rem 0 / 16rem 0 / 16rem 32 / 16rem;

    /* px */
    font-size: 25px;

    /* rem */
    font-size: 25 / 16rem;
  }
}

.cc header.hero div.banner h1::before {
  content: ' ';
  position: absolute;
  top: 66px;
  left: 0;
  display: block;

  /* px */
  width: 32px;

  /* rem */
  width: 32 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  background-color: #d15462;
}
@media only screen and (max-width: 768px) {
  .cc header.hero div.banner h1::before {
    top: 27px;
  }
}

.cc header.hero div.banner p {
  position: relative;
  margin-right: 20%;

  /* px */
  padding-top: 24px;

  /* rem */
  padding-top: 24 / 16rem;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  line-height: 1.1;
}

.cc header.hero div.tile {
  position: relative;

  /* px */
  padding: 32px 0 8px;

  /* rem */
  padding: 32 / 16rem 0 / 16rem 8 / 16rem 0 / 16rem;
  background-color: #fff;
}
@media only screen and (max-width: 768px) {
  .cc header.hero div.tile {
    margin-top: 185px;

    /* px */
    padding: 8px 0;

    /* rem */
    padding: 8 / 16rem 0 / 16rem 8 / 16rem 0 / 16rem;
  }
}
@media only screen and (max-width: 400px) {
  .cc header.hero div.tile {
    margin-top: 125px;
  }
}
@media only screen and (max-width: 768px) {
  .cc header.hero div.tile p.intro {
    /* px */
    margin-bottom: 8px;

    /* rem */
    margin-bottom: 8 / 16rem;
  }
}

.cc header.hero > p,
.cc header.hero > ul,
.cc header.hero > div {
  /* px */
  padding: 0 32px;

  /* rem */
  padding: 0 / 16rem 32 / 16rem;
  color: #4471a8;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
}

.cc header.conseil {
  /* px */
  min-height: 400px;

  /* rem */
  min-height: 400 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc header.conseil {
    min-height: auto;
  }
}

.cc header.conseil div.img {
  left: 0;
  overflow: hidden;
  width: 100%;
  margin-bottom: 40px;
  padding: 0;
}

.cc header.conseil div.img figure {
  overflow: hidden;
  text-align: center;
}

.cc header.conseil div.img img {
  position: relative;
  left: 100%;

  /* max-width: unset; */
  max-width: none;
  margin-left: -200%;
}
@media only screen and (max-width: 768px) {
  .cc header.conseil div.img img {
    width: 200%;
    height: auto;
    margin-left: -240%;
  }
}
@media only screen and (max-width: 970px) {
  .cc header.conseil div.img {
    top: 60px;
  }
}
@media only screen and (max-width: 768px) {
}

.cc header.conseil div.banner {
  /* px */
  padding-top: 32px;

  /* rem */
  padding-top: 32 / 16rem;

  /* px */
  padding-bottom: 32px;

  /* rem */
  padding-bottom: 32 / 16rem;
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  background-color: #fff;
  box-shadow: 0 0 8px 0 #ccc;
}
@media only screen and (max-width: 970px) {
  .cc header.conseil div.banner {
    position: absolute;
    top: 110px;
  }
}
@media only screen and (max-width: 768px) {
  .cc header.conseil div.banner {
    top: 75px;
  }
}
@media only screen and (max-width: 400px) {
  .cc header.conseil div.banner {
    top: 40px;
  }
}

.cc header.conseil div.banner h1 {
  position: relative;

  /* px */
  padding: 32px 400px 8px 0;

  /* rem */
  padding: 32 / 16rem 400 / 16rem 8 / 16rem 0 / 16rem;
  color: #4471a8;
  line-height: 1.1;
}
@media only screen and (max-width: 768px) {
  .cc header.conseil div.banner h1 {
    /* px */
    padding: 0 0 0 32px;

    /* rem */
    padding: 0 / 16rem 0 / 16rem 0 / 16rem 32 / 16rem;

    /* px */
    font-size: 25px;

    /* rem */
    font-size: 25 / 16rem;
  }
}

.cc header.conseil div.banner h1::before {
  content: ' ';
  position: absolute;
  top: 66px;
  display: block;

  /* px */
  width: 32px;

  /* rem */
  width: 32 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  padding-left: -32px;
  background-color: #d15462;
}
@media only screen and (max-width: 768px) {
  .cc header.conseil div.banner h1::before {
    top: 27px;
  }
}

.cc header.conseil div.banner p {
  position: relative;
  margin-right: 20%;

  /* px */
  padding-top: 24px;

  /* rem */
  padding-top: 24 / 16rem;
  color: #414141;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  line-height: 1.3;
}

.cc header.conseil > p,
.cc header.conseil > ul,
.cc header.conseil > div {
  /* px */
  padding: 0 32px;

  /* rem */
  padding: 0 / 16rem 32 / 16rem;
  color: #4471a8;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
}

.cc div.menu {
  position: relative;
  margin-top: 87px;

  /* px */
  margin-bottom: 32px;

  /* rem */
  margin-bottom: 32 / 16rem;

  /* px */
  padding-bottom: 16px;

  /* rem */
  padding-bottom: 16 / 16rem;
  background-color: #fff;
  box-shadow: 0 0 8px 0 #ccc;
}
@media only screen and (max-width: 970px) {
  .cc div.menu {
    /* px */
    margin: 32px 16px;

    /* rem */
    margin: 32 / 16rem 16 / 16rem;
  }
}
@media only screen and (max-width: 768px) {
  .cc div.menu {
    padding-bottom: 0;
  }
}
@media only screen and (max-width: 768px) {
  .cc div.menu div.domaine {
    /* px */
    padding-bottom: 16px;

    /* rem */
    padding-bottom: 16 / 16rem;
  }
}

.cc div.menu div.domaine > ul.img {
  display: flex;
  align-items: center;

  /* px */
  margin: 8px 16px;

  /* rem */
  margin: 8 / 16rem 16 / 16rem;
  line-height: 1.2;
}
@media only screen and (max-width: 768px) {
  .cc div.menu div.domaine > ul.img {
    flex-direction: column;
    margin: 0;
  }
}

.cc div.menu div.domaine > ul.img li {
  flex: 1 1 0%;

  /* px */
  padding: 0 16px;

  /* rem */
  padding: 0 / 16rem 16 / 16rem;
  border-radius: 5px;
  text-align: center;
}
@media only screen and (max-width: 768px) {
  .cc div.menu div.domaine > ul.img li {
    flex: 1 1 auto;
    width: 100%;
  }
}

.cc div.menu div.domaine > ul.img li h3,
.cc div.menu div.domaine > ul.img li h2 {
  padding-bottom: 0;
  box-shadow: 0 0 8px 0 #ccc;
}

.cc div.menu div.domaine > ul.img li h3 a,
.cc div.menu div.domaine > ul.img li h2 a {
  display: block;
  margin-top: 16px;
  padding-top: 30px;
  padding-bottom: 30px;
  color: #797979;

  /* px */
  font-size: 18px;

  /* rem */
  font-size: 18 / 16rem;
  text-decoration: none;
  text-transform: uppercase;
}
@media only screen and (max-width: 768px) {
  .cc div.menu div.domaine > ul.img li h3 a,
  .cc div.menu div.domaine > ul.img li h2 a {
    padding: 16px 16px 16px 60px;
    text-align: left;
  }
}

.cc div.menu div.domaine > ul.img li h3 a.font::before,
.cc div.menu div.domaine > ul.img li h2 a.font::before {
  display: block;

  /* px */
  height: 48px;

  /* rem */
  height: 48 / 16rem;
  color: #4471a8;

  /* px */
  font-size: 42px;

  /* rem */
  font-size: 42 / 16rem;
  font-family: fts_picto;
}

.cc div.menu div.domaine > ul.img li h3 a.font.comptes::before,
.cc div.menu div.domaine > ul.img li h2 a.font.comptes::before {
  content: '\F0248';
}

.cc div.menu div.domaine > ul.img li h3 a.font.emprunter::before,
.cc div.menu div.domaine > ul.img li h2 a.font.emprunter::before {
  content: '\F0727';
}

.cc div.menu div.domaine > ul.img li h3 a.font.assurer::before,
.cc div.menu div.domaine > ul.img li h2 a.font.assurer::before {
  content: '\F013E';
}

.cc div.menu div.domaine > ul.img li h3 a.font.epargner::before,
.cc div.menu div.domaine > ul.img li h2 a.font.epargner::before {
  content: '\F06C4';
}

.cc div.menu div.domaine > ul.img li h3 a.font.phone::before,
.cc div.menu div.domaine > ul.img li h2 a.font.phone::before {
  content: '\F05D4';
}

.cc div.menu div.domaine > ul.img li h3 a.font.dossier::before,
.cc div.menu div.domaine > ul.img li h2 a.font.dossier::before {
  content: '\ED98';
}
@media only screen and (max-width: 768px) {
  .cc div.menu div.domaine > ul.img li h3 a.font::before,
  .cc div.menu div.domaine > ul.img li h2 a.font::before {
    position: absolute;
    left: 8px;
  }
}

.cc div.menu div.domaine > ul.img li h3 a:hover,
.cc div.menu div.domaine > ul.img li h2 a:hover,
.cc div.menu div.domaine > ul.img li h3 a:focus,
.cc div.menu div.domaine > ul.img li h2 a:focus {
  background-color: #f8f8f8;
  color: #4471a8;
}

.cc div.menu .button {
  display: inline-block;

  /* px */
  margin: 16px 0;

  /* rem */
  margin: 16 / 16rem 0 / 16rem;

  /* px */
  padding: 16px 32px;

  /* rem */
  padding: 16 / 16rem 32 / 16rem;
  border: 1px solid #4471a8;
  background-color: #4471a8;
  color: #fff;
  box-shadow: 0 8px 6px -6px #d2d0cc;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  text-align: center;
  text-decoration: none;
}

.cc div.menu .button:hover,
.cc div.menu .button:focus {
  border-color: #4471a8;
  background-color: #fff;
  color: #4471a8;
}

.cc section.offre.insert div.container {
  display: block;
}

.cc section div.container {
  position: relative;
  display: flex;
  align-items: center;
  padding: 0;
}
@media only screen and (max-width: 768px) {
  .cc section div.container {
    flex-direction: column;
  }
}

.cc section div.container > div {
  flex: 1 1 50%;
}
@media only screen and (max-width: 768px) {
  .cc section div.container > div {
    flex: none;
    width: 100%;
  }
}

.cc section div.container > div.banner {
  /* px */
  padding-left: 32px;

  /* rem */
  padding-left: 32 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc section div.container > div.banner {
    padding-left: 0;
  }
}

.cc section div.container > div.banner > form {
  /* px */
  margin-right: 32px;

  /* rem */
  margin-right: 32 / 16rem;
}

.cc section div.container > div.banner > ul.immo {
  display: flex;
  align-items: stretch;

  /* px */
  margin: 8px 16px 8px -16px;

  /* rem */
  margin: 8 / 16rem 16 / 16rem 8 / 16rem -16 / 16rem;
  line-height: 1.2;
}
@media only screen and (max-width: 768px) {
  .cc section div.container > div.banner > ul.immo {
    flex-direction: column;
    margin: 0;
    padding-left: 0;
  }
}

.cc section div.container > div.banner > ul.immo li {
  flex: 1 1 1%;
  flex-direction: row;

  /* px */
  padding: 0 16px;

  /* rem */
  padding: 0 / 16rem 16 / 16rem;

  /* px */
  font-size: 12px;

  /* rem */
  font-size: 12 / 16rem;
  text-align: center;
}

.cc section div.container > div.banner > ul.immo li p {
  /* px */
  margin-top: 10px;

  /* rem */
  margin-top: 10 / 16rem;

  /* px */
  margin-bottom: 0;

  /* rem */
  margin-bottom: 0 / 16rem;
  line-height: 1.5;
}
@media only screen and (max-width: 768px) {
  .cc section div.container > div.banner > ul.immo li {
    flex: none;

    /* px */
    margin-top: 5px;

    /* rem */
    margin-top: 5 / 16rem;
    padding: 8px 0;
  }
}

.cc section div.container > div.img {
  overflow: hidden;

  /* px */
  margin-bottom: -32px;

  /* rem */
  margin-bottom: -32 / 16rem;
  text-align: right;
}

.cc section div.container > div.img img {
  width: auto;
  margin: 0 0 0 auto;
}

.cc section div.container > div.img.imgbas {
  /* px */
  margin-top: 32px;

  /* rem */
  margin-top: 32 / 16rem;
}

.cc section div.container > div.img.imgcenter img {
  /* px */
  margin: 32px auto 0;

  /* rem */
  margin: 32 / 16rem auto 0 / 16rem auto;
}

.cc section div.container.imgbas {
  display: block;

  /* px */
  padding: 0;

  /* rem */
  padding: 0 / 16rem;
}

.cc section div.container.imgbas > div.banner {
  /* px */
  padding-left: 40px;

  /* rem */
  padding-left: 40 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc section div.container.imgbas > div.banner {
    /* px */
    padding-bottom: 32px;

    /* rem */
    padding-bottom: 32 / 16rem;
  }
}

.cc section div.container.imgright {
  /* px */
  padding: 0;

  /* rem */
  padding: 0 / 16rem;
}

.cc section div.container.imgright > div.banner {
  /* px */
  padding-left: 40px;

  /* rem */
  padding-left: 40 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc section div.container.imgright > div.banner {
    /* px */
    padding-left: 32px;

    /* rem */
    padding-left: 32 / 16rem;
  }
}

.cc section div.container.imgcenter {
  /* px */
  padding: 0;

  /* rem */
  padding: 0 / 16rem;
}

.cc section div.container.imgcenter > div.banner {
  /* px */
  padding-left: 40px;

  /* rem */
  padding-left: 40 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc section div.container.imgcenter > div.banner {
    /* px */
    padding-left: 32px;

    /* rem */
    padding-left: 32 / 16rem;
  }
}

.cc section.body,
.cc div.insert {
  position: relative;
  overflow: hidden;

  /* px */
  margin-bottom: 32px;

  /* rem */
  margin-bottom: 32 / 16rem;

  /* px */
  padding: 32px 0;

  /* rem */
  padding: 32 / 16rem 0 / 16rem;
  background-color: #fff;
  box-shadow: 0 0 8px 0 #ccc;

  /* p {
			.px-to-rem(margin-bottom, @grid*2);
		} */
}
@media only screen and (max-width: 768px) {
  .cc section.body,
  .cc div.insert {
    /* px */
    margin: 16px;

    /* rem */
    margin: 16 / 16rem;
  }
}

.cc section.body h2,
.cc div.insert h2 {
  position: relative;
  color: #4471a8;

  /* px */
  font-size: 23px;

  /* rem */
  font-size: 23 / 16rem;
  line-height: 1.1;
  text-transform: uppercase;
}

.cc section.body h2::before,
.cc div.insert h2::before {
  content: ' ';
  position: absolute;
  top: 17px;
  left: 0;
  display: block;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  background-color: #d15462;
}

.cc section.body h3,
.cc div.insert h3 {
  color: #4471a8;
}

.cc section.body h3 {
  /* px */
  margin-top: 8px;

  /* rem */
  margin-top: 8 / 16rem;
}

.cc section.body,
.cc section.offre {
  /* div.container {
			display: flex;
			align-items: flex-end;
			padding: 0;
			position: relative;
			> div {
				flex: ~"1 1 0%";
				&.banner {
					.px-to-rem(padding-left, @grid*4);
				}
				&.img {
					text-align: right;
					.px-to-rem(margin-bottom, -@grid*4);
					img {
						margin: 0 0 0 auto;
					}
				}
			}
		} */

  /* div.container2 {
			display: flex;
			padding: 0;
			position: relative;
			> div {
				flex: ~"1 1 0%";
				&.banner {
					.px-to-rem(padding-left, @grid*4);
				}
				&.img {
					justify-content: center;
					align-items: center;
				}
			}
		} */
}

.cc section.body h2,
.cc section.offre h2 {
  /* px */
  margin-bottom: 16px;

  /* rem */
  margin-bottom: 16 / 16rem;

  /* px */
  padding: 0 40px;

  /* rem */
  padding: 0 / 16rem 40 / 16rem;

  /* px */
  font-size: 23px;

  /* rem */
  font-size: 23 / 16rem;
}

.cc section.body h2::before,
.cc section.offre h2::before {
  top: 19px;

  /* px */
  width: 32px;

  /* rem */
  width: 32 / 16rem;
}

.cc section.body div.summary > ul.img,
.cc section.offre div.summary > ul.img {
  display: flex;
  align-items: stretch;

  /* px */
  margin: 8px 16px;

  /* rem */
  margin: 8 / 16rem 16 / 16rem;
  line-height: 1.2;
}
@media only screen and (max-width: 768px) {
  .cc section.body div.summary > ul.img,
  .cc section.offre div.summary > ul.img {
    flex-direction: column;
    margin: 0;
  }
}

.cc section.body div.summary > ul.img li,
.cc section.offre div.summary > ul.img li {
  flex: 1 1 1%;

  /* px */
  padding: 0 16px;

  /* rem */
  padding: 0 / 16rem 16 / 16rem;

  /* px */
  font-size: 12px;

  /* rem */
  font-size: 12 / 16rem;
  text-align: center;
}

.cc section.body div.summary > ul.img li p,
.cc section.offre div.summary > ul.img li p {
  /* px */
  margin-bottom: 0;

  /* rem */
  margin-bottom: 0 / 16rem;
  line-height: 1.5;
}
@media only screen and (max-width: 768px) {
  .cc section.body div.summary > ul.img li,
  .cc section.offre div.summary > ul.img li {
    flex: none;
    padding: 10px 0 10px 64px;
    text-align: left;
  }
}

.cc section.body div.summary > ul.img li .texte,
.cc section.offre div.summary > ul.img li .texte {
  display: block;

  /* px */
  height: 40px;

  /* rem */
  height: 40 / 16rem;
  margin-bottom: 13px;
  color: #4471a8;
  font-weight: bold;

  /* px */
  font-size: 55px;

  /* rem */
  font-size: 55 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc section.body div.summary > ul.img li .texte,
  .cc section.offre div.summary > ul.img li .texte {
    /* px */
    font-size: 45px;

    /* rem */
    font-size: 45 / 16rem;
  }
}
@media only screen and (max-width: 768px) {
  .cc section.body div.summary > ul.img li .texte,
  .cc section.offre div.summary > ul.img li .texte {
    position: absolute;
    top: 12px;
    left: -64px;
  }
}

.cc section.body div.summary > ul.img li h3,
.cc section.offre div.summary > ul.img li h3 {
  margin-top: 7px;
  padding-top: 22px;
  padding-bottom: 3px;
  text-transform: uppercase;
}
@media only screen and (max-width: 768px) {
  .cc section.body div.summary > ul.img li h3,
  .cc section.offre div.summary > ul.img li h3 {
    margin-top: 0;
    padding: 0;
  }
}

.cc section.body div.summary > ul.img li h3.font::before,
.cc section.offre div.summary > ul.img li h3.font::before {
  display: block;

  /* px */
  height: 40px;

  /* rem */
  height: 40 / 16rem;
  margin-bottom: 13px;
  color: #4471a8;

  /* px */
  font-size: 55px;

  /* rem */
  font-size: 55 / 16rem;
  font-family: fts_picto;
}
@media only screen and (max-width: 768px) {
  .cc section.body div.summary > ul.img li h3.font::before,
  .cc section.offre div.summary > ul.img li h3.font::before {
    /* px */
    font-size: 45px;

    /* rem */
    font-size: 45 / 16rem;
  }
}
@media only screen and (max-width: 768px) {
  .cc section.body div.summary > ul.img li h3.font::before,
  .cc section.offre div.summary > ul.img li h3.font::before {
    position: absolute;
    top: 12px;
    left: -64px;
  }
}

.cc section.body div.summary > ul.img li h3.font.facile::before,
.cc section.offre div.summary > ul.img li h3.font.facile::before {
  content: '\F0006';
}

.cc section.body div.summary > ul.img li h3.font.pratique::before,
.cc section.offre div.summary > ul.img li h3.font.pratique::before {
  content: '\F0317';
}

.cc section.body div.summary > ul.img li h3.font.proximite::before,
.cc section.offre div.summary > ul.img li h3.font.proximite::before {
  content: '\F03D2';
}

.cc section.body div.summary > ul.img li h3.font.utile::before,
.cc section.offre div.summary > ul.img li h3.font.utile::before {
  content: '\ED4F';
}

.cc section.body div.summary > ul.img li h3.font.reconnu::before,
.cc section.offre div.summary > ul.img li h3.font.reconnu::before {
  content: '\EB83';
}

.cc section.body div.summary > ul.img li h3.font.rejoindre::before,
.cc section.offre div.summary > ul.img li h3.font.rejoindre::before {
  content: '\EC55';
}

.cc section.body div.summary > ul.img li h3.font.dispo::before,
.cc section.offre div.summary > ul.img li h3.font.dispo::before {
  content: '\EA47';
}

.cc section.body div.summary > ul.img li h3.font.securite::before,
.cc section.offre div.summary > ul.img li h3.font.securite::before {
  content: '\EB9F';
}

.cc section.body div.summary > ul.img li h3.font.personnalise::before,
.cc section.offre div.summary > ul.img li h3.font.personnalise::before {
  content: '\E65D';
}

.cc section.body div.summary > ul.img li h3.font.performance::before,
.cc section.offre div.summary > ul.img li h3.font.performance::before {
  content: '\EB0C';
}

.cc section.body div.summary > ul.img li h3.font.transparence::before,
.cc section.offre div.summary > ul.img li h3.font.transparence::before {
  content: '\E833';
}

.cc section.body div.summary > ul.img li h3.font.protection::before,
.cc section.offre div.summary > ul.img li h3.font.protection::before {
  content: '\ECCE';
}

.cc section.body div.summary > ul.img li h3.font.mesure::before,
.cc section.offre div.summary > ul.img li h3.font.mesure::before {
  content: '\ED27';
}

.cc section.body div.summary > ul.img li h3.font.flexibilite::before,
.cc section.offre div.summary > ul.img li h3.font.flexibilite::before {
  content: '\E808';
}

.cc section.body div.summary > ul.img li h3.font.reactivite::before,
.cc section.offre div.summary > ul.img li h3.font.reactivite::before {
  content: '\ECDB';
}

.cc section.body div.summary > ul.img li h3.font.expertise::before,
.cc section.offre div.summary > ul.img li h3.font.expertise::before {
  content: '\E829';
}

.cc section.body div.summary > ul.img li h3.font.avec-vous::before,
.cc section.offre div.summary > ul.img li h3.font.avec-vous::before {
  content: '\E820';
}

.cc section.body div.summary > ul.img li h3.font.osez::before,
.cc section.offre div.summary > ul.img li h3.font.osez::before {
  content: '\ED88';
}

.cc section.body div.summary > ul.img li h3.font.musique::before,
.cc section.offre div.summary > ul.img li h3.font.musique::before {
  content: '\EC28';
}

.cc section.body div.summary > ul.img li h3.font.fiscalite::before,
.cc section.offre div.summary > ul.img li h3.font.fiscalite::before {
  content: '\EA08';
}

.cc section.body div.summary > ul.img li h3.font.souplesse::before,
.cc section.offre div.summary > ul.img li h3.font.souplesse::before {
  content: '\ECBA';
}

.cc section.body div.summary > ul.img li h3.font.mutualiste::before,
.cc section.offre div.summary > ul.img li h3.font.mutualiste::before {
  content: '\E606';
}

.cc section.body div.summary > ul.img li h3.font.solide::before,
.cc section.offre div.summary > ul.img li h3.font.solide::before {
  content: '\EB40';
}

.cc section.body div.summary > ul.img li h3.font.tirelire::before,
.cc section.offre div.summary > ul.img li h3.font.tirelire::before {
  content: '\F010C';
}

.cc section.body div.summary > ul.img li h3.font.agrisalon::before,
.cc section.offre div.summary > ul.img li h3.font.agrisalon::before {
  content: '\E664';
}

.cc section.body div.summary > ul.img li h3.font.associatheque::before,
.cc section.offre div.summary > ul.img li h3.font.associatheque::before {
  content: '\EBA2';
}

.cc section.body > p,
.cc section.offre > p,
.cc section.body > ul,
.cc section.offre > ul,
.cc section.body > div,
.cc section.offre > div {
  /* px */
  padding: 0 40px;

  /* rem */
  padding: 0 / 16rem 40 / 16rem;
}

.cc section.body p.teaser,
.cc section.offre p.teaser {
  /* px */
  margin-bottom: 16px;

  /* rem */
  margin-bottom: 16 / 16rem;

  /* px */
  font-size: 16px;

  /* rem */
  font-size: 16 / 16rem;
  line-height: 1.5;
}

.cc section.body div.banner > ul.styled li,
.cc section.offre div.banner > ul.styled li,
.cc section.body div.intro > ul.styled li,
.cc section.offre div.intro > ul.styled li {
  margin: 10px;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  line-height: 25px;
}

.cc section.body div.banner > ul.styled li::before,
.cc section.offre div.banner > ul.styled li::before,
.cc section.body div.intro > ul.styled li::before,
.cc section.offre div.intro > ul.styled li::before {
  content: '\E061';
  color: #393;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  font-family: fts_picto;
}

.cc section.body div.banner p.soustitre,
.cc section.offre div.banner p.soustitre,
.cc section.body div.intro p.soustitre,
.cc section.offre div.intro p.soustitre {
  /* px */
  margin-bottom: 10px;

  /* rem */
  margin-bottom: 10 / 16rem;
  color: #4471a8;

  /* px */
  font-size: 28px;

  /* rem */
  font-size: 28 / 16rem;
  line-height: 1.3;
}

.cc section.body div.banner p.exergue,
.cc section.offre div.banner p.exergue,
.cc section.body div.intro p.exergue,
.cc section.offre div.intro p.exergue {
  /* px */
  margin-top: 15px;

  /* rem */
  margin-top: 15 / 16rem;

  /* px */
  margin-bottom: 15px;

  /* rem */
  margin-bottom: 15 / 16rem;
  color: #4471a8;
  font-weight: bold;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
}

.cc section.body div.img,
.cc section.offre div.img {
  display: flex;
  align-items: center;
}

.cc div.alerte,
.cc div.info,
.cc div.err,
.cc div.succes {
  position: relative;
  margin: 0 0 10px;
  padding: 8px 10px 8px 40px;
}

.cc div.err {
  border: 1px solid #ee8686;
  color: #c50307;
}

.cc section.body form {
  /* px */
  padding-top: 30px;

  /* rem */
  padding-top: 30 / 16rem;
}

.cc section.body form.ctxt-form-inline .form-group {
  /* px */
  margin-bottom: 10px;

  /* rem */
  margin-bottom: 10 / 16rem;

  /* px */
  padding-left: 10px;

  /* rem */
  padding-left: 10 / 16rem;
  border-left: 2px solid #3f8bd2;
}

.cc section.body > div + div {
  /* px */
  padding-top: 24px;

  /* rem */
  padding-top: 24 / 16rem;
}

.cc section.offre {
  background-image: linear-gradient(to bottom, #fff, #ccc);
}

.cc section.offre p.soustitre {
  /* px */
  margin-bottom: 10px;

  /* rem */
  margin-bottom: 10 / 16rem;
  color: #4471a8;

  /* px */
  font-size: 22px;

  /* rem */
  font-size: 22 / 16rem;
  line-height: 1.3;
}

.cc section.offre div.img img {
  width: 100% !important;
}

.cc section.detail {
  /* hr {
		    border: 0;
		    height: 1px;
		    background-image: linear-gradient(to right, @C24, @C16, @C24);
		    .px-to-rem(margin, @grid*5 0);
		} */

  /* div.container2 {
			display: flex;
			padding: 0;
			position: relative;
			> div {
				flex: ~"1 1 0%";
				&.banner {
					.px-to-rem(padding-left, @grid*4);
				}
				&.img {
					flex: none;
					justify-content: center;
					align-items: center;
				}
			}
		} */
}
@media only screen and (max-width: 768px) {
  .cc section.detail {
    padding: 16px;
  }
}
@media only screen and (max-width: 970px) {
  .cc section.detail {
    margin-top: 110px;
  }
}

.cc section.detail h2 {
  color: #000;
  font-size: 26px;
}

.cc section.detail h2::before {
  content: ' ';
  right: 0;
  bottom: 4px;
  display: inline-block;

  /* px */
  width: 24px;

  /* rem */
  width: 24 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  background-color: #d15462;
}

.cc section.detail p.intro {
  /* px */
  margin-top: 16px;

  /* rem */
  margin-top: 16 / 16rem;

  /* px */
  margin-bottom: 16px;

  /* rem */
  margin-bottom: 16 / 16rem;
  border-bottom: 1px solid #ccc;

  /* px */
  font-size: 16px;

  /* rem */
  font-size: 16 / 16rem;
  line-height: 1.5;
  text-align: center;
}

.cc section.detail h3 {
  color: #4471a8;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
}

.cc section.detail div.detail2 {
  /* px */
  padding: 32px;

  /* rem */
  padding: 32 / 16rem;
  background-color: #fff;
  box-shadow: 0 0 8px 0 #ccc;
}

.cc section.detail div.valorisation {
  /* px */
  margin-top: 32px;

  /* rem */
  margin-top: 32 / 16rem;

  /* px */
  margin-bottom: 32px;

  /* rem */
  margin-bottom: 32 / 16rem;

  /* px */
  padding: 32px;

  /* rem */
  padding: 32 / 16rem;
  background-color: #ececec;
  box-shadow: 0 0 8px 0 #ccc;
}

.cc section.detail > p,
.cc section.detail > ul,
.cc section.detail > div {
  /* px */
  padding: 0 32px;

  /* rem */
  padding: 0 / 16rem 32 / 16rem;
}

.cc section.detail .ligne {
  margin-top: 24px;
  padding-bottom: 18px;
  border-top: 1px solid #ddd;
}

.cc section.detail ul.styled > li {
  margin: 15px 0;
}

.cc section.detail .button {
  display: inline-block;

  /* px */
  margin: 16px 0 0;

  /* rem */
  margin: 16 / 16rem 0 / 16rem 0 / 16rem 0 / 16rem;

  /* px */
  padding: 16px 32px;

  /* rem */
  padding: 16 / 16rem 32 / 16rem;
  border: 1px solid #4471a8;
  background-color: #4471a8;
  color: #fff;
  box-shadow: 0 8px 6px -6px #d2d0cc;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  text-align: center;
  text-decoration: none;
}

.cc section.detail .button:hover,
.cc section.detail .button:focus {
  border-color: #4471a8;
  background-color: #fff;
  color: #4471a8;
}

.cc section.detail div.space {
  /* px */
  padding: 16px;

  /* rem */
  padding: 16 / 16rem;
}

.cc section.detail div.img {
  display: flex;
}

.cc div.insert .button {
  display: inline-block;

  /* px */
  margin: 16px 0;

  /* rem */
  margin: 16 / 16rem 0 / 16rem;

  /* px */
  padding: 8px 16px;

  /* rem */
  padding: 8 / 16rem 16 / 16rem;
  border: 1px solid #4471a8;
  background-color: #4471a8;
  color: #fff;
  box-shadow: 0 8px 6px -6px #d2d0cc;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  text-align: center;
  text-decoration: none;
}

.cc div.insert .button:hover,
.cc div.insert .button:focus {
  border-color: #4471a8;
  background-color: #fff;
  color: #4471a8;
}

.cc div.insert div p.teaser {
  /* px */
  margin-bottom: 16px;

  /* rem */
  margin-bottom: 16 / 16rem;
  margin-left: 10px;

  /* px */
  font-size: 16px;

  /* rem */
  font-size: 16 / 16rem;
}

.cc div.insert p.recompense {
  /* px */
  font-size: 16px;

  /* rem */
  font-size: 16 / 16rem;
  text-align: center;
}

.cc div.insert p.soustitre {
  color: #4471a8;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
}

.cc div.insert h2 {
  /* px */
  margin-bottom: 8px;

  /* rem */
  margin-bottom: 8 / 16rem;

  /* px */
  padding: 0 24px;

  /* rem */
  padding: 0 / 16rem 24 / 16rem;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
}

.cc div.insert h2::before {
  /* px */
  width: 16px;

  /* rem */
  width: 16 / 16rem;
}

.cc div.insert p.appli {
  color: #4471a8;
  font-weight: bold;

  /* px */
  font-size: 18px;

  /* rem */
  font-size: 18 / 16rem;
  line-height: 1.7;
  text-align: center;
}

.cc div.insert p.appli::before {
  content: '\EBA4';
  display: block;

  /* px */
  font-size: 50px;

  /* rem */
  font-size: 50 / 16rem;
  font-family: fts_picto;
  text-align: center;
}

.cc div.insert > p,
.cc div.insert > ul,
.cc div.insert > div {
  /* px */
  padding: 0 24px;

  /* rem */
  padding: 0 / 16rem 24 / 16rem;
}

.cc div.insert.ctxt-ptfort {
  background-color: #4471a8;
}

.cc div.insert.ctxt-ptfort h3 {
  /* px */
  padding: 0 16px 16px;

  /* rem */
  padding: 0 / 16rem 16 / 16rem 16 / 16rem 16 / 16rem;
  color: #fff;
  font-weight: normal;

  /* px */
  font-size: 24px;

  /* rem */
  font-size: 24 / 16rem;
}

.cc div.insert.ctxt-ptfort h3::before {
  content: '\E644';
  bottom: 32px;
  left: 0;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  padding-right: 7px;
  font-family: fts_picto;
}

.cc div.insert.ctxt-ptfort > p {
  color: #fff;
  font-weight: normal;

  /* px */
  font-size: 18px;

  /* rem */
  font-size: 18 / 16rem;
  line-height: 2;
  text-align: center;
}

.cc div.insert.ctxt-enbref {
  padding: 0;
}

.cc div.insert.ctxt-enbref h3 {
  /* px */
  padding: 16px;

  /* rem */
  padding: 16 / 16rem;
  background-color: #4471a8;
  color: #fff;
  font-weight: normal;

  /* px */
  font-size: 16px;

  /* rem */
  font-size: 16 / 16rem;
}

.cc div.insert.ctxt-enbref > ul {
  /* px */
  padding: 16px 0 16px 16px;

  /* rem */
  padding: 16 / 16rem 0 / 16rem 16 / 16rem 16 / 16rem;
}

.cc div.insert.ctxt-enbref > ul li {
  /* px */
  padding: 8px 0;

  /* rem */
  padding: 8 / 16rem 0 / 16rem;
  border-top: 1px solid #e8e8e8;
}

.cc div.insert.ctxt-enbref > ul li:first-child {
  border-top: none;
}

.cc div.insert.ctxt-FAQ {
  /* px */
  padding: 0;

  /* rem */
  padding: 0 / 16rem 0 / 16rem;
}

.cc div.insert.ctxt-FAQ h3 {
  /* px */
  padding: 16px;

  /* rem */
  padding: 16 / 16rem 16 / 16rem;
  background-color: #4471a8;
  color: #fff;
  font-weight: normal;
}

.cc div.insert.ctxt-FAQ h3::before {
  content: '\e822';
  bottom: 32px;
  left: 0;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  padding-right: 7px;
  font-family: fts_picto;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt {
  clear: left;

  /* px */
  padding: 16px 24px;

  /* rem */
  padding: 16 / 16rem 24 / 16rem;
  border-top: 1px solid #ccc;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt a {
  display: block;
  color: #000;
  font-weight: normal;
  text-decoration: none;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed] {
  position: relative;
  cursor: pointer;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed]::before {
  position: absolute;

  /* px */
  top: 16px;

  /* rem */
  top: 16 / 16rem;

  /* px */
  left: 8px;

  /* rem */
  left: 8 / 16rem;
  color: #8d8d8d;
  font-weight: normal;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  font-family: fts_picto;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed]:focus,
.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed]:hover {
  background-color: #f1f1f1;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed='yes'] {
  /* border-bottom: 1px solid @C24; */
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed='yes']::before {
  content: '\E652';
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed='yes'] + dd {
  display: none;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed='no'] {
  background-color: #f1f1f1;
  font-weight: bold;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed='no']::before {
  content: '\E653';
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dt[data-collapsed='no'] + dd {
  display: block;
  background-color: #f1f1f1;
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dd {
  /* px */
  padding: 0 8px 8px 22px;

  /* rem */
  padding: 0 / 16rem 8 / 16rem 8 / 16rem 22 / 16rem;
  background: #fff;

  /* border-bottom: 1px solid @C24; */
}

.cc div.insert.ctxt-FAQ dl[data-collapse] dd::after {
  content: '';
  display: block;
  clear: left;
}

.cc div.hasAside {
  display: flex;

  /* @media @small */
}
@media only screen and (max-width: 970px) {
  .cc div.hasAside {
    flex-direction: column;
  }
}

.cc div.hasAside > div {
  flex: 1 1 0%;
}
@media only screen and (max-width: 970px) {
  .cc div.hasAside > div {
    flex: 1 1 auto;
  }
}

.cc div.hasAside > aside {
  /* px */
  width: 400px;

  /* rem */
  width: 400 / 16rem;

  /* px */
  margin: 0 0 0 32px;

  /* rem */
  margin: 0 / 16rem 0 / 16rem 0 / 16rem 32 / 16rem;

  /* @media @small */
}

.cc div.hasAside > aside:first-child {
  /* px */
  margin: 0 32px 0 0;

  /* rem */
  margin: 0 / 16rem 32 / 16rem 0 / 16rem 0 / 16rem;
}
@media only screen and (max-width: 970px) {
  .cc div.hasAside > aside {
    width: auto;
    margin: 110px 0 0;
  }
}
@media only screen and (max-width: 768px) {
  .cc div.hasAside > aside {
    margin-top: 110px;
  }
}

.cc.ctxt-service div.hasAside {
  /* @media @small */
}
@media only screen and (max-width: 970px) {
  .cc.ctxt-service div.hasAside {
    flex-direction: column-reverse;
  }
}
@media only screen and (max-width: 768px) {
  .cc.ctxt-service div.hasAside {
    flex-direction: column;
  }
}

.cc.ctxt-service div.hasAside > aside {
  /* @media @small */
}
@media only screen and (max-width: 970px) {
  .cc.ctxt-service div.hasAside > aside {
    margin: 0;
  }
}

.cc aside[role='complementary'] {
  /* &.ctxt-news {
		} */
}

.cc aside[role='complementary'] h2 {
  color: #000;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
}

.cc aside[role='complementary'] h2::after {
  content: ' ';
  right: 0;
  bottom: 4px;
  display: inline-block;

  /* px */
  width: 24px;

  /* rem */
  width: 24 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  background-color: #d15462;
}

.cc aside[role='complementary'] > div {
  display: flex;
}

.cc aside[role='complementary'] > div > div {
  flex: 1 1 33%;
}

.cc [data-collapse][data-collapsed] {
  cursor: pointer;
}

.cc [data-collapse] [aria-hidden='false'] {
  display: block;
}

.cc [data-collapse] [aria-hidden='true'] {
  display: none;
}

.cc table[data-collapse] tr[aria-hidden='false'] {
  display: table-row;
}

.cc [data-collapse][role='tablist'] {
  /* px */
  margin-top: 5px;

  /* rem */
  margin-top: 5 / 16rem;
}

.cc [data-collapse][role='tablist'] [role='tab'] {
  position: relative;
  clear: left;
  margin-top: -1px;

  /* px */
  padding: 5px 30px 5px 0;

  /* rem */
  padding: 5 / 16rem 30 / 16rem 5 / 16rem 0 / 16rem;
  border-top: 1px solid #e9e4e1;
  cursor: pointer;

  /* &:hover {
				color: @Cerulean;
				h3, a {
					color: @Cerulean;
				}
			} */

  /* &[data-collapsed="no"] {
				&:after {
					//content: "\e634";
					content: @glyphe_chevron_haut;
				}
			} */
}

.cc [data-collapse][role='tablist'] [role='tab']:focus {
  outline: 0;

  /* color: @Cerulean; */
}

.cc [data-collapse][role='tablist'] [role='tab'] h2::before {
  display: none;
}

.cc [data-collapse][role='tablist'] [role='tab'] h3 {
  padding-top: 0;
  padding-bottom: 0;
}

.cc [data-collapse][role='tablist'] [role='tab'] a {
  display: block;
  font-weight: normal;
  text-decoration: none;

  /* &:hover{
				color: @Cerulean;
				} */
}

.cc [data-collapse][role='tablist'] [role='tab']::after {
  position: absolute;

  /* px */
  top: 6px;

  /* rem */
  top: 6 / 16rem;

  /* px */
  right: 0;

  /* rem */
  right: 0 / 16rem;
  font-weight: normal;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  font-family: fts_commun;
}

.cc [data-collapse][role='tablist'] [role='tab'][data-collapsed='yes'] {
  border-bottom: 1px solid #e9e4e1;

  /* &:after {
					//content: "\e635";
					content: @glyphe_chevron_bas;
				} */
}

.cc [data-collapse][role='tablist'] [role='tab'][data-collapsed='yes'] + [role='tabpanel'] {
  display: none;
}

.cc [data-collapse][role='tablist'] [role='tab'][data-collapsed='no'] + [role='tabpanel'] {
  display: block;
}

.cc [data-collapse][role='tablist'] [role='tab'] h2 {
  margin: 0;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
}

.cc [data-collapse][role='tablist'] [role='tab'] h3 {
  margin-top: 0;

  /* px */
  font-size: 16px;

  /* rem */
  font-size: 16 / 16rem;
}

.cc [data-collapse][role='tablist'] [role='tabpanel'] {
  /* px */
  padding: 0 8px 8px 22px;

  /* rem */
  padding: 0 / 16rem 8 / 16rem 8 / 16rem 22 / 16rem;
  border-bottom: 1px solid #e9e4e1;

  /* p ~ abbr {
				// font-weight: bold;
			} */
}

.cc [data-collapse][role='tablist'] [role='tabpanel']::after {
  content: '';
  display: block;
  clear: left;
}

.cc [data-collapse][role='tablist'] [role='tabpanel'] > ul,
.cc [data-collapse][role='tablist'] [role='tabpanel'] > ul > li {
  margin-top: 0;
}

.cc table[data-collapse][role='tablist'] {
  margin: 0;
}

.cc table[data-collapse][role='tablist'] caption [role='tab'][data-collapsed]:focus,
.cc table[data-collapse][role='tablist'] caption [role='tab'][data-collapsed]:hover {
  background: #fff;
  color: #d3545a;
}

.cc table[data-collapse][role='tablist'] [role='tab'] {
  display: block;

  /* width: 100%; */
  padding-left: 26px;
  border: none;
  background: transparent;
  color: inherit;
  font-size: inherit;
}

.cc table[data-collapse][role='tablist'] [role='tab'][data-collapsed]::after {
  position: absolute;

  /* px */
  top: 6px;

  /* rem */
  top: 6 / 16rem;

  /*	right:inherit;
					left:0; */
  right: 5px;

  /* px */
  right: 0;

  /* rem */
  right: 0 / 16rem;
  font-weight: normal;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  font-family: fts_commun;
}

.cc table[data-collapse][role='tablist'] [role='tab'][data-collapsed]:focus,
.cc table[data-collapse][role='tablist'] [role='tab'][data-collapsed]:hover {
  color: #03b2f3;
}

.cc table[data-collapse][role='tablist'] [role='tab'][data-collapsed='yes'] {
  border: none;
  background: white;
}

.cc table[data-collapse][role='tablist'] [role='tab'][data-collapsed='yes']::after {
  content: '\F0098';
}

.cc table[data-collapse][role='tablist'] [role='tab'][data-collapsed='no'] {
  color: inherit;
}

.cc table[data-collapse][role='tablist'] [role='tab'][data-collapsed='no']::after {
  content: '\F009D';
}

.cc table[data-collapse][role='tablist'] [role='tab'].group {
  display: table-cell;

  /* px */
  padding: 16px 14px;

  /* rem */
  padding: 16 / 16rem 14 / 16rem;
  border-top: 1px solid #d7204f;
  border-bottom: 1px solid #d7204f;
  color: #d7204f;

  /* px */
  font-size: 16px;

  /* rem */
  font-size: 16 / 16rem;
}

.cc table[data-collapse][role='tablist'] [role='tab'].group[data-collapsed]::after {
  top: 16px;
  right: 20px;
}

.cc table[data-collapse][role='tablist'] [role='tab'].group:hover,
.cc table[data-collapse][role='tablist'] [role='tab'].group:focus {
  background: #f2eaec;
  color: #d7204f;
}

.cc table[data-collapse][role='tablist'] [role='tab'].group:hover[data-collapsed]::after,
.cc table[data-collapse][role='tablist'] [role='tab'].group:focus[data-collapsed]::after {
  color: #d7204f;
}

.cc table[data-collapse][role='tablist'] [role='tabpanel'] {
  /* px */
  padding: 8px 8px 8px 22px;

  /* rem */
  padding: 8 / 16rem 8 / 16rem 8 / 16rem 22 / 16rem;
  border: none;
  background: transparent;
}

/* fin de cc */

/* Onglets */
.cc ul.tabs {
  display: flex;
  height: auto;
  margin: 0;

  /* px */
  margin-bottom: 8px;

  /* rem */
  margin-bottom: 8 / 16rem;
}
@media only screen and (max-width: 400px) {
  .cc ul.tabs {
    display: block;
  }
}

.cc ul.tabs li {
  flex: 1 0 0%;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  background-color: #ececec;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  text-align: center;
}

.cc ul.tabs li a {
  display: block;
  height: 100%;
  padding: 16px;
  color: #797979;
  font-weight: normal;
  text-decoration: none;
  cursor: pointer;
}

.cc ul.tabs li a:hover,
.cc ul.tabs li a:focus,
.cc ul.tabs li a:active {
  color: #0f228b;
  text-decoration: none;
}

.cc ul.tabs li.sel {
  border-bottom: 0 solid #fff;
}

.cc ul.tabs li.sel a {
  outline: 0;
  cursor: auto;
}

.cc ul.tabs.atouts {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.cc ul.tabs.atouts li {
  flex-basis: 33.33%;
}

.cc ul.tabs li.sel h2,
.cc ul.tabs li.sel h3,
.cc ul.tabs li.sel a {
  background-color: #fff;
  color: #4471a8;
  font-weight: bold;
}

.cc ul.nav {
  display: flex;
  height: auto;

  /* px */
  margin-bottom: 8px;

  /* rem */
  margin-bottom: 8 / 16rem;
}

.cc ul.nav li {
  flex: 1 0 0%;
  border-right: 1px solid #ddd;
  border-bottom: 1px solid #ddd;
  background-color: #ececec;

  /* px */
  font-size: 13px;

  /* rem */
  font-size: 13 / 16rem;
  text-align: center;
}

.cc ul.nav li a {
  display: block;
  padding: 16px;
  color: #797979;
  text-decoration: none;
}

.cc ul.nav li a:hover,
.cc ul.nav li a:focus {
  color: #4471a8;
  font-weight: bold;
  text-decoration: none;
}

.cc ul.nav li.sel {
  border-bottom: 1px solid #fff;
  font-weight: bold;
}
@media only screen and (max-width: 768px) {
  .cc ul.nav li {
    display: none;
  }

  .cc ul.nav li.sel {
    display: list-item;
  }
}

.cc ul.nav li.sel h2,
.cc ul.nav li.sel h3,
.cc ul.nav li.sel a {
  background-color: #fff;
  color: #4471a8;
}

.cc ul.nav.mobile {
  display: none;
}
@media only screen and (max-width: 768px) {
  .cc ul.nav.mobile {
    display: block;
  }

  .cc ul.nav.mobile li {
    display: list-item;
  }
}
@media only screen and (max-width: 768px) {
  .cc div.tab {
    height: auto;
  }
}

.cc div.tab[aria-hidden='true'] {
  display: none;
}

.cc div.tab h3 {
  /* px */
  padding: 16px 0;

  /* rem */
  padding: 16 / 16rem 0 / 16rem;

  /* px */
  font-size: 50px;

  /* rem */
  font-size: 50 / 16rem;
  line-height: 1.2;
}
@media only screen and (max-width: 768px) {
  .cc div.tab h3 {
    /* px */
    font-size: 32px;

    /* rem */
    font-size: 32 / 16rem;
  }
}

.cc div.tab p.exergue {
  color: #4471a8;
}

.cc div.tab img {
  margin: 15px 15px 0;
}

.cc div.tab div.container {
  position: relative;
  display: flex;
  height: 100%;
  padding: 0;
}
@media only screen and (max-width: 768px) {
  .cc div.tab div.container {
    flex-direction: column;
    height: auto;
  }
}

.cc div.tab div.container > div {
  flex: 1 1 0%;
}
@media only screen and (max-width: 768px) {
  .cc div.tab div.container > div {
    flex: 1 1 auto;
  }
}

.cc div.tab div.container > div.banner {
  /* px */
  margin-bottom: 32px;

  /* rem */
  margin-bottom: 32 / 16rem;

  /* px */
  padding-left: 32px;

  /* rem */
  padding-left: 32 / 16rem;
}
@media only screen and (max-width: 768px) {
  .cc div.tab div.container > div.banner {
    /* px */
    padding-top: 16px;

    /* rem */
    padding-top: 16 / 16rem;
  }
}

.cc div.tab div.container > div.banner h2 {
  /* px */
  padding: 16px 0;

  /* rem */
  padding: 16 / 16rem 0 / 16rem;

  /* px */
  font-size: 50px;

  /* rem */
  font-size: 50 / 16rem;
  line-height: 1.2;
}
@media only screen and (max-width: 768px) {
  .cc div.tab div.container > div.banner h2 {
    /* px */
    font-size: 32px;

    /* rem */
    font-size: 32 / 16rem;
  }
}

.cc div.tab div.container > div.img {
  align-self: center;
  text-align: right;

  /* .px-to-rem(margin-bottom, -@grid*4); */
}
@media only screen and (max-width: 768px) {
  .cc div.tab div.container > div.img {
    text-align: center;
  }
}

.cc div.tab div.container > div.img.center {
  text-align: center;
}

.cc div.tab div.container > div.img.center img {
  margin: 15px auto 0;
}

.cc div.tab div.container > div.img.right img {
  margin-right: 0;
}

/* ------------------------------------ */

/* ==Lightbox                			*/

/* ------------------------------------ */
div#overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 850;
  display: none;
  width: 100%;
  height: 100%;
  background: #6c6c6c;
  opacity: 0;
}

dialog#lightbox {
  position: fixed;
  top: 30% !important;
  right: 0;
  left: 25%;

  /* margin: 5% auto; */
  z-index: 880;

  /* max-height: calc(~"100% - 130px") !important; */
  display: flex;
  margin: 0;

  /* px */
  padding-top: 16px;

  /* rem */
  padding-top: 16 / 16rem;
  padding-right: 0;
  padding-left: 0;
  border: none;
  background: #fff;
  box-shadow: 0 1px 2px 0 #737373;
}

dialog#lightbox > div {
  flex: 1;
}

dialog#lightbox button.close {
  float: right;
  border: none;
  background: transparent;
  outline: 0;

  /* .px-to-rem(padding,8); */
  transition: all 1s ease 0s;

  /* &:hover, &:focus {
			color: @C4;
		} */
}

dialog#lightbox button.close::before {
  content: '\e629';
  display: inline-block;

  /* px */
  width: 32px;

  /* rem */
  width: 32 / 16rem;

  /* px */
  height: 32px;

  /* rem */
  height: 32 / 16rem;
  color: #8d8d8d;

  /* px */
  font-size: 15px;

  /* rem */
  font-size: 15 / 16rem;
  font-family: fts_commun;
}

dialog#lightbox .padding {
  padding-top: 20px;
}

dialog#lightbox h1 {
  margin: 0;

  /* px */
  padding: 8px 8px 0;

  /* rem */
  padding: 8 / 16rem 8 / 16rem 0 / 16rem 8 / 16rem;
  background-color: #fff;
  color: #4471a8;

  /* px */
  font-size: 17px;

  /* rem */
  font-size: 17 / 16rem;
  line-height: 1;
}

dialog#lightbox h1::before {
  content: ' ';
  bottom: 4px;
  left: 0;
  display: inline-block;

  /* px */
  width: 24px;

  /* rem */
  width: 24 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  margin-right: 5px;
  background-color: #d15462;
}

dialog#lightbox iframe {
  width: 100%;
  height: 100%;
  height: calc(100% - 32px);
  border: none;
}

dialog#lightbox .ctxt-form-inline {
  margin-left: 30px;
}

dialog#lightbox.pdf,
dialog#lightbox.nowidth {
  left: 25%;
  left: calc(50% - 250px);
  max-width: 500px;
}
@media only screen and (max-width: 768px) {
  dialog#lightbox.pdf,
  dialog#lightbox.nowidth {
    left: 5%;
    width: 90%;
  }
}

dialog#lightbox.pdf,
dialog#lightbox.noheight,
dialog#lightbox.nowidth {
  max-height: 235px !important;

  /* height: calc(~"100% - 200px") !important;	*/
}

.ctxt-lightbox {
  background: #f7f5f3;
}

.ctxt-lightbox .hideIfLightbox {
  display: none;
}
@media only screen and (max-width: 970px) {
  dialog#lightbox {
    left: 15%;
    width: 70%;
    height: calc(100% - 130px) !important;
  }
}
@media only screen and (max-width: 768px) {
  dialog#lightbox,
  dialog#lightbox.pdf {
    left: 3%;
    width: 90%;
  }
}

.cc iframe.noborder {
  border: none;
}

/* 		Numéros colorés					*/
.phone-bloc {
  position: relative;
  display: inline-block;

  /* vertical-align: bottom; */
  vertical-align: middle;

  /* px */
  margin: 0 4px;

  /* rem */
  margin: 0 / 16rem 4 / 16rem;
  background: none;
}

.phone-bloc .num,
.phone-bloc .phone-num {
  display: block;
  font-weight: bold;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
  text-transform: uppercase;
}

.phone-bloc .num sup,
.phone-bloc .phone-num sup {
  top: -8px;

  /* px */
  font-size: 10px;

  /* rem */
  font-size: 10 / 16rem;
}

.phone-bloc .rate,
.phone-bloc .phone-rate {
  position: absolute;
  top: 0;

  /* px */
  left: 180px;

  /* rem */
  left: 180 / 16rem;

  /* px */
  width: 95px;

  /* rem */
  width: 95 / 16rem;

  /* px */
  height: 36px;

  /* rem */
  height: 36 / 16rem;

  /* px */
  padding: 3px 6px;

  /* rem */
  padding: 3 / 16rem 6 / 16rem;
  font-weight: bold;

  /* px */
  font-size: 12px;

  /* rem */
  font-size: 12 / 16rem;
  line-height: 1;
}

.phone-bloc .hours,
.phone-bloc .phone-hours {
  padding-bottom: 20px;

  /* px */
  font-size: 16px;

  /* rem */
  font-size: 16 / 16rem;
}

.phone-bloc .hours {
  display: block;
  color: #8d8d8d;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
}

.phone-bloc[class*='sva'] {
  position: relative;
  vertical-align: middle;

  /* px */
  width: 286px;

  /* rem */
  width: 286 / 16rem;
  font-family: arial;
}

.phone-bloc[class*='sva'] .num {
  /* px */
  width: 285px;

  /* rem */
  width: 285 / 16rem;

  /* px */
  margin: 3px 0;

  /* rem */
  margin: 3 / 16rem 0 / 16rem;

  /* px */
  padding: 4px;

  /* rem */
  padding: 4 / 16rem;
  border: 1px solid #91919b;
  line-height: 1;
  text-align: left;
}

.phone-bloc[class*='sva'] .rate {
  position: absolute;
  top: 0;

  /* px */
  left: 140px;

  /* rem */
  left: 140 / 16rem;
  display: inline-block;

  /* px */
  width: 140px;

  /* rem */
  width: 140 / 16rem;

  /* px */
  height: 36px;

  /* rem */
  height: 36 / 16rem;

  /* px */
  padding: 3px 6px;

  /* rem */
  padding: 3 / 16rem 6 / 16rem;
  color: #fff;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
  line-height: 1;
  text-align: left;
}

.phone-bloc[class*='sva'] .hours {
  /* px */
  margin-top: 4px;

  /* rem */
  margin-top: 4 / 16rem;

  /* px */
  padding-left: 5px;

  /* rem */
  padding-left: 5 / 16rem;

  /* px */
  font-size: 14px;

  /* rem */
  font-size: 14 / 16rem;
}

.phone-bloc.sva-free .num {
  border-color: #78b41e;
  color: #78b41e;
}

.phone-bloc.sva-free .rate {
  background-color: #78b41e;
}

p .phone-bloc {
  vertical-align: top;
}

.phone-bloc-small[class*='sva'],
.phone-bloc-small [class*='sva'] {
  /* px */
  width: 150px;

  /* rem */
  width: 150 / 16rem;

  /* px */
  height: 102px;

  /* rem */
  height: 102 / 16rem;
}

.phone-bloc-small[class*='sva'] .num,
.phone-bloc-small [class*='sva'] .num {
  /* px */
  width: 154px;

  /* rem */
  width: 154 / 16rem;

  /* px */
  margin: 0 2px;

  /* rem */
  margin: 0 / 16rem 2 / 16rem;
  text-align: center;
}

.phone-bloc-small[class*='sva'] .rate,
.phone-bloc-small [class*='sva'] .rate {
  /* px */
  top: 28px;

  /* rem */
  top: 28 / 16rem;
  left: 0;

  /* px */
  width: 158px;

  /* rem */
  width: 158 / 16rem;

  /* px */
  height: 36px;

  /* rem */
  height: 36 / 16rem;

  /* px */
  padding: 4px 6px;

  /* rem */
  padding: 4 / 16rem 6 / 16rem;
  background-position: 14px top;
}

.phone-bloc-small[class*='sva'] .hours,
.phone-bloc-small [class*='sva'] .hours {
  /* px */
  margin-top: 35px;

  /* rem */
  margin-top: 35 / 16rem;
}

/* ------------------------------------ */

/*  Article                			*/

/* ------------------------------------ */
.cc.main.ctxt-basic header,
.cc.main.ctxt-news header,
.cc.main .ctxt-guide header {
  margin-bottom: 30px;
}
@media only screen and (max-width: 970px) {
  .cc.main.ctxt-basic header,
  .cc.main.ctxt-news header,
  .cc.main .ctxt-guide header {
    padding: 0 20px;
  }
}
@media only screen and (max-width: 768px) {
  .cc.main.ctxt-basic section.body,
  .cc.main.ctxt-news section.body,
  .cc.main .ctxt-guide section.body {
    position: static;
  }
}

#ei_tpl_footer .fede {
  max-width: 1290px;
  margin: 0 auto;
  padding: 5px 0;
}

#ei_tpl_footer .fede ul li {
  display: inline;
}

#ei_tpl_footer .fede ul li a {
  font-size: 0.85em;
}

#ei_tpl_footer .fede ul li a:hover {
  text-decoration: underline;
}

/***************************************   */

/********** Styles CCM 2017 *************/

/***************************************   */

/* Description :                        */

/*  - Styles CCM 2017/Tiles             */

/* Responsabilité :                     */

/*  - Équipe DIGITALE CM-CIC/SMB        */

/* Historique :                         */

/*  - 26/04/2017 : création             */

/***************************************   */

/***************************************   */
.cc .recrute {
  display: flex;
  height: 100%;

  /* px */
  margin-top: 15px;

  /* rem */
  margin-top: 15 / 16rem;
  background-color: #fff;
}
@media only screen and (max-width: 970px) {
  .cc .recrute {
    display: block;

    /* px */
    margin: 16px;

    /* rem */
    margin: 16 / 16rem;
  }
}

.cc .recrute .img {
  left: 0;
  width: 620px;
}
@media only screen and (max-width: 970px) {
  .cc .recrute .img {
    width: 100%;
  }
}

.cc .recrute .texte {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 100%;
}

.cc .recrute .texte .tileHeader {
  width: auto;
}

.cc .recrute .texte .tileHeader h1,
.cc .recrute .texte .tileHeader h3 {
  /* px */
  padding-top: 0;

  /* rem */
  padding-top: 0 / 16rem;
  padding-top: 20px;

  /* px */
  padding-right: 16px;

  /* rem */
  padding-right: 16 / 16rem;

  /* px */
  padding-bottom: 8px;

  /* rem */
  padding-bottom: 8 / 16rem;

  /* px */
  padding-left: 0;

  /* rem */
  padding-left: 0 / 16rem;
  color: #4471a8;
  font-size: 17px;
  text-transform: uppercase;
}

.cc .recrute .texte .tileHeader h1::before,
.cc .recrute .texte .tileHeader h3::before {
  content: ' ';
  bottom: 4px;
  left: 0;
  display: inline-block;

  /* px */
  width: 20px;

  /* rem */
  width: 20 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  margin-right: 4px;
  background-color: #d15462;
}
@media only screen and (max-width: 970px) {
  .cc .recrute .texte .tileHeader h1,
  .cc .recrute .texte .tileHeader h3 {
    font-size: 15px;
  }
}

.cc .recrute .texte .tileHeader p {
  /* px */
  padding: 10px 24px;

  /* rem */
  padding: 10 / 16rem 24 / 16rem;
  color: #000;

  /* px */
  font-size: 30px;

  /* rem */
  font-size: 30 / 16rem;
}
@media only screen and (max-width: 970px) {
  .cc .recrute .texte .tileHeader p {
    display: block;

    /* px */
    font-size: 20px;

    /* rem */
    font-size: 20 / 16rem;
  }
}

.cc .recrute .texte .tileFooter {
  /* px */
  padding-bottom: 16px;

  /* rem */
  padding-bottom: 16 / 16rem;
}

.cc .recrute .texte .tileFooter .more {
  padding-right: 15px;
  font-size: 14px;
  text-decoration: none;
}

.cc .recrute .texte .tileFooter .more::after {
  content: '\EBB6';
  display: inline-block;
  vertical-align: middle;

  /* px */
  width: 20px;

  /* rem */
  width: 20 / 16rem;

  /* px */
  height: 24px;

  /* rem */
  height: 24 / 16rem;
  padding-top: 1px;
  color: #4471a8;

  /* px */
  font-size: 22px;

  /* rem */
  font-size: 22 / 16rem;
  font-family: fts_commun;
  transition: color 0.2s linear;
}

.cc .recrute .texte .tileFooter .more:hover::after,
.cc .recrute .texte .tileFooter .more:focus::after {
  padding-left: 5px;
  color: #4471a8;
}

.cc .tiles {
  display: flex;
  flex-wrap: wrap;

  /* px */
  margin: 0 -16px;

  /* rem */
  margin: 0 / 16rem -16 / 16rem;
}
@media only screen and (max-width: 970px) {
  .cc .tiles {
    /* px */
    margin: 0;

    /* rem */
    margin: 0 / 16rem;
  }
}

.cc .tiles > .tile {
  flex: 1 1 33%;
  max-width: 378px;
  max-width: calc(33.33% - 32px);

  /* px */
  margin: 16px;

  /* rem */
  margin: 16 / 16rem;
}
@media only screen and (max-width: 970px) {
  .cc .tiles > .tile {
    flex: 1 1 50%;
    max-width: calc(50% - 32px);
  }
}
@media only screen and (max-width: 768px) {
  .cc .tiles > .tile {
    flex: 1 1 100%;
    max-width: calc(100% - 32px);
  }
}

.cc .tiles > .tile:hover,
.cc .tiles > .tile:focus {
  box-shadow: 0 0 15px rgb(0 0 0 / 50%);
}

.cc .tiles > .tilex2 {
  display: block;

  /* sinon bug de hauteur sous IE */
  flex: 2 2 66%;
  max-width: 787px;
  height: 100%;

  /* px */
  margin: 16px;

  /* rem */
  margin: 16 / 16rem;
}
@media only screen and (max-width: 970px) {
  .cc .tiles > .tilex2 {
    flex: 1 1 100%;
    max-width: calc(100% - 32px);
  }
}

.cc .tiles > .tilex2 div.img img {
  left: 0;
  margin-left: 80px;
}

.cc .tiles.ctxt-home .tile {
  position: relative;
  flex: 1 1 0%;

  /* .px-to-rem(margin, @grid*2); */
  width: 100%;
  max-width: 787px;
  max-width: calc(50% - 32px);
  padding-bottom: 0;
}
@media only screen and (max-width: 768px) {
  .cc .tiles.ctxt-home .tile {
    flex: none;
    max-width: calc(100% - 32px);
  }
}

.cc .tiles.ctxt-home .tile > img {
  width: 100%;
}

.cc .ctxt-institutionnel.tiles {
  justify-content: center;
}

.cc .ctxt-institutionnel.tiles .tile {
  flex: 1 1 0%;
  background: transparent;
  box-shadow: 0 0 0 0;
}

.cc .ctxt-institutionnel.tiles h2 {
  margin-top: 35px;
  margin-bottom: 10px;
  color: #414141;
  font-size: 36px;
  text-align: center;
}

.cc .ctxt-institutionnel.tiles h2::before {
  content: ' ';
  bottom: 4px;
  left: 0;
  display: inline-block;

  /* px */
  width: 24px;

  /* rem */
  width: 24 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  margin-right: 10px;
  background-color: #d15462;
}

.cc .ctxt-institutionnel.tiles h2::after {
  content: ' ';
  right: 0;
  bottom: 4px;
  display: inline-block;

  /* px */
  width: 24px;

  /* rem */
  width: 24 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  margin-left: 10px;
  background-color: #d15462;
}
@media only screen and (max-width: 400px) {
  .cc .ctxt-institutionnel.tiles h2 {
    font-size: 25px;
  }
}

.cc .ctxt-institutionnel.tiles > ul.img {
  /* background-color: @background; */
  display: flex;
  align-items: center;
  align-items: flex-start;
  width: 100%;
  max-width: calc(100% - 32px);

  /* px */
  margin: 8px 16px;

  /* rem */
  margin: 8 / 16rem 16 / 16rem;
  line-height: 1.2;
}

.cc .ctxt-institutionnel.tiles > ul.img li {
  flex: 1 1 0%;
  width: 50%;

  /* px */
  padding: 0 16px;

  /* rem */
  padding: 0 / 16rem 16 / 16rem;
  border-radius: 5px;
}

.cc .ctxt-institutionnel.tiles > ul.img li h3 {
  padding-top: 20px;
  padding-bottom: 30px;
  font-size: 15px;
  text-align: center;
}

.cc .ctxt-institutionnel.tiles > ul.img li h3.font::before {
  display: block;

  /* px */
  height: 40px;

  /* rem */
  height: 40 / 16rem;
  margin-bottom: 10px;
  color: #4471a8;
  font-size: 55px;
  font-family: fts_picto;
  text-align: center;
}

.cc .ctxt-institutionnel.tiles > ul.img li h3.font.podium::before {
  content: '\F0376';
}

.cc .ctxt-institutionnel.tiles > ul.img li h3.font.star::before {
  content: '\F0129';
}

.cc .ctxt-institutionnel.tiles > ul.img li h3.font.secure::before {
  content: '\F043E';
}

.cc .ctxt-institutionnel.tiles > ul.img li h3.font.strange::before {
  content: '\F045E';
}
@media only screen and (max-width: 768px) {
  .cc .ctxt-institutionnel.tiles > ul.img {
    flex-wrap: wrap;
  }

  .cc .ctxt-institutionnel.tiles > ul.img li {
    min-width: 50%;
  }
}

.cc .ctxt-institutionnel.tiles div.code {
  display: flex;
  flex: 1 1 100%;
  align-items: center;

  /* px */
  margin: 8px 16px;

  /* rem */
  margin: 8 / 16rem 16 / 16rem;
  line-height: 1.2;
}

.cc .tile {
  display: flex;
  flex-direction: column;

  /* px */
  margin-bottom: 32px;

  /* rem */
  margin-bottom: 32 / 16rem;

  /* px */
  padding-bottom: 16px;

  /* rem */
  padding-bottom: 16 / 16rem;
  border-radius: 3px;
  background-color: #fff;
  box-shadow: 0 0 8px 0 #ccc;
}

.cc .tile > img {
  flex: none;
}

.cc .tile .tileHeader {
  position: relative;
  flex: 1 1 auto;
}

.cc .tile .tileHeader > h1,
.cc .tile .tileHeader h3 {
  /* px */
  padding-top: 0;

  /* rem */
  padding-top: 0 / 16rem;

  /* px */
  padding-right: 16px;

  /* rem */
  padding-right: 16 / 16rem;

  /* px */
  padding-bottom: 8px;

  /* rem */
  padding-bottom: 8 / 16rem;

  /* px */
  padding-left: 0;

  /* rem */
  padding-left: 0 / 16rem;
  color: #4471a8;
}

.cc .tile .tileHeader > p {
  /* px */
  padding: 0 24px;

  /* rem */
  padding: 0 / 16rem 24 / 16rem;
  color: #8d8d8d;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
}

.cc .tile .more {
  font-size: 14px;
  text-decoration: none;
}

.cc .tile .more::after {
  content: '\EBB6';
  display: inline-block;
  vertical-align: middle;

  /* px */
  width: 20px;

  /* rem */
  width: 20 / 16rem;

  /* px */
  height: 24px;

  /* rem */
  height: 24 / 16rem;
  padding-top: 1px;
  color: #4471a8;

  /* px */
  font-size: 22px;

  /* rem */
  font-size: 22 / 16rem;
  font-family: fts_commun;
  transition: color 0.2s linear;
}

.cc .tile .more:hover::after,
.cc .tile .more:focus::after {
  padding-left: 5px;
  color: #4471a8;
}

.cc .tile .tileFooter p {
  /* px */
  padding: 0 16px;

  /* rem */
  padding: 0 / 16rem 16 / 16rem;
  text-align: right;
}

.cc .tile div.ctxt-offers > h1,
.cc .tile div.ctxt-offers h3 {
  padding-top: 20px;
  color: #4471a8;
  font-size: 17px;
  text-transform: uppercase;
}

.cc .tile div.ctxt-offers > h1::before,
.cc .tile div.ctxt-offers h3::before {
  content: ' ';
  bottom: 4px;
  left: 0;
  display: inline-block;

  /* px */
  width: 20px;

  /* rem */
  width: 20 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  margin-right: 4px;
  background-color: #d15462;
}
@media only screen and (max-width: 768px) {
  .cc .tile div.ctxt-offers img {
    display: block;
    margin: 0 auto;
  }
}

.cc .tile div.ctxt-offers > p {
  color: #414141;
  line-height: 1.3;
}

.cc .tile .atouts {
  flex: 1 1 0%;
}

.cc .tile .atouts div.tab {
  min-height: 350px;

  /* height: calc(~"100% - 54px + 16px"); */

  /* height: 100%; */
  background: #fff;
}
@media only screen and (max-width: 970px) {
  .cc .tile .atouts div.tab {
    height: auto;
  }
}

.cc .tile div.ctxt-groupe {
  position: absolute;
  top: 0;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;

  /* px */
  padding: 20px 0;

  /* rem */
  padding: 20 / 16rem 0 / 16rem;
}

.cc .tile div.ctxt-groupe .tileHeader {
  position: relative;
  flex: 1 1 0%;
}

.cc .tile div.ctxt-groupe .tileHeader > h3 {
  color: #fff;

  /* px */
  font-size: 20px;

  /* rem */
  font-size: 20 / 16rem;
  text-transform: uppercase;
}

.cc .tile div.ctxt-groupe .tileHeader > h3::before {
  content: ' ';
  bottom: 4px;
  left: 0;
  display: inline-block;

  /* px */
  width: 24px;

  /* rem */
  width: 24 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  margin-right: 5px;
  background-color: #d15462;
}
@media only screen and (max-width: 400px) {
  .cc .tile div.ctxt-groupe .tileHeader > h3 {
    /* px */
    font-size: 16px;

    /* rem */
    font-size: 16 / 16rem;
  }
}

.cc .tile div.ctxt-groupe .tileHeader > p {
  color: #fff;
}

.cc .tile div.ctxt-groupe .tileHeader > p.intro {
  padding-right: 50px;
  font-weight: 300;

  /* px */
  font-size: 47px;

  /* rem */
  font-size: 47 / 16rem;
  line-height: 1;
}
@media only screen and (max-width: 970px) {
  .cc .tile div.ctxt-groupe .tileHeader > p.intro {
    /* px */
    font-size: 27px;

    /* rem */
    font-size: 27 / 16rem;
  }
}

.cc .tile div.ctxt-groupe .tileHeader h1 {
  padding-right: 50px;
  color: #fff;
  font-weight: 300;

  /* px */
  font-size: 47px;

  /* rem */
  font-size: 47 / 16rem;
  line-height: 1;
}
@media only screen and (max-width: 970px) {
  .cc .tile div.ctxt-groupe .tileHeader h1 {
    /* px */
    font-size: 27px;

    /* rem */
    font-size: 27 / 16rem;
  }
}
@media only screen and (max-width: 970px) {
  .cc .tile div.ctxt-groupe .tileHeader .img {
    aligne-content: center;
  }
}

.cc .tile div.ctxt-groupe .tileFooter p.actions {
  text-align: left;
}

.cc .tile div.img {
  left: 0;
  overflow: hidden;
  width: 100%;
}

.cc .tile div.img figure {
  overflow: hidden;
  text-align: center;
}

.cc .tile div.img img {
  position: relative;
  left: 100%;
  max-width: unset;
  margin-left: -200%;
}

.cc .tile div.tuile img {
  position: relative;
  max-width: unset;
}

.cc .tile p.surtitle {
  position: relative;

  /* .px-to-rem(padding, @grid*4 0); */

  /* px */
  padding-top: 8px;

  /* rem */
  padding-top: 8 / 16rem;
  color: #4471a8;
  text-transform: uppercase;
}

.cc .tile p.surtitle::before {
  content: ' ';
  position: absolute;
  bottom: 4px;
  left: 0;
  display: block;

  /* px */
  width: 16px;

  /* rem */
  width: 16 / 16rem;

  /* px */
  height: 8/4px;

  /* rem */
  height: 8/4 / 16rem;
  background-color: #d15462;
}

.cc .tile h1 {
  color: #4471a8;
}

.cc .tile.ctxt-news {
  padding-top: 0;
  border-top: 4px solid #fff;
  background: #fff;
}

.cc .tile.ctxt-news a.button {
  background: transparent;
}

.cc .tile.ctxt-news a.button:hover,
.cc .tile.ctxt-news a.button:focus {
  background: #fff;
  color: #4471a8;
}

.cc .tile.ctxt-news {
  border-top-color: #393;
}

.cc .tile.ctxt-news h1 strong {
  color: #393;
  font-weight: bold;
}

.cc .tile.ctxt-news a.more {
  background: #393;
  color: #fff;
}

.cc .tile.ctxt-news a.more:hover,
.cc .tile.ctxt-news a.more:focus {
  background: #194d19;
}

.cc .tile.ctxt-news a.button {
  border-color: #393;
}

.cc .tile.ctxt-news a.button:hover,
.cc .tile.ctxt-news a.button:focus {
  background-color: #393;
  color: #fff;
}

.cc {
  /* 		Composants					*/

  /* 		Mise en forme des formulaires					*/
}

.cc #frmGeoloc .form-group > .form-control {
  width: 100%;
}
@media only screen and (max-width: 400px) {
  .cc #frmGeoloc .form-group > .form-control {
    width: 100%;
  }
}

.cc [class^='ctxt-form'] input,
.cc [class^='ctxt-form'] textarea {
  /* px */
  padding: 8px 16px;

  /* rem */
  padding: 8 / 16rem 16 / 16rem;
}

.cc [class^='ctxt-form'] .form-group > label,
.cc [class^='ctxt-form'] .form-label {
  display: block;
}

.cc [class^='ctxt-form'] .form-control {
  position: relative;
}

.cc [class^='ctxt-form'] .err-msg b {
  font-weight: bold;
}

.cc [class^='ctxt-form'] .form-text1 {
  display: inline-block;
}

.cc [class^='ctxt-form'] .form-text2 {
  display: inline-block;
}

.cc [class^='ctxt-form'] *[role='radiogroup'] {
  position: relative;
}

.cc [class^='ctxt-form'] *[role='radiogroup'] .form-control .err-msg {
  display: none;
}

.cc [class^='ctxt-form'] input[type='radio'],
.cc [class^='ctxt-form'] input[type='checkbox'] {
  /* px */
  margin-left: 20px;

  /* rem */
  margin-left: 20 / 16rem;
}

.cc [class^='ctxt-form'] input[type='radio']:first-child,
.cc [class^='ctxt-form'] input[type='checkbox']:first-child {
  /* px */
  margin-left: 0;

  /* rem */
  margin-left: 0 / 16rem;
}

.cc .inp-s {
  /* px */
  width: 150px;

  /* rem */
  width: 150 / 16rem;
}

.cc .inp-m {
  /* px */
  width: 200px;

  /* rem */
  width: 200 / 16rem;
}

.cc textarea.inp-m {
  /* px */
  width: 420px;

  /* rem */
  width: 420 / 16rem;
}

.cc .inp-l {
  /* px */
  width: 380px;

  /* rem */
  width: 380 / 16rem;
}

.cc .inp-xl {
  /* px */
  width: 500px;

  /* rem */
  width: 500 / 16rem;
}

.cc .ctxt-form-horizontal .form-group {
  display: flex;
  align-items: center;
}

.cc .ctxt-form-horizontal .form-group > label,
.cc .ctxt-form-horizontal .form-group .form-label {
  flex: 1 0 0;
  text-align: right;
}
@media only screen and (max-width: 768px) {
  .cc .ctxt-form-horizontal .form-group > label,
  .cc .ctxt-form-horizontal .form-group .form-label {
    text-align: left;
  }
}

.cc .ctxt-form-horizontal .form-group .form-control {
  flex: 2 0 0;
}

.cc .ctxt-form-horizontal .form-group .form-text1 {
  flex: 1 0 0;
  text-align: right;
}

.cc .ctxt-form-horizontal .form-group .form-text2 {
  flex: 2 0 0;
}

.cc .ctxt-form-horizontal button[type='submit'] {
  margin-bottom: 0;
}

.cc .ctxt-form-inline {
  /* px */
  margin-bottom: 16px;

  /* rem */
  margin-bottom: 16 / 16rem;

  /* background: @background; */

  /* px */
  padding: 8px 32px 32px;

  /* rem */
  padding: 8 / 16rem 32 / 16rem 32 / 16rem 32 / 16rem;
}

.cc .insert .ctxt-form-horizontal .form-group {
  padding: 0;
}

.cc .insert .inp-m,
.cc .insert .inp.l,
.cc .insert .inp-xl {
  width: 100%;
}

body.cc > .ctxt-form-inline p.center {
  display: flex;
  margin-top: 1rem;
}

body.cc > .ctxt-form-inline p.center input {
  flex: 1 1 0%;
}

body.cc > .ctxt-form-inline p.center button {
  margin-top: 0;
  margin-left: 8px;
}
@media only screen and (max-width: 400px) {
  body.cc > .ctxt-form-inline p.center {
    display: block;
    width: 100%;
  }

  body.cc > .ctxt-form-inline p.center input {
    width: 100%;
  }

  body.cc > .ctxt-form-inline p.center button {
    width: 100%;
    margin-top: 10px;
    margin-left: 0;
  }
}

#ei_tpl_footerlinks li a {
  font-size: 0.85em;
}

.cc header.hero {
  min-height: initial;
}

.cc header.hero div.img {
  top: 0;
}

.cc div.covid19 {
  position: relative;
  padding: 3em 2.5em;
  background-color: #4170a9;
  color: #fff;
  font-size: 1.2em;
}

.cc div.covid19 h2 {
  padding-bottom: 1em;
  color: #fff;
  font-weight: 600;
}

.cc div.covid19 p {
  color: #fff;
  line-height: 1.6em;
}

.cc div.covid19 a {
  color: #fff;
  line-height: 1.6em;
}

.cc div.covid19 a:hover {
  color: #f5cfcf;
  line-height: 1.6em;
  text-decoration: none;
}

.cc div.covid19 ul {
  padding-left: 2em;
}

.cc div.covid19 ul li {
  padding-bottom: 1.5em;
  list-style: disc;
}

.cc div.covid19 ul li:last-child {
  padding-bottom: 0;
}

.cc div.covid19 .encart {
  position: relative;
  bottom: inherit;
  z-index: inherit;
  max-width: inherit;
  border: 1px solid #fff;
  opacity: 1;
}

.cc div.covid19 .encart h3 {
  color: #fff;
  font-weight: bolder;
}

.cc div.container {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 100px;
}

.cc div.container div.podium {
  position: relative;
  display: flex;
  align-items: center;
  width: 80%;
  padding: 1em 2.5em;
  background-color: #4170a9;
  color: #fff;
  font-size: 1.2em;
  align: center;
}
@media only screen and (max-width: 768px) {
  .cc div.container div.podium {
    flex-direction: column;
    padding: 2em;
  }
}

.cc div.container div.podium div.text {
  width: 70%;
  padding: 25px 25px 15px;
  border-right: 1px solid #fff;
}
@media only screen and (max-width: 768px) {
  .cc div.container div.podium div.text {
    width: 100%;
    padding: 5px;
    border: 0;
  }
}

.cc div.container div.podium div.text .note {
  color: #fff;
  font-size: 12px;
}

.cc div.container div.podium div.img {
  width: 30%;
}
@media only screen and (max-width: 768px) {
  .cc div.container div.podium div.img {
    width: 100%;
  }
}

.cc div.container div.podium h2 {
  padding-bottom: 1em;
  color: #fff;
  font-weight: 500;
  line-height: 1.2em;
}

.cc div.container div.podium p {
  color: #fff;
  line-height: 1.6em;
}