#blog *{
    font-family: Montserrat!important;
}
html, body{
    overflow-x: hidden!important;
}
/* debut style navbar */
.bg-header{
    background-color: #1A2D4A;
    border-radius: 0!important;
    /* padding: 17px; */
}
.navbar-brand{
    float: none!important;
}
.navbar-brand > img{
    max-height: 33px;
}
/* fin style header */
/* debut style lien categorie en bas du header */
.categorie{
    text-align: center;
    margin-top: 25px;
    margin-bottom: 50px;
}
.categorie a{
    margin: 10px;
    color: #000000;
    font-weight: 600;
}
.categorie a:hover{
    text-decoration: none;
    color: darkgrey;
}
/* debut style lien categorie en bas du header */
/* style de tous les textes majuscules */
.uppercased{
    text-transform: uppercase;
}
.img-blog{
    position: relative;
}
/* style du css texte renversé à côté image */
span.translated{
    max-height: 360px;
    max-width: 360px;
    width: 360px;
    background-color: #1A2D4A;
    color: white;
    padding: 23px;
    display: block;
    text-align: center;
    transform: rotate(270deg);
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    position: absolute;
    font-size: 35px;
    /* position: relative; */
    top: 132px;
    left: -246px;
}
/* style du grand image du milieu */
.img-blog img{
    width: 100%;
    max-width: 720px;
    max-height: 360px;
    border-radius: 18px;
    display: block;
    margin: 0 auto;
}
.box-red{
    color: #fff;
    background-color: #ed4344;
    padding: 15px 20px;
    font-weight: 600;
    text-align: center;
    display: block;
    margin-bottom: 25px;
}
.no-pad{
    padding: 0!important;
}
/* debut css colonne du droite */
.img-min{
    height: 100px;
    max-height: 100px;
    width: 150px;
    max-width: 150px;
    margin-right: 20px;
}
.flex{
    display: flex;
    margin-bottom: 20px;
}
.legende h2{
    font-size: 13pt;
    font-weight: 600;
    margin: 0!important;
}   
.legende p{
    margin-top: 10px;
    font-size: 9pt;
    overflow: hidden;
    max-width: 195px;
    max-height: 100px;
}
.flex{
    margin-bottom: 35px;
}
.tags-container{
    display: flex;
    flex-wrap: wrap;
}
.tags-elm {
    background-color: #192c4a;
    padding: 5px 15px;
    margin-right: 10px;
    margin-bottom: 10px;
    font-size: 13px;
    font-weight: 400;
}
.tags-elm a{
    color: #fff!important;
}
.tags-elm a:hover{
    color: #fff!important;
    opacity: 1!important;
    text-decoration: underline!important;
}
.blog-content p{
    text-align: justify;
    font-size:12pt;
    color: #000000;
}
.blog-content h1{
    font-weight: bold;
    font-size: 31pt;
    color: #192D4A;
}
.blog-content span{
    color: #D90148;
    margin-bottom: 20px;
    display: block;
    font-size: 12pt;
}
.blog-content h2{
    font-weight: bold;
    font-size: 16pt;
    color: #192D4A;
    margin: 11px 0;
}
.blog-content img{
    /*height: 270px;
    width: 100%;
    max-width: 360px;
    max-height: 270px;*/
    max-width: 1140px;
    height: auto;
}
.clearfix{
    clear: both!important;
}
.left-bloc a{
    color: #000000;
}
.left-bloc a:hover{
    color: #000000;
    text-decoration: none;
}
/* fin css colonne du droite */
.btn-contenu{
    color: #fff;
    background-color: #ed4344;
    padding: 5px 20px;
    font-weight: 600;
    text-align: center;
    display: block;
    font-size:19pt;
    margin: 30px auto;
    width: 60%;
}
/* debut style slider */
img.owl-lazy{
    max-height: 150px;
    height: 150px;
}
.item p{
    max-height: 90px;
    overflow: hidden;
}
.item h2.title{
    /* max-height: 26px; */
    overflow: hidden;
    line-height: 1.2;
}
.item{
    height: auto;
    width: 100%;
    max-width: 200px;
}
.owl-nav button {
    position: absolute;
    top: 25%;
    background-color: #000;
    color: #fff;
    margin: 0;
    transition: all 0.3s ease-in-out;
  }
  .owl-nav button.owl-prev {
    left: 0;
  }
  .owl-nav button.owl-next {
    right: 0;
  }
  .owl-dots button.owl-dot.active {
    background-color: #000;
  }
  .owl-dots button.owl-dot:focus {
    outline: none;
  }
  .owl-nav button {
      position: absolute;
      top: 25% !important;
      transform: translateY(-50%);
      background: rgba(255, 255, 255, 0.38) !important;
  }
  .owl-slider span {
      font-size: 70px;    
      position: relative;
      top: -5px;
  } 
  .owl-slider h2{
      font-size: 15px !important;
      color: #192D4A;
      font-weight: 600;
  }
  .owl-slider p{
      font-size: 10pt!important;
      text-align: justify;
      color: #000000;
      font-weight: 400;
  }
  .owl-nav button:focus {
      outline: none;
  }
  .owl-slider{
    max-width: 70%;
    display: block;
    margin: 0 auto;
  }
  .owl-stage-outer.owl-height{
      margin-left: 26px;
  }
  /* fin style slider */
  .title-block{
      display: block;
  }
  .paragraph-floater{
    background: white;
    padding: 5px;
    position: relative;
    /*right: 25px;*/
  }
  .f-width{
    display: flex;
    flex-direction: row;
    width: 155%;
    align-items: center;
  }

  .f-width img{
    min-width: auto;
    min-height: auto;
  }
  /* style qui rend la derniere paragraph full width  */
  .w-500{
    width: 150%;
  }
  /* media queries pour mobile */
  @media screen and (max-width: 991px) {
    .w-500{
        width: 100%;
      }
    .f-width{
        width: 100%;
        flex-wrap: wrap;
    }
    .f-width img{
        margin-bottom: 15px;
        display: block;
        margin: 15px auto;
    }
    h2.title-bloc{
        text-align: center;
        margin-bottom: 15px;
    }
    .paragraph-floater{
        right: 0;
    }
  }
  @media only screen and (min-width: 1200px) and (max-width: 1325px){
    span.translated{
    left: -200px;
    }
}
@media only screen and (min-width: 992px) and (max-width: 1124px){
    span.translated{
    left: -190px;
    }
    img{
        max-width: 92vw !important;
    }
}

