@font-face {

  font-family: 'Montserrat';
  src: url('/templates/site/themes/defaut/fonts/Montserrat.ttf') format('truetype');
}

.cms-menu.cms-menu-haut {

  height: auto;
  float: none;
}

.cms-menu.cms-menu-haut ul:not(section.recherche_formation ul) {
  padding: 0px 0px 0px 30px;
  display: flex;
  position: relative;
}

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

  text-transform: uppercase;
}
h1, h2, h3 
{
  color: var(--c-secondaire);
}

h1 {
  font-size: 50px;
}

h2 {
  font-size: 40px;
}

h3 {
  font-size: 30px;
}

p {
  font-size: 25px;
}

@media (max-width: 768px) {
  h1 {
    font-size: 30px;
  }

  h2 {
    font-size: 25px;
  }

  h3 {
    font-size: 20px;
  }

  p {
    font-size: 16px;
  }
}

.hide 
{
  display: none !important;
}
[readonly]
{
    /* background:  #CFCFCF; */
    background: #e0e0e0;
}
body {

  margin: 0px;
  position: relative;
}
#contenu, input, textarea 
{
  font-family: "Montserrat" !important;
}
textarea, textarea:focus
{
  border: 1px solid var(--c-secondaire);
}
.select2-container {
  font-family: "Montserrat";
  display: inline-block;
  width: 100% !important;
}
.select2-dropdown {
  border: solid 1px #0000001f !important;
  border-radius: 0px 0px 2px 2px !important;
}

.select2-container--default .select2-selection--single {
  /* Ne pas remettre la ligne suivante car la bordure
  rouge disparait si champ invalide */
  /*border: solid 1px #0000001f !important;*/
  border-radius: 2px !important;
}

.select2-container--default
  .select2-selection--single
  .select2-selection__placeholder {

  font-weight: normal !important;
  font-size: 0.8rem !important;
  color: #757575 !important;
}

.select2 .selection:focus,
.select2-search__field:focus {
  outline: none !important;
}
span.select2.error .select2-selection {
    border: solid red 1px;
    margin-bottom: 5px;
}
/**
 * SWITCH
 */
 .switch {
  margin-top: 4px;
  margin-bottom: 4px;
}

.switch input[type="checkbox"] {
  height: 0;
  width: 0;
  visibility: hidden;
}

.switch .switch-action-name {
  float: left;
  font-size: 0.9rem;
  vertical-align: middle;
  margin-top: 13px;
}

.switch label {
  cursor: pointer;
  text-indent: -9999px;
  width: 50px;
  height: 26px;
  background: #fff;
  display: block;
  border-radius: 100px;
  position: relative;
  float: left;
  margin: 0px 10px 0px 10px;
}


.switch label:after {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 20px;
  height: 20px;
  background: var(--c-secondaire);
  border-radius: 90px;
  transition: 0.3s;
}

.switch input:checked + label {
  /* background: rgba(69, 190, 223, 0.20); */
  background: var(--c-secondaire);
}

.switch input:checked + label:after {
  left: calc(100% - 3px);
  transform: translateX(-100%);
  background: #fff;
}

.switch:after {
  content: "";
  clear: both;
  display: block;
}

/**
 * SWITCH MULTIPLE
 */
.switch-multiple {
  position: relative;
  border: solid 1px #fff;
  overflow: hidden;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  position: relative;
  padding: 7px 0px;
  margin-top: 4px;
  margin-bottom: 4px;
}

.switch-multiple > * {
  float: left;
}

.switch-multiple input[type="radio"] {
  display: none;
}

.switch-multiple label {
  color: #fff;
  display: block;
  width: calc(100% / 3.2);
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  cursor: pointer;
  z-index: 1;
  text-align: center;
}

.slider-option {
  background: #fff;
  opacity: 0.2;
  width: calc(100% / 3);
  position: absolute;
  -webkit-border-radius: 50px;
  -moz-border-radius: 50px;
  border-radius: 50px;
  top: 2px;
  bottom: 2px;
  -webkit-transition: all 0.2s ease;
  -moz-transition: all 0.2s ease;
  -o-transition: all 0.2s ease;
  -ms-transition: all 0.2s ease;
  transition: all 0.2s ease;
}

