@media screen and (max-width: 768px){
    /* header start */
    #m_header .hide-mobile{
        display: none;
    }
    /* header end */

   /* block nos avantages start */
   .nos-avantages .information {
        width: 100%;
    }

    .nos-avantages .avantage{
        display: block;
    }

    /* block nos avantages end */

    .padding-bottom {
        padding-bottom: 10px;
    }

    .nos-evenements-main {
        top: unset;
    }

    .nos-avantages{
        height: auto;
    }

    .contain-howitworks {
        height: auto;
    }

    .nos-evenements {
        height: auto;
    }

    .circle-party {
        height: auto;
    }


    /*  contact reseaux sociaux start*/
    .bouton .btn{
        display: flex;
    }
    /*  contact reseaux sociaux end*/

    /* header start*/
    #m_header .hide-mobile{
        display: none;
    }
    /*  header end */

    /*contactez-nous start*/
    .bloc-rs ul{
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
    }
    /*contactez-nous end*/

    /*recrutement start*/
    .colonne1{
        display: none;
    }
    /*recrutement end*/
    
  /*accordeon version tablette*/
    .que-fetez-vous2{height:130vh;}

    div#accordion {
        position: relative;
        /* left:1rem; */
        top: 3rem;
    }

    .card1 {
        width: 300px;
    }

    
    /*fin accordeon version tablette*/

    #accueil .main-search-input{
        width:100%;
           }

}

@media only screen and (min-width: 769px){
    .vertical-align-center{
        position: relative;
        top: 40%;
        transform: translateY(-45%);

    }


  

/*accordeon version tablette*/
    .que-fetez-vous2{height:130vh;}

    div#accordion {
        position: relative;
        /*left:4rem;*/
        top: 3rem;
    }

    .card1 {
        width: 300px;
    }

    
/*fin accordeon version tablette*/

}

@media (max-width:453px) and (min-width: 320px) {

    .card1 {
        width: 255px !important;
    }

    .btntext {
        font-size:0.5rem;
    }

}


@media screen and (max-width: 484px){
    /* header start */
    #m_header .hide-mobile-btn{
        display: none;
    }
    /* header end */

    /* block form search start */
    /* #accueil .main-search-input{
        display: none;
    } */

    #btn-creer-events{
        padding-top: 30px;
    }
    
    #btn-creer-events span{
        display: initial;
    }

    #accueil .main-search-inner h2 {
        font-size: 30px;
    }

    #accueil .main-search-inner h4 {
        font-size: 15px;
    }
    /* block form search end */

}

@media screen and (min-width: 484px) and (max-width: 768px) {
    /* block form search start */
    #accueil .form-search-container .format{
        padding: 5px 4px;
    }
    /* block form search end */

    /* block nos avantages start */
    .nos-avantages .information {
        width: 56%;
        margin: auto;
        margin-bottom: 20px;
    }
    /* block nos avantages end */

}

@media only screen and (min-width: 768px) and (max-width: 1023px){
    /* page mon profil start */
    #profil .masonry {
        column-count: 2;
    }
    /* page mon profil end */



}

@media screen and (min-width: 768px) and (max-width: 1024px) {
    /* header start */
    #m_header .creer-btn {
        top: 14px;
    }
    /* header end */

    /* block form search start */
     #accueil .form-search-container .format{
        padding: 20px 4px;
    }
    /* block form search end */

    /*accordeon version tablette*/
    .que-fetez-vous2{height:130vh;}

    div#accordion {
        position: relative;
        /* left:15rem; */
        top: 5rem;
    }

   
    /*fin accordeon version tablette*/
}


@media screen and (max-width: 1024px){

        /* page mon profil start */
        .masonry {
            column-count: 3;
        }
        /* page mon profil end */

    /* header start */
    #m_header .m-brand{
        width: initial;
    }

    #m_header .logo-text {
        position: relative;
        /* top: -26px;
        left: 120px; */
    }
    /* header end */

    /* block nos avantages start */
    .nos-avantages .avantage {
        width: 100%;
    }
    /* block nos avantages end */

    /* content padding sur toutes les pages */
    #events .m-content,
    #parametres .m-content,
    #creer_event .m-content,
    #profil .m-content {
        padding-top: 70px;
    }
    /* content padding sur toutes les pages */

    /*contactez-nous start*/
  
    .container-cn{
        width:100%;
    }
    /*contactez-nous end*/
    /*faq start*/
    .portlet{
        padding-top:60px;
    }
    /*faq end*/

    
    #accueil .main-search-input{
        width:100%;
           }

}

@media (min-width: 1025px){
    .m-header .m-header__bottom {
        background: #242C4D !important;
    }


}

@media screen and (max-width: 425px){
    /*  contactez-nous start*/
      .envoi-mail{
          padding-top: 15px ;
      }
      .contacteznous{
          display: none;
      }
     /* contactez-nous end*/
     /*ccm start*/
     .vid-fish{
      width: 280px;  
      }
      /*ccm end*/

}

 /* Responsive ROUE */

  /* Desktop */
@media screen and (min-width: 1440px) and (max-width: 1920px) {
    object.roue {
        width: 70%;
        height: auto;
    }

}

  /* laptop */
  @media screen and (min-width: 1024px) and (max-width: 1440px) {
    object.roue {
        width: 65%;
        height: auto;
    }

}


@media (max-width: 768px) and (min-width: 360px) {

    .marginTopH1 {
        margin-top:2rem;
    }
  
}


@media (max-width: 991px) and (min-width: 768px) {

    .marginTopH1 {
        margin-top:4.5rem;
    }
  
}



  /* resolution mobile pour accordeon */
  @media screen and (min-width: 500px) and (max-width: 611px) {

    div#accordion {
        position: relative;
        /* left:4rem; */
        top: 3rem;
    }

}

@media only screen and (min-width: 1024px){
    /* page mon profil start */
    .masonry {
        column-count: 3;
    }
    /* page mon profil end */

}