@media only screen and (min-width: 768px) and (max-width: 959px){
    img{
        max-width: 94vw !important;
    }
}

@media screen and (max-width:740px){
    .menu-wrapper .left-side {
        width: auto;
        min-width: 20%;
        padding-left: 0px;
    }
    .text-select-langue{
        font-size: 14px;
    }

    #content-humberger i{
        margin-top: 11px!important;
    }

    .img-responsive.center{
        position: relative;
        top: -46px;
        margin: auto;
    }

    div img.center{
        max-height: 87px;
        margin-bottom: 20px;
    }

    .row.blogpage{
      margin-top: 1.5rem!important;
    }

    .container{
        margin-left: 0px!important;
        margin-right: 0px!important;
        padding: 0 1rem!important;
        margin-top: 5.5rem;
    }

    h3.text-center{
        font-size: 17px;
        margin-top: 0px!important;
    }

    .contenu{
        padding: 0px;
    }

    .acc-dion,.acc-dion-1,.acc-dion-2,.acc-dion-3,.acc-dion-4,.acc-dion-5{
        margin: 0 11px 3rem 7px;
        background-color: #fff;
    }

    .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9 {
        width: 100%!important;
        padding-bottom: 1rem;
    }

    h3.titre-acc {
        font-size: 14px;
    }

    .group .question .uppercase {
        font-size: 14px !important;
        margin-top: 1rem;
    }

    .col-md-4.col-xs-4.no-pad h2 {
        font-size: 12px !important;
        margin-top: 1rem!important;
    }

    .col-md-4.col-xs-4.col-lg-4.no-pad.mobil-pad{
        width: 33.33333333%!important;
    }

    .question.espace{
        margin-bottom: 5px;
    }

    .reponse.mb{
        margin-bottom: 1px;
    }
    .group .col-md-5.col-xs-5, 
    .group .col-md-7.col-xs-7,
    .group .col-md-12.col-xs-12{
        padding: 0px;
    }

    .contenu .col-md-8.col-xs-8 .no-pad, 
    .contenu .col-md-3.col-xs-3 .no-pad
    {
        margin-top: 1rem;
    }

    .contenu .group{
        padding:  1rem;
        display: table;
    }

    .contenu .col-md-4.col-xs-4 .no-pad.select{
        margin-bottom: 1rem;
    }

    .contenu .question.espace{
        padding: 1rem;
    }
    .accordion .contenu textarea{
        margin: 1rem;
        width: 94%;
    }
    .row.footer-foot{
        display: flex;
    }

    .g-condition.col-md-8.col-xs-12 span{
        margin-top: 0px!important;
        margin-bottom: 0px!important;
    }

    .row.champ{
        display: table;
    }

    .row.champ .col-md-4.col-xs-6.no-pad,
    .row.champ .col-md-3.col-xs-6.no-pad,
    .row.champ .col-md-2.col-xs-6.no-pad
    {
        margin-top: 1rem;
        display: block!important;
    }
    .w-nom, .w-courriel{
        width: 95%!important;
    }

    .no-pad img {
        height: 137px;
    }

    .menu-wrapper .right-side .left-navigation-btns a {
        height: 44px;
    }

    .categorie {
      text-align: center;
      margin-top: 0px;
      margin-bottom: 12px;
    }

    .categorie a{
      font-size: 1.2rem;
    }

    .blog-content h1, .blog-content h2 {
      font-weight: bold;
      font-size: 1.5rem!important;
      color: #192D4A;
      margin-top: 4px!important;
      line-height: 28px!important;
    }

    .blog-content span {
      font-size: 1.5rem;
    }

    .f-width {
      overflow: hidden;
    }

    .f-width img{
      /*height: 20rem*/
    }

    .legende h2{
      font-size: 1.5rem;
    }
    .legende p {
      margin-top: 10px;
      font-size: 1.2rem;
      overflow: hidden;
      max-width: inherit;
      max-height: inherit;
    }

    .blog-content h3{
      font-size: 2rem;
    }

    span.btn-contenu{
      width: 100%;
    }

    .owl-slider{
      max-width: 100%;
    }

    .owl-slider .owl-item .item{
      max-width: 87%;
    }
    /****/
    img{
        width: 100%;
    }

    .gal-items{
      padding: 0;
      margin: 1rem 2rem;
    }

    .gal-item{
      width: 100%!important;
    }

    .p-fixer{
      padding: 0 20px!important;
    }
}