.first-state:checked ~ .slider-option {
  left: 2px;
}

.second-state:checked ~ .slider-option {
  left: calc((100% / 2) - (100% / 6));
}

.third-state:checked ~ .slider-option {
  left: calc(100% - (100% / 3) - 2px);
}

.read-more {

  text-decoration: none !important;
}

.home-research-responsive {

  position: absolute;
  bottom: 0;
 
}


.home-research-responsive img {

  width: 40px;
  margin: auto;
  z-index: 30;
}

.home-research-responsive button {

  z-index: 30;
}

.home-research-responsive {
  overflow:hidden;
  width: 100%;
  height: 130px;
  padding: 0px 30px 15px;
}

.home-research-responsive::after {

  content: '';
  background-color: var(--c-orange);
  position: absolute;
  right: -16px;
  left: -16px;
  height: 200px;
  border-radius: 100% 100% 0px 0px;
  z-index: 0;
}

.close-responsive-research {

  display: none;
}

input[type='text'], input[type='password'], input[type='number'],
input[type='email'], input[type='tel'], textarea {
  padding:8px;
  width:100%;
  /*border:1px solid #c9c9c9;*/
  -moz-border-radius:2px;
  -webkit-border-radius:2px;
  border-radius:2px;
  margin-bottom:5px;
  font-size:12px;
}

.clone {

  display: none !important;
}

.libelle_act a {

  text-decoration: none !important;
}

.flex-order-1 {

  order: 1;
}

.flex-order-2 {

  order: 2;
}

.flex-order-3 {

  order: 3;
}

.flex-order-4 {

  order: 4;
}

.flex-order-5 {

  order: 5;
}

#sub_top_header_connecte {

  margin-top: 5px;
}

.flex-wrap {

  flex-wrap: wrap;
}

#sub_top_header_connecte img {

  width: 15px;
  margin-right: 5px;
  vertical-align: middle;
}

#sub_top_header_connecte a:not(:last-child) {

  margin-right: 15px;
}

#sub_top_header_connecte a:last-child img  {

  width: 11px;
}

#sub_top_header_connecte a {

  text-decoration: none;
}

#sub_top_header_connecte a span {

  font-size: .8rem;
  color: #fff;
}



.right-separator {

  border-right: solid 1px var(--c-orange);
  padding: 0px 30px;
}

.btn-choice-account {

  width: 300px;
}

.btn_return_choice {

  margin-bottom: 30px !important;
}

.home-production-none {

  background-color: var(--c-orange) !important;
  flex-direction: column;
}

.home-production-none::after {

  display: none !important;
}

.top-header-production-none {

  margin-top: 20px;
}

.calque {
  visibility: hidden;
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  z-index: 100;
  background: rgba(0, 0, 0, 0.6);
  margin: auto;
  align-items: center;
  justify-content: space-around;
  -webkit-justify-content: space-around;
  display: flex;
  display: -webkit-flex;
  display: -moz-flex;
  display: -ms-flex;
  font-family: "Montserrat";
}
.calque div[id*="calque_"] {
  max-width: 100%;
  min-width: 20%;
  width: 100%;
  display: flex;
  height: 100vh;
}
.calque .modal {
  border-radius: 3px;
  margin: auto;
  background-color: #fff;
  max-width: 98%;
}
.calque .modal .modal-title {
  font-size: 1.2rem;
  border-bottom: solid 1px rgba(0, 0, 0, 0.07);
  display: flex;
  align-items: center;
  border-radius: 3px 3px 0px 0px;
  padding: 0.5rem 0.5rem 0.4rem 0.5rem;
  background: var(--c-secondaire);
  color: #70819a;
}
.calque .modal .modal-title h2 {
  font-size: 1.4rem;
  flex: 1;
  white-space: nowrap;
  margin-right: 10px;
  color: rgba(255, 255, 255, 0.7);
  padding: 0px;
}
#detail_formation h2:after, #detail_formation h1:after
{
  border-top: none !important;
}
#calque_inscription_formation h2
{
  font-size: 1.2rem;
}
.calque .modal .modal-title .close i {
  vertical-align: middle;
  color: rgba(255, 255, 255, 0.7);
}
.calque .modal .modal-title .close:hover {
  cursor: pointer;
}
.calque .modal .modal-title .minimize i {
  vertical-align: middle;
  color: rgba(255, 255, 255, 0.7);
}
.calque .modal .modal-title .minimize:hover {
  cursor: pointer;
}
.calque .modal .modal-title .maximize i {
  vertical-align: middle;
  color: rgba(255, 255, 255, 0.7);
}
.calque .modal .modal-title .maximize:hover {
  cursor: pointer;
}
.calque .modal .contenu_scroll {
  overflow-y: scroll;
  overflow-x: scroll;
  max-height: 80vh;
  width: 100%;
  max-width: 100%;
}
.calque .modal .contenu_scroll .modal-content {
  padding: 0.7rem;
}

.modal-content form  {
  width: 97%;
}
.modal-content select, .modal-content input, .modal-content input:focus, .modal-content .selection
{
  /* border: 1px solid var(--c-secondaire); */
  /* border-radius: 0px; */
  border-radius: 0.5rem;
}
.modal-content .column-6.column-sm-12
{
  margin-top: 5px;
  margin-bottom: 5px;
}
.modal-content label
{
  margin-top: 10px;
  margin-bottom: 5px;
  display: block;
}
.calque .modal .contenu_scroll .modal-content .modal-section {
  background-color: #f4f4f4;
  padding: 15px;
  -moz-border-radius: 2px;
  -webkit-border-radius: 2px;
  border-radius: 2px;
  margin-bottom: 15px;
  overflow: scroll;
}
.calque
  .modal
  .contenu_scroll
  .modal-content
  .modal-section
  .modal-section-title {
  border-bottom: solid 1px #e5e5e5;
  margin-bottom: 15px;
  padding: 0px 0px 10px 0px;
  text-align: center;
}
.calque .modal .contenu_scroll .modal-content .modal-section label {
  display: block;
  font-weight: bold;
  white-space: nowrap;
}
.calque .modal .contenu_scroll .modal-content .modal-section label span {
  font-weight: normal;
  color: #929292;
}
.calque .modal .form-action-bar {
  padding: 0.9rem;
  border-top: solid 1px rgba(0, 0, 0, 0.07);
  background: rgba(0, 0, 0, 0.05);
}
.calque .modal .form-action-bar:after {
  content: "";
  display: block;
  clear: both;
}

.multicalques {
  top: auto;
  bottom: auto;
  left: auto;
  right: auto;
  background: none;
}
.multicalques .modal {
  -webkit-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
  -moz-box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
  box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.75);
  width: 100%;
}

.contenu_alerte {
  width: 100%;
}

.calque.alerte .modal {
  width: 950px;
  position: relative;
}
.calque.alerte .modal .close {
  position: absolute;
  left: 20px;
  top: 25px;
  color: #fff;
}
.calque.alerte .modal .close:hover {
  cursor: pointer;
}
.calque.alerte .modal .modal-content {
  color: #fff;
}
.calque.alerte .modal .modal-content .modal-alert-title {
  width: 96%;
  float: right;
}
.calque.alerte .modal .modal-content .modal-alert-title h2 {
  font-size: 1.2rem;
  /* color: var(--c-secondaire) !important; */
  color: #272727 !important;
  margin-left: 0.5rem;
  /* Les h2 sont en table + nowrap (application.css) : un titre d'alerte long doit revenir à la ligne. */
  display: block;
  white-space: normal;
  overflow-wrap: break-word;
}
.calque.alerte .modal .modal-content .modal-alert-title h2::after {
 border: none;
}
/*.calque.alerte .modal .modal-content:before {
  width: 120px;
  display: block;
  float: left;
  font-family: "Material Icons";
  font-size: 7rem;
  height: auto;
  border-radius: 2px 0px 0px 2px;
  text-align: center;
  color: rgba(255, 255, 255, 0.8);
}
.calque.alerte .modal .modal-content:after {
  content: "";
  display: block;
  clear: both;
}*/
.calque.alerte .modal .modal-content .btn-section {
  display: block;
  width: 96%;
  float: right;
  margin-top: 15px;
}
.calque.alerte .modal .modal-content .btn-section:after {
  content: "";
  display: block;
  clear: both;
}
.calque.alerte .modal .modal-content .btn-round {
  text-decoration: none;
  width:45%;
  display:inline-block;
  text-align: center;
  padding: 8PX;
  margin: 8px;
  text-transform: uppercase;
  border-radius: 4px;
}
.calque.alerte .modal .contenu_alerte {
  width: 94.7%;
  float: right;
}
.calque 
{
  font-family: "Montserrat";
}
.calque.alerte.confirmation .modal {
  border: 3px solid var(--c-secondaire);
  background: #fff;
}
.calque.alerte.confirmation .modal *
{
  color: var(--c-secondaire); 
  font-weight: 200;
}
.calque.alerte.confirmation .btn-round {
  color:#fff !important; 
  background: var(--c-secondaire);;
}
/* Le fond du bouton étant déjà --c-secondaire, le texte doit rester blanc (sinon invisible). */
.calque.alerte.confirmation .btn-round.continue span {
  color: #fff !important;
}

.calque.alerte.erreur .modal {
  border: 3px solid var(--c-primaire);
  background: #fff;
}
.calque.alerte.erreur .modal * {
  color: var(--c-primaire)  !important; 
}

.calque.alerte.erreur .modal a.btn-primary span {
  color: #fff !important; 
}

.calque.alerte.erreur .modal a.btn-primary i.material-icons {
  color: var(--c-secondaire) !important; 
  background-color: #fff;
  color: #fff !important;
  border-radius: 0.4rem;
  color: var(--c-secondaire) !important;
}

.calque.alerte.erreur .btn-round {
  color:#fff !important; 
  background: var(--c-primaire);
}
.calque.alerte.succes .modal {
  border: 3px solid #4caf50;
  background: #fff;
}
.calque.alerte.succes .modal * { 
  /* color: #4caf50  !important;  */
  color: #272727;
}
.calque.alerte.succes .btn-round {
  color:#fff !important; 
  /* background: #4caf50; */
  background: var(--c-secondaire);
}

.modal-full {
  width: 100% !important;
}

.modal-large {
  width: 70% !important;
}

.modal-medium {
  width: 50% !important;
}

.modal-small {
  width: 30% !important;
}

.modal-auto {
  min-width: 0;
  width: auto;
}

.calque.alerte:not(.multicalques) {
  top: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  right: 0 !important;
}

.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: 70% !important;
}

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

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

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

#bloc_radio_wrap {
padding: 1em 2em;
border-radius: 1em;
}

#bloc_radio_wrap .bloc_radio {
display: grid;
grid-template-columns: 30px 1fr;
justify-content: center;
align-items: center;
gap: .5em;
margin-bottom: .5em;
}

#bloc_radio_wrap .bloc_radio:last-child {
margin-bottom: 0;
}

#bloc_radio_wrap .bloc_radio input {
margin: 0;
}

#bloc_radio_wrap .bloc_radio label {
text-align: left;
margin: 0;
}

a:hover, .btn:hover 
{
  opacity: 0.6 !important;
}
.btn
{
    background: var(--c-secondaire) !important;
    border: 1px solid var(--c-secondaire) !important;
}
.btn-primaire
{
    background: var(--c-secondary-light) !important;
    border: 1px solid var(--c-secondary-light) !important;
}
.btn-tertiaire
{
    color: #fff !important;
    border: 1px solid var(--c-secondaire) !important;
    background: var(--c-secondaire) !important;;
}
.btn-tertiaire i.material-icons
{
    color: #fff !important;
}


#calque_alerte_clone .un_bloc {
  border: none;
  border-radius: 1rem;
  padding: 1.6rem;
}

.calque.alerte.erreur .modal * {
  color: #272727 !important;
}

.calque.alerte.info .modal * {
  color: #272727 !important;
}

.calque.alerte .modal .close i {
  color: #fff !important;
  background: var(--c-secondaire);
  border-radius: 0.4rem;
}

.calque.alerte .modal div.btn-section i {
  color: var(--c-secondaire);
  background: #fff;
  border-radius: 0.4rem;
}

#calque_edition_formation {
  display: block !important;
}
/* Menu mobile (FCC-375) */
#menu_mobile {
  display: none;
  position: relative;
}

@media screen and (max-width: 1160px) {
  #menu_mobile {
    display: block;
  }

  /* Les deux sélecteurs ci-dessous sont renforcés exprès : les CSS du thème sont chargées deux fois
     (modele.html puis conf, ?v=1.1.11) dans un ordre qui varie selon la page, et application.css
     gagne sinon sur certaines pages (ex. /public/login). */

  /* Evite la ligne vide créée par ce bloc inline-block, vide en mobile */
  #div_header #div_option_header {
    display: block;
  }

  /* Hauteur du header identique sur toutes les pages (l'ordre de chargement des CSS varie) */
  header #div_header {
    padding: 5px 0 0;
  }
}

/* Burger à gauche, logo centré, profil à droite, sur une seule ligne */
.menu_mobile_barre {
  display: grid;
  grid-template-columns: 52px 1fr 52px;
  align-items: center;
  padding: 8px 16px;
}

.menu_mobile_logo {
  justify-self: center;
  display: block;
  line-height: 0;
}

.menu_mobile_logo img {
  width: 72px;
  height: 72px;
}

.menu_mobile_burger {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 7px;
  width: 52px;
  height: 52px;
  padding: 0;
  border: none;
  border-radius: 8px;
  background: transparent;
  cursor: pointer;
  /* Supprime l'attente du double-tap (zoom) sur mobile */
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}

.menu_mobile_burger:active,
.menu_mobile_burger[aria-expanded="true"] {
  background: var(--c-tertiaire);
}

.menu_mobile_burger span {
  display: block;
  width: 36px;
  height: 5px;
  border-radius: 800px;
  background: var(--c-primaire);
}

.menu_mobile_profil {
  justify-self: end;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: var(--c-primaire);
  text-decoration: none;
  touch-action: manipulation;
}

.menu_mobile_profil .material-icons {
  font-size: 28px;
  color: var(--c-blanc);
}

#menu_mobile_panneau {
  display: none;
  position: absolute;
  top: 100%;
  left: 16px;
  z-index: 100;
  width: min(360px, calc(100vw - 32px));
  max-height: calc(100vh - var(--hauteur-header-mobile) - 16px);
  max-height: calc(100dvh - var(--hauteur-header-mobile) - 16px);
  overflow-y: auto;
  padding: 24px 32px;
  box-sizing: border-box;
  border-radius: 40px;
  background: var(--c-tertiaire);
  box-shadow: 0 8px 24px rgba(var(--c-primary-hexa), 0.15);
}

#menu_mobile_panneau.open {
  display: block;
}

#menu_mobile_panneau a {
  touch-action: manipulation;
}

#menu_mobile_panneau ul {
  display: block;
  width: auto;
  margin: 0;
  padding: 0 !important;
  text-align: left;
  list-style: none;
}

#menu_mobile_panneau .menu_mobile_compte li {
  text-transform: none;
}

.menu_mobile_liens li a {
  display: block;
  padding: 12px 0;
  font-family: "Montserrat";
  font-size: 1.4rem;
  font-weight: 800;
  text-transform: uppercase;
  text-decoration: none;
  color: #1d1d1b;
}

.menu_mobile_compte li a {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 10px 0;
  font-family: "Montserrat";
  font-size: 1.3rem;
  text-decoration: none;
  color: var(--c-primaire);
}

.menu_mobile_icone {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--c-primaire);
}

.menu_mobile_icone .material-icons {
  font-size: 24px;
  color: var(--c-blanc);
}

.menu_mobile_libelle {
  position: relative;
}

#pastilleMenuMobile {
  position: absolute;
  top: 0;
  right: -12px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--c-error-color);
}