/* RESPONSIVE */
@media only screen and (max-width: 840px){

    .contenu-cms.g-texte-d-texte .wrapper-texte {

        width: 100%;

    }

    .contenu-cms.g-texte-c-texte-d-texte .wrapper-texte {

        width: 100%;

    }

    .contenu-cms.g-texte-d-image .wrapper-texte{

        width: 100%;

    }

    .contenu-cms.g-texte-d-image .wrapper-image{

        width: 100%;
    }


    .contenu-cms.g-image-d-texte .wrapper-texte{

        width: 100%;

    }

    .contenu-cms.g-image-d-texte .wrapper-image{

        width: 100%;
    }

    .img-responsive{

        width: 30%;
        display: block;
        margin: 0 auto;
    }

    .pack-block {

        flex-direction: column;
    }

    .pack-block .pack-price {

        border-radius: 8px 8px 0px 0px !important;
    }

    .pack-block .pack-price {

        text-align: center;
    }

    .pack-block .pack-description {

        text-align: center;
    }

    .pack-block .pack-button {

        margin-bottom: 30px !important;
    }

    
}
@media screen and (max-width: 800px) 
{
    .main-container
    {
        width: 98% !important;
        max-width: 98% !important;
    }
    .bandeau, .grand_titre, h2
    {
        font-size: 18px;
    }
    footer div:not(#btn_bibliotheque)
    {
        padding: 0px !important
    }
    #titre_accueil
    {
        margin-top: inherit !important;
        margin-bottom: inherit !important;
    }

}
@media screen and (max-width: 500px) 
{
    .main-container
    {
        width: 95% !important;
        max-width: 95% !important;
    }
    .bandeau, .grand_titre, h2
    {
        font-size: 16px;
    }
    .grand_titre, h2
    {
        width: 95%;
    }
    footer .main-container
    {
        width: 72% !important;
    }
    footer .block-footer
    {
        padding: 0px !important;
    }
}
@media screen and (max-width: 576px) {
  #logo_site > a > img{
      max-width: 175px;
      max-height: 100px;
  }

  #tarteaucitronIcon #tarteaucitronManager img {
    width: 30px !important;
    height: 30px !important;
    }

  .cms-widget-notreethique {
      margin: 0;
  }

  .ethics-presentation {
      width: 100% !important;
  }

  .cms-widget-notreethique .ethics-presentation .ethics-presentations {
      align-items: center;
  }

  .cms-widget-notreethique .ethics-presentation .ethics-presentations p {
      text-align: center;
  }

  .cms-widget-notreethique .ethics-presentation .ethics-presentations a {
      margin: 0 auto;
  }

  #calendrier_reservation .ui-datepicker {
      width: 100%;
  }

  #activite_reservation {
      padding: 2em 0;
  }

  #contenu .page {
      padding: 1em;
  }

  .cms-widget-commentcamarche, #infos_section_activity {
      width: 100%;
      margin: 0;
  }
}

@media screen and (max-width: 1380px) {
    #btn_mail_volontaire
    {
        display: block;
        width: 69%;
        margin: auto;
        margin-top: 11px;
    }
}
@media screen and (max-width: 768px) {
  #contenu .page {
      padding: 2em;
  }
}

@media screen and (max-width: 1160px) {
    .main-container
    {
        width: 94% !important;
        max-width: 95% !important;
    }
    
    #div_recherche_publique
    {
        width: 50%;
    }

    #texte_annuaire 
    {
        width: 70% !important;
    }

    h2::after, h1::after {
        left: -6%;
        }
        h2::after, h1::after {
            width: 46%;
        }

    header
    {
      position: relative;
    }

    .border_secondaire 
    {
        width: 81%;
    }

    #div_header {
      padding-top: 5px;
      position: fixed;
      width: 100%;
      padding-bottom: 0px;
      background: #fff;
    }

    #contenu .main-container:first-child, #contenu .hauteur_fixed, #contenu.main-container
    {
      margin-top: var(--hauteur-header-mobile);
    }
    #contenu_page_creer_compte 
    {
        margin-top: 0px !important;
    }

    /* Le titre passe à la ligne au lieu d'élargir la page */
    #titre_bibliotheque
    {
      display: block;
      white-space: normal;
    }
    #titre_bibliotheque::after
    {
      content: none;
    }

    /* width: 100% + padding : le formulaire dépassait de l'écran */
    form#formulaire_mon_compte, form#form_changer_mot_de_passe
    {
      box-sizing: border-box;
    }
    /* Les libellés longs (« Changer mon mot de passe ») passent à la ligne sur les petits écrans */
    #formulaire_mon_compte .btn-picto
    {
      box-sizing: border-box;
      max-width: 100%;
      white-space: normal;
      text-align: left;
    }

    #header_logo
    {
      width: 100%;
      padding: 5px;
      margin-bottom: 0px !important;
    }

    .bandeau
    {
        font-size: 20px;
    }
    .grand_titre, h2
    {
        margin-top: 0px !important;
        margin-bottom: 15px !important;
    }
    .logo_footer img
    {
        width: 80px;
    }

  .r-md-display-block {

      display: block !important;
  }

  .r-md-hide {

      display: none !important;
  }

  .r-md-flex-none {

      flex: none !important;
  } 

  .r-md-display-block {

      display: block !important;
  }

  .r-md-flex-column {

      flex-direction: column !important;
  }

  .r-md-flex-row {

      flex-direction: row !important;
  }

  .r-md-margin-h-center {

      margin: 0px auto !important;
  }

  .r-md-full-width {

      width: 100% !important;
  }

  .r-md-flex-wrap {

      flex-wrap: wrap !important;
  }

  .r-md-margin-none {

      margin: 0px !important;
  }

  .r-md-margin-auto {

      margin: auto !important;
  }

  .r-md-display-none {

      display: none !important;
  }

  .r-md-flex-1 {

      flex: 1 !important;
  }

  .r-md-flex-2 {

      flex: 2 !important;
  }

  .r-md-flex-basis-30 {

      flex-basis: 30% !important;
  }

  #advanced_research .field {

      margin-bottom: 10px;
  }

  #btn_launch_search {

      background-color: var(--c-orange);
      color: #fff;
  }

  .search-button-container img {

      display: none !important;
  }

  #advanced_research .search-button-container {

      padding-right: 0px !important;
  }
  
  .field.field-medium, .field.field-large {

      max-width: none !important;
  }

  #top_header, #div_fond_bg, #div_option_header #sub_top_header_connecte, .cache_responsive {

      display: none !important;
  }
  #div_fond_bg_footer
  {
      display: block !important;
  }

  #bandeau_accueil_parcours {
    display: inline-block;
  }
  #bandeau_accueil_parcours
  {
    width: 57%;
    text-align: left;
    padding-left: 5%;
    padding-right: 5%;
    padding-top: 8px;
    padding-bottom: 8px;
    font-size: 1.4rem;
    margin-bottom: 0px;
  }

  #bg-image, #bg-deco-1, #bg-deco-2,
  #bg-deco-3, #bg-deco-4, #bg-circle-1, #bg-circle-2,
  #bg-circle-3, #bg-circle-4 {

      display: none;
  }

  /* .main-container {

      max-width: 90% !important;
  } */

  #logo_site {

      max-width: 200px !important;
  }

  .planinway-slogan {

      padding: 0px 50px 0px 50px !important;
  }

  .home-research {

      margin-top: 0px !important;
  }

  #header_center.no-production {

      margin-bottom: 90px;
  }

  .close-responsive-advanced-research {

      display: none;
  }
  
  #header_center {

      background-position-x: right;
  }

  #btn_create_account {

      display: none !important;
  }

  #partners_section {

      margin: 30px auto !important;
  }

  .cms-micro-contenu_partenaire li{

      margin: 0 !important;
  }

  .bx-wrapper .bx-controls .bx-next {

      right: 10px !important;   
  }
  
  .bx-wrapper  .bx-controls .bx-prev {

      left: 10px !important;
  }

  .bx-wrapper .bx-controls-direction a {

      top: auto !important;
  }

  #infos_section, #infos_section_activity {

      width: 100% !important;
      margin: auto !important;
  }

  /* .block-infos {

      display: block !important;
  }

  .block-presentation {

      width: 100% !important;
      display: block;
      margin-bottom: 25px;
  } */

  #ethics_section {


  }

  .activity-favorite-price {

      flex-basis: 25% !important;
  }

  #header_center_responsive {

      display: none !important;
  }

  #ethics_section .ethics-img {

      margin: auto;
  }

  #ethics_section .ethics-img img {

      width: 30% !important;
  }

  #ethics_section .ethics-presentation {

      width: auto !important;
  }

  #home_research_responsive {

      display: none;
  }

  .cms-menu.cms-menu-haut ul:not(.card-meta) {
    text-align: center;
    padding: 0px !important;
    width: 100%;
  }

  #activity_list {
      padding: 0px !important;
  }

  /* .activity-image img {

      max-width: 200px !important;
  } */

  .activity-sidebar {

      padding: 0px !important;
  }
  

  header ul li a:after {

      content: '';
      border: none !important;
  }
  
  .advanced-research::after {

      display: none !important;
  }

  #formulaire_login {

      width: 100% !important;
  }

  #activity_create_account_content.slideTop, #login_form_section.slideTop {

      position: relative;
      top: 0px;
      transform: translateY(-20vh);
      opacity: 1;
      visibility: visible;
  }

  .cms-menu.cms-menu-footer ul {

      padding: 0px;
      justify-content: center;
  }

  .cms-menu.cms-menu-footer {

      max-width: 100% !important;
      margin-bottom: 20px;
  }
  #div_annuaire .petite_div-sm
    {
        width: 15%;
        text-align: center;
    }
}

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

  .r-sm-display-block {

      display: block !important;
  }

  .r-sm-display-flex {

      display: flex !important;
  }

  .r-sm-flex-column {

      flex-direction: column !important;
  }

  .r-sm-flex-row {

      flex-direction: row !important;
  }

  .r-sm-margin-h-center {

      margin: 0px auto !important;
  }

  .r-sm-flex-none {

      flex: none !important;
  }

  .r-sm-full-width {

      width: 100% !important;
  }

  .r-sm-flex-wrap {

      flex-wrap: wrap !important;
  }

  .r-sm-margin-none {

      margin: 0px !important;
  }

  .r-sm-margin-auto {

      margin: auto !important;
  }

  .r-sm-display-none {

      display: none !important;
  }

  .r-sm-flex-basis-auto {

      flex-basis: none !important;
  }

  .planinway-slogan {

      display: none !important;
  }

  /* .main-container {

      max-width: 90% !important;
  } */

  #logo_site {

      max-width: 150px !important;
  }

  #header_center {

      height: 350px !important;
      padding: 0px !important;
      border-radius: 8px !important;
  }

  #bg-gradient {
      
      height: 380px !important;
      background-size: 100% 700px;
  }

  .cms-menu.cms-menu-haut ul {

      padding: 0px !important;
      width: 100%;
  }

  #contenu .text-padding {

      padding: 0px !important;
  }


  .block-footer {

      width: auto !important;
  }

    /* .planinway-slogan {

      display: none !important;
  } */

  #home_research {

      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 99999999999;
      background-color: var(--c-orange);
      margin-top: 0px !important;
      border-radius: 0px;
      transition: all .5s;
      transform: translateY(-100%);
  }


  #home_research.open {

      transform: translateY(0);
  }

  #home_research .search-button-container {

      padding: 0px !important;
  }

  #home_research .field {

      margin-bottom: 15px;
      margin-right: 0px !important;      
  }

  #home_research .field label {

      color: #fff;
  }

  #home_research {

      flex-direction: column !important;
  }

  .search-button-container {

      text-align: center !important;
  }

  .search-button-container img {

      margin: 50px auto 15px !important;   
  }

  .close-responsive-research {
     
      width: 28px;
      margin-bottom: 40px;
      border-radius: 50%;
      height: 28px;
      background-color: #ffffff80;
      justify-content: right;
      display: flex !important;
      margin: 0 0 30px auto;
      z-index: 1;
  
  }

  .close-responsive-research img {
      width: 12px;
      display: block;
      margin: auto;
      
  }

  #form_recherche_activite h4 {

      font-size: 2rem;
      color: #fff;
      text-align: center;
  }

  #ethics_section {

      margin: 0 !important;
  }

  #ethics_section .ethics-presentation {

      width: auto !important;
      text-align: center;
  }

  #partners_section {

      margin: 30px auto !important;
  }

  .cms-micro-contenu_partenaire li{

      margin: 0 !important;
  }

  .field.field-large {

      max-width: 100% !important;
  }



  .price-container-responsive .euro-price {

      font-size: 1.2rem !important;
  }

  #advertisement {

      width: 100% !important;
      height: 180px !important;
      margin-bottom: 30px !important;
  }

  #header_center_responsive .search-button-container img {

      margin: 20px auto !important;
      width: 40px !important;
  }

  #header_center_responsive .search-button-container button {

      width: 80% !important;
  }

  #header_center_research {

      height: 100%;
      position: initial !important;
      z-index: 999;
      top: 0;
      right: 0;
      bottom: 0;
      background-color: var(--c-orange);
      left: 0;
      margin-top: 0px !important;
      overflow: scroll;
  }

  #ethics_section .ethics-img img {

      width: 100% !important;
  }

  #header_center_research #advanced_research {

      background: transparent !important;
      box-shadow: none !important;
  }

  .field.field-medium {

      max-width: 100% !important;
  }

  #form_recherche_activite_avancee {

      border-bottom: solid 1px #fff !important;
  }

  #form_recherche_activite_avancee .field {

      margin-right: 0px !important;
      margin-bottom: 15px !important;
  }

  #form_recherche_activite_avancee .field label {

      color: #fff !important; 
  }

  #advanced_research h4 {

      color: #fff !important;
      font-size: 1.8rem !important;
      text-align: center;
  }

  #header_center_responsive {

      margin-bottom: 50px;
      display: flex !important; 
  }

  .liste_criteres_rch {

      flex-wrap: wrap !important;
      justify-content: center !important;
  }

  .liste_criteres_rch li {

      margin-bottom: 10px !important;
  }

  #advanced_research .search-button-container {

      padding: 0px !important;
  }

  #result_section .c-dark-blue {

      color: #fff !important;
  }

  .result-tag-list ul li span.result-tag {

      border: solid 1px #fff !important;
      color: #fff !important;
      font-size: .8rem !important;
  }

  .reinit-research span {

      color: #fff !important;
  }

  .reinit-research a span img path {

      fill: red !important;
  }

  #activity_create_account_content.slideTop, #login_form_section.slideTop {

      position: relative;
      top: 0px;
      transform: translateY(-50vh);
      opacity: 1;
      visibility: visible;
  }

  .close-responsive-advanced-research {
     
      width: 28px;
      margin-bottom: 40px;
      border-radius: 50%;
      height: 28px;
      background-color: #ffffff80;
      justify-content: right;
      display: flex !important;
      margin: 0 0 30px auto;
      z-index: 1;
      display: flex !important;
  
  }

  .close-responsive-advanced-research img {
      width: 12px;
      display: block;
      margin: auto;
      
  }

  #header_center_research {
      
      width: 100%;
      position: fixed;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      z-index: 99999999999;
      background-color: var(--c-orange);
      margin-top: 0px !important;
      border-radius: 0px;
      transition: all .5s;
      transform: translateY(-100%);
  }

  #header_center_research.open {

      transform: translateY(0);
  }

  .responsive-favorite  {

      font-size: .8rem !important;
  }
     
  .activity-infos .activity-tag .tag {

      width: 100%;
      text-align: center;
  }

  /* .activity-image img {

      max-width: 360px !important;
  } */

  .r-sm-hide {

      display: none !important;
  }

  .r-sm-flex-order-1 {

      order: 1;
  }
  
  .r-sm-flex-order-2 {
  
      order: 2;
  }
  
  .r-sm-flex-order-3 {
  
      order: 3;
  }
  
  .r-sm-flex-order-4 {
  
      order: 4;
  }
  
  .r-sm-flex-order-5 {
  
      order: 5;
  }

  .activity-sidebar {

      padding: 0px !important;
  }

  #activity_subscribe {

      margin-top: 20px;
  }

  .activity-title-top h2 {

      font-size: 1.6rem !important;
      line-height: 1.4 !important;
  }

  .activity-tag {

      margin-top: 15px;
  }

  .act_prix {

      font-size: 1.2rem !important;
  }

  #sub_top_header_connecte {

      display: none;
  }

  #home_research_responsive {

      display: flex !important;
  }



  header ul li:not(:nth-last-child(1)) a:after {

      content: '';
      display: none !important;
  }

  #account_nav {

      width: 100% !important;
  }

  #account_nav ul {

      flex-direction: column !important;
      padding: 0px 0px 15px 0px !important;
  }

  #account_nav ul li {

      width: 100%;
      padding: 10px 0px !important;
      display: block;
      border-bottom: solid 1px var(--c-dark-blue);
      text-align: center;
  } 

  #account_nav ul li a {

      text-decoration: none !important;
  }

  #account_nav ul li:not(:nth-last-child(1)) a:after {

      display: none !important;
      text-align: center;
  }

  #fidelity {

      margin-right: 0px !important;
      margin-bottom: 15px;
  }

  .family-list .family-member {

      margin: 25px 0px !important;   
  }

  .family-list {

      justify-content: space-between;
  }

  .contenu-cms .wrapper-image {

      order: 1;
  }

  .contenu-cms .text-padding {

      order: 2;
  }

  #activity_create_account_header {

      margin: 15px 0px !important;
  }

  #activity_create_account_header #page_title {

      padding-bottom: 15px !important;
  }

  #bg-gradient.height-small {

      background-size: 100% 80px !important;
  }

  #block_account_disconnect_reponsive a {

      text-decoration: none;
  }

  .bloc_edition_membre {

      width: 100% !important;
  }

  .contenu-cms #page_title{

      margin-bottom: 0px !important;
  }

  .h1 {

      font-size: 60px;
      line-height: 60px;
  }
  
  .h2 {
   
      font-size: 34px !important;
      line-height: 34px !important;
  }
  .h3 {
      
      font-size: 20px !important;
      line-height: 26px !important;
  }
  
  .h4 {
      font-size: 24px;
      line-height: 30px;
  }   
  
  .h5 {
      
      font-size: 18px;
      line-height: 24px;
  }
  
  .h6 {
      
      font-size: 16px;
      line-height: 20px;
  }

  header ul li a:after {

      content: '';
      border: none !important;
  }

  .advanced-research::after {

      display: none !important;
  }

  .search-button-container img {

      display: block !important;
  }

  .right-separator {

      border: none !important;
  }

  #partners_section ul li {

      justify-content: space-between;
      text-align: center;
  }

  #partners_section ul li a img {

      max-width: 80%;
      margin: auto !important;
  }

  #slider_section:not(.no-background):before {

      content: '';
      background-color: var(--c-light-blue);
      width: 100%;
      height: 300px;
      display: block;
      position: absolute;
      left: 0;
      top: 380px;
      z-index: -1;
  }

  #ethics_section {

      position: relative;
  }

  #ethics_section:before {

      content: '';
      background-color: var(--c-light-blue);
      display: block;
      position: absolute;
      left: -25px;
      top: -15px;
      bottom: -20px;
      left: -20px;
      right: -20px;
      z-index: -1;
  }

  .cms-menu.cms-menu-footer ul {

      padding: 0px;
      justify-content: center;
  }
  .cms-menu.cms-menu-footer {

      max-width: 100% !important;
      margin-bottom: 20px;
  }

}

@media screen and (min-width: 1160px) {
  #home_research_responsive {

      display: none;
  }
 

   


  .close-responsive-advanced-research {
    
      display: none;
  }

  .r-lg-display-none {

      display: none !important;
  }

  #activity_create_account_content.slideTop, #login_form_section.slideTop {

      position: relative;
      top: 0px;
      transform: translateY(-200px);
      opacity: 1;
      visibility: visible;
  }

  
}

@media screen and (max-width: 671px) {
    #calque_inscription_formation .btn
    {
        font-size: 0.9rem;
        width: 93% !important;
        display: block;
        padding: 5px !important;
    }

    #header_logo .espace_logo {
        height: 12px !important;
    }
}


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

  #bg-circle-1, #bg-circle-3 {

      display: none;
  }

  #bg-deco-3 {

      
  }

  #bg-deco-2 {

      display: none;
  }
}


@media screen and (max-width: 700px) and (orientation: landscape) { 

  #contenu .text-padding {

      padding: 0 40px !important; 
  }

  #contenu.page {
      margin-top: 20px !important;
  }

  #page_title {
      margin-bottom: 0px !important;
  }

  #logo_site {

      max-width: 200px !important;
  }

  #sub_top_header_connecte img {
      display: block;
      margin-bottom: 3px;
  }

  #sub_top_header_connecte a span {
      text-align: center;
  }

  #sub_top_header_connecte a {

      display: flex;
      flex-direction: column;
     align-items: center;
  }

  .contenu-cms .r-sm-flex-column {
      flex-direction: column;
  }
}

/* sm */
@media (min-width: 576px) {
  
  .activity-image {
      margin-right: 2em;
  }
}

/* md */
@media (min-width: 768px) {
  #header_center, #header_center_research, header .main-container {
      /*width: 70%;*/
  }
}

/* lg */
@media (min-width: 1024px) {
}
@media (max-width: 1024px) {
    #div_fond_bg_footer
    {
        width: 100%;
    }
}

/* xl */

/* 2xl */
@media (min-width: 1536px) {

}


@media screen and (max-width: 976px) {
    .calque.alerte .modal .modal-content .modal-alert-title h2
    {
        font-size: 1.2rem;
    }

}
@media screen and (max-width: 769px) {
   
    .modal-medium:not(.multicalques) .modal
{
    width: 95% !important;
}
  .ligne_formation * 
  {
    margin-left: 3px;
    margin-right: 4px;
  }
  .calque.alerte .modal .modal-content .modal-alert-title h2
{
    font-size: 1rem;
    white-space: inherit !important;

}
.calque.alerte .modal .modal-content .btn-section
{
    width: 100%;
}
.calque.alerte .modal .modal-content .btn-round
{
    width: 42%;
}
}
@media screen and (max-width: 666px) {
    #div_annuaire .petite_div-sm
    {
        width: 19%;
    }
    #div_filtre .un_champ_switch 
    {
        width: 100%;
    }
    #div_recherche_publique
    {
        width: 80%;
    }
    #div_filtre .field
    {
        width: 100%;
    }
    .grand_bloc_xs, #formulaire_creer_compte input.grand_bloc_xs, #formulaire_edition_volontaire .un_champ.grand_bloc_xs, 
    #formulaire_edition_formateur .un_champ.grand_bloc_xs, #formulaire_mon_compte .un_champ.grand_bloc_xs, #formulaire_envoi_mail .grand_bloc_xs
    {
        width: 100% !important;
    }
    #formulaire_edition_volontaire .un_champ.demi_bloc, #formulaire_edition_volontaire .un_champ.tiers_bloc,
    #formulaire_edition_formateur .un_champ.demi_bloc, #formulaire_edition_formateur .un_champ.tiers_bloc,
    #formulaire_mon_compte .un_champ.demi_bloc, #formulaire_mon_compte .un_champ.tiers_bloc,
    #formulaire_envoi_mail .tiers_bloc
    {
        margin-left: 0px !important;
    }
    #formulaire_edition_formateur .un_champ .select2
    {
        width: 93% !important;
    }
    #recherche_haute_bibliotheque
    {
        width: 97%;
    }
    #formulaire_creer_compte .un_champ
    {
        width: 97% !important;
    }
    #formulaire_creer_compte .select-civilite .select2
    {
        width: 100% !important;
    }
    #calque_envoi_mail input, #calque_envoi_mail textarea
    {
        width: 95%;
        margin: auto;
    }
    .ligne_bibliotheque .download_ressource {
        float: right;
        position: relative;
        top: -13px;
    }
    #formulaire_recherche_bibliotheque_precise
    {
        width: 97%;
        display: block !important;
    }
    /*#formulaire_recherche_bibliotheque_precise div
    {
        width: 99%;
        text-align: center;
    }*/
    #onglet_bibliotheque, #div_bibliotheque
    {
        width: 100%;
    }
    #formulaire_recherche_bibliotheque_precise input
    {
        width: 80% !important;
        display: block;
        margin: auto;
    }
    #formulaire_recherche_bibliotheque_precise input
    {
        width: 77% !important;
    }
    .grand_bloc, .petit_bloc 
    {
        width: 95% !important;
    }
    .ligne_formation * 
    {
        margin-left: 3px;
        margin-right: 3px;
    }
    #formulaire_login input, #form_changer_mot_de_passe input {
        width: 89%;

    }
    #div_formation .btn_desinscription
    {
        width: 73px;
        padding: 4px !important;
    }
  #bandeau_accueil_parcours
  {
    width: 54%;
    font-size: 1.1rem;
  }
  #div_formation .ligne_formation .material-icons {
        top: 3px;
    }
  #div_formation .ligne_formation .show_formation .material-icons {
        top: -2px;
    }


  #div_formation_accueil .ligne_formation .show_formation .material-icons {
        top: 3px !important;
    }
  #div_formation_accueil .ligne_formation .show_formation .material-icons.float-right {
        top: -13px !important;
    }
  .div_action
  {
      width: 100%;
  }
  .div_action, .div_action select, .div_action .btn
  {
      display: block;
  }
  .div_action select, .div_action .select2-container, .div_action .btn
  {
      margin: auto;
      text-align: center;
      width: 350px !important;
      margin-bottom: 8px;
  }
  #formulaire_recherche_formation
  {
      text-align: center;
  }
  #btn_recherche_formation_accueil
  {
      margin-top: 8px;
      width: 335px !important;
  }
  h2::after, h1::after {

        width: 33%;
    }
    .ligne_formation .img_calendrier
    {
        margin-right: 3px;
    }
    #footer_div_formation .btn
    {
        width: 95%;
    }
    #div_filtre select, #div_filtre input:not([type="radio"]), #div_filtre .selection{
        font-size: 14px !important;
        width:80%;
        display: inline-block;
    }
    #div_filtre .select2-selection
    {
        width: 100% !important;
        display: inline-block;
        font-size: 14px !important;
        min-height: 100%;
    }
    .ligne_formation .show_formation .material-icons
    {
        top: -5px;
    }
    #div_filtre input:not([type="radio"])
    {
        width:75%;
    }
    #div_filtre .switch-multiple label
    {
        width: calc(100% / 3.4);
    }
    #div_filtre .switch-multiple
    {
        width: 83%;
        margin: auto;
    }
    #div_filtre .field {
        margin-top: 0px;
        margin-bottom: 5px;
    }
    #formulaire_recherche_formation
    {
        display: block;
        z-index: 1;
        position: relative;
    }
    #section_creer_compte{
        width: 100%;
    }

    .grande_div-sm
    {
        width:100%;
    }
    .petite_div-sm
    {
        width:80%;
    }
    .ligne_annuaire .petite_div-sm
    {
        width:90%;
    }
    i.float-right
    { 
      top: -10px !important;
      position: relative;
    }
    .ligne_formation
    {
        width: 98%;
        font-size: 0.8rem !important;
    }
    .main-container {
        width: 98% !important;
        max-width: 98% !important;
    }
    h1, h2 
    {
        width: 95%;
        
    }
    #header_logo
    {
        width:95%;
    }
}

@media screen and (max-width: 558px) {
  .colonne_chemin_annuaire
  {
      width:100%;
  }
  #div_formation_accueil :not(i)
  {
    font-size: 0.8rem;
  }
  #bloc_auth 
  {
      width: 80%;
  }


  #bandeau_accueil_parcours {
    font-size: 1rem;
  }
  footer a
  {
    font-size: 10px !important;
  }
  #formulaire_creer_compte .un_champ input[name="sCodePostal"], #formulaire_creer_compte .un_champ input[name="sVille"]
{
    width: 100% !important;
    margin-left: 0px !important;
}
    #formulaire_creer_compte input.tiers_bloc:not(.first_bloc)
    {
        margin-left: 0px !important;
        margin-right: 0px !important;
    }
  .demi_bloc {
    width: 96%; 
    }
    .btn.demi_bloc
    {
        margin-bottom: 9px;
    }
    .ligne_formation {
        width: 97%;
    }
}
@media screen and (max-width: 727px)
{
    #header_logo .img_logo {
        height: 17px !important;
    }
    #header_logo .espace_logo {
        height: 15px !important;
    }
}
@media screen and (max-width: 482px) {
    .thematique_formation
    {
        padding: 0rem 0 !important;
    }
    .une_info
    {
        width: calc(100% - 1rem) !important;
    }
   .calque_mot_passe_oublie .btn
   {
        width: 80% !important;
   }
    #formulaire_contact_classique .grid
    {
        width: 100%;
    }
    #formulaire_contact_classique .grid *
    {
        width: 95%;
    }
    #contenu .main-container:first-child, #contenu .hauteur_fixed, #contenu.main-container
    {
        margin-top: var(--hauteur-header-mobile);
    }
    #detail_formation #sTitre
    {
        white-space: normal;
    }
  #bandeau_accueil_parcours {
    width: 54%;
    font-size: 0.8rem;
  } 
  #header_logo .img_logo {
    height: 27px !important;
  }
  #header_logo .espace_logo {
    height: 15px !important;
    margin-left: 5px;
  }    
  h2::after, h1::after {

    width: 10%;
    }
}
@media screen and (max-width: 413px) {
    .calque.alerte .modal .modal-content .btn-round
{
    width: 40%;
}
  .calque_mot_passe_oublie {
    width: 90% !important;
  }
  #calque_edition_utilisateur .modal, #calque_envoi_mail .modal,   #calque_alerte_clone .modal
  {
      width: 90% !important;
  }
  
}
@media screen and (max-width: 378px) {
    #header_logo .espace_logo {
        height: 10px !important;
    }

    #header_logo .img_logo{
        height: 10px !important;
    }
}
@media screen and (max-width: 800px) {
#formulaire_login, #form_changer_mot_de_passe
{
    width: 80% !important;
}
}
@media screen and (max-width: 1254px) {
    #calque_alerte_clone .modal
    {
        width: 70% !important;
    }
}
@media screen and (max-width: 1062px) {
    #dialogue_questionnaire .dialogue
    {
        width: 80%;
    }

    .info_content_row
    {
       flex-direction: column;
    }
    .une_info {
        width : calc(50% - 1rem)
    }
}
@media screen and (max-width: 650px) {
    #div_signature .demi 
    {
        width: 100%;
    }
}

@media (max-width: 500px) {
    #btn_enregistrement_volontaire, #btn_anonymiser_volontaire, #btn_mail_volontaire, #btn_mail_formateur,
    .action_formateur_btn_enregistre_edition_formateur
    {
        width: 96%;
        display: block;
        margin: auto;
        margin-bottom: 3px;
        margin-top: 0px;
        padding: 0px !important;
    }
    #btn_enregistrement_volontaire span, #btn_anonymiser_volontaire span, #btn_mail_volontaire span, #btn_mail_formateur span
    {
        font-size: 12px;
    }
}
@media screen and (max-width: 850px) 
{
    #texte_annuaire 
    {
        width: 60% !important;
    }
}
@media screen and (max-width: 590px) 
{
    #texte_annuaire, #link_annuaire
    {
       float: left;
    }
    #texte_annuaire 
    {
        width: 100% !important;
    }
}

@media screen and (max-width: 388px) {
    #table_annuaire {
        font-size: 0.75rem;
    }
}

@media screen and (max-width: 319px) {
    #table_annuaire {
        font-size: 0.6rem;
    }
}

/* Responsive : 2 éléments par ligne sur écran <= 900px */
@media screen and (max-width: 900px) {
  .section_formation {
    gap: 12px;
  }
  .card_formation {
    flex: 1 1 calc(50% - 12px);
    max-width: 50%;
    padding: 1.5rem;
  }
}

/* Les cards de l'accueil sont dans .cms-menu-haut : on neutralise les styles du menu (majuscules, centrage)
   sur les listes de la description HTML du type de formation */
.section_formation .event-card .card-description li {
    text-transform: none;
}

@media screen and (max-width: 1160px) {
    .section_formation .event-card .card-description ul:not(.card-meta),
    .section_formation .event-card .card-description ol {
        text-align: left;
        padding-left: 20px !important;
    }
}

/* Responsive : 1 élément par ligne sur écran <= 600px */
@media screen and (max-width: 600px) {

    /* ===== Carte : coins droits + barres dégradées gauche/droite ===== */
    .section_formation .event-card {
        width: 100% !important;
        padding: 0 !important;
        margin-bottom: 20px;
        background: #FAF7FF !important;
        border-radius: 0 !important;
        border-style: solid !important;
        border-width: 0 15px !important;
        border-image: linear-gradient(to bottom, #2821A9 0%, #B34474 50%, #AE90DC 100%) 1 !important;
        box-shadow: none !important;
        overflow: visible !important;
    }

    .section_formation .event-card .card-content {
        padding: 28px 24px !important;
        gap: 22px;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
        background: #FAF7FF !important;
    }

    /* ===== Header ===== */
    .section_formation .event-card .date-text {
        font-size: 18px;
    }

    .section_formation .event-card .location-icon {
        width: 36px;
        height: 36px;
        border-radius: 8px;
    }

    .section_formation .event-card .location-icon .material-icons {
        font-size: 20px;
    }

    /* ===== Titre ===== */
    .section_formation .event-card .card-title-row {
        align-items: center;
        gap: 14px;
    }

    .section_formation .event-card .card-title {
        font-size: 18px;
        line-height: 1.25;
    }

    /* ===== Description (et tout ce qui est injecté dedans) ===== */
    .section_formation .event-card .card-description,
    .section_formation .event-card .card-description * {
        font-size: 16px !important;
        line-height: 1.45 !important;
        font-weight: 400 !important;
        color: #161616 !important;
        margin: 0;
    }

    /* ===== Infos (durée, formateur, lieu) ===== */
    .section_formation .event-card .card-meta {
        gap: 18px;
    }

    .section_formation .event-card .card-meta li {
        display: flex;
        align-items: center;
        gap: 10px;
        font-size: 16px !important;
        line-height: 1.3;
        color: #161616;
    }

    .section_formation .event-card .card-meta li>span,
    .section_formation .event-card .card-meta li strong {
        font-size: 16px !important;
        line-height: 1.3;
        margin: 0;
    }

    .section_formation .event-card .card-meta li .meta-icon {
        font-size: 20px !important;
        line-height: 1;
        vertical-align: middle;
        flex-shrink: 0;
    }

    .section_formation .event-card .card-meta li.meta-location,
    .section_formation .event-card .card-meta li.meta-location>span {
        color: #444;
        font-weight: 300;
    }

    /* ===== Bouton ===== */
    .section_formation .event-card .card-cta {
        font-size: 15px !important;
        padding: 10px 10px 10px 22px !important;
        gap: 12px;
    }

    /* ===== Arrondi pour la dernière carte ===== */
    .section_formation .event-card:last-child,
    .formations_complementaires .event-card:last-child {
        border-image: none !important;
        border-width: 0 !important;
        padding: 0 15px !important;
        background: linear-gradient(to bottom, #2821A9 0%, #B34474 50%, #AE90DC 100%) !important;
        border-bottom-left-radius: 30px !important;
        border-bottom-right-radius: 30px !important;
        overflow: hidden !important;
    }
    .section_formation .event-card:last-child .card-content,
    .formations_complementaires .event-card:last-child .card-content {
        border-bottom-left-radius: 20px !important;
        border-bottom-right-radius: 20px !important;
    }

    /* ===== Détails de la formation : sidebar pleine largeur ===== */
    .sidebar_formation .une_info {
        width: 100% !important;
    }
}


/* @media screen and (max-width: 500px)
{
    #div_signature *
    {
        font-size: 12px;
    }
    .mon_bloc_signature_responsive 
    {
        margin-top: 10px;
    }
    .mon_bloc_signature_responsive .border_secondaire
    {
        margin-bottom: 0px;
    }
    .mon_bloc_signature_responsive #div_fond_bg_footer
    {
        height: 40px;
        background-size: 120px;
    }
    #div_signature canvas
    {
        height: 142px;
    }
    #div_signature .margin_responsive
    {
        margin-top: 0px;
        margin-bottom: 0px;
    }
    .mon_bloc_haut_signature_responsive 
    {
        min-height: 0px !important;
    }
    .mon_body_signature_responsive
    {
        overflow: hidden !important;
    }
} */

/** Responsive : Formulaire Creer compte **/
@media screen and (max-width: 900px) {
    #formulaire_creer_compte .parentColumn3 { 
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: repeat(2, auto);
    }
    #formulaire_creer_compte .childColumn3n1, 
    #formulaire_creer_compte .childColumn3n2, 
    #formulaire_creer_compte .childColumn3n3 { 
        grid-area: auto 
    } 
    #formulaire_creer_compte .childColumn3n2 {
        padding-right: 0;
    }
    #formulaire_creer_compte .addPaddingRight25rem {
        padding-right: 0;
    }
    #formulaire_creer_compte .childColumn3n3 {
        grid-column: span 2 / span 2;
        padding-top: 0;
    }

    #section_creer_compte,
    #contenu_page_creer_compte,
    #formulaire_creer_compte,
    #formulaire_creer_compte .tableCreerCompte,
    #formulaire_creer_compte .ligneCreerCompte,
    #formulaire_creer_compte .parentColumn1,
    #formulaire_creer_compte .parentColumn2,
    #formulaire_creer_compte .parentColumn3,
    #formulaire_creer_compte .childColumn1,
    #formulaire_creer_compte .childColumn2n1,
    #formulaire_creer_compte .childColumn2n2,
    #formulaire_creer_compte .childColumn3n1,
    #formulaire_creer_compte .childColumn3n2,
    #formulaire_creer_compte .childColumn3n3 {
        width: 100%;
        max-width: 100%;
        min-width: 0;
        box-sizing: border-box;
    }

    #formulaire_creer_compte .padding-right-15rem,
    #formulaire_creer_compte .padding-right-18rem,
    #formulaire_creer_compte .padding-right-25rem,
    #formulaire_creer_compte .addPaddingRight25rem,
    #formulaire_creer_compte .addPaddingRight28rem {
        padding-right: 0 !important;
    }

    #formulaire_creer_compte .text-secondary,
    #formulaire_creer_compte .weight-300,
    #formulaire_creer_compte .weight-200,
    #formulaire_creer_compte .switch-action-name,
    #formulaire_creer_compte label {
        white-space: normal;
        overflow-wrap: break-word;
        word-break: normal;
    }
}

@media screen and (max-width: 768px) {
    #section_creer_compte,
    #contenu_page_creer_compte {
        width: 100% !important;
        max-width: 100% !important;
    }

    #contenu .page,
    .section_form,
    .div_form,
    .div_form.w-95percent {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
        box-sizing: border-box;
    }

    #formulaire_creer_compte .parentColumn2 { 
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(2, auto);
    } 
    #formulaire_creer_compte .parentColumn3 { 
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: repeat(3, auto);
        gap: 0;
    }
    #formulaire_creer_compte .childColumn2n1, 
    #formulaire_creer_compte .childColumn2n2, 
    #formulaire_creer_compte .childColumn3n1, 
    #formulaire_creer_compte .childColumn3n2, 
    #formulaire_creer_compte .childColumn3n3 { 
        grid-area: auto; 
        padding-top: 0;
    } 
    #formulaire_creer_compte .childColumn2n1, 
    #formulaire_creer_compte .childColumn2n2 {
        padding-right: 0;
    }
    #formulaire_creer_compte .childColumn2n2 {
        padding-left: 0;
    }
    #formulaire_creer_compte .childColumn3n1,
    #formulaire_creer_compte .childColumn3n2, 
    #formulaire_creer_compte .childColumn3n3 {
        padding-right: 0;
    }
    #formulaire_creer_compte .addPaddingRight25rem {
        padding-right: 0;
    }
    #formulaire_creer_compte .addPaddingRight28rem {
        padding-right: 0;
    }

    #formulaire_creer_compte .parentColumn1,
    #formulaire_creer_compte .childColumn1,
    #formulaire_creer_compte .parentColumn2,
    #formulaire_creer_compte .parentColumn3,
    #formulaire_creer_compte .childColumn2n1,
    #formulaire_creer_compte .childColumn2n2,
    #formulaire_creer_compte .childColumn3n1,
    #formulaire_creer_compte .childColumn3n2,
    #formulaire_creer_compte .childColumn3n3,
    #formulaire_creer_compte input:not([type="checkbox"]),
    #formulaire_creer_compte textarea,
    #formulaire_creer_compte select,
    #formulaire_creer_compte .select2,
    #formulaire_creer_compte .select2-container,
    #formulaire_creer_compte .select2-selection {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0;
        box-sizing: border-box;
    }

    #formulaire_creer_compte .childColumn1 {
        display: block;
    }

    #formulaire_creer_compte .switch {
        display: flex;
        flex-wrap: nowrap;
        align-items: center;
        gap: clamp(0.15rem, 1vw, 0.3rem);
        min-width: 0;
        width: 100%;
    }

    #formulaire_creer_compte .switch .switch-action-name,
    #formulaire_creer_compte span.switch-span {
        font-size: clamp(0.72rem, 2vw, 0.84rem);
        line-height: 1.1;
    }

    #formulaire_creer_compte .text-secondary {
        font-size: clamp(0.8rem, 2.2vw, 0.95rem) !important;
        line-height: 1.25;
    }

    #formulaire_creer_compte #btn_creer_compte {
        width: 100%;
        justify-content: center;
    }
}

/* Formulaire connexion - petit écran smartphone */
@media screen and (max-width: 576px) {
    .calque_connexion_public h2 {
        text-align: center;
    }

    .section_form {
        align-items: center;
    }

    .div_form {
        margin: 0 auto;
        padding: 1.5rem 1rem;
        box-sizing: border-box;
    }

    .div_form.w-50percent {
        width: 90% !important;
    }

    #formulaire_login {
        width: 100% !important;
        margin: 0 auto !important;
    }

    .input_login {
        width: 100% !important;
        box-sizing: border-box;
        font-size: 1rem !important;
        padding: 0.7rem !important;
    }

    .input_login::placeholder {
        font-size: 1rem;
    }

    .lien_login {
        font-size: 1rem;
    }

    .btn_connexion.force-left {
        display: block !important;
        margin: 0 auto !important;
        width: 100% !important;
        justify-content: center;
    }

    .font-size-default {
        font-size: 0.95rem !important;
    }
}

/**
 * GRID SYSTEM
 */

[class*="grid-"] {
  display: flex;
  -webkit-flex-flow: row wrap;
  -ms-flex-flow: row wrap;
}

.grid {
  display: flex;
  flex-flow: row wrap;
  -ms-flex-flow: row wrap;
  flex: 1;
  -webkit-box-flex: 1;
  -moz-box-flex: 1;
  -ms-box-flex: 1;
  max-width: 100%;
}

.no-gutter {
  padding: 0rem !important;
}

[class*="column-"] {
  padding: 0.5rem;
  max-width: 100%;
  float: left;
}

.grid .column-1 {
  width: 8.333333%;
}

.grid .column-2 {
  width: 16.666666%;
}

.grid .column-3 {
  width: 25%;
}

.grid .column-4 {
  width: 33.333333%;
}

.grid .column-5 {
  width: 41.666666%;
}

.grid .column-6 {
  width: 50%;
}

.grid .column-7 {
  width: 58.333332%;
}

.grid .column-8 {
  width: 66.666665%;
}

.grid .column-9 {
  width: 75%;
}

.grid .column-10 {
  width: 83.333331%;
}

.grid .column-11 {
  width: 91.666664%;
}

.grid .column-12 {
  width: 100%;
}

.hide {
  display: none;
}

.show {
  display: block;
}

@media all and (max-width: 1200px) {
  .grid .column-lg-1 {
    width: 8.333333%;
  }

  .grid .column-lg-2 {
    width: 16.666666%;
  }

  .grid .column-lg-3 {
    width: 25%;
  }

  .grid .column-lg-4 {
    width: 33.333333%;
  }

  .grid .column-lg-5 {
    width: 41.666666%;
  }

  .grid .column-lg-6 {
    width: 50%;
  }

  .grid .column-lg-7 {
    width: 58.333332%;
  }

  .grid .column-lg-8 {
    width: 66.666665%;
  }

  .grid .column-lg-9 {
    width: 75%;
  }

  .grid .column-lg-10 {
    width: 83.333331%;
  }

  .grid .column-lg-11 {
    width: 91.666664%;
  }

  .grid .column-lg-12 {
    width: 100%;
  }

  .hide-lg {
    display: none;
  }

  .show-lg {
    display: block;
  }
}

@media all and (max-width: 992px) {
  .grid .column-md-1 {
    width: 8.333333%;
  }

  .grid .column-md-2 {
    width: 16.666666%;
  }

  .grid .column-md-3 {
    width: 25%;
  }

  .grid .column-md-4 {
    width: 33.333333%;
  }

  .grid .column-md-5 {
    width: 41.666666%;
  }

  .grid .column-md-6 {
    width: 50%;
  }

  .grid .column-md-7 {
    width: 58.333332%;
  }

  .grid .column-md-8 {
    width: 66.666665%;
  }

  .grid .column-md-9 {
    width: 75%;
  }

  .grid .column-md-10 {
    width: 83.333331%;
  }

  .grid .column-md-11 {
    width: 91.666664%;
  }

  .grid .column-md-12 {
    width: 100%;
  }

  .hide-md {
    display: none;
  }

  .show-md {
    display: block;
  }

  .calque.alerte .modal {

    width: 70%;
    height: auto;
  }
}

@media all and (max-width: 768px) {
  .grid .column-sm-1 {
    width: 8.333333%;
  }

  .grid .column-sm-2 {
    width: 16.666666%;
  }

  .grid .column-sm-3 {
    width: 25%;
  }

  .grid .column-sm-4 {
    width: 33.333333%;
  }

  .grid .column-sm-5 {
    width: 41.666666%;
  }

  .grid .column-sm-6 {
    width: 50%;
  }

  .grid .column-sm-7 {
    width: 58.333332%;
  }

  .grid .column-sm-8 {
    width: 66.666665%;
  }

  .grid .column-sm-9 {
    width: 75%;
  }

  .grid .column-sm-10 {
    width: 83.333331%;
  }

  .grid .column-sm-11 {
    width: 91.666664%;
  }

  .grid .column-sm-12 {
    width: 100%;
  }

  .hide-sm {
    display: none;
  }

  .show-sm {
    display: block;
  }

  .modal-full:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .modal-large:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .modal-medium:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .modal-small:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .modal-auto:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .calque:not(.multicalques) {
    width: 100% !important;
  }

  .modal-full:not(.multicalques) .modal {
    width: 100% !important;
  }

  .modal-large:not(.multicalques) .modal {
    width: 100% !important;
  }

  .modal-medium:not(.multicalques) .modal {
    width: 100% !important;
  }

  .modal-small:not(.multicalques) .modal {
    width: 100% !important;
  }
  .calque.alerte .modal {

    width: 90% !important;
    height: auto;
  }

  .calque.alerte .modal .modal-content .modal-alert-title, 
  .calque.alerte .modal .contenu_alerte,
  .calque.alerte .modal .modal-content .btn-section,
  .calque.alerte .modal .modal-content:before {

    width: 100% !important;
    text-align: center;
  }

  .btn-success, .annuler, .continue {
    width: 40%;
  }
}

@media all and (max-width: 576px) {
  .grid .column-xs-1 {
    width: 8.333333%;
  }

  .grid .column-xs-2 {
    width: 16.666666%;
  }

  .grid .column-xs-3 {
    width: 25%;
  }

  .grid .column-xs-4 {
    width: 33.333333%;
  }

  .grid .column-xs-5 {
    width: 41.666666%;
  }

  .grid .column-xs-6 {
    width: 50%;
  }

  .grid .column-xs-7 {
    width: 58.333332%;
  }

  .grid .column-xs-8 {
    width: 66.666665%;
  }

  .grid .column-xs-9 {
    width: 75%;
  }

  .grid .column-xs-10 {
    width: 83.333331%;
  }

  .grid .column-xs-11 {
    width: 91.666664%;
  }

  .grid .column-xs-12 {
    width: 100%;
  }

  .hide-xs {
    display: none;
  }

  .show-xs {
    display: block;
  }

  .modal-full:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .modal-large:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .modal-medium:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .modal-small:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .modal-auto:not(.multicalques) {
    top: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    right: 0 !important;
  }

  .calque:not(.multicalques) {
    width: 100% !important;
  }

  .modal-full:not(.multicalques) .modal {
    width: 100% !important;
    max-width: 100%;
  }

  .modal-large:not(.multicalques) .modal {
    width: 100% !important;
    max-width: 100%;
  }

  .modal-medium:not(.multicalques) .modal {
    width: 100% !important;
    max-width: 100%;
  }

  .modal-small:not(.multicalques) .modal {
    width: 100% !important;
    max-width: 100%;
  }

  .modal-auto:not(.multicalques) .modal {
    min-width: 0;
    width: auto;
  }

  .calque.alerte .modal {

    width: 90%;
    height: auto;
  }

  .calque.alerte .modal .modal-content .modal-alert-title, 
  .calque.alerte .modal .contenu_alerte,
  .calque.alerte .modal .modal-content .btn-section,
  .calque.alerte .modal .modal-content:before {

    width: 100% !important;
    text-align: center;
  }

  .menu {
    flex-wrap: wrap;
  }

  .container .main-content .menu .search-sidebar {

    flex-basis: 60%;
  }

  .breadcrumb {

    display: none !important;
  }

  .div_table .action-bar .container-pagination {

    float: none;
    width: 100%;
  }

  .btn-success, .annuler, .continue {
    width: 40% !important;
  }
}
/**  
 * END GRID SYSTEM
*/

@media (max-width: 1200px) {
  .container .sidebar {
    position: fixed;
    transform: translateX(-100%);
    transition: transform 0.5s ease;
    z-index: 300;
    bottom: 0;
    left: 0;
    min-width: 10rem;
    overflow-y: auto;
  }

  .container .search-sidebar-menu {
    position: fixed;
    /*transform: translateX(-100%);*/
    transition: transform 0.5s ease;
    z-index: 300;
    bottom: 0;
    left: 0;
    min-width: 10rem;
    overflow-y: auto;
  }

  /*.search-container {
    display: none;
  }*/

  .container .sidebar #logo {
    background-origin: padding-box;
  }

  .container .main-content {
    max-width: 100%;
  }

  .responsive-sidebar {
    display: block;
  }

  .horizontal-form .form-field {
    display: flex;
  }

  .horizontal-form .form-field label {
    max-width: 120px;
    flex: 1;
    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -ms-flex: 1;
  }
}

@media (min-width: 1200px) {
  .container .sidebar {
    transform: translateX(0%);
    transition: transform 0.5s ease;
  }

  .container .search-sidebar-menu {
    transform: translateX(0%);
    transition: transform 0.5s ease;
  }

  .search-container {
    display: block !important;
  }

  .search-icon {
    display: none;
  }
}

@media (max-width: 768px) {
  .calque {
    height: 100%;
  }
  .calque .modal {
    height: 100%;
    max-width: 100%;
  }
  .calque .modal .contenu_scroll {
    max-height: calc(100% - 96px);
  }
  .calque .modal .form-action-bar {
    padding: 0.4rem 0.9rem;
    position: fixed;
    width: 100%;
    bottom: 0;
  }
  .calque div[id*="calque_"] form {
    height: 100%;
  }
  .calque div[id*="calque_"] {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
  }
}

/* Modales de la partie publique en mobile : le contenu reste toujours dans le cadre.
   Les calques courts (alertes, inscription, mot de passe, besoin spécifique) deviennent des cartes
   centrées à hauteur automatique au lieu d'occuper tout l'écran. */
@media (max-width: 768px) {
  /* Barre d'actions fixe des calques plein écran (envoi de mail…) : pas plus large que l'écran */
  .calque .modal .form-action-bar {
    left: 0;
    right: 0;
    width: auto;
    box-sizing: border-box;
  }
  #modal_calque_envoi_mail .modal {
    width: 100% !important;
  }

  /* Calques courts : carte centrée */
  #modal_calque_inscription_formation #calque_inscription_formation,
  #modal_calque_mot_passe_oublie #calque_mot_passe_oublie {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    width: calc(100% - 32px) !important;
    height: auto;
    margin: auto;
  }
  #modal_calque_inscription_formation .modal,
  #modal_calque_mot_passe_oublie .modal,
  #modal_calque_besoin_specifique_formation .modal {
    height: auto;
    max-height: calc(100vh - 32px);
    /* iOS Safari : 100vh inclut la barre d'adresse, 100dvh suit la zone visible (100vh reste en repli) */
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    box-sizing: border-box;
  }
  #modal_calque_besoin_specifique_formation .besoin_specifique_modal {
    width: calc(100% - 32px) !important;
    margin: auto;
    padding: 24px 20px;
  }
  #modal_calque_besoin_specifique_formation .besoin_specifique_header h2 {
    font-size: 24px;
  }

  /* Calque « vous devez être connecté » : titre sur plusieurs lignes, boutons empilés */
  #calque_inscription_formation .modal-title h2 {
    font-size: 1rem;
  }
  #modal_calque_inscription_formation .form-action-bar {
    position: static;
    flex-direction: column;
    gap: 8px;
  }
  #calque_inscription_formation .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    width: 100% !important;
    margin: 0;
    padding: 10px !important;
    box-sizing: border-box;
  }

  /* Alertes : la croix (en absolu à gauche) ne recouvre plus le titre, boutons empilés */
  #calque_alerte_clone.calque.alerte .modal {
    width: calc(100% - 32px) !important;
    max-height: calc(100vh - 32px);
    /* iOS Safari : 100vh inclut la barre d'adresse, 100dvh suit la zone visible (100vh reste en repli) */
    max-height: calc(100dvh - 32px);
    overflow-y: auto;
    box-sizing: border-box;
  }
  .calque.alerte .modal .modal-content .modal-alert-title {
    padding: 0 2.5rem;
    box-sizing: border-box;
  }
  .calque.alerte .modal .modal-content .modal-alert-title h2 {
    margin-left: 0;
    text-align: center;
  }
  /* Le champ garde ses marges de 5 % (application.css, !important) : 90 % de large pour rester centré */
  .calque.alerte .modal .contenu_prompt form {
    width: 100%;
  }
  .calque.alerte .modal .contenu_prompt .sChampAlertePrompt {
    width: 90%;
    box-sizing: border-box;
  }
  .calque.alerte .modal .modal-content .btn-section {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
  }
  .calque.alerte .modal .modal-content .btn-section .clear {
    display: none;
  }
  .calque.alerte .modal .modal-content .btn-round {
    width: 100% !important;
    max-width: 280px;
    margin: 0 !important;
    box-sizing: border-box;
    justify-content: center;
  }
}

@media screen and (max-width: 900px) {
    .event-card {
        padding: 0 10px;
        margin-bottom: 30px;
    }
    .card-content {
        padding: 40px 24px;
        gap: 20px;
    }
}

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

    /* Carte : coins droits + barres dégradées gauche/droite */
    .event-card {
        width: 100%;
        padding: 0 15px;
        /* épaisseur des barres dégradées */
        margin-bottom: 20px;
        border-radius: 0;
    }

    .event-card .card-content {
        padding: 28px 24px;
        gap: 22px;
        border-radius: 0;
    }

    /* Header */
    .date-text {
        font-size: 18px;
    }

    .location-icon {
        width: 36px;
        height: 36px;
        border-radius: 8px;
    }

    .location-icon .material-icons {
        font-size: 20px;
    }

    /* Titre */
    .card-title-row {
        align-items: center;
        gap: 14px;
    }

    .card-title {
        font-size: 18px;
        line-height: 1.25;
    }

    /* Description : plus grande, plus foncée, graisse normale */
    .event-card .card-description {
        font-size: 16px;
        line-height: 1.45;
        font-weight: 400;
        color: #161616;
    }

    /* Infos (durée, formateur, lieu) */
    .event-card .card-meta {
        gap: 18px;
    }

    .event-card .card-meta li {
        font-size: 16px;
        line-height: 1.3;
        color: #161616;
    }

    .event-card .card-meta li .meta-icon {
        font-size: 20px;
    }

    .event-card .card-meta li.meta-location {
        color: #444;
        font-weight: 300;
    }

    /* Bouton */
    .event-card .card-cta {
        font-size: 15px !important;
        padding: 10px 10px 10px 22px !important;
        gap: 12px;
    }
}