/*HACK*/
HTML BODY {
  overflow-x: hidden;
}
.bloc-text IMG.cns {
  display: inline-block;
  margin-bottom: -8px;
}
/*COLOR*/
.primaire {
  color: #1C3077 !important;
}
.secondaire {
  color: #2B818E !important;
}
.tertiaire {
  color: #4564CD !important;
}
.quaternaire {
  color: #6267A1 !important;
}
.bg-primaire {
  background: #ECEFFA !important;
}
.bg-secondaire {
  background: #EAF2F4 !important;
}
.bg-tertiaire {
  background: #E4E6F0 !important;
}
.bg-quaternaire {
  background: #F0F0F6 !important;
}
.dg-primaire {
  background: rgb(255, 255, 255) !important;
  background: -moz-linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(236, 239, 250, 1) 100%) !important;
  background: -webkit-linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(236, 239, 250, 1) 100%) !important;
  background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgba(236, 239, 250, 1) 100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#eceffa",GradientType=1) !important;
}
.dg-secondaire {
  background: rgb(255, 255, 255) !important;
  background: -moz-linear-gradient(-90deg, rgba(255, 255, 255, 1) 0%, rgba(234, 242, 244, 1) 100%) !important;
  background: -webkit-linear-gradient(-90deg, rgba(255, 255, 255, 1) 0%, rgba(234, 242, 244, 1) 100%) !important;
  background: linear-gradient(-90deg, rgba(255, 255, 255, 1) 0%, rgba(234, 242, 244, 1) 100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#eaf2f4",GradientType=1) !important;
}
.dg-tertiaire {
  background: rgb(255, 255, 255) !important;
  background: -moz-linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(236, 239, 250, 1) 100%) !important;
  background: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(236, 239, 250, 1) 100%) !important;
  background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(236, 239, 250, 1) 100%) !important;
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#eceffa",GradientType=1) !important;
}
/*.dg-maths{background:rgb(255,255,255);background:-moz-linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(255,243,234,1) 100%);background:-webkit-linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(255,243,234,1) 100%);background:linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(255,243,234,1) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#fff3ea",GradientType=1);}*/
/*.dg-francais{background:rgb(255,255,255);background:-moz-linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(255,234,252,1) 100%);background:-webkit-linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(255,234,252,1) 100%);background:linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(255,234,252,1) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ffeafc",GradientType=1);}*/
/*.dg-pedagogie{background:rgb(255,255,255);background:-moz-linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(238,255,234,1) 100%);background:-webkit-linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(238,255,234,1) 100%);background:linear-gradient(0deg,rgba(255,255,255,1) 0%,rgba(238,255,234,1) 100%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#eeffea",GradientType=1);}*/
/*WRAP*/
.wrap {
  box-sizing: border-box;
  max-width: 1240px;
  margin: 0 auto;
  margin-right: auto;
  margin-left: auto;
  padding-left: 0rem;
  padding-right: 0rem;
  font-family: "Segoe UI", sans-serif !important;
  font-size: 16px;
  line-height: 1.5;
  font-weight: normal;
  color: #373737;
}
.wrap A {
  color: #373737;
}
.wrap A:hover {
  text-decoration: none;
}
.wrap IMG.responsive {
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
  position: relative;
  display: block;
}
.wrap .text-center {
  text-align: center;
}
.wrap .text-left {
  text-align: left;
}
.wrap .no-margin {
  margin: 0;
}
.wrap H1, .wrap H2, .wrap H3, .wrap H4 {
  font-family: 'Raleway', sans-serif;
  margin-top: 0em;
  margin-bottom: 1em;
  line-height: 1.2;
}
.wrap P {
  font-family: "Segoe UI", sans-serif;
  margin-top: 0em;
  margin-bottom: 0.75em;
  line-height: 1.5;
}
.wrap H1 {
  font-size: 2em;
}
.wrap H2 {
  font-size: 1.9em;
}
.wrap H3 {
  font-size: 1.75em;
  font-weight: normal;
}
.wrap H4 {
  font-size: 1.5em;
}
.wrap .lead {
  font-size: 1.25em !important;
  font-family: 'Raleway', sans-serif;
}
.wrap .titre {
  font-size: 1em;
  font-family: 'Raleway', sans-serif;
  margin-top: 0.5em;
}
.wrap .site-compagnon .titre {
  margin-bottom: 1em;
}
/*BOUTON*/
.bouton {
  padding: 16px 24px;
  font-family: "Segoe UI", sans-serif;
  text-decoration: none;
  background-color: #CE3636;
  color: #FFFFFF !important;
  font-size: 14px;
  position: relative;
  display: inline-block;
  font-weight: 600;
  /*+border-radius: 4px;*/
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  transition: all ease-out 0.3s;
}
.bouton.bleu {
  background-color: #1C3077;
}
.bouton.vert {
  background-color: #2B818E;
}
.bouton.bleu:hover {
  background-color: #2B818E;
}
.bouton.vert:hover {
  background-color: #1C3077;
}
/*------------*/
.bouton.blanc {
  border: 0px solid black;
  padding-left: 120px;
  font-size: 20px;
  line-height: 1.5;
  color: #2B818E !important;
  background-color: #FFFFFF;
  /*+border-radius: 40em;*/
  -moz-border-radius: 40em;
  -webkit-border-radius: 40em;
  -khtml-border-radius: 40em;
  border-radius: 40em;
  font-weight: bold;
  font-family: 'Raleway', sans-serif;
}
.bouton.blanc:hover {
  color: #1C3077 !important;
}
.bouton.blanc::before {
  position: absolute;
  width: 88px;
  height: 88px;
  top: -12px;
  content: "";
  left: 24px;
  border: 0px solid black;
  /*+border-radius: 40em;*/
  -moz-border-radius: 40em;
  -webkit-border-radius: 40em;
  -khtml-border-radius: 40em;
  border-radius: 40em;
  transition: all ease-out 0.3s;
}
.bouton.blanc.tuto::before {
  background: url('../img/lecteur-video.svg') center no-repeat #2B818E;
}
.bouton.blanc.qa::before {
  background: url('../img/lecteur-qa.svg') center no-repeat #2B818E;
}
.bouton.blanc.tuto:hover::before {
  background: url('../img/lecteur-video.svg') center no-repeat #1C3077;
}
.bouton.blanc.qa:hover::before {
  background: url('../img/lecteur-qa.svg') center no-repeat #1C3077;
}
/*------------*/
.bg-quaternaire .bouton.blanc {
  color: #6267A1 !important;
  background-color: #FFFFFF;
}
.bg-quaternaire .bouton.blanc:hover {
  color: #2B818E !important;
}
.bg-quaternaire .bouton.blanc.tuto::before {
  background: url('../img/lecteur-video.svg') center no-repeat #6267A1;
}
.bg-quaternaire .bouton.blanc.qa::before {
  background: url('../img/lecteur-qa.svg') center no-repeat #6267A1;
}
.bg-quaternaire .bouton.blanc.tuto:hover::before {
  background: url('../img/lecteur-video.svg') center no-repeat #2B818E;
}
.bg-quaternaire .bouton.blanc.qa:hover::before {
  background: url('../img/lecteur-qa.svg') center no-repeat #2B818E;
}
/*ICONED*/
.iconed {
  position: relative;
  padding-left: 0;
  margin-left: 68px;
}
.iconed::before {
  position: absolute;
  width: 64px;
  height: 64px;
  top: -10px;
  content: "";
  left: -64px;
}
.iconed.manuel-ens::before {
  background: url('../img/ico-manuel-prof.svg') center / contain no-repeat transparent;
}
.iconed.manuel-ele::before {
  background: url('../img/ico-manuel-ele.svg') center / contain no-repeat transparent;
}
.iconed.maths::before {
  background: url('../img/ico-maths.svg') center no-repeat transparent;
  width: 48px;
  height: 48px;
  top: -2px;
  left: -60px;
}
.iconed.francais::before {
  background: url('../img/ico-francais.svg') center no-repeat transparent;
  width: 48px;
  height: 48px;
  top: -2px;
  left: -60px;
}
.iconed.pedagogie::before {
  background: url('../img/ico-pedago.svg') center / contain no-repeat transparent;
  width: 48px;
  height: 48px;
  top: -2px;
  left: -60px;
}
/*--------*/
.double-iconed {
  position: relative;
}
.double-iconed::before {
  position: relative;
  width: 40px;
  height: 40px;
  top: 10px;
  content: " ";
  right: 5px;
  display: inline-block;
}
.double-iconed::after {
  position: relative;
  width: 40px;
  height: 40px;
  top: 10px;
  content: " ";
  left: 5px;
  display: inline-block;
}
.double-iconed.eclat::before {
  background: url('../img/Union-1.png') center no-repeat transparent;
}
.double-iconed.eclat::after {
  background: url('../img/Union-2.png') center no-repeat transparent;
}
.double-iconed.roue::before {
  background: url('../img/ico-config-1.png') center no-repeat transparent;
}
.double-iconed.roue::after {
  background: url('../img/ico-config-2.png') center no-repeat transparent;
}
/*--------*/
.bt-iconed {
  padding-left: 48px;
}
.bt-iconed::before {
  position: absolute;
  width: 20px;
  height: 20px;
  top: 16px;
  content: "";
  left: 18px;
  background-color: #EF3EC9;
}
.bt-iconed.manuel::before {
  background: url('../img/Icon-btn-1.png') center no-repeat transparent;
}
.bt-iconed.config::before {
  background: url('../img/Icon-btn-2.png') center / contain no-repeat transparent;
  width: 25px;
  height: 27px;
  top: 12px;
}
/*--------*/
.spaced {
  margin-top: 4em;
  margin-bottom: 4em;
}
.spaced-sm {
  margin-top: 2em;
  margin-bottom: 2em;
}
.spaced-top {
  margin-top: 4em;
  margin-bottom: 0em;
}
.spaced-bot {
  margin-top: 0em;
  margin-bottom: 4em;
}
.spaced-top-sm {
  margin-top: 2em;
  margin-bottom: 4em;
}
.spaced-xs {
  margin-top: 1em;
  margin-bottom: 1em;
}
.manuel-numerique, .modalite, .outro {
  padding: 2em 1em;
  /*+border-radius: 0.25em;*/
  -moz-border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
  -khtml-border-radius: 0.25em;
  border-radius: 0.25em;
}
/*--------*/
.wrap UL {
  list-style: none;
}
.wrap UL LI {
  margin-bottom: 0.5em;
}
.wrap UL LI LI:first-of-type {
  margin-top: 0.5em;
}
/*.wrap UL LI::before {
  content: "●";
  display: inline-block;
  width: 1.5em;
  margin-left: -1.5em;
  text-align: center;
  font-size: 16px;
}
.wrap UL LI LI::before {
  content: "✓";
  display: inline-block;
  width: 1.5em;
  margin-left: -1.5em;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}*/
.wrap UL LI::before {
  content: "●" !important;
  display: inline-block !important;
  width: 1.5em !important;
  margin-left: -1.5em !important;
  text-align: center !important;
  font-size: 16px !important;
  background-color: transparent !important;
  top: 0 !important;
  left: 0 !important;
}
.wrap UL LI LI::before {
  content: "✓" !important;
  display: inline-block;
  width: 1.5em;
  margin-left: -1.5em;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}
.wrap .enseignant UL LI::before {
  color: #4564CD;
}
.wrap .eleve UL LI::before {
  color: #2B818E;
}
/*SECTION*/
SECTION.titre-numerique {
  position: relative;
  height: 100%;
}
SECTION.titre-numerique::after {
  content: "";
  position: absolute;
  right: 50%;
  bottom: -2rem;
  width: 100vw;
  height: 60%;
  background-color: #F4F7F7;
  transform: translateX(50%);
  z-index: -1;
}
SECTION.intro-compagnon {
  position: relative;
  height: 100%;
}
SECTION.intro-compagnon::after {
  content: "";
  position: absolute;
  right: 50%;
  bottom: -2rem;
  width: 100vw;
  height: 60%;
  background-color: #FFF3EA;
  transform: translateX(50%);
  z-index: -1;
}
/*-------*/
SECTION.procure {
}
SECTION.procure DIV.bloc {
  text-align: center;
}
SECTION.procure DIV.bloc DIV.bloc-text {
  background: url('../img/main.png') center bottom / auto repeat-x #FFF3EA;
  padding: 6em 1em 1em;
  /*+border-radius: 0.25em;*/
  -moz-border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
  -khtml-border-radius: 0.25em;
  border-radius: 0.25em;
  text-align: left;
}
SECTION.procure DIV.bloc IMG.icon {
  /*+border-radius: 40em;*/
  -moz-border-radius: 40em;
  -webkit-border-radius: 40em;
  -khtml-border-radius: 40em;
  border-radius: 40em;
  border: 4px solid #FFF3EA;
  margin-bottom: -90px;
}
SECTION.procure DIV.bloc-adoptant {
  padding: 1em;
  /*+border-radius: 0.25em;*/
  -moz-border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
  -khtml-border-radius: 0.25em;
  border-radius: 0.25em;
  text-align: left;
}
/*------------*/
SECTION.titre-numerique IMG, SECTION.cle-numerique IMG {
  /*+border-radius: 1em;*/
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
  -khtml-border-radius: 1em;
  border-radius: 1em;
  transition: all ease-out 0.3s;
  box-shadow: 0px 0px 0px rgba(74, 74, 74, 0);
}
SECTION.cle-numerique IMG:hover, SECTION.titre-numerique IMG:hover {
  box-shadow: 0px 4px 16px rgba(50, 89, 95, 0.2);
  transition: all ease-out 0.3s;
}
SECTION.intro-compagnon IMG {
  /*+border-radius: 0.25em;*/
  -moz-border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
  -khtml-border-radius: 0.25em;
  border-radius: 0.25em;
}
SECTION.titre-numerique .lead, SECTION.cle-numerique .lead, SECTION.dispositif-numerique .lead, SECTION.site-compagnon .lead {
}
SECTION.titre-numerique P, SECTION.cle-numerique P, SECTION.dispositif-numerique P {
  font-size: 0.85em !important;
}
SECTION.site-compagnon {
  background: rgb(255, 255, 255);
  background: -moz-linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 243, 234, 1) 100%);
  background: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 243, 234, 1) 100%);
  background: linear-gradient(0deg, rgba(255, 255, 255, 1) 0%, rgba(255, 243, 234, 1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#fff3ea",GradientType=1);
  padding: 2em 1em 1em;
  /*+border-radius: 0.25em;*/
  -moz-border-radius: 0.25em;
  -webkit-border-radius: 0.25em;
  -khtml-border-radius: 0.25em;
  border-radius: 0.25em;
}
SECTION.site-compagnon IMG {
  border: 1px solid #ECECEC;
  /*+border-radius: 4px;*/
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  -khtml-border-radius: 4px;
  border-radius: 4px;
  transition: all ease-out 0.3s;
  box-shadow: 0px 0px 0px rgba(74, 74, 74, 0);
}
SECTION.site-compagnon IMG:hover {
  box-shadow: 0px 4px 16px rgba(95, 78, 50, 0.200);
  transition: all ease-out 0.3s;
}
/*---------*/
SECTION.outro H2 {
  margin: 0;
  padding: 0;
  line-height: normal;
}
/*------------*/
@media only screen and (max-width: 1024px) {
  .wrap IMG.responsive {
  }
  .wrap .titre {
  }
  SECTION.outro H2 {
    margin: 0 0 1em 0;
    padding: 0;
    font-size: 1.5em;
  }
  .bouton.blanc {
    padding-left: 100px;
    font-size: 14px;
    line-height: 24px;
  }
  .bouton.blanc::before {
    left: 0px;
  }
}
@media only screen and (max-width: 768px) {
  .wrap {
  }
  .wrap .lead {
    font-size: 1.2em;
    font-family: 'Raleway', sans-serif;
  }
  .bouton.blanc {
    padding-left: 64px;
  }
  .bouton.blanc::before {
    position: absolute;
    width: 48px;
    height: 48px;
    top: 4px;
    content: "";
    left: 8px;
    border: 0px solid black;
    /*+border-radius: 40em;*/
    -moz-border-radius: 40em;
    -webkit-border-radius: 40em;
    -khtml-border-radius: 40em;
    border-radius: 40em;
    transition: all ease-out 0.3s;
  }
}
@media only screen and (max-width: 576px) {
  .bouton.blanc {
    padding-left: 24px;
  }
  .bouton.blanc::before {
    display: none;
  }
  SECTION.intro-compagnon::after, SECTION.titre-numerique::after {
    display: none;
  }
  .wrap H1 {
    font-size: 1.8em;
  }
  .wrap H2 {
    font-size: 1.6em;
  }
  .wrap H3 {
    font-size: 1.5em;
  }
  .wrap H4 {
    font-size: 1.2em;
  }
}
