﻿/* ==========================================================================
   Variables couleurs et polices
   ========================================================================== */
/*lighten(@age0-12, 36%);*/
/*lighten(@age1-3, 45%);*/
/*lighten(@age3-5, 34%);*/
/*lighten(@age5-8, 34%);*/
/* Fonts */
@font-face {
  font-family: 'oswaldbook';
  src: url('/css/fonts/oswald/ng-oswald-regular-webfont.eot');
  src: url('/css/fonts/oswald/ng-oswald-regular-webfont.eot?#iefix') format('embedded-opentype'), url('/css/fonts/oswald/ng-oswald-regular-webfont.woff') format('woff'), url('/css/fonts/oswald/ng-oswald-regular-webfont.ttf') format('truetype'), url('/css/fonts/oswald/ng-oswald-regular-webfont.svg#oswaldbook') format('svg');
  font-weight: normal;
  font-style: normal;
}
@font-face {
  font-family: 'oswaldbook';
  src: url('/css/fonts/oswald/oswald-light-webfont.eot');
  src: url('/css/fonts/oswald/oswald-light-webfont.eot?#iefix') format('embedded-opentype'), url('/css/fonts/oswald/oswald-light-webfont.woff') format('woff'), url('/css/fonts/oswald/oswald-light-webfont.ttf') format('truetype'), url('/css/fonts/oswald/oswald-light-webfont.svg#oswaldbook') format('svg');
  font-weight: 300;
  font-style: normal;
}
/* ==========================================================================
   Helper classes
   ========================================================================== */
.listReset {
  margin: 0;
  padding: 0;
  list-style-type: none;
}
.hoverUnderline {
  text-decoration: none;
}
.hoverUnderline:hover,
.hoverUnderline:active {
  text-decoration: underline;
}
.ir {
  background-color: transparent;
  border: 0;
  overflow: hidden;
  text-indent: -9999px;
}
.ir:before {
  content: "";
  display: block;
  width: 0;
  height: 150%;
}
.hidden {
  display: none !important;
  visibility: hidden;
}
.visuallyhidden {
  border: 0;
  clip: rect(0 0 0 0);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
  clip: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  position: static;
  width: auto;
}
.invisible {
  visibility: hidden;
}
.clearfix:before,
.clearfix:after {
  content: " ";
  display: table;
}
.clearfix:after {
  clear: both;
}
.clearfix {
  *zoom: 1;
}
#headerFiche #filArianne {
  display: none;
}
.main-content.index #headerFiche {
  padding-top: 63px;
}
.main-content.index #headerFiche #filArianne {
  display: none;
}
.main-content.index #headerFiche h1 {
  text-align: center;
}
#accueilDossiers #dossierVedette .image {
  margin-bottom: 24px;
}
#accueilDossiers #dossierVedette .image img {
  width: 100%;
  height: auto;
  border-radius: 30px 30px 30px 0;
  aspect-ratio: 17 / 10;
  object-fit: cover;
  object-position: center center;
}
#accueilDossiers #dossierVedette .texte h2 {
  margin: 0 0 23px;
}
#accueilDossiers #navDossier h3 {
  margin-bottom: 34px;
}
#accueilDossiers #navDossier ul {
  list-style-type: none;
  margin: 0 0 2em;
  padding: 0;
}
#accueilDossiers #navDossier ul li {
  margin-left: 0;
  padding-left: 0;
}
#accueilDossiers #navDossier ul li:before {
  content: "";
  display: none;
}
#accueilDossiers #navDossier ul li a {
  display: flex;
  gap: 18px;
  align-items: flex-start;
  text-decoration: none;
  color: #333333;
}
#accueilDossiers #navDossier ul li a .image {
  flex: 0 0 93px;
}
#accueilDossiers #navDossier ul li a .image img {
  width: 100%;
  height: auto;
  border-radius: 5px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center center;
}
#accueilDossiers #navDossier ul li a .texte {
  flex: 1;
}
#accueilDossiers #navDossier ul li a .texte h4 {
  margin: 0;
  font-size: 16px;
  line-height: 22px;
  font-weight: 700;
}
#accueilDossiers #navDossier ul li a:hover .texte h4,
#accueilDossiers #navDossier ul li a:active .texte h4 {
  text-decoration: underline;
}
#accueilDossiers #navDossier ul li + li {
  margin-top: 30px;
}
/* Dossiers */
#contenuFicheTexte .dossierlisteImg li {
  display: block;
  height: 11em;
  background: transparent;
  padding-left: 0px;
}
#contenuFicheTexte .dossierlisteImg li img {
  float: left;
  vertical-align: top;
  padding: 0 15px 0 0px;
  margin: 0 0 10px 0;
}
.main-container .main-content.fiche section .Encadre-image-texte-droite {
  margin-top: 25px;
  padding: 10px;
  overflow: auto;
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-weight: bold;
  font-size: 1.3em;
  border-bottom: 2px solid #c0c0c0;
  border-top: 2px solid #c0c0c0;
}
.main-container .main-content.fiche section .Encadre-image-texte-droite img {
  float: left;
  margin: 0px 15px 15px 0px;
}
.main-container .main-content.fiche section .Encadre-image-texte-droite h3 {
  clear: inherit;
  margin: 15px 5px -20px 0px;
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-weight: bold;
  font-size: 1.4em;
}
.main-container .main-content.fiche section .Encadre-image-texte-droite b {
  font-size: 1.3em;
}
.main-container .main-content.fiche section .Encadre-image-texte-gauche {
  margin: 25px 0 13px 0;
  padding: 10px;
  overflow: auto;
  font-size: 1.3em;
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-weight: bold;
  border-bottom: 2px solid #c0c0c0;
  border-top: 2px solid #c0c0c0;
}
.main-container .main-content.fiche section .Encadre-image-texte-gauche img {
  float: right;
  margin: 0px 0px 15px 15px;
}
.main-container .main-content.fiche section .Encadre-image-texte-gauche h3 {
  clear: inherit;
  margin: 15px 5px -20px 0px;
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-weight: bold;
  font-size: 1.4em;
}
.main-container .main-content.fiche section .Encadre-image-texte-gauche b {
  font-size: 1.3em;
}
.elementsImage {
  overflow: visible;
}
/* =================================
    ACCUEIL D'UN DOSSIER
   =============================== */
.dossier {
  max-width: 1024px;
  margin: auto;
}
.dossier.accueilDossiers {
  max-width: 100%;
}
.dossier #surTitreDossier {
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-size: 1.4em;
  font-weight: 700;
  text-align: center;
  margin-bottom: 0.2em;
}
.dossier h1 {
  text-align: center;
  font-size: 2.5em;
  line-height: 1.2;
  margin: 0 0 0.66666667em;
}
.dossier #lienDeTraduction {
  margin: -5px 0 20px;
  text-align: center;
}
.dossier #lienDeTraduction a {
  color: #333333;
  text-decoration: none;
  max-width: 50px;
  margin: 0 auto;
  display: block;
  font-size: 14px;
}
.dossier #lienDeTraduction a:hover,
.dossier #lienDeTraduction a:active {
  text-decoration: underline;
}
.dossier #lienDeTraduction a img {
  display: block;
  margin: 0 auto 5px;
  width: 32px;
  height: 32px;
}
.dossier .elementsImage {
  overflow: visible;
}
.dossier .rangees {
  overflow: auto;
}
.dossier .element {
  line-height: 1.3;
  margin-bottom: 22px;
  position: relative;
}
.dossier .element a {
  text-decoration: none;
}
.dossier .element h2 {
  font-family: 'Droid Sans', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-weight: bold;
}
.dossier .element.avecImage .image-wrap .image-wrap-container img {
  width: 100%;
  height: auto;
  margin: 0 auto;
  position: relative;
  left: -50%;
}
.dossier .element.avecImage .elementContent {
  background-color: #44484f;
  padding: 11px;
  min-height: 59px;
  position: relative;
}
.dossier .element.avecImage .elementContent h2 {
  margin: 0;
  font-size: 1em;
  color: #fff;
}
.dossier .element.avecImage .elementContent span.plus {
  display: block;
  width: 25px;
  height: 25px;
  position: absolute;
  right: 5px;
  bottom: 5px;
  background: url(/img/layout2013/vedette-plus.png) center top no-repeat;
}
.dossier .element.avecImage.principal {
  width: 100%;
  float: none;
  text-align: center;
}
.dossier .element.avecImage.principal .elementContent {
  padding: 22px 11px;
}
.dossier .element.avecImage.principal .elementContent h2 {
  font-size: 1.2em;
  margin-bottom: 0.5em;
}
.dossier .element.avecImage.principal .elementContent .description {
  color: #fff;
  margin: 0;
}
.dossier .element a:hover .elementContent span.plus,
.dossier .element a:active .elementContent span.plus {
  background-position: center bottom;
}
.dossier .rangee {
  overflow: auto;
}
.dossier .rangee .element:first-child {
  margin-right: 6%;
}
.dossier .sousTitreAussi {
  color: #0078b5;
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-weight: bold;
  text-align: center;
  font-size: 1.5em;
  padding: 0.6em;
  border-top: 1px solid #eaeaea;
  border-bottom: 1px solid #eaeaea;
  margin: 0.2em -5px 1em;
}
.dossier .element.texte {
  text-align: center;
  margin-bottom: 25px;
  /*modif pour l'index liens à lire aussi*/
}
.dossier .element.texte h2 {
  color: #333333;
  margin: 0 0 0.5em;
  font-size: 1.3em;
}
.dossier .element.texte p {
  margin: 0 0 0.5em;
}
.dossier .element.texte p.description {
  font-size: 1.2em;
  color: #000;
}
.dossier .element.texte a.plus:hover,
.dossier .element.texte a.plus:active {
  text-decoration: none;
}
.dossier .element.texte a.plus:after {
  content: " +";
  font-weight: bold;
}
.dossier .element.texte + .element.texte {
  padding-top: 27px;
  background: url(/img/layout2013/points-separation.png) center top no-repeat;
}
.dossier .lireDossier {
  font-weight: bold;
  position: absolute;
  bottom: 13px;
  right: 40px;
}
/* Navigation */
.main-container .main-content-container {
  overflow: visible;
}
/*menu--Retour au dossier*/
.bord {
  border-top: 2px solid #eaeaea;
  border-bottom: 2px solid #eaeaea;
  padding: 0.5em 0;
  margin: 0 -5px 1.35em -5px;
  width: 100%;
  height: 25px;
  clear: both;
}
.bord a {
  text-decoration: none;
  float: right;
  font-size: 1.2em;
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-weight: bold;
}
/* =================================
    ACCUEIL DE TOUS LES DOSSIERS
   =============================== */
#dossierNavIndex .element.principal .texte {
  margin-top: 20px;
}
#dossierNavIndex .element.principal .texte #mainDossierTextContainer #mainSupTitle {
  font-size: 26px;
  line-height: 34px;
  font-weight: 700;
}
#dossierNavIndex .element.principal .texte #mainDossierTextContainer h2 {
  font-family: 'Roboto Slab', serif;
  color: #0078b5;
  margin: 0 0 0.5em;
  font-size: 1.8em;
  font-weight: normal;
}
#dossierNavIndex .element.principal .texte #mainDossierTextContainer p#description {
  font-size: 1em;
  margin-bottom: 15px;
}
#dossierNavIndex .element.principal .texte #mainDossierTextContainer span.plus {
  color: #309aea;
  font-size: 1.15em;
}
#dossierNavIndex .element.principal .texte #mainDossierTextContainer span.plus b {
  font-size: 1.3em;
  line-height: 1;
  vertical-align: top;
}
#dossierNavIndex #navDossier {
  margin-bottom: 50px;
}
#dossierNavIndex #navDossier #navDossierOuvert {
  position: initial;
  margin: 0px;
  padding: 0px;
  background-color: #fff;
  top: 0;
}
#dossierNavIndex #navDossier #navDossierOuvert p {
  color: #333333;
  font-weight: bold;
  font-size: 1.8em;
  text-align: center;
  margin: 45px 0px 0px 0px;
  border-top: 1px solid #CFCFCF;
  border-bottom: 1px solid #CFCFCF;
  padding: 10px 0;
}
#dossierNavIndex #navDossier #navDossierOuvert ul {
  margin: 0px;
  padding: 20px 0px;
  border-top: none;
  border-bottom: none;
}
/* =================================
    PAGE FICHE D'UN DOSSIER
   =============================== */
.fiche #DocAssocie #DocAssocieContainer .item-doc-associe img {
  height: 40px;
}
.fiche #DocAssocie #DocAssocieContainer .item-doc-associe .title {
  margin-left: 0px;
}
.fiche #DocAssocie #DocAssocieContainer .item-doc-associe + .item-doc-associe + .item-doc-associe + .item-doc-associe {
  display: block;
}
.cellCuriositeTrameeNoTableauGlobal .cellCuriositeTrameeNoTableau img {
  float: right;
  margin: 0 0 20px 0;
}
/* Navigation de rappel dans les fiches */
#navInterneDossierBas {
  margin-top: 40px;
  margin-bottom: 40px;
  font-size: 16px;
}
#navInterneDossierBas h2 {
  font-family: 'Roboto Slab', serif;
  font-weight: normal;
  font-size: 28px;
  text-align: center;
  color: #333333;
}
#navInterneDossierBas #navInterneDossierBasContainer .item {
  max-width: 288px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  justify-content: space-between;
  padding: 20px 0;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#navInterneDossierBas #navInterneDossierBasContainer .item a {
  color: #333333;
  text-decoration: none;
  font-weight: bold;
}
#navInterneDossierBas #navInterneDossierBasContainer .item a:hover,
#navInterneDossierBas #navInterneDossierBasContainer .item a:active {
  text-decoration: underline;
}
#navInterneDossierBas #navInterneDossierBasContainer .item .itemImage {
  flex: 0 0 90px;
  margin-right: 20px;
}
#navInterneDossierBas #navInterneDossierBasContainer .item .itemImage img {
  width: 90px;
  height: auto;
  display: block;
}
#navInterneDossierBas #navInterneDossierBasContainer .item .itemTitre {
  flex-grow: 1;
  padding-right: 20px;
}
#navInterneDossierBas #navInterneDossierBasContainer .item.selected {
  background-color: #f6f6f6;
  padding-left: 20px;
}
#navInterneDossierBas #navInterneDossierBasContainer .item.selected .itemTitre {
  color: #999;
}
#navInterneDossierBas #navInterneDossierBasContainer .item + .item {
  border-top: 1px solid #c0c2c4;
}
/* Navigation catfish dans les fiches */
#container-dossier-page-navigation {
  position: fixed;
  bottom: -78px;
  left: 0;
  right: 0;
  height: 63px;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.9);
  box-shadow: 0px 0px 15px #ccc;
  z-index: 1000;
  font-size: 16px;
}
#container-dossier-page-navigation #content-dossier-page-navigation {
  padding: 0 22px;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  height: 63px;
}
#container-dossier-page-navigation .NomDossier {
  overflow: hidden;
}
#container-dossier-page-navigation .NomDossier .supTitle {
  display: block;
  color: #767c87;
  font-size: 0.95em;
}
#container-dossier-page-navigation .NomDossier strong {
  font-family: 'Roboto Slab', serif;
  font-weight: 400;
  white-space: nowrap;
  display: block;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
}
#container-dossier-page-navigation nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#container-dossier-page-navigation nav a {
  color: #333333;
  font-weight: 900;
  font-size: 25px;
  padding: 5px;
}
#container-dossier-page-navigation nav a:hover,
#container-dossier-page-navigation nav a:active {
  color: #017ACD;
}
#container-dossier-page-navigation nav #previous a {
  padding: 5px 5px 5px 0;
  margin-left: 5px;
}
#container-dossier-page-navigation nav #next a {
  padding: 5px 0 5px 5px;
}
#container-dossier-page-navigation nav #page-of {
  font-weight: bold;
  line-height: 1;
  margin: 0 5px;
  white-space: nowrap;
}
/* Section 100 gestes */
body.Dossier100gestes .main-container .main .main-content h2 {
  font-family: 'Roboto Slab', serif;
  font-size: 1.8em;
  line-height: 1.2;
  font-weight: normal;
  text-align: center;
  color: #333333;
  border-top: 1px solid #e6e6e6;
  padding-top: 40px;
}
body.Dossier100gestes .main-container .main .main-content #readSpeakerContent,
body.Dossier100gestes .main-container .main .main-content #printBtnDossier,
body.Dossier100gestes .main-container .main .main-content #dossierOutils {
  display: none;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc {
  overflow: auto;
  text-align: center;
  margin: 0 -10px 0;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc {
  background-color: #8CD7DD;
  height: 160px;
  background-position: center center;
  position: relative;
  margin: 10px;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.colorRose {
  background-color: #EA8192;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.colorJaune {
  background-color: #FBB323;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.colorGris {
  background-color: #D8D8D8;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a {
  width: 280px;
  height: 160px;
  padding: 15px;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  display: inline-block;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a > span {
  display: flex;
  align-items: center;
  width: auto;
  padding: 20px 5px;
  background-color: #fff;
  background-color: rgba(255, 255, 255, 0.8);
  position: absolute;
  bottom: 15px;
  left: 15px;
  right: 15px;
  top: auto;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a > span > span {
  font-size: 0.9em;
  padding: 0 40px 0 20px;
  display: block;
  line-height: 1.2;
  color: #333333;
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
  font-weight: bold;
  text-decoration: none;
  text-align: left;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  background-color: transparent;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a:hover span {
  background-color: rgba(0, 0, 0, 0.8);
  color: #fff;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a:hover span span {
  background-color: transparent;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.telecharger a span {
  font-family: 'Roboto Slab', serif;
  text-transform: none;
  font-weight: normal;
  font-size: 1.6em;
  background-color: transparent;
  color: #fff;
  text-align: center;
  top: 15px;
  line-height: 1;
  top: 90px;
  height: auto;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.telecharger a span:after {
  content: "\f0a9";
  left: 116px;
  right: auto;
  bottom: 65px;
  font-size: 28px;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.telecharger:hover {
  background-color: #000;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.minitext a {
  width: 280px;
  height: 160px;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.mini a {
  width: 280px;
  height: 160px;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.mini a > span {
  background-color: transparent;
  right: 0;
  bottom: 0;
  top: 0;
  left: 0;
  height: 100%;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.mini a > span span {
  top: auto;
  bottom: 10px;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.mini a > span span:after {
  top: auto;
  bottom: 10px;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.mini a:hover span {
  color: #e6e6e6;
}
body.Dossier100gestes .main-container .main .main-content #listeBloc + h2 {
  margin-top: 40px;
}
@media only screen and (max-width: 568px) {
  #contenuFicheTexte .dossierlisteImg li {
    height: 20em;
  }
  #contenuFicheTexte .dossierlisteImg li p {
    float: left;
  }
  .dossierEncadrerBleu {
    float: left;
    overflow: auto;
  }
}
/* Navigation interne de dossier */
#ficheDossier {
  background-color: #fff;
  max-width: 1280px;
  margin: 0 auto 2em;
}
#ficheDossier #main-header {
  text-align: center;
  background-position: center top;
  padding: 25px 0;
  background-color: #30343d;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
#ficheDossier #main-header #supTitleDossier {
  color: #fff;
}
#ficheDossier #main-header #supTitleDossier:before {
  content: "-";
  margin-right: 5px;
}
#ficheDossier #main-header #supTitleDossier:after {
  content: "-";
  margin-left: 5px;
}
#ficheDossier #main-header h3 {
  margin: 5px 0 20px;
  font-size: 1.4em;
  font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
}
#ficheDossier #main-header h3 a {
  color: #fff;
  text-decoration: none;
}
#ficheDossier #mainArticle.main-content .titreSection {
  display: none;
}
#ficheDossier aside {
  text-align: center;
}
@media only screen and (max-width: 767px) {
  /* Navigation interne de dossier */
  #ficheDossier #main-header #navInterneDossier {
    background-color: #53B6D8;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    border-radius: 5px;
    display: inline-block;
    width: 280px;
    text-align: left;
    position: relative;
  }
  #ficheDossier #main-header #navInterneDossier #navInterneSelectedDoc {
    padding: 7px 10px 7px 10px;
    color: #fff;
    font-weight: bold;
    cursor: pointer;
    font-size: 16px;
    background: url(/img/layout2013/fleche-bas-blanc.png) no-repeat right 13px center;
  }
  #ficheDossier #main-header #navInterneDossier #navInterneSelectedDoc span {
    display: inline-block;
    width: 233px;
    border-right: 1px solid #60b1ef;
    padding-right: 10px;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
  }
  #ficheDossier #main-header #navInterneDossier #navInterneDossierContainer {
    width: 100%;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-top: 1px solid #fff;
    display: none;
    background-color: #53B6D8;
    padding: 7px 10px 7px 10px;
    position: absolute;
    z-index: 100;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
  }
  #ficheDossier #main-header #navInterneDossier #navInterneDossierContainer .item a {
    color: #fff;
    text-decoration: none;
    font-weight: bold;
    padding: 5px 0;
    display: block;
    border-top: 1px solid #60b1ef;
    font-size: 14px;
  }
  #ficheDossier #main-header #navInterneDossier #navInterneDossierContainer .item:first-child a {
    border-top: none;
  }
  #ficheDossier #main-header #navInterneDossier.showSubNav {
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
  }
  #ficheDossier #main-header #navInterneDossier.showSubNav #navInterneDossierContainer {
    display: block;
  }
}
/* ====================
    INTERMEDIATE
   ==================== */
@media only screen and (min-width: 768px) {
  .main-container .main {
    display: block;
  }
  .main-container .main-content.fiche section .Encadre-image-texte-droite {
    overflow: auto;
  }
  .main-container .main-content.fiche section .Encadre-image-texte-droite img {
    float: left;
    margin: 0px 15px 15px 0px;
  }
  .main-container .main-content.fiche section .Encadre-image-texte-gauche {
    margin: 0 0 13px 0;
    overflow: auto;
  }
  .main-container .main-content.fiche section .Encadre-image-texte-gauche img {
    float: right;
    margin: 0px 0px 15px 15px;
  }
  .cellCuriositeTrameeNoTableauGlobal .cellCuriositeTrameeNoTableau img {
    margin: 0 0 20px 20px;
  }
  /* ACCUEIL D'UN DOSSIER */
  .dossier h1 {
    font-size: 3em;
  }
  .dossier .element.avecImage {
    width: 48%;
  }
  .dossier .element.avecImage .image-wrap {
    height: 215px;
  }
  .dossier .element.avecImage .image-wrap .image-wrap-container img {
    height: 215px;
    width: auto;
  }
  .dossier .element.avecImage .elementContent {
    width: 100%;
    height: 52px;
    min-height: 0;
    padding: 0;
    position: absolute;
    bottom: 0;
    background-color: #44484f;
    background-color: rgba(48, 52, 60, 0.8);
  }
  .dossier .element.avecImage .elementContent .elementContentContainer {
    padding: 6px 45px 5px 10px;
  }
  .dossier .element.avecImage .elementContent .elementContentContainer h2 {
    font-size: 1em;
  }
  .dossier .element.avecImage .elementContent span.plus {
    bottom: 13px;
    right: 10px;
  }
  .dossier .element.avecImage.principal .image-wrap {
    width: 100%;
    height: auto;
  }
  .dossier .element.avecImage.principal .image-wrap .image-wrap-container img {
    height: auto;
    width: 100%;
  }
  .dossier .element.avecImage.principal .elementContent {
    padding: 0;
    width: 72.5%;
    min-width: 370px;
    max-width: 420px;
    bottom: 30px;
    left: -9px;
    height: auto;
  }
  .dossier .element.avecImage.principal .elementContent .elementContentContainer {
    padding: 20px 45px 20px 29px;
  }
  .dossier .element.avecImage.principal .elementContent span.plus {
    bottom: 10px;
    right: 10px;
  }
  .dossier .rangee .element:first-child {
    margin-right: 4%;
  }
  .dossier .sousTitreAussi {
    font-size: 2.2em;
  }
  .dossier .element.texte {
    width: 80%;
    margin-left: auto;
    margin-right: auto;
  }
  .dossier .element.texte h2 {
    font-size: 1.4em;
  }
  /* ACCUEIL DE TOUS LES DOSSIERS */
  .main-content.index #headerFiche {
    padding-top: 40px;
  }
  .main-content.index #headerFiche h1 {
    font-size: 36px;
    line-height: 45px;
    margin-bottom: 51px;
  }
  #accueilDossiers #dossierVedette {
    margin-bottom: 80px;
  }
  #accueilDossiers #dossierVedette .image {
    float: right;
    width: 50%;
    margin-left: 34px;
  }
  #accueilDossiers #dossierVedette .texte h2 {
    font-size: 30px;
    line-height: 38px;
  }
  #accueilDossiers #navDossier ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 40px 30px;
  }
  #accueilDossiers #navDossier ul li {
    flex: 0 0 calc(100% / 3 - 20px);
    display: flex;
    margin: 0;
  }
  #accueilDossiers #navDossier ul li a {
    width: 100%;
    display: block;
    padding: 4px;
    border: 2px solid #e8f6f0;
    border-radius: 30px 30px 30px 0;
  }
  #accueilDossiers #navDossier ul li a .image img {
    aspect-ratio: 17 / 10;
    object-fit: cover;
    object-position: center center;
    border-radius: 26px 26px 26px 0;
  }
  #accueilDossiers #navDossier ul li a .texte {
    padding: 18px 18px 31px;
  }
  #accueilDossiers #navDossier ul li a .texte h4 {
    font-size: 18px;
    line-height: 26px;
  }
  #accueilDossiers #navDossier ul li + li {
    margin-top: 0;
  }
  #dossierNavIndex .element.principal #derniereParution {
    left: -10px;
  }
  #dossierNavIndex .element.principal .texte {
    width: 100%	;
  }
  #dossierNavIndex .element.principal .texte #mainDossierTextContainer h2 {
    font-size: 2.43em;
  }
  #dossierNavIndex #navDossier #navDossierOuvert p {
    font-size: 2.15em;
  }
  .fiche #DocAssocie #DocAssocieContainer {
    margin: 0 -20px 0 -7px;
    overflow: auto;
    padding: 0;
  }
  .fiche #DocAssocie #DocAssocieContainer .item-doc-associe {
    margin-top: 0;
    margin: 0 8px 15px 7px;
    overflow: auto;
    width: 185px;
    display: inline-block;
    vertical-align: top;
    float: none;
  }
  .fiche #DocAssocie #DocAssocieContainer .item-doc-associe .title {
    margin-left: 0px;
  }
  .fiche #DocAssocie #DocAssocieContainer .item-doc-associe img {
    float: none;
    margin-right: 0;
    margin-bottom: 9px;
    margin-top: 7px;
    display: block;
  }
  .fiche #DocAssocie #DocAssocieContainer .item-doc-associe:first-child {
    margin: 0 8px 15px 7px;
  }
  .fiche #DocAssocie #DocAssocieContainer .item-doc-associe + .item-doc-associe + .item-doc-associe + .item-doc-associe {
    display: inline-block;
  }
  /* Navigation interne de dossier */
  #ficheDossier #main-header {
    padding: 25px 0 15px;
    min-height: 270px;
  }
  #ficheDossier #main-header #supTitleDossier {
    font-size: 1.2em;
  }
  #ficheDossier #main-header #supTitleDossier:before {
    content: "";
    margin-right: 10px;
    height: 0;
    width: 208px;
    border-bottom: 2px solid #fff;
    position: relative;
    bottom: 4px;
    display: inline-block;
  }
  #ficheDossier #main-header #supTitleDossier:after {
    content: "";
    margin-left: 10px;
    height: 0;
    width: 208px;
    border-bottom: 2px solid #fff;
    position: relative;
    bottom: 4px;
    display: inline-block;
  }
  #ficheDossier #main-header h3 {
    margin: 0px 0 20px;
    font-size: 2.5em;
  }
  #ficheDossier #main-header #navInterneDossier {
    background-color: transparent;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
    display: block;
    width: auto;
    padding: 0 20px;
    text-align: center;
  }
  #ficheDossier #main-header #navInterneDossier #navInterneSelectedDoc {
    display: none;
  }
  #ficheDossier #main-header #navInterneDossier .item {
    display: inline-block;
  }
  #ficheDossier #main-header #navInterneDossier .item a {
    vertical-align: top;
    color: #fff;
    display: inline-block;
    text-decoration: none;
    font-weight: bold;
    border: 3px solid #fff;
    width: 106px;
    height: 106px;
    -webkit-border-radius: 60px;
    -moz-border-radius: 60px;
    -ms-border-radius: 60px;
    -o-border-radius: 60px;
    border-radius: 60px;
    text-align: center;
    position: relative;
    background: transparent url(/img/layout2013/fleche-bas-blanc.png) no-repeat 46px 83px;
    margin: 5px;
    font-size: 14px;
  }
  #ficheDossier #main-header #navInterneDossier .item a span {
    position: absolute;
    top: 43%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding: 0 10px;
    line-height: 1.3;
  }
  #ficheDossier #main-header #navInterneDossier .item a:hover {
    background-color: rgba(255, 255, 255, 0.3);
  }
  #ficheDossier #main-header #navInterneDossier .item a.selected {
    background-color: #53B6D8;
    border-color: #53B6D8;
  }
  #ficheDossier #ficheDossierContainer #mainArticle.main-content #fiche-header #filArianne {
    margin-top: 20px;
    float: left;
  }
  #ficheDossier #mainArticle.main-content {
    float: none;
    width: 100%;
    /*#fiche-header, .main-content-container {margin-left: 44px; margin-right: 44px; padding-left: 0; padding-right: 0;}*/
  }
  #ficheDossier #mainArticle.main-content section {
    margin-top: 0;
  }
  #ficheDossier #mainArticle.main-content #fiche-header {
    position: relative;
  }
  #ficheDossier aside {
    float: none;
    width: 100%;
  }
  /* Section 100 gestes */
  body.Dossier100gestes .main-container .main .main-content h2 {
    font-size: 2.1em;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc {
    margin: 0;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc {
    height: 225px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a {
    width: 206px;
    height: 178px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.tier a {
    width: 436px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.minitext a {
    width: 206px;
    height: 178px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.mini a {
    width: 206px;
    height: 178px;
  }
  /* Navigation de rappel dans les fiches */
  #navInterneDossierBas h2 {
    font-size: 38px;
  }
  /* Navigation catfish dans les fiches */
  #container-dossier-page-navigation #content-dossier-page-navigation {
    padding: 0 30px;
  }
  #container-dossier-page-navigation .NomDossier strong {
    font-family: 'Roboto Slab', serif;
    font-weight: 400;
    font-size: 1.33em;
  }
}
/* ====================
    WIDE
   ==================== */
@media only screen and (min-width: 1024px) {
  .main section.main-content {
    float: none;
    width: 100%;
  }
  .main-container .main aside {
    display: none;
  }
  .bord {
    width: 97%;
  }
  /* ACCUEIL D'UN DOSSIER */
  .dossier {
    width: auto;
    /*margin-left: 80px; margin-right: 80px;*/
  }
  .dossier .element.avecImage {
    width: 48.5%;
  }
  .dossier .element.avecImage .image-wrap {
    width: 100%;
    height: 215px;
  }
  .dossier .element.avecImage .image-wrap .image-wrap-container img {
    width: auto;
    height: 215px;
  }
  .dossier .element.avecImage.principal .image-wrap {
    width: 100%;
    height: 440px;
  }
  .dossier .element.avecImage.principal .image-wrap .image-wrap-container img {
    height: 440px;
    width: auto;
  }
  .dossier .rangee .element:first-child {
    margin-right: 3%;
  }
  .dossier .sousTitreAussi {
    margin-left: -10px;
    margin-right: -10px;
  }
  .dossier .element.texte {
    width: 65%;
  }
  .dossier .element.texte p.description {
    font-size: 1.2em;
  }
  .main-container .main.pleineLargeur #bPartager {
    margin-left: 100px;
    margin-right: 100px;
  }
  .main-container .main.pleineLargeur #ficheDossier #bPartager {
    margin-left: 70px;
    margin-right: 70px;
  }
  #navDossier #navDossierFerme {
    margin-left: 70px;
    margin-right: 70px;
    padding-left: 10px;
    padding-right: 10px;
  }
  #navDossier #navDossierOuvert {
    top: -83px;
  }
  #navDossier #navDossierOuvert strong {
    font-weight: normal;
    margin-left: 80px;
    margin-right: 80px;
    display: block;
  }
  #navDossier #navDossierOuvert strong a {
    text-decoration: none;
    font-family: 'Open Sans Condensed', Helvetica, Helvetica Neue, Arial, sans-serif;
    font-weight: bold;
    color: #fff;
    text-transform: uppercase;
    display: block;
    font-size: 1.2em;
    padding-right: 50px;
    margin: 0 auto;
    background: url(/img/layout2013/x-fermer.png) right center no-repeat;
  }
  #navDossier #navDossierOuvert ul {
    margin-left: 70px;
    margin-right: 70px;
  }
  /* ACCUEIL DE TOUS LES DOSSIERS */
  .main-content.index #headerFiche h1 {
    font-size: 40px;
    line-height: 50px;
    margin-bottom: 70px;
  }
  #accueilDossiers #dossierVedette {
    margin-bottom: 80px;
    display: flex;
    gap: 33px;
  }
  #accueilDossiers #dossierVedette .image {
    order: 2;
    flex: 0 1 56%;
    float: none;
    width: auto;
    margin-left: 0;
  }
  #accueilDossiers #dossierVedette .texte {
    order: 1;
    flex: 1;
  }
  #accueilDossiers #dossierVedette .texte h2 {
    font-size: 40px;
    line-height: 50px;
  }
  #accueilDossiers #navDossier ul {
    gap: 40px;
  }
  #accueilDossiers #navDossier ul li {
    flex: 0 0 calc(100% / 4 - 30px);
  }
  #dossierNavIndex .element.principal {
    margin-left: -10px;
    padding-left: 10px;
    overflow: auto;
  }
  #dossierNavIndex .element.principal #derniereParution {
    left: 0;
  }
  #dossierNavIndex .element.principal a {
    display: flex;
  }
  #dossierNavIndex .element.principal .image-wrap {
    margin-left: 0;
    height: 245px;
    margin-right: 30px;
    max-width: 600px;
    flex: 1;
  }
  #dossierNavIndex .element.principal .image-wrap .image-wrap-container {
    height: auto;
  }
  #dossierNavIndex .element.principal .image-wrap .image-wrap-container img {
    width: auto;
    height: 245px;
  }
  #dossierNavIndex .element.principal .texte {
    margin-top: 0;
    flex: 1;
    text-align: left;
  }
  #dossierNavIndex .element.principal .texte #mainDossierTextContainer #mainSupTitle {
    margin-top: 0;
  }
  /* PAGE FICHE D'UN DOSSIER */
  .fiche #DocAssocie #DocAssocieContainer .item-doc-associe {
    width: 155px;
  }
  /* Navigation interne de dossier */
  #ficheDossier {
    /*		#mainArticle.main-content {
			#fiche-header, .main-content-container {margin-left: 70px; margin-right: 70px;}
			#contenuFicheTexte {max-width: 100%;}
		}*/
  }
  #ficheDossier #main-header {
    padding: 30px 0 15px;
    min-height: 360px;
    margin-right: 0;
  }
  #ficheDossier #main-header #supTitleDossier:before {
    margin-right: 15px;
    width: 275px;
    border-bottom: 3px solid #fff;
    bottom: 6px;
  }
  #ficheDossier #main-header #supTitleDossier:after {
    margin-left: 15px;
    width: 275px;
    border-bottom: 3px solid #fff;
    bottom: 6px;
  }
  #ficheDossier #main-header h3 {
    margin: 0px 0 25px;
  }
  #ficheDossier #main-header #navInterneDossier .item a {
    border: 4px solid #fff;
    width: 140px;
    height: 140px;
    -webkit-border-radius: 75px;
    -moz-border-radius: 75px;
    -ms-border-radius: 75px;
    -o-border-radius: 75px;
    border-radius: 75px;
    text-align: center;
    position: relative;
    background-position: 63px 112px;
    margin: 12px;
    font-size: 16px;
  }
  #ficheDossier #main-header #navInterneDossier .item a span {
    padding: 0 10px;
  }
  #ficheDossier #main-header #navInterneDossier .twoRows {
    margin-top: -20px;
  }
  #ficheDossier #main-header #navInterneDossier .twoRows .item a {
    margin-top: 5px;
    margin-bottom: 5px;
    width: 135px;
    height: 135px;
    background-position: 60px 110px;
  }
  #ficheDossier #ficheDossierContainer {
    display: flex;
  }
  #ficheDossier #ficheDossierContainer #mainArticle.main-content {
    vertical-align: top;
    max-width: 850px;
    margin-left: auto;
    margin-right: auto;
  }
  #ficheDossier #ficheDossierContainer #mainArticle.main-content #fiche-header img.mainContentImage,
  #ficheDossier #ficheDossierContainer #mainArticle.main-content .main-content-container img.mainContentImage {
    margin-right: 0;
    margin-top: 0;
  }
  #ficheDossier #ficheDossierContainer #mainArticle.main-content #contenuFicheTexte {
    max-width: 100%;
  }
  #ficheDossier #ficheDossierContainer #mainArticle.main-content #navDossier #navDossierOuvert ul {
    margin-left: 30px;
    margin-right: 30px;
  }
  #ficheDossier #ficheDossierContainer #mainArticle.main-content #navDossier #navDossierOuvert ul li {
    width: 195px;
  }
  #ficheDossier #ficheDossierContainer aside {
    display: none;
  }
  /* Section 100 gestes */
  body.Dossier100gestes .main-container .main .main-content h2 {
    font-size: 2.5em;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc {
    float: left;
    height: auto;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a {
    display: block;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a span {
    font-size: 16px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc a span:after {
    font-size: 22px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.grand a {
    width: 432px;
    height: 500px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.demi a {
    width: 432px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.tier a {
    width: 433px;
    height: 240px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.vertical a {
    height: 500px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.mini a {
    height: 240px;
  }
  body.Dossier100gestes .main-container .main .main-content #listeBloc .bloc.minitext a {
    height: 240px;
  }
}
@media only screen and (min-width: 1440px) {
  .main-content.index #headerFiche h1 {
    font-size: 44px;
    line-height: 54px;
    margin-bottom: 79px;
  }
  #accueilDossiers #dossierVedette {
    margin-bottom: 110px;
    gap: 42px;
  }
  #accueilDossiers #dossierVedette .texte h2 {
    font-size: 44px;
    line-height: 54px;
  }
  #accueilDossiers #navDossier ul li {
    flex: 0 0 calc(100% / 5 - 32px);
  }
}