/**CSS form IPHONE**/
@media
  only screen and (-webkit-min-device-pixel-ratio: 4),
  only screen and (   min--moz-device-pixel-ratio: 4),
  only screen and (     -o-min-device-pixel-ratio: 4/1),
  only screen and (        min-device-pixel-ratio: 4),
  only screen and (                min-resolution: 550dpi),
  only screen and (                min-resolution: 4dppx) { 
    
    .container{
      margin-top: 5.5rem;
    }
    .menu-wrapper .left-side{
      min-width: 35%;
    }
    
    .menu-wrapper .right-side .left-navigation-btns {
      display: flex;
      justify-content: flex-start;
      width: 100% !important;
      padding-top: 20px;
    }

    .hero_in {
      display: contents;
      min-height: 20rem;
    }

    .text-select-langue{
      width: 3.5rem!important;
    }

    .container-items-option .slick-next {
      z-index: 500000;
      margin-right: -58px !important;
      width: 158px!important;
    }
    .container-items-option .slick-next::before {
      margin-right: -51px;
    }
    .container-spec-slick button.slick-next.slick-arrow:hover{
      left: 2rem;
      height: 61px!important;
    }
    .left-navigation-btns {
      left: -100%;
    }
    .disable-login {
      top: -1000%;
      position: absolute;
    }

    .menu-wrapper .right-side {
      display: flex;
      justify-content: flex-end;
      padding: 20px;
    }
    #content-humberger i {
      font-size: 50px;
      color: #fff;
    }

    .menu-wrapper .right-side {
      padding-top: 21px;
      padding-left: 7px;
    }

    .left-navigation-btns {
      position: absolute;
      top: 84px;
      left: -100%;
      left: 0%;
      height: 125px;
      flex-direction: column;
      width: 100%;
      background: #192d4a;
      z-index: 5000;
      transition: left 0.5s ease;
    }
    
    #content-info-room-categorie select{
      display: none;
    }


    .content-element-validation .part-left {
      margin-top: 85px !important;
      padding: 1px!important;
    }

    #main button, #main a{
      font-size: 1rem!important;
    }

    #previousBtn span{
      font-size: 1.1rem;
    }

    #main button#nextBtn{
      padding-right: 2px!important;
    }

    #nextBtn span{
      font-size: 1.1rem;
      margin-top: 0.5rem;
    }
    #nextBtn img{
      width: 0.6rem;
      height: 1.3rem;
      margin-top: 0.8rem;
    }

    .container-step-progress-bar {
      padding: 0px;
      width: 100%;
    }

    .content-step{
      width: 75px;
    }

    .content-bullet-step {
      height: 45px!important;
      width: 45px!important;
    }

    .bullet::after{
      left: 38px!important;
      width: 22px!important;
    }

    .container-stepper .row.content-element-validation .col-xs-8.part-left {
      padding-right: 0px !important;
    }    

    .container-spec-slick{
      display: none!important;
    }

    .slick-slider{
      width: 100%!important;
    }

    .container-items-option.container-spec-slick.active-drop.slick-initialized.slick-slider.slick-dotted{
      margin: 0rem!important;
      padding-left: 1.2rem!important;
      padding-right: 1.1rem!important;
    }

    .slick-slide{
      opacity: 1 !important;
    }

    #step2
      > div
      > div
      > div.container-items-option
      > div.slick-list
      > div.slick-track
      > div.slick-slide {
      margin-right: 12px;
    }

    .slick-slide .content-items-option {
      height: 100%;
      display: flex !important;
      flex-direction: column;
      justify-content: flex-end;
    }

    .slick-track .slick-slide div .content-items-option {
      width: 100% !important;
    }
    .container-spec-slick .slick-list{
      margin-left: 10px!important;
    }

    .hdesktop-page{
        display: none!important;
    }
    .hmobil-page{
        display: block!important;
    }

    h2.cap {
        width: 89%;
        margin-left: 9%;
        padding-top: 23%;
    }

    .t-blue{
        width: 51%;
        left: 33%;
        font-size: 1rem;
    }
    .t-white{
        font-size: 1rem;
    }

    .text-sl{
        margin: 4.5rem 0.5rem 2rem;
        width: 80%;
        font-size: 0.8rem !important;
    }
    .part-right .contentelt{
      display: none;
    }

    .select-langue {
      margin-bottom: 45px !important;
      width: 15px;
      font-size: 21px !important;
    }

    #modal-vedette .modal-content {
      background: none;
      top: 50px;
      max-height: max-content;
      overflow-y: hidden;
    }

    #modal-vedette .col-md-4 {
      margin-bottom: 13px;
      padding-left: 0;
      padding-right: 0;
    }

    #modal-vedette img {
      width: 100%;
    }

    .header-langue {
      margin-right: 0px;
      display: flex;
      margin-left: 40px;
    }

    .select-langue {
      font-size: 20px !important;
    }

    a.m-vedette {
      line-height: 2.2rem;
      display: block;
      margin-left: 1.5rem;
    }

    a.p-vedette{
      display: none!important;
    }
}

_::-webkit-full-page-media, _:future, :root .safari_only {
    img.img-day{
      width: 4rem!important;
    }
}

@media screen and (min-color-index:0) and(-webkit-min-device-pixel-ratio:0) { 
    @media {
        .safari6 { 
            color:#0000FF; 
            background-color:#CCCCCC; 
        }
        img.img-day{
          width: 4rem!important;
        }
    }
}

@media not all and (min-resolution:.001dpcm) { 
    @media {
        .safari10 { 
            color:#0000FF; 
            background-color:#CCCCCC; 
        }
        img.img-day{
          width: 3rem!important;
        }
        .sl-decoration{
          z-index: 23333!important;
          width: 37%;
          left: 12%;
        }
        .img-tag{
          display: contents;
        }
        #img-tag{
          z-index: 0;
        }
        .bullet::after{
          top: 40%;
        }

        div#main{
        height: 58px!important;
        bottom: 2px!important;
      }

      }

}


@media screen and (max-width: 740px){
  .row.blogpage.p-fixer {
    padding: 0.5rem 0;
    text-align: center;
  }

  .col-md-8.right-bloc{
    padding: 0px;
  }

  .col-md-4.left-bloc {
    padding: 0px;
  }

  .blogpage .paragraph-foot {
    text-align: left;
  }
  .img-blog{
    margin-bottom: 2rem;
  }

  .blog-content h3 {
    margin: 1rem 0 !important;
  }

  .owl-carousel .owl-item img.owl-lazy {
    margin-bottom: 2rem;
  }

  .flex {
    flex-direction: column;
  }

  .img-min {
    height: auto;
    width: 100%;
    max-height: 100%;
    max-width: 100%;
  }

  .legende{
    padding: 1rem 0;
  }

  .legende h2 {
    font-size: 1.5rem!important;
  }

  .image-container {
    display: contents!important;
  }

  .item h2.title {
    line-height: 2rem!important;
    max-height: max-content;
    font-size: 15pt!important;
  }

  .gal .gal-item {
    width: 85.5%;
  }

  .f-width img {
    min-height: 13rem!important;
  }
  .f-width img.img-middle{
    min-height: auto!important;
  }

  .owl-stage-outer.owl-height {
    margin-left: 21px;
  }

  span.uppercased.btn-contenu {
    margin: 2px 0 12px;
    font-size: 15pt;
  }

  span.uppercased.box-red {
    font-size: 15pt;
  }

  .mg-b{
    display: none;
  }

  .flex {
    margin-bottom: 0px;
  }
}

@supports (-webkit-touch-callout: none) {
  /* CSS specific to iOS devices */
  html, body{
    overflow-x: hidden!important;
  }
  .menu-wrapper{
    height: 62px!important;
    font-size: 0rem;
  }
  .stew-logo >img{
    width: 20rem;
    height: 40px!important;
  }
  .menu-wrapper .left-side{
    min-width: 45%;
  }

  .menu-wrapper .header-langue{
    margin-left: 7rem;
    margin-right: 2rem;
  }

  .menu-wrapper .right-side{
    margin-right: 4rem;
  }

  #content-humberger i{
    margin-top: 18px!important;
    font-size: 8rem;
  }


  .menu-wrapper .right-side .left-navigation-btns{
    margin-top: -22px!important;
  }

  .menu-wrapper .right-side .left-navigation-btns.active{
    left: 0!important;
  }

  .hero_in{
    height: 25rem;
  } 
  .stew-slider-1,.stew-slider-2,.stew-slider-3{
    position: relative;
    max-height: 20rem!important;
  }

  h1.text-center{
    font-size: 30px;
  }

  .font{
    font-size: 2rem;
  }
  .accordion {
    margin: 2rem 8px!important;
  }

  .group .question .uppercase, .oaerror, .question.espace .uppercase{
    font-size: 2rem!important;
  }

  .reponse label{
    font-size: 2rem;
  }

  .group-trip .acc-dion.accordion .row.contenu .col-md-8.col-xs-8.group .col-md-4.col-xs-4.no-pad {
        width: 100%;
  }

  .contenu .groupe .col-md-5.col-xs-5, .contenu .groupe .col-md-7.col-xs-7{
    width: 100%;
  }

  .nbreVoyageur, .inc_trans{
    width: 100%;
    font-size: 3rem;
  }

  .button-next{
    font-size: 2rem;
  }

  .inp-txt{
    width: 100%;
    font-size: 3rem;
  }

  .periode{
    width: 100%;
    font-size: 3rem;
  }

  .budget{
    width: 100%;
    font-size: 3rem;
  }

  .n_societe{
    font-size: 3rem;
  }

  h3.titre-acc{
    font-size: 2rem;
  }

  .text-select-langue{
    width: 6.8rem!important;
    font-size: 16px!important;
  }

  .mobil-pad{
    margin-top: 6rem;
  }

  .no-pad img{
    height: 100px;
  }

  #img-tag{
    min-height: 20rem;
  }
  .sl-decoration{
    z-index: 23333!important;
    width: 30%!important;
    left: 8%!important;
  }
  div#main{
    height: 58px!important;
    bottom: 10px;
  }

  .bullet::after{
    width: 82%;
    top: 1.3rem!important;
  }
  .table tr{
    display: grid!important;
  }

  .no-pad h1{
    font-size: 1.7rem;
  }

  select,
  textarea,
  input {
    font-size: 16px!important;
  }
}

@media screen and (-webkit-min-device-pixel-ratio:0) { 
  select,
  textarea,
  input {
    font-size: 16px;
  }
}

@supports not (-webkit-touch-callout: none) {
  /* CSS for other than iOS devices */ 
  
}