@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,400italic);
.Header-tutoriel {
  background-color: #00A3E0;
  color: white;
  position: relative; }
  .Header-tutoriel .bold {
    font-weight: 600; }
  .Header-tutoriel img {
    position: absolute; }
  .Header-tutoriel .title-header {
    top: 50%;
    transform: translateY(-50%);
    position: relative; }
  @media screen and (max-width: 671px) {
    .Header-tutoriel {
      height: 498px;
      text-align: center;
      font: normal normal normal 27px/37px Open Sans; }
      .Header-tutoriel .clearfix {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-direction: column-reverse;
            flex-direction: column-reverse; }
      .Header-tutoriel img {
        top: 14px;
        left: 50%;
        transform: translateX(-50%);
        width: 336px; }
      .Header-tutoriel .text-wrapper {
        height: 218px; }
      .Header-tutoriel .img-wrapper {
        height: 279px; } }
  @media screen and (min-width: 672px) {
    .Header-tutoriel {
      height: 498px;
      text-align: left;
      font: normal normal normal 40px/55px Open Sans; }
      .Header-tutoriel .title-header {
        margin-left: 10%; }
      .Header-tutoriel .text-wrapper {
        height: 498px; }
      .Header-tutoriel img {
        top: 100px;
        left: 10%;
        width: 336px; } }
  @media screen and (min-width: 1056px) {
    .Header-tutoriel {
      text-align: left;
      font: normal normal normal 40px/55px Open Sans; }
      .Header-tutoriel,.Header-tutoriel .text-wrapper {
      height: 498px; }
      .Header-tutoriel img {
        top: 100px;
        left: 10%;
        width: 336px; } }
  @media screen and (min-width: 1302px) {
    .Header-tutoriel {
      text-align: left;
      font: normal normal normal 51px/70px Open Sans; }
      .Header-tutoriel,.Header-tutoriel .text-wrapper {
      height: 502px; }
      .Header-tutoriel img {
        top: 52px;
        width: 434px; } }

.banner-lolme {
  min-height: 400px;
  background-image: url(/images/lolme/PHONE_background.png); }

@media screen and (max-width: 671px) {
  .invert-order-phone-tab {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column-reverse;
        flex-direction: column-reverse; } }

.img-lolme {
  width: 570px !important;
  transform: translateX(-50%);
  left: 50%;
  position: absolute;
  top: 0px; }

@media screen and (min-width: 672px) {
  .invert-order-phone-tab {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: row-reverse;
        flex-direction: row-reverse; }
  .banner-lolme {
    display: block;
    background-image: url(/images/lolme/TAB_background.png); }
  .lolme-text {
    transform: translateY(30%);
    text-align: left; }
  .lolme-imgwrapper {
    transform: translateY(25%); }
  .img-lolme {
    top: auto;
    left: auto;
    position: relative;
    width: auto !important;
    transform: translateX(0%); } }

@media screen and (min-width: 1056px) {
  .invert-order-phone-tab {
    display: block; }
  .banner-lolme {
    background-image: url(/images/lolme/DESK_background.png); }
  .img-lolme {
    width: 650px !important;
    left: 0%;
    position: absolute; }
  .lolme-text {
    text-align: left; }
  .lolme-text,.lolme-imgwrapper {
    transform: translateY(0%); } }

@media screen and (min-width: 1302px) {
  .banner-lolme {
    background-image: url(/images/lolme/LG-DESK_background.png); }
  .img-lolme {
    width: auto !important;
    left: auto;
    position: absolute; } }

.banner-assistance {
  background-color: white; }
  .banner-assistance,.banner-assistance .title-wrapper {
  position: relative; }
    .banner-assistance .title-wrapper .title-assist {
      position: relative;
      color: #004994; }
  .banner-assistance .text-wrapper .title-text,.banner-assistance .text-wrapper .text-1 {
    color: #707070;
    position: relative;
    left: 50%;
    transform: translateX(-50%); }
    .banner-assistance .text-wrapper .text-1 .bold {
      font-weight: 600; }
  @media screen and (max-width: 671px) {
    .banner-assistance {
      height: 674px; }
      .banner-assistance .title-wrapper {
        height: 175px; }
        .banner-assistance .title-wrapper .title-assist {
          top: 50%;
          transform: translateY(-50%);
          text-align: center;
          font: normal normal 600 34px/46px Open Sans; }
      .banner-assistance .text-wrapper {
        height: 158px; }
        .banner-assistance .text-wrapper .title-text {
          font: normal normal bold 18px/24px Open Sans;
          max-width: 375px;
          text-align: center; }
          .banner-assistance .text-wrapper .title-text img {
            width: 36px;
            height: 36px;
            position: absolute;
            top: -47px;
            left: 50%;
            transform: translateX(-50%); }
        .banner-assistance .text-wrapper .text-1 {
          margin-top: 21px;
          font: normal normal normal 16px/22px Open Sans;
          text-align: center;
          max-width: 375px; } }
  @media screen and (min-width: 672px) {
    .banner-assistance {
      height: 359px; }
      .banner-assistance .title-wrapper {
        height: 134px; }
        .banner-assistance .title-wrapper .title-assist {
          margin-left: 3%;
          top: 50%;
          transform: translateY(-50%);
          text-align: left;
          font: normal normal 600 40px/55px Open Sans; }
      .banner-assistance .text-wrapper {
        height: 226px; }
        .banner-assistance .text-wrapper .title-text {
          font: normal normal bold 18px/24px Open Sans;
          max-width: 300px; }
          .banner-assistance .text-wrapper .title-text img {
            margin-right: 10px;
            width: 54px;
            height: 54px;
            position: relative;
            top: 20px; }
        .banner-assistance .text-wrapper .text-1 {
          margin-top: 21px;
          font: normal normal normal 16px/22px Open Sans;
          text-align: left;
          max-width: 300px; } }
  @media screen and (min-width: 1056px) {
    .banner-assistance {
      height: 419px; }
      .banner-assistance .title-wrapper {
        height: 164px; }
        .banner-assistance .title-wrapper .title-assist {
          margin-left: 7%;
          top: 50%;
          transform: translateY(-50%);
          text-align: left;
          font: normal normal 600 40px/55px Open Sans; }
      .banner-assistance .text-wrapper {
        height: 248px; }
        .banner-assistance .text-wrapper .title-text {
          font: normal normal bold 20px/27px Open Sans;
          max-width: 351px; }
          .banner-assistance .text-wrapper .title-text img {
            width: 54px;
            height: 54px;
            position: relative;
            top: 20px; }
        .banner-assistance .text-wrapper .text-1 {
          margin-top: 21px;
          font: normal normal normal 20px/27px Open Sans;
          text-align: left;
          max-width: 351px; } }
    @media screen and (min-width: 1056px) and (min-width: 1302px) {
      .banner-assistance .text-wrapper {
        top: -25px;
        color: black; } }
  @media screen and (min-width: 1302px) {
    .banner-assistance {
      height: 431px; }
      .banner-assistance .title-wrapper {
        height: 183px; }
        .banner-assistance .title-wrapper .title-assist {
          margin-left: 7%;
          top: 50%;
          transform: translateY(-50%);
          text-align: left;
          font: normal normal 600 40px/55px Open Sans; }
      .banner-assistance .text-wrapper {
        height: 248px; }
        .banner-assistance .text-wrapper .title-text {
          font: normal normal bold 20px/27px Open Sans;
          max-width: 365px; }
          .banner-assistance .text-wrapper .title-text img {
            width: 54px;
            height: 54px;
            position: relative;
            top: 20px; }
        .banner-assistance .text-wrapper .text-1 {
          margin-top: 21px;
          font: normal normal normal 20px/27px Open Sans;
          text-align: left;
          max-width: 365px; } }

.video-iframe {
  position: relative;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 281px;
  height: 149px; }
  @media screen and (min-width: 672px) {
    .video-iframe {
      width: 212px;
      height: 149px; } }
  @media screen and (min-width: 1056px) {
    .video-iframe {
      width: 281px;
      height: 180px; } }
  @media screen and (min-width: 1302px) {
    .video-iframe {
      height: 205px; } }

.answer {
  background-color: #FFFFFF; }
  @media screen and (max-width: 671px) {
    .answer {
      padding-top: 0px; } }
  @media screen and (min-width: 672px) {
    .answer {
      height: 223px; } }
  @media screen and (min-width: 1056px) {
    .answer {
      height: 265px; } }
  @media screen and (min-width: 1302px) {
    .answer {
      height: 290px; } }

@media screen and (max-width: 671px) { }

@media screen and (max-width: 671px) {
  .answer-wifi,.answer-tv {
    height: 420px; } }

.video-wrapper {
  height: 159px; }
  .video-wrapper .video-title {
    text-align: center;
    margin-top: 24px;
    color: #707070; }
    @media screen and (max-width: 671px) {
      .video-wrapper .video-title {
        margin-top: 20px; } }
  @media screen and (min-width: 672px) {
    .video-wrapper {
      top: -45px;
      height: 159px; } }
  @media screen and (min-width: 1056px) {
    .video-wrapper {
      top: -45px;
      height: 200px; } }
  @media screen and (min-width: 1302px) {
    .video-wrapper {
      top: -30px;
      left: 10px;
      height: 225px; } }

.question_q {
  border-bottom: 0px solid #dadada !important;
  color: #004994;
  font: normal normal 600 34px/46px Open Sans; }
  @media screen and (min-width: 672px) {
    .question_q {
      text-align: left;
      font: normal normal 600 28px/55px Open Sans; } }
  @media screen and (min-width: 1056px) {
    .question_q {
      font: normal normal 600 28px/55px Open Sans; } }
  @media screen and (min-width: 1302px) {
    .question_q {
      padding: 0px 0 !important;
      font: normal normal 600 28px/55px Open Sans; } }

.question {
  box-shadow: 0px 3px 31px #00000029;
  background-color: #FFFFFF; }

.icon-2-dropdown {
  right: -95%;
  width: 32px;
  height: 18px;
  position: relative;
  top: -25px; }
  .icon-2-dropdown .section-img-align-bottom {
    position: relative !important; }
  .icon-2-dropdown img {
    display: block;
    width: 25px; }
  @media screen and (max-width: 671px) {
    .icon-2-dropdown {
      right: -50%;
      width: 32px;
      height: 18px;
      position: relative;
      top: 0px;
      transform: translateX(-50%); }
      .icon-2-dropdown img {
        display: block; } }

@media screen and (max-width: 671px) {
  .icon-2-dropdown img,.icon-1-dropdown {
        left: 50%;
        transform: translateX(-50%); }
  .icon-1-dropdown {
    width: 33px;
    position: relative; } }

@media screen and (min-width: 672px) {
  .icon-1-dropdown {
    left: 5%;
    width: 33px;
    position: relative;
    top: 52px; } }

@media screen and (min-width: 1056px) {
  .icon-1-dropdown {
    left: 5%;
    width: 33px;
    position: relative;
    top: 40px; } }

@media screen and (min-width: 1302px) {
  .icon-1-dropdown {
    left: 6%;
    width: 33px;
    position: relative;
    top: 50px; } }

.icon-1-dropdown img {
  left: 50%;
  transform: translateX(-50%); }

@media screen and (min-width: 672px) {
  .text-dropdown .text-1 {
    left: 10%;
    position: relative; } }

@media screen and (min-width: 1056px) {
  .text-dropdown .text-1 {
    left: 8%;
    position: relative; } }

@media screen and (min-width: 1302px) {
  .text-dropdown .text-1 {
    left: 9%;
    position: relative;
    top: 8px; } }

@media screen and (max-width: 671px) {
  .text-dropdown .text-1 {
    position: relative;
    text-align: center; } }

.icon-phone {
  left: 50%;
  transform: translateX(-50%);
  cursor: pointer; }

/*# sourceMappingURL=../maps/tutoriel/tutoriel.css.map */