@charset "UTF-8";
/*
* ManageMe Version 3
* Author : @empiguet
*/
:root {
  --main-ui-color: #f3f3f4;
  --main-brand-color: #6d34c2;
  --main-brand-color-alpha: rgba(109, 52, 194, 0.4784313725);
  --main-body-color: #676a6c;
  --badge-bg: #c4c4c4;
  --main-ui-dark: #7b8186;
  --main-ui-dark-alpha: #7b81866f;
}

body,
html {
  font-family: "Open Sans", sans-serif;
  font-weight: 300;
  background-color: white;
  color: var(--main-body-color);
  height: 100vh;
  overflow: inherit;
  transition: all 0.2s ease;
  scrollbar-width: none;
  -ms-overflow-style: none;
}
body::-webkit-scrollbar,
html::-webkit-scrollbar {
  width: 0px;
}
body.date, body.login, body.promo,
html.date,
html.login,
html.promo {
  background-color: var(--main-ui-color);
  height: 100vh;
}

.mme-pointer {
  cursor: pointer;
}

.dv-date {
  max-width: 140px;
}

.dv-date input {
  text-align: center;
}

.form-inline .dv-date {
  max-width: none;
}

.numeric .mme-manager-session {
  cursor: pointer;
}

/* ********* BILL STATE CSS **** ********* */
/* INCONNU */
.mme-bill-consult-state- {
  background: #75787b;
  color: white;
}

/* 10	Ouverte */
.mme-bill-consult-state-10 {
  background: #c41617;
  color: white;
}

/* 15	Envoy� */
.mme-bill-consult-state-15 {
  background: #c41617;
  color: white;
}

/* 30	Partiellement pay�e */
.mme-bill-consult-state-30 {
  background: #c41617;
  color: white;
}

/* 40	Pay� */
.mme-bill-consult-state-40 {
  background: #84bd00;
  color: white;
}

/* 50	Annul� */
.mme-bill-consult-state-50 {
  background: #75787b;
  color: white;
}

.mme-bill-line-total {
  font-weight: bold;
  font-size: large;
}

/* ********* BILL PAYMENT CSS ** ********* */
.mme-payment-TooMuch {
  background-color: yellow;
}

.table-striped > tbody > tr.mme-payment-TooMuch:nth-of-type(2n + 1) {
  background-color: yellow;
}

.mme-payment-NotEnought {
  background-color: red;
  color: white;
}

.table-striped > tbody > tr.mme-payment-NotEnought:nth-of-type(2n + 1) {
  background-color: red;
  color: white;
}

/* ********* ********* ********* ********* */
td.mme-amount {
  text-align: right;
  padding-right: 2px;
}

.mme-doc-access {
  cursor: pointer;
}

.nna-extended-line {
  padding-left: 10px;
  padding-right: 10px;
}

.csspre {
  display: block;
  font-family: monospace;
  white-space: pre;
  margin: 1em 0;
}

.mme-reg-cancel {
  background-color: transparent;
}

.mme-cursus-arrow {
  font-size: 40px;
}

.img-icon {
  width: 20px;
  height: 20px;
}

.note-editor {
  border: 1px solid #ccc;
}

.mme-upsell-check {
  width: 20px;
}

.mme-bill-cancel {
  /*background-color : black;
    color : white;*/
}

.mme-panel-master-session {
  border-color: #676a6c;
}

.mme-panel-master-session > .panel-heading {
  background-color: #676a6c;
  border-color: #676a6c;
  color: #ffffff;
}

.mme-panel-child-session {
  border-color: #a7b1c2;
}

.mme-panel-child-session > .panel-heading {
  background-color: #a7b1c2;
  border-color: #a7b1c2;
  color: #ffffff;
}

.mme-checkbox-inline label:first-child {
  margin-left: 10px;
}

.mme-resume-artcile {
  /* color:white; */
}

.adr-com {
  width: 40px;
}

.profile-link {
  padding-top: 0px;
  padding-bottom: 0px;
  padding-left: 3px;
  padding-right: 3px;
}

.mme-dropzone {
  min-height: 190px;
}

.mme-quiz-action {
  font-size: 18pt;
}

.mme-clean-ibox {
  border-color: transparent;
}

.required {
  border-color: #ed5565;
}

[class*=col-].date-col {
  padding-left: 15px;
}

[class*=form-control].date-field {
  width: 100px;
}

.ndatebox {
  width: 100px;
}

input[type=text].ntimebox {
  width: 100px;
  text-align: center;
}

input[type=text].integer {
  width: 150px;
  text-align: center;
}

input[type=text].amount {
  width: 100px;
  text-align: right;
}

input[type=text].quantity {
  width: 100px;
  text-align: right;
}

input[type=text]:read-only {
  background-color: pink;
}

@media screen and (max-width: 767px) {
  .table-responsive > .table > tbody > tr > td.reg_center,
  .table-responsive > .table > tbody > tr > th.reg_center,
  .table-responsive > .table > tfoot > tr > td.reg_center,
  .table-responsive > .table > tfoot > tr > th.reg_center,
  .table-responsive > .table > thead > tr > td.reg_center,
  .table-responsive > .table > thead > tr > th.reg_center {
    white-space: normal;
  }
}
table.tblist th.c_identifier {
  width: 30px;
  text-align: center;
}

table.tblist td.c_identifier {
  text-align: right;
}

table.tblist th.h-state {
  width: 150px;
}

table.tblist th.c_active {
  width: 100px;
  text-align: center;
}

table.tblist td.c_active {
  text-align: center;
}

table.tblist th.c_date {
  width: 115px;
  text-align: center;
}

table.tblist td.c_date {
  text-align: center;
}

table.tblist th.c_datetime {
  width: 160px;
  text-align: center;
}

table.tblist td.c_datetime {
  text-align: center;
  white-space: nowrap;
}

table.tblist th.c_amount {
  text-align: right;
  width: 100px;
}

table.tblist td.c_amount {
  text-align: right;
}

table.tblist th.c_large_amount {
  text-align: right;
  width: 150px;
}

table.tblist td.c_large_amount {
  text-align: right;
}

table.tblist th.c_dorder {
  width: 70px;
  text-align: right;
}

table.tblist td.c_dorder {
  text-align: right;
}

table.tblist th.c_singleaction {
  width: 45px;
}

table.tblist td.c_singleaction {
  text-align: right;
  padding-right: 6px;
}

table.tblist th.c_twiceaction {
  width: 65px;
}

table.tblist td.c_twiceaction {
  text-align: right;
  padding-right: 6px;
}

table.tblist th.minfit {
  width: 1px;
}

table.tblist td.minfit {
  word-break: keep-all;
  white-space: nowrap;
  padding-left: 3px;
  padding-right: 5px;
}

table.tblist td.expandable-anchor {
  padding-left: 10px;
}

.criteria input[type=text] {
  width: 95%;
}

table.tblist th.c_center {
  text-align: center;
}

table.tblist td.c_center {
  text-align: center;
}

/* ************** MMe styles ******* */
i.mme-fa {
  font-size: 18px;
}

a.mme-fa {
  font-size: 14px;
}

.session-dispo {
  font-style: italic;
  padding-left: 10px;
}

.reg_center {
  text-align: center;
  width: 100px;
}

.upsell-desc {
  padding-left: 2px;
  padding-top: 90px;
  padding-bottom: 90px;
  background-color: #f8f8f9;
  color: #bebec3;
}

.lsn-details {
  cursor: pointer;
}

.mme-back {
  font-size: 19px;
}

.mme-link-access {
  background-color: transparent;
  border: 0px;
}

.full_img {
  width: 100%;
  height: 100%;
}

/* ************** Inspinia styles ******* */
.timeline-item .date {
  width: 95px;
}

[class*=form-control].fld-ext-data {
  width: 100%;
}

/* ************** Loading styles ******* */
.with-loading > .sk-spinner {
  display: none;
}

.with-loading.sk-loading > .sk-spinner {
  display: block;
  position: absolute;
  top: 40%;
  left: 0;
  right: 0;
  z-index: 2000;
}

.with-loading.sk-loading::after {
  content: "";
  background-color: rgba(255, 255, 255, 0.7);
  position: absolute;
  top: 0;
  left: 15px;
  right: 0;
  bottom: 0;
  z-index: 1000;
}

/* Corrections WonderWeb */
.touchspin1.form-control {
  text-align: center;
}

.nopadding {
  padding: 0 !important;
  margin: 0 !important;
}

.no-bg {
  background-color: transparent;
  padding-left: 0;
  padding-right: 0;
}

.mme-basket-line {
  background-color: #ffffff;
  color: inherit;
  padding: 0;
  border-color: var(--main-ui-color);
  border-image: none;
  border-style: solid solid none;
  border-width: 0;
}

.mme-basket-line-total {
  font-weight: bold;
}

.mme-basket-line::before {
  content: "";
  height: 1px;
  width: 100%;
  display: block;
  background-color: var(--main-ui-color);
  color: inherit;
  padding: 0;
  margin-bottom: 15px;
}

.mme-input-qt {
  display: inline-table;
}

/* .mme-basket-price {
	margin: 5px 0 20px;
	font-weight: normal;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
} */
.mme-basket-price-num {
  margin: 5px 0;
  font-weight: normal;
  flex-shrink: 0;
  padding: 0 5%;
}

.mme-basket-inclus {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}

.mme-component .btn-group {
  display: flex;
  flex-direction: column;
}

.mme-component .btn-group a {
  margin-right: 0;
  /* margin-bottom: 5px; */
}

.mme-basket-remove {
  margin-top: 5px;
}

.float-e-margins .btn {
  margin: 0;
}

@media (min-width: 768px) {
  .mme-basket-price {
    margin: 5px 0;
    font-weight: normal;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
  }
  .mme-component .btn-group {
    display: block;
    flex-direction: column;
  }
  .mme-component .btn-group a {
    margin-right: 5px;
    margin-bottom: 5px;
  }
}
@media (max-width: 768px) {
  .mme-basket-product-image {
    max-height: 100px;
    object-fit: cover;
    margin-bottom: 10px;
  }
}
/*
 * Responsive text aligning
 * http://ohryan.ca/2014/08/14/set-responsive-text-alignment-bootstrap-3/
 *
 * EDITED by Nino Škopac for StackOverflow (https://stackoverflow.com/q/18602121/1325575)
 */
.text-xs-left {
  text-align: left;
}

.text-xs-right {
  text-align: right;
}

.text-xs-center {
  text-align: center;
}

.text-xs-justify {
  text-align: justify;
}

@media (min-width: 768px) {
  .text-sm-left {
    text-align: left;
  }
  .text-sm-right {
    text-align: right;
  }
  .text-sm-center {
    text-align: center;
  }
  .text-sm-justify {
    text-align: justify;
  }
}
@media (min-width: 992px) {
  .text-md-left {
    text-align: left;
  }
  .text-md-right {
    text-align: right;
  }
  .text-md-center {
    text-align: center;
  }
  .text-md-justify {
    text-align: justify;
  }
}
@media (min-width: 1200px) {
  .text-lg-left {
    text-align: left;
  }
  .text-lg-right {
    text-align: right;
  }
  .text-lg-center {
    text-align: center;
  }
  .text-lg-justify {
    text-align: justify;
  }
}
/* Reference import */
/* Ajout d'un tableau de prestation dans les box */
/* voir : ecommerce_product_grid.html ligne 409 */
.product-prestations {
  background-color: #f8f8f9;
  padding: 1rem;
  margin: 0 auto;
  /* hauteur minimal et centrage avec flexbox */
  min-height: 222px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-prestations__image {
  position: absolute;
  z-index: 1;
}

.product-prestations__table {
  z-index: 2;
  width: 100%;
  font-size: 1.2rem;
}

.product-prestations__table .fa-check {
  color: #1ab394;
}

.product-prestations__table .fa-times {
  color: #ed5565;
}

.product-prestations__table td {
  padding: 0.2rem;
}

.product-prestations__table del {
  background-color: transparent;
  color: #ed5565;
}

/* Ajout d'une asterix autour des "form-group" */
/* voir : form_basic.html  ligne 430 */
.form-group.required {
  position: relative;
}

.form-group.required label:after {
  font-family: "Font Awesome 6 Pro";
  content: "\f069";
  display: inline;
  margin-left: 0.7rem;
  color: #ed5565;
  font-size: 1rem;
}

body.viewport-lg {
  position: absolute;
}

body {
  overflow-x: hidden;
}

/* The reason the media specific is on there is
   on a desktop i was having issues with when the modal would open
   all content on the page would shift from centered to left.
   Looked like crap. So this targets up to tablet size devices
   where you would need to scroll. There is still a slight shift
   on mobile and tablet but its really not much. */
.product-box {
  margin-bottom: 2rem;
}

/* /Registration/Cursus */
/* Bouton Aucun package selectionne */
.mme-upsell-select-lesson {
  padding: 20px;
  border: 1px solid #e7eaec;
  width: 100%;
}

@media screen and (max-width: 767px) {
  .table-responsive {
    margin: 0;
  }
}
/** le tableau des cours **/
@media screen and (min-width: 768px) {
  .lsn-filter {
    margin-right: 2rem;
  }
  #mme-reg-lesson-details .row div {
    width: auto;
    display: inline;
    padding: 0 0 0 2rem;
  }
}
#cours-liste {
  margin-top: 2rem;
}


.input-group-addon {
  border: 1px solid #e5e6e7;
}

/*******
**
**  NEW CART
**
**/
.mme-cart-item {
  position: relative;
}

.mme-cart-item::after {
  content: "";
  display: block;
  height: calc(100% - 30px);
  width: 2px;
  background: rgb(207, 207, 207);
  background: linear-gradient(180deg, rgb(207, 207, 207) 6%, rgb(255, 255, 255) 100%);
  position: absolute;
  top: 30px;
  left: 24px;
  z-index: 1;
}

.mme-cart-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  position: relative;
  z-index: 9;
  margin-bottom: 1rem;
}

.mme-cart-title {
  display: flex;
  align-items: center;
  flex-grow: 1;
}

/* fix chevauchement du titre et du bouton remove */
.mme-cart-metas {
  display: flex;
  position: relative;
  width: 100%;
  padding-bottom: 1rem;
  justify-content: space-between;
}

.mme-cart-operations {
  text-align: left;
  flex-grow: 0;
  margin-left: 50px;
  display: flex;
  flex-wrap: wrap;
}

.mme-cart-price {
  padding: 7px 0;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  flex-grow: 0;
  text-align: right;
  min-width: 136px;
}

.mme-cart-price1 {
  font-weight: normal;
}

.mme-cart-price2 {
  font-weight: normal;
  text-decoration: line-through;
  color: red;
  font-size: 80%;
}

.mme-cart-price3 {
  font-weight: bold;
}

.mme-input-qt {
  display: inline-table;
  width: 120px;
  margin: 0 1rem 1rem 0;
}

.mme-cart-content {
  padding-left: 45px;
  margin-right: 0;
}

.mme-cart-content-text {
  padding-bottom: 1rem;
}

.mme-cart-content-sessions {
  padding: 1rem;
  background-color: #f5f5f5;
  border-radius: 5px;
  border-width: 1px;
  border-color: #e7eaec;
  border-style: solid;
}

.mme-cart-content-sessions .btn-group a {
  margin-right: 5px;
  margin-bottom: 5px;
}

.mme-cart-content-sessions .btn-group a:first-child {
  margin-bottom: 0;
}

.mme-cart-content-sessions .btn-group a:last-child {
  margin-bottom: 0;
}

.mme-cart-content-sessions .btn-group {
  display: flex;
  flex-direction: column;
}

/* package content */
.mme-cart-pack-content > .mme-cart-content-text {
  padding-left: 50px;
  margin-right: 36px;
}

.mme-cart-pack-content .mme-cart-icon {
  padding: 0 1.3rem;
}

.mme-cart-pack-content h3 {
  font-size: 1.5rem;
}

.mme-cart-pack-content .mme-cart-item {
  padding-bottom: 3rem;
}

@media screen and (min-width: 481px) {
  .mme-cart-metas {
    width: auto;
    padding-top: 1rem;
    flex: 1;
    justify-content: space-between;
  }
  .mme-cart-price {
    width: 100px;
    padding: 7px 1rem;
  }
  .mme-cart-operations {
    flex-wrap: nowrap;
  }
  .mme-cart-content-sessions .btn-group {
    flex-direction: row;
  }
  .mme-cart-content-sessions .btn-group a {
    margin-bottom: 0;
  }
  .mme-cart-pack-content .mme-cart-metas {
    padding-top: 2px;
  }
}
.barba-container {
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-perspective: 1000;
  perspective: 1000;
}

.topmessage.alert {
  border-radius: 0.5em;
  margin: 0 0.5em 1em 0.5em;
  padding: 0.5em;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.topmessage.alert button.close {
  position: absolute;
  top: 0.1em;
  right: 0.1em;
}
.topmessage.alert svg {
  flex-shrink: 0;
}
.topmessage.alert i {
  color: var(--main-brand-color);
}
.topmessage.alert .alert-message {
  flex: 1;
  margin-left: 0.5rem;
  font-size: 12px;
  color: var(--main-body-color);
  margin-right: 1rem;
}
.topmessage.alert .alert-icon {
  color: var(--main-brand-color);
}
.topmessage.alert.alert-info {
  background-color: var(--main-ui-color);
  border: 1px solid var(--main-ui-color);
}

.alert-total {
  background-color: var(--main-ui-color);
  border: 1px solid var(--main-ui-color);
}

.img-wide {
  max-height: 400px;
  width: 100%;
  object-fit: cover;
}

@media (min-width: 768px) {
  .sections {
    margin-right: 1rem;
  }
}
.sections-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(100%, 1fr));
  gap: 0.5rem;
}
@media (min-width: 768px) {
  .sections-grid {
    grid-template-columns: repeat(auto-fill, minmax(50%, 1fr));
  }
}
@media (min-width: 1024px) {
  .sections-grid {
    grid-template-columns: repeat(auto-fill, minmax(33%, 1fr));
  }
}

.section {
  background-color: var(--main-ui-color);
  padding: 0 1rem 1rem;
  width: 100%;
  border-radius: 5px;
}
.section--nopadding {
  padding: 0 0 1rem 0;
}
.section--large {
  grid-column: span;
}
.section--middle  {
  grid-column: 1;
}
.section--gray {
  background-color: var(--main-ui-color);
}
.section--light {
  background-color: white;
}
.section__title {
  font-size: 1em;
  line-height: 1.2em;
  font-weight: bold;
  display: flex;
  justify-content: center;
  padding-top: 0;
  text-align: center;
  padding: 1rem 0;
  border-radius: 1rem;
  background-color: white;
}
@media (min-width: 768px) {
  .section__title {
    padding: 0.5rem 0;
  }
}
.section__title__all {
  color: var(--main-body-color);
  font-weight: normal;
}
.section__title__all:hover {
  color: var(--main-body-color);
  text-decoration: none;
}
.section__title span {
  color: var(--main-body-color);
  font-weight: normal;
}
.section__inner {
  overflow: auto;
  margin: 0;
  padding: 0;
}
.section__items {
  display: flex;
  justify-content: flex-start;
  width: fit-content;
}
.section .app-item a {
  color: var(--main-body-color);
  font-weight: normal;
}
.section .app-item a:hover {
  color: var(--main-brand-color);
  text-decoration: none;
  border-color: var(--main-brand-color);
}
.section .app-item__title {
  font-size: 1rem;
  text-transform: none;
  margin-bottom: 0;
  font-weight: normal;
}
.section .app-item__date {
  font-size: 0.75rem;
  text-transform: none;
  margin-bottom: 0;
  font-weight: normal;
}
.section .app-item__header-content {
  padding-bottom: 0;
}
.section .app-date__header__title {
  margin-bottom: 0.5rem;
  font-weight: normal;
}
.section .app-date-list img {
  margin-right: 0.5rem;
}
.section__teaser a {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  color: var(--main-body-color);
  font-weight: normal;
}
.section__teaser a img {
  margin-right: 1rem;
}
.section__teaser a:hover {
  color: var(--main-body-color);
  text-decoration: none;
}
.section__carousel {
  margin-left: -1rem;
  margin-right: -1rem;
}
.section.section-formation .app-item__title {
  text-align: center;
  font-size: 1.2rem;
}

@media (min-width: 768px) {
  .section {
    margin: 0 0 1rem 0;
    width: 100%;
  }
  .section.section-cours .app-item {
    margin-right: 0.5rem;
    width: auto;
    flex-direction: column;
  }
  .section.section-cours .app-item-row:last-child .app-item {
    margin-right: 0;
  }
  .section.section-cours .app-item__title {
    width: auto;
  }
  .section.section-cours .app-item__text {
    padding: 0 1rem 0 0;
  }
}
.js-main-sticky {
  background-color: white;
  border-top: 1px solid var(--main-ui-color);
}
.js-main-sticky:hover {
  cursor: pointer;
}

.layout-split-container {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .layout-split-container {
    flex-direction: row;
  }
}
.layout-split-container .layout-split-list {
  width: 100%;
}
@media (min-width: 768px) {
  .layout-split-container .layout-split-list {
    width: 50%;
  }
}
.layout-split-container .layout-split-details {
  width: 100%;
}
@media (min-width: 768px) {
  .layout-split-container .layout-split-details {
    width: 50%;
  }
}

.card--grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 780px) {
  .card--grid {
    grid-template-columns: repeat(5, 1fr);
  }
}
.card--grid.card--grid-prestation {
  grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 780px) {
  .card--grid.card--grid-prestation {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ITEM */
.app-item {
  justify-content: space-evenly;
  padding: 1em 0;
  position: relative;
  transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);
  overflow: hidden;
  background: white;
  padding: 1em;
  border-radius: 5px;
  flex-direction: column;
  color: var(--main-body-color);
  text-decoration: none;
  border: 1px solid var(--main-ui-color);
}
.app-item .item-content a {
  color: var(--main-body-color);
}
.app-item .item-content a:hover {
  text-decoration: none;
}
.item-small .app-item {
  background-color: transparent;
  margin: 1rem 0;
  border: none;
}
.app-item .item-groupe {
  display: block;
}
.app-item .item-groupe .item-groupe-inCart-message {
  display: none;
}
.app-item .item-groupe::before {
  transition: all 0.3s ease-in-out;
  opacity: 0;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 2px solid var(--main-brand-color-alpha);
}
.app-item .item-groupe:hover::before {
  opacity: 1;
}
.app-item .item-groupe-inCart::before {
  opacity: 1;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--main-brand-color-alpha);
}
.app-item .item-groupe-inCart .item-groupe-inCart-message {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 5rem;
}
.app-item .item-groupe-inCart .item-groupe-inCart-message span {
  background-color: var(--main-brand-color);
  color: white;
  padding: 1em;
  border-radius: 10px;
  font-weight: 500;
}
.app-item-row {
  position: relative;
  margin: 0 auto;
}
@media (max-width: 780px) {
  .app-item-row {
    padding: 0;
  }
}
.card--grid .app-item-row {
  width: 100%;
}
.app-item:hover {
  cursor: pointer;
}
.app-item.no-clic {
  pointer-events: none;
}
.animate-me .app-item.is-open {
  transform: scale(1.05);
  z-index: 10;
}
.app-item__header {
  display: flex;
  flex-direction: row;
  width: 100%;
}
.app-item__header-image {
  min-width: 25%;
  width: 25%;
}
@media (min-width: 960px) {
  .item-small .app-item__header-image {
    width: auto;
    min-width: auto;
  }
}
.item-small .app-item__header-image {
  min-width: 50px;
  width: 50px;
}
.app-item__header-content {
  flex: 1;
  padding: 0 0.5em 0.5em;
}
.app-item .app-item__image {
  max-width: 100%;
  height: auto;
  background-attachment: fixed;
  object-fit: cover;
  border-radius: 5px;
}
.app-item .app-item__image-container {
  width: 100%;
}
.app-item__badge {
  color: white;
  padding: 0.05em 0.5em;
  background-color: var(--badge-bg);
  border-radius: 5px;
  font-size: 0.7em;
  text-transform: uppercase;
  font-weight: 300;
  display: inline-block;
}
@media (min-width: 768px) {
  .app-item__badge {
    padding: 0.1em 0.7em;
    font-size: 0.8em;
  }
}
.app-item__cat {
  color: var(--main-brand-color);
  padding: 0.05em 0;
  font-size: 0.8em;
  display: inline-block;
}
@media (min-width: 768px) {
  .app-item__cat {
    padding: 0.1em 0;
    font-size: 0.8em;
  }
}
.app-item__title {
  font-size: 1.2em;
  text-transform: uppercase;
  font-weight: bold;
}
.app-item__more {
  position: relative;
  padding: 0;
  overflow: hidden;
  height: 0;
  opacity: 0;
  transition: all 1s cubic-bezier(0.075, 0.82, 0.165, 1);
}
.app-item__readless {
  position: absolute;
  right: 0;
  bottom: 0;
  color: currentColor;
}
.app-item__readless:hover {
  color: currentColor;
}
.item-small .app-item__text {
  color: var(--badge-bg);
  display: none;
}
.app-item__addtocart {
  position: absolute;
  right: 0.5em;
  left: auto;
  top: 0.5em;
  height: 44px;
  width: 44px;
  z-index: 10;
  display: block;
  color: var(--main-brand-color);
}
.app-item__addtocart:hover {
  color: var(--main-brand-color);
}
.app-item__addtocart svg {
  width: 100%;
  height: 100%;
}
.app-item__switch {
  position: absolute;
  right: 0;
  left: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
  display: block;
  color: var(--main-brand-color);
}
.app-item__switch:hover {
  color: var(--main-brand-color);
}
.app-item__switch svg {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  width: 40px;
  height: 40px;
}
.modal-body .app-item {
  margin: 0;
}

/* INLINE  par exemple dans les notes /documents*/
.card--inline .app-item a {
  display: flex;
  flex-direction: row;
  gap: 1rem;
}
.card--inline .app-item a .app-item__header {
  flex: 0;
  width: 100px;
  font-size: 2em;
}
.card--inline .app-item a .app-item__titre {
  font-weight: 500;
}
.card--inline .app-item a .app-item__content {
  flex: 1;
}
.card--inline .app-item a .app-item__meta {
  font-size: 0.8em;
}

.app-item__price {
  margin: 1rem 0;
  font-size: 1.1em;
  line-height: 1.3;
}
.app-item__price-text {
  font-weight: 500;
}
.app-item__price-info {
  font-size: 0.8em;
}
.item-small .app-item__price {
  font-size: 0.9em;
  margin-bottom: 0;
}

.app-item__title {
  font-size: 1em;
  line-height: 1.2em;
}
@media (min-width: 768px) {
  .app-item__title {
    font-size: 1.2em;
  }
}
.item-small .app-item__title {
  font-size: 0.9em;
  width: auto;
}
.card--grid .app-item__title {
  font-size: 1em;
  font-weight: normal;
  text-transform: none;
}

.card--grid .app-item.flat {
  padding: 0;
}
.app-item.flat a {
  color: var(--main-body-color);
}
.app-item.flat a:hover {
  text-decoration: none;
  color: var(--main-brand-color);
}
.app-item.flat a:hover i {
  color: var(--main-brand-color);
}

.card--grid .app-item__header {
  background-color: white;
  padding: 1rem;
  text-align: center;
  display: block;
}
.card--grid .app-item__header i {
  font-size: 3rem;
  color: var(--main-brand-color-alpha);
}

.card--grid .app-item__content {
  background-color: var(--main-ui-color);
  padding: 1rem;
}

.card--grid .app-item__surtitre {
  font-size: 0.8em;
  font-weight: normal;
  text-transform: none;
}

.card--grid .app-item__titre {
  margin-bottom: 1rem;
}

.card--grid .app-item__meta {
  font-size: 0.8em;
  font-weight: normal;
  text-transform: none;
}

.app-item__text p {
  font-size: 0.8em;
  margin-bottom: 0;
}
@media (min-width: 768px) {
  .app-item__text p {
    font-size: 1em;
  }
}

@media (min-width: 768px) {
  .app-item {
    display: flex;
    color: var(--main-body-color);
    text-decoration: none;
  }
  .app-item__badge {
    font-size: 0.8em;
  }
  .app-item__header {
    flex-direction: row;
    align-items: start;
  }
  .card--horizontal .app-item__header {
    flex-direction: row;
  }
  .card--horizontal .app-item__header-content {
    margin-left: 1em;
    margin-top: 0;
  }
}
@media (min-width: 1024px) {
  .app-item .app-item__image {
    width: 100%;
    max-width: 100%;
    height: auto;
  }
  .item-small .app-item .app-item__image {
    max-width: 80px;
  }
  .card--vertical .app-item .app-item__image {
    width: 100%;
    max-width: 100%;
    height: auto;
  }
}
.trend {
  position: relative;
  box-sizing: border-box;
  box-shadow: rgba(111, 111, 112, 0.1607843137) 0px 2px 16px 0px, rgba(111, 111, 112, 0.1607843137) 0px 1px 2px 0px;
  transition: opacity 1s cubic-bezier(0.215, 0.61, 0.355, 1) 0s, transform 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s, box-shadow 0.4s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
  -webkit-font-smoothing: subpixel-antialiased;
  opacity: 1;
  cursor: grab;
  margin: 1rem;
  border-radius: 0.3rem;
}

.flat {
  margin: 0.5rem;
}

.app_item-content-small {
  flex: 1;
  padding: 0 0.5em 0.5em;
  position: relative;
  gap: 0.25rem;
}
.app_item-content-small .icon-continue {
  position: absolute;
  top: 0;
  right: 0;
  color: var(--main-brand-color);
  width: 1.5rem;
  height: 1.5rem;
}
.app_item-content-small .icon-continue svg {
  width: 100%;
  height: 100%;
}

/* DATE Single */
.app-date {
  margin: 0;
  padding: 0;
  /* Liste des dates disponibles */
}
.app-date-single {
  display: flex;
  flex-direction: column;
  padding: 0;
  max-width: 1024px;
  margin: 0 auto;
}
.app-date__header {
  background-color: white;
  padding: 0;
  margin: 0;
}
.app-date__header__title {
  width: 100%;
}
.app-date__content {
  background-color: white;
  margin: 0;
  padding: 2rem;
  /* Les infos en liste <ul> */
}
@media (min-width: 768px) {
  .app-date__content {
    height: 100%;
    width: 100%;
  }
}
.details-ajax .app-date__content {
  padding-bottom: 1rem;
  padding-top: 0;
}
.app-date__content .content__list {
  border-top: 1px solid var(--main-ui-color);
  margin: 0 auto;
  padding: 0;
  list-style: none;
  font-size: 0.8rem;
}
.app-date__content .content__list li {
  border-bottom: 1px solid var(--main-ui-color);
  margin: 0;
  padding: 0.5em 0;
}
.app-date__content .content__list .label {
  width: 25%;
  min-width: 8em;
  display: inline-block;
}
.app-date__footer {
  background-color: var(--main-ui-dark);
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
}
.app-date .icon-product {
  margin-right: 1rem;
}
.app-date__dates {
  margin: 0 auto;
  padding: 2rem;
  width: 100%;
  background-color: var(--main-ui-color);
}
.app-date__dates .date {
  font-weight: bold;
}

@media (min-width: 768px) {
  .app-date__dates .date {
    font-weight: bold;
  }
}
.app-date-list__place,
.app-date-list__lang {
  display: flex;
  margin-top: 0.5rem;
}

.app-date-list__actions {
  display: flex;
  justify-content: flex-end;
}
@media screen and (min-width: 768px) {
  .app-date-list__actions {
    flex-direction: row;
  }
}
.app-date-list__actions a {
  color: var(--main-body-color);
  margin-bottom: 0.5rem;
}
.app-date-list__actions a:hover rect {
  fill: var(--main-body-color);
  stroke: var(--main-body-color);
}
.app-date-list__actions a:hover path {
  fill: white;
}
.app-date-list__actions a.voir_les_seances svg circle {
  stroke: var(--main-brand-color);
}
.app-date-list__actions a.voir_les_seances svg path {
  fill: var(--main-brand-color);
}

.app-date-list__price {
  display: flex;
  width: 50%;
  flex-direction: column;
  align-items: flex-end;
  justify-content: space-between;
  padding: 1rem 0;
}
.app-date-list__price .btn {
  margin-top: auto;
}

.app-date-list__link {
  transform: rotate(180deg);
  color: var(--main-brand-color);
}
.app-date-list__link svg {
  width: 3rem;
  height: 3rem;
}

/* liste dates dans le panier*/
.app-date-list--row {
  width: 100%;
  font-size: 0.9em;
  border-bottom: 1px solid var(--main-ui-dark-alpha);
  margin-bottom: 1rem;
  padding: 1rem 0;
}
.app-date-list--row:last-child, .app-date-list .app-date-list--row {
  border-bottom: none;
}
.mme-cart-item .app-date-list--row {
  width: 100%;
  justify-content: flex-start;
  margin-bottom: 1rem;
}

.date-list-no-edit .modifier_la_date {
  display: none;
}

.icon-date {
  margin-right: 0.5rem;
}

@media (min-width: 768px) {
  .app-date__footer {
    width: 100vw;
    margin: 0;
  }
  .app-date-list--row {
    width: 50vw;
    display: flex;
    justify-content: space-around;
    flex: 1;
  }
  .modal-body .app-date-list--row, .mme-cart-item .app-date-list--row {
    width: 100%;
    justify-content: space-between;
    margin-bottom: 1rem;
  }
  .app-date-list__place,
  .app-date-list__lang {
    margin-top: 0;
    margin-left: 0.5rem;
  }
  .app-date-list__price {
    font-size: 0.9em;
    flex-direction: row;
    align-items: center;
    width: auto;
  }
  .app-date-list__price span {
    pointer-events: none;
    padding: 0 1rem;
  }
  .app-date-list__price .btn {
    pointer-events: none;
    margin-top: 0;
  }
}
.app-date-list.is-open {
  background-color: var(--main-ui-color);
}
@media (min-width: 768px) {
  .app-date-list.is-open {
    transform: scale(1.05);
    z-index: 10;
  }
}

#dates-cours-agenda-calendar .event-info h6,
#calendar-event-individuel .event-info h6 {
  display: none;
}

#dates-cours-agenda-calendar {
  background-color: white;
}

.app-cart__footer .js-cart-comment {
  display: none;
}

.edit_date {
  display: none;
}

/* Product Single */
.app-product {
  padding: 0 1rem;
  /* Les infos en liste <ul> */
  /* Liste des dates disponibles */
}
@media (min-width: 768px) {
  .app-product {
    padding: 0 1rem;
  }
}
.app-product-single {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .app-product-single {
    flex-direction: row;
    height: 100%;
    width: 100vw;
    overflow: auto;
    background-color: white;
    padding-bottom: 100px;
    margin: 0;
    gap: 1rem;
  }
}
@media (min-width: 768px) {
  .mm_dialog .app-product-single {
    padding: 1rem;
  }
}
.app-product__header {
  background-color: white;
  padding: 1rem 1rem 0 0;
  margin: 0;
}
@media (min-width: 768px) {
  .app-product__header {
    height: auto;
    padding: 1rem 0;
    margin: 0;
  }
}
.app-product__header__title {
  font-size: 1.2em;
  font-weight: bold;
  display: flex;
  align-items: center;
  width: 100%;
}
.app-product__content {
  background-color: white;
}
@media (min-width: 768px) {
  .app-product__content {
    width: 50vw;
    height: 100%;
    padding: 0;
    margin: 0;
    max-width: 770px;
    margin-left: auto;
  }
}
.app-product__content-reverse {
  order: 1;
}
.app-product__content-fullwidth {
  order: 1;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0 auto;
  max-width: 960px;
  margin-left: auto;
}
@media (min-width: 768px) {
  .app-product__content-fullwidth {
    padding: 0 2rem;
    width: 100vw;
  }
}
.app-product__content .app-item.trend {
  margin-left: 0;
  margin-right: 0;
}
.app-product__more {
  margin-top: 1rem;
  margin-bottom: 5rem;
  order: 1;
}
@media (min-width: 768px) {
  .app-product__more {
    order: 2;
    width: 50vw;
    height: 100%;
    padding: 1rem 2rem 10em 2rem;
    margin: 0;
    overflow: auto;
    max-width: 770px;
    margin-right: auto;
  }
}
.app-product__more .app-item.trend {
  margin-left: 0;
  margin-right: 0;
}
@media (min-width: 768px) {
  .mm_dialog .app-product__more {
    padding: 1rem;
  }
}
.app-product__price {
  align-items: center;
  padding: 1rem;
  background-color: var(--main-ui-color);
}
.app-product__price .mme-input-qt {
  margin: 0;
}
.app-product__image {
  display: flex;
  position: relative;
  width: 100%;
  justify-content: center;
  background-color: var(--main-ui-color);
  border-radius: 0.5rem;
  margin: 0 0 1rem;
}
@media (min-width: 768px) {
  .app-product__image {
    margin: 1rem 0;
  }
}
.app-product__image img {
  margin: 0 auto;
  height: 25vh;
  width: 100vw;
  object-position: center;
}
.app-product__image img.contain {
  object-fit: contain;
}
.app-product__image img.cover {
  object-fit: cover;
}
@media (min-width: 768px) {
  .app-product__image img {
    width: 100%;
    height: 33vh;
    object-position: center;
  }
  .app-product__image img.contain {
    object-fit: contain;
  }
  .app-product__image img.cover {
    object-fit: cover;
  }
}
.app-product__image__title {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: flex;
  height: 100%;
  width: 100%;
  justify-content: flex-start;
  align-items: center;
  padding: 0 1rem;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .app-product__image__title {
    padding: 0 2rem;
  }
}
.app-product__image__title h2 {
  color: white;
  max-width: 1510px;
  margin: 0 auto;
  background-color: transparent;
  padding: 0.5rem;
  font-size: 2rem;
  font-weight: lighter;
  border-radius: 5px;
  text-align: center;
  width: 100%;
  position: relative;
  z-index: 4;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .app-product__image__title h2 {
    font-size: 3em;
    text-align: left;
  }
}
.app-product__image__title::after {
  content: "";
  height: 100%;
  width: 100%;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.33);
  position: absolute;
  top: 0;
  left: 0;
}
.app-product__footer {
  background-color: var(--main-ui-color);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  flex-direction: column;
  padding: 1rem;
}
@media (min-width: 768px) {
  .app-product__footer {
    margin-left: 0;
    width: 100vw;
    border-top: 1em solid white;
    border-bottom: 1em solid white;
    padding: 0 0;
    flex-direction: row;
  }
}
.app-product .icon-product {
  margin-right: 1rem;
}
.app-product .content__list {
  border-top: 1px solid var(--main-ui-color);
  margin: 0 -1rem;
  padding: 0 1rem;
  list-style: none;
}
.app-product .content__list li {
  border-bottom: 1px solid var(--main-ui-color);
  margin: 0 -1rem;
  padding: 0 1rem;
}
.app-product .content__list .label {
  width: 25%;
  min-width: 8em;
  display: inline-block;
  color: var(--badge-bg);
}
.app-product__dates {
  margin: 0 -1rem;
  padding: 2rem;
  padding-bottom: 100px;
}
.app-product__dates .date {
  font-weight: bold;
  font-size: 1rem;
}
.app-product__price {
  background-color: var(--main-ui-color);
  padding: 1rem;
  align-items: center;
}
.app-product__price .mme-input-qt {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .app-product__dates .date {
    font-weight: bold;
    font-size: 120%;
  }
}
.app-product-list__place {
  display: flex;
  margin-top: 1rem;
}

/* liste dates */
.app-product-list--row {
  width: 100%;
  font-size: 80%;
}
.mme-cart-item .app-product-list--row {
  width: 100%;
  justify-content: flex-start;
  margin-bottom: 1rem;
}

.icon-product {
  margin-right: 0.5rem;
}

@media (min-width: 768px) {
  .app-product-list--row {
    width: 50vw;
    display: flex;
    justify-content: space-around;
    flex: 1;
    font-size: 100%;
  }
  .mme-cart-item .app-product-list--row {
    width: 100%;
    justify-content: flex-start;
    margin-bottom: 1rem;
  }
  .app-product-list__place {
    margin-top: 0;
    margin-left: 1rem;
  }
}
/* LOGIN */
.app-page__logo {
  height: 23vh;
  background-color: white;
  padding: 0 1rem;
  margin: -1rem 0 0 0;
  overflow: hidden;
}
.app-page__form {
  padding: 1rem;
}

@media (min-width: 768px) {
  .app-login,
  .app-page {
    display: flex;
    justify-content: space-between;
    flex: 1;
  }
  .app-login .app-page__logo,
  .app-page .app-page__logo {
    flex: 1;
    order: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: auto;
    width: 50%;
  }
  .app-login .app-page__logo svg,
  .app-page .app-page__logo svg {
    width: 100%;
    margin: 0;
    height: 100%;
  }
  .app-login .app-page__logo .message,
  .app-page .app-page__logo .message {
    display: none;
  }
  .app-login .app-page__form,
  .app-page .app-page__form {
    flex: 1;
    padding: 4rem;
    order: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 50%;
    max-width: 600px;
  }
  .app-login .app-page__form form,
  .app-page .app-page__form form {
    min-height: auto;
  }
}
/* Boutons */
/* html generic */
button {
  border: 0;
  background-color: transparent;
}

#mm-app .btn-primary {
  border: var(--main-brand-color);
}

.btn {
  position: relative;
  z-index: 0;
  border-radius: 5px;
  /* navigation footer */
}
.btn.btn-dropdown {
  font-weight: 300;
  /* force pour ios */
  border-radius: 0 !important;
  -webkit-appearance: none;
}
.btn.btn-primary {
  background-color: var(--main-brand-color);
  color: white;
}
.btn.btn-primary i {
  color: white;
}
.btn.btn-tertiary {
  background-color: var(--main-ui-color);
  border: 1px solid var(--badge-bg);
}
.btn.btn-tertiary-light {
  background-color: var(--main-ui-color);
  border: 1px solid var(--main-ui-color);
}
.btn.btn-tertiary-light:hover {
  border: 1px solid var(--main-brand-color);
  background-color: var(--main-brand-color);
  color: white;
}
.btn.btn-brand-alpha {
  background-color: white;
  border: 1px solid white;
}
.btn.btn-brand-alpha:hover {
  border: 1px solid var(--main-brand-color);
  background-color: var(--main-brand-color);
  color: white;
}
.btn.btn-secondary {
  background-color: white;
  color: var(--main-body-color);
  border-color: var(--main-body-color);
  box-shadow: 0px 2px 5px var(--badge-bg);
}
.btn.btn-secondary.btn-alt {
  border-color: var(--main-brand-color);
  box-shadow: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  box-shadow: 0 0 0 0.5em white;
}
.btn .btn-back {
  background-color: transparent !important;
  color: var(--main-body-color) !important;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.btn.btn-alt {
  color: var(--main-brand-color);
}
.btn.btn-prev {
  background-color: transparent !important;
  color: var(--main-body-color) !important;
  padding: 0.5em 2em;
  position: relative;
}
.btn.btn-prev:before {
  content: " " url("../img/btn/arrow-prev-dark.svg");
  display: inline-block;
  margin-right: 1rem;
}
.btn.btn-next {
  box-shadow: 0 0 0 0.5em white;
  padding: 0.5em 2em;
  position: relative;
}
.btn.btn-next:after {
  content: " " url("../img/btn/arrow-next.svg");
  display: inline-block;
  margin-left: 1rem;
}
.btn.btn-icon {
  box-shadow: 0 0 0 0.5em white;
  padding: 0.5em 2em;
  position: relative;
}
.btn.btn-icon i {
  display: inline-block;
  margin-left: 1rem;
}
.btn.btn-outline {
  box-shadow: 0 0 0 0.5em white;
  padding: 0.5em 2em;
  position: relative;
}
.btn.btn--notext:after, .btn.btn--notext:before {
  margin: 0 !important;
}
.btn.btn-arrow {
  background-color: transparent;
  color: var(--main-brand-color);
  border-color: var(--main-brand-color);
  box-shadow: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.3rem 0.7rem;
}
.btn.btn-arrow i {
  display: inline-block;
  height: 10px;
  width: 9px;
  background-image: url("../img/arrow-simple.svg");
  background-repeat: no-repeat;
  margin-left: 1.5rem;
}
.btn.btn-fa {
  background-color: transparent;
  border-color: none;
  box-shadow: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.3rem 0;
}
.btn.btn-fa i {
  display: inline-block;
  margin-right: 0.5rem;
  color: var(--main-brand-color);
}
.btn.btn-mainmenu {
  background-color: var(--main-brand-color);
  color: white;
  border-color: var(--main-brand-color);
  display: flex;
  justify-content: center;
  align-items: center;
}
.btn--small {
  font-size: 11px;
  font-weight: medium;
  padding: 3px 1rem;
}
@media (min-width: 768px) {
  .btn--small {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
  }
}
.btn--hollow {
  background-color: transparent !important;
  color: var(--badge-bg) !important;
  border: none;
}
.btn--hollowOnDark {
  background-color: rgba(255, 255, 255, 0.1) !important;
  color: var(--main-ui-color) !important;
  border: 0;
}
.btn--rotate180 {
  transform: rotate(180deg);
}
.btn.btn-dark {
  background-color: var(--main-body-color) !important;
  color: white !important;
}
.btn.btn-panier {
  display: flex;
  align-items: center;
  gap: 1em;
  box-shadow: 0 0 0 0.5em white;
  background-color: var(--main-brand-color);
  padding-left: 2.5em;
  padding-right: 1rem;
  width: auto;
  margin: 0 auto;
}
.btn.btn-panier .icon-cart {
  background-color: var(--main-body-color);
  border-radius: 100%;
  padding: 0.5em;
  position: absolute;
  left: -2rem;
  box-shadow: 0 0 0 0.5em white;
}
.btn.btn-panier .icon-cart svg {
  width: 2.2rem;
  height: 2.2rem;
}
.btn.btn-panier .icon-cart svg .number-bg,
.btn.btn-panier .icon-cart svg circle {
  fill: var(--main-brand-color);
}
.btn.btn-panier .bouton-label {
  color: white;
  line-height: 1.2;
  font-size: 0.8em;
  text-align: left;
}
.btn.btn-panier .bouton-label strong {
  font-size: 1rem;
}

/* kill default bootstrap classes */
.btn-primary:not(:disabled):not(.disabled).active,
.btn-primary:not(:disabled):not(.disabled):active,
.show > .btn-primary.dropdown-toggle {
  background-color: var(--main-brand-color);
  border: var(--main-brand-color);
}

.btn-primary:not(:disabled):not(.disabled).active:focus,
.btn-primary:not(:disabled):not(.disabled):active:focus,
.show > .btn-primary.dropdown-toggle:focus {
  box-shadow: none;
}

.form-control {
  border: 1px solid var(--main-ui-color);
}

.btn-white {
  color: inherit;
  background: white;
  border: 1px solid var(--main-ui-color);
}

/* bouton poubelle */
.mme-basket-remove {
  color: var(--main-brand-color) !important;
}
.mme-basket-remove:hover svg path {
  fill: white;
}
.mme-basket-remove:hover svg rect {
  stroke: var(--main-brand-color);
  fill: var(--main-brand-color);
}

/* bouton edit */
.mme-basket-edit {
  color: var(--main-brand-color);
}
.mme-basket-edit:hover svg path {
  fill: white;
}
.mme-basket-edit:hover svg rect {
  stroke: var(--main-brand-color);
  fill: var(--main-brand-color);
}

.catalogue-content-datas,
.catalogue-subnav {
  width: 100%;
}
@media (min-width: 768px) {
  .catalogue-content-datas,
  .catalogue-subnav {
    max-width: 1280px;
    margin: 0 auto;
  }
}

.catalogue-content-loading {
  height: 100px;
  width: 100%;
  background-position: center;
  background-repeat: no-repeat;
  margin: 10vh 0;
}
.catalogue-content-loading svg path {
  fill: var(--main-ui-color);
}

.catalogue-subnav {
  display: flex;
  flex-direction: column;
  padding: 0.5rem;
}
@media (min-width: 768px) {
  .catalogue-subnav {
    position: relative;
  }
}
.catalogue-subnav-row {
  display: flex;
  width: 100%;
  justify-content: flex-start;
  gap: 1rem;
}

.catalogue-subnav-filters {
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
@media (min-width: 768px) {
  .catalogue-subnav-filters {
    flex-direction: row;
    align-items: center;
  }
}
.catalogue-subnav-filters .filter-settings {
  align-self: right;
}
@media (min-width: 768px) {
  .catalogue-subnav-filters .filter-settings {
    align-self: center;
  }
}

.catalogue-subnav-tools {
  display: flex;
}
@media (min-width: 768px) {
  .catalogue-subnav-tools {
    justify-content: center;
    align-items: center;
    margin: auto;
  }
}

.catalogue-filters {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  order: 1;
  padding: 15px 0 0;
  border-top: 1px solid var(--main-ui-color);
  background-color: var(--main-ui-color);
  margin-bottom: 1rem;
}
.catalogue-filters label {
  display: block;
  font-weight: bold;
  font-size: 0.8rem;
}
.catalogue-filters .btn.btn-outlined {
  font-weight: normal;
  width: 100%;
  display: flex;
  justify-content: space-between;
  font-size: 1rem;
  background-color: white;
}

.catalogue-filters-form {
  font-size: 14px;
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  justify-content: space-evenly;
  width: 100%;
}
.catalogue-filters-form fieldset {
  padding: 0 1em;
  flex: 1;
}

.select2-container {
  width: 100%;
}
.select2-container input.select2-search__field {
  height: auto;
}

@media (min-width: 768px) {
  .catalogue-filters {
    margin-top: 1rem;
    margin-bottom: 0;
  }
  .catalogue-filters .btn.btn-outlined {
    min-width: 10vw;
    font-size: 1em;
  }
  .catalogue-filters-form {
    flex-direction: row;
    width: auto;
    margin: 0 auto 15px;
  }
  .catalogue-filters-form fieldset {
    margin-right: 16px;
  }
  .select2-container {
    width: 100%;
  }
  .select2-container input.select2-search__field {
    height: auto;
  }
}
/*

 FILTERS EXTRAS

*/
.dropdown-toggle::after {
  display: none;
}

.btn-outlined svg,
.btn-dropdown svg {
  fill: var(--main-body-color);
  margin: 0 0 0 0px;
}

@media (min-width: 768px) {
  .btn-dropdown svg,
  .btn-outlined svg {
    margin: 0 0 0 15px;
  }
}
.dropdown-toggle.btn-dropdown svg {
  padding: 5px 0;
}

.dropdown-toggle.btn-outlined svg {
  padding: 5px 0;
}

.dropdown-center .dropdown-toggle {
  width: auto;
}
.dropdown-center .dropdown-menu {
  text-align: center;
}

.btn-outlined {
  border: 1px solid var(--main-ui-color);
  font-weight: bold;
  color: var(--main-body-color) !important;
}

.btn-dropdown {
  border-bottom: 1px solid var(--main-ui-color);
  color: var(--main-body-color) !important;
  border-radius: 0 !important;
  padding-left: 0;
  width: 100%;
  text-align: left;
  margin-bottom: 0;
  display: flex;
  justify-content: space-between;
  box-shadow: none;
}

.dropdown-toggle {
  border-radius: 0 !important;
}

form fieldset .clear-filter {
  display: none;
  float: right;
  font-size: 12px;
  padding-top: 2px;
  color: var(--main-brand-color);
}
form fieldset.fieldset-active .clear-filter {
  display: block;
}

.dropdown.show .btn-dropdown-caret {
  -webkit-transform: rotate(-180deg);
  -ms-transform: rotate(-180deg);
  transform: rotate(-180deg);
}
.dropdown .dropdown-menu {
  font-weight: normal;
  font-size: 12px;
  color: var(--main-body-color);
  width: 100%;
  min-width: fit-content;
}
.schema-select .dropdown .dropdown-menu {
  width: auto;
  font-size: 1rem;
}
.dropdown .dropdown-menu .dropdown-item:focus,
.dropdown .dropdown-menu .dropdown-item:hover {
  background-color: var(--main-ui-color);
}

/*

 FILTERS CATEGORIES

*/
.filter-categories:not(.allow-overflow) {
  overflow-x: auto;
  overflow-y: hidden;
  position: relative;
}
.filter-categories:not(.allow-overflow)::-webkit-scrollbar {
  display: none;
}

.filter-categories:not(.allow-overflow) ul {
  overflow-x: auto;
  overflow-y: hidden;
}

.filter-categories {
  padding: 15px 0;
  border-bottom: 1px solid var(--main-ui-color);
  margin: 0 0 15px;
  display: flex;
  align-items: center;
}
@media (min-width: 768px) {
  .filter-categories {
    margin: 0;
    border: 0;
    padding: 0;
  }
}
.filter-categories .category a {
  display: flex;
  flex-direction: column;
  align-items: center;
}
@media (min-width: 768px) {
  .filter-categories .category a {
    margin-right: 1rem;
  }
}
.filter-categories .category {
  display: inline-block;
}

.filter-types {
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
}
.filter-types .dropdown-toggle {
  padding: 0.5rem 0.8rem;
  font-size: 1rem;
  line-height: 1.5;
  color: var(--main-body-color);
  font-size: 14px;
  font-weight: bold;
}

@media (min-width: 768px) {
  .filter-categories:not(.allow-overflow) {
    padding: 0.5rem 0;
  }
  .filter-categories:not(.allow-overflow) ul {
    margin: 0;
    display: flex;
    justify-content: flex-start;
  }
  .filter-settings {
    order: 3;
  }
}
.scroll {
  position: absolute;
  top: 0;
  height: 100%;
  width: 30px;
  display: flex;
  align-items: center;
}

.scroll-forward {
  right: 0;
}

.scroll-backward {
  left: 0;
}

.filter-categories .scroll a {
  color: #333;
  position: absolute;
  width: 40px;
  z-index: 1;
  display: flex;
  height: 100%;
  justify-content: center;
  align-items: center;
}

.filter-categories .scroll-backward a {
  left: 0;
  justify-content: flex-start;
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(255, 255, 255, 0)), color-stop(50%, white));
  background-image: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, white 50%);
}

.filter-categories .scroll-forward a {
  right: 0;
  justify-content: flex-end;
  background-image: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), color-stop(50%, white));
  background-image: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, white 50%);
}

.filter-categories .scroll-forward a svg {
  -webkit-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.filter-categories .scroll a svg {
  height: 12px;
  width: 12px;
  fill: currentColor;
}

.filter-categories .scroll a svg {
  height: 14px;
  width: 14px;
}

.filter-types ul,
.filter-categories ul {
  padding: 0 2px;
  white-space: nowrap;
  scroll-behavior: smooth;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  margin-bottom: 0;
}
.filter-types ul::-webkit-scrollbar,
.filter-categories ul::-webkit-scrollbar {
  display: none;
}

.filter-types .category {
  display: inline-block;
}

.filter-types .category a,
.filter-categories .category a {
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #6e6d7a;
  padding: 8px 10px;
  -webkit-transition: all 200ms ease;
  transition: all 200ms ease;
  border-radius: 5px;
  background-color: transparent;
  color: var(--main-body-color);
  font-size: 13px;
  line-height: 16px;
  font-weight: bold;
  transition: background-color 0.2s ease-in-out;
}
.filter-types .category a i,
.filter-categories .category a i {
  padding: 0 10px 8px;
  font-size: 1rem;
}
.filter-types .category a.is-active, .filter-types .category a:hover,
.filter-categories .category a.is-active,
.filter-categories .category a:hover {
  background-color: var(--main-ui-color);
  text-decoration: none;
}

.filter-categories .category a:after {
  display: block;
  content: attr(title);
  font-weight: 500;
  height: 0;
  overflow: hidden;
  visibility: hidden;
}

.filter-categories .scroll-backward a svg {
  -webkit-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  transform: rotate(90deg);
}

.catalogue-subnav-tools + .filter-settings {
  position: absolute;
  right: 0.5rem;
}

.filter-settings {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: end;
  justify-content: flex-end;
  -ms-flex: 0 0 200px;
  flex: 0 0 200px;
  -ms-flex-order: 2;
  order: 2;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
  align-self: flex-end;
}
.catalogue .filter-settings {
  margin-top: 0;
  margin-bottom: 0;
}
@media (min-width: 768px) {
  .filter-settings {
    width: auto;
  }
}
@media (min-width: 768px) {
  .filter-settings .label {
    display: inline-block;
  }
}
.filter-settings .mm-label {
  display: none;
}
@media (min-width: 768px) {
  .filter-settings .mm-label {
    display: inline-block;
  }
}

.meatball {
  display: none;
  background-color: var(--main-brand-color);
  height: 20px;
  width: 20px;
  display: inline-block;
  color: white;
  border-radius: 100%;
  font-size: 85%;
}

.sort-datas {
  display: flex;
  justify-content: left;
  padding: 0;
  margin-right: 1rem;
}

@media (min-width: 768px) {
  .sort-datas {
    display: flex;
    justify-content: center;
  }
  .sort-datas fieldset {
    width: auto;
    text-align: center;
  }
}
.filter-fieldset {
  background-color: white;
  border-bottom: 1px solid var(--main-ui-color);
  width: 100%;
  flex-grow: initial !important;
  flex-shrink: initial !important;
  flex-basis: initial !important;
}
@media (min-width: 768px) {
  .filter-fieldset {
    width: 50%;
  }
}
.filter-fieldset > * {
  padding: 1rem 0;
}
.filter-fieldset .fieldset-button[aria-expanded=true] .icon {
  transform: rotate(90deg);
}
.filter-fieldset label:not(.mm-date-field-label) {
  font-weight: bold;
  padding: 0.5rem 0 0;
}
.filter-fieldset label:not(.mm-date-field-label).form-check-label {
  font-weight: normal;
  padding: 0;
}
.filter-fieldset label:not(.mm-date-field-label) .fieldset-result {
  font-weight: 300;
  margin-left: 1rem;
  color: var(--main-brand-color);
}
.filter-fieldset .form-check {
  margin-bottom: 0.5rem;
}
.filter-fieldset .form-check:last-child {
  margin-bottom: 0;
}
.filter-fieldset .fieldset-info {
  padding: 0 0 0.5rem 0;
  width: 100%;
}
.filter-fieldset .fieldset-content {
  padding: 0;
}
.filter-fieldset .fieldset-content .dropdown {
  margin-bottom: 1rem;
}
.filter-fieldset .fieldset-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  width: 100%;
  height: auto;
  padding: 0;
  color: var(--main-body-color);
}
.filter-fieldset .fieldset-button label {
  pointer-events: none;
}
.filter-fieldset .fieldset-button:hover {
  cursor: pointer;
}
.filter-fieldset .fieldset-button:focus {
  outline: none;
}
.filter-fieldset .fieldset-button .icon {
  transition: all 0.2s ease-in-out;
  transform: rotate(-90deg);
  margin-right: -0.5rem;
  margin-top: -0.5rem;
}

.filter-date-individuel {
  display: flex;
  justify-content: space-between;
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;
  padding: 0 1rem;
}
@media (min-width: 768px) {
  .filter-date-individuel {
    padding: 0;
  }
}
.filter-date-individuel-views {
  margin: 0 -0.5rem;
}

/* FORMS */
.input-wrap {
  position: relative;
  display: block;
  padding: 0;
}

.form-field .input-wrap {
  margin-bottom: 0.625rem;
}

.form-field.form-inline {
  justify-content: center;
}

.form-field.form-inline .input-wrap {
  display: flex;
  align-items: baseline;
}
.form-field.form-inline .input-wrap button {
  white-space: nowrap;
  margin-left: 1rem;
}

.input-wrap input:not([type=range]) {
  display: block;
  height: auto;
  width: 100%;
  margin: 0;
  outline: 0;
  padding: 1.5rem 0 0.0625rem;
  border: 0;
  border-radius: 0;
  border-bottom: 1px solid var(--main-ui-color);
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  -webkit-transition: box-shadow 0.2s;
  transition: box-shadow 0.2s;
  font-size: 1rem;
  line-height: 1.5;
  box-sizing: border-box;
  background-color: transparent;
  color: var(--main-body-color) !important;
}

.input-wrap label {
  display: inline-block;
  color: var(--main-body-color);
}

.input-wrap label {
  position: absolute;
  top: 1.4375rem;
  -webkit-transform-origin: top left;
  transform-origin: top left;
}

input[type=text]:read-only {
  background-color: transparent;
  color: var(--main-ui-dark);
}

.btn .label {
  color: var(--main-body-color);
  font-size: 14px;
}

.input-wrap input[type=email] ~ label,
.input-wrap input[type=password] ~ label,
.input-wrap input[type=tel] ~ label,
.input-wrap input[type=text] ~ label,
.input-wrap input[type=url] ~ label,
.input-wrap input[type=tel] ~ label,
.input-wrap select ~ label,
.input-wrap textarea ~ label {
  font-size: 1rem;
  -webkit-transition: all 0.2s ease-in-out;
  transition: all 0.2s ease-in-out;
  -webkit-transform-origin: top left;
  transform-origin: top left;
  pointer-events: none;
}

.input-wrap input[type=email]:focus ~ label,
.input-wrap input[type=password]:focus ~ label,
.input-wrap input[type=tel]:focus ~ label,
.input-wrap input[type=text]:focus ~ label,
.input-wrap input[type=url]:focus ~ label,
.input-wrap input[type=tel]:focus ~ label,
.input-wrap textarea:focus ~ label,
.input-wrap input:-webkit-autofill ~ label,
.input-wrap input:-webkit-autofill:hover ~ label,
.input-wrap input:-webkit-autofill:focus ~ label,
.input-wrap input:-webkit-autofill:active ~ label {
  -webkit-transform: translateY(-1.4375rem) scale(0.75);
  transform: translateY(-1.4375rem) scale(0.75);
  pointer-events: all;
  color: var(--main-body-color);
}

.input-wrap--labelled label {
  -webkit-transform: translateY(-1.4375rem) scale(0.75);
  transform: translateY(-1.4375rem) scale(0.75);
  color: var(--main-body-color);
}

.input-wrap--trailing-icon input[type=email],
.input-wrap--trailing-icon input[type=password],
.input-wrap--trailing-icon input[type=tel],
.input-wrap--trailing-icon input[type=text],
.input-wrap--trailing-icon input[type=url] {
  padding-right: 6.25rem;
}

.input-wrap > .btn--plain,
.input-wrap > .svg-icon {
  position: absolute;
  bottom: 0;
}

.btn--plain {
  background: none;
  padding: 0.3125rem;
  box-shadow: none;
}

.input-wrap input:not([type=range]):not([type=number]) ~ .btn--plain {
  padding: 0.3125rem;
}

.input-wrap--trailing-icon > .btn--plain,
.input-wrap--trailing-icon > .svg-icon {
  right: 0;
}

.btn .btn__copy {
  justify-content: center;
  align-items: center;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
}

.btn .btn__copy {
  display: flex;
  opacity: 1;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  -webkit-transition-property: opacity, -webkit-transform;
  transition-property: opacity, -webkit-transform;
  transition-property: opacity, transform;
  transition-property: opacity, transform, -webkit-transform;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
}

.btn .svg-icon {
  flex-shrink: 0;
  display: inline-block;
  height: 1.5rem;
  width: 1.5rem;
  vertical-align: middle;
  fill: currentColor;
  -webkit-transition-property: fill, -webkit-transform;
  transition-property: fill, -webkit-transform;
  transition-property: transform, fill;
  transition-property: transform, fill, -webkit-transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease;
  transition-timing-function: ease;
}

.btn--plain .btn__label {
  position: absolute;
  height: 1px;
  width: 1px;
  overflow: hidden;
  clip: rect(1px, 1px, 1px, 1px);
  margin: -1px;
  white-space: nowrap;
}

.input-with-icon {
  position: relative;
}

.input-with-icon input[type=text],
.input-with-icon input[type=search],
.input-with-icon input[type=password],
.input-with-icon input[type=email],
.input-with-icon input[type=url],
.input-with-icon input[type=tel] {
  padding-left: 44px;
}

.input-with-icon svg {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  height: 16px;
  width: 16px;
  left: 16px;
  fill: var(--main-body-color);
}

input[type=search],
.input-with-prefix {
  font-size: 16px;
  font-weight: 400;
  line-height: 24px;
  width: 100%;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  height: 40px;
  padding: 10px 16px;
  outline: none;
  border-radius: 8px;
  -webkit-transition: background-color 200ms ease, outline 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;
  transition: background-color 200ms ease, outline 200ms ease, color 200ms ease, -webkit-box-shadow 200ms ease;
  transition: background-color 200ms ease, outline 200ms ease, color 200ms ease, box-shadow 200ms ease;
  transition: background-color 200ms ease, outline 200ms ease, color 200ms ease, box-shadow 200ms ease, -webkit-box-shadow 200ms ease;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: 1px solid var(--main-ui-color);
  background-color: white;
}

@media (min-width: 768px) {
  .dropdown-menu.dropdown-menu--large {
    min-width: 21rem;
  }
}
.input-wrap input[aria-required=true] + label::after {
  content: "*";
  display: inline-block;
  color: var(--main-brand-color);
  padding-left: 0.5em;
}

.form-required::after {
  content: "*";
  display: inline-block;
  color: var(--main-brand-color);
  padding-left: 0;
}

.input-wrap input#code.is-valid + label::after {
  content: "";
  display: inline-block;
  color: var(--main-brand-color);
  padding-left: 0.5em;
  width: 2em;
  height: 1.2em;
  background-image: url(../img/validate.svg);
  background-size: contain;
  background-repeat: no-repeat;
  margin-left: 1.5rem;
}

/* FOCUS */
.btn.focus,
.btn:focus,
.form-control:focus {
  box-shadow: 0 0 0 0.2rem var(--main-brand-color-alpha);
}

/* select */
.bootstrap-select:not([class*=col-]):not([class*=form-control]):not(.input-group-btn) {
  width: 100%;
}

.bootstrap-select > .dropdown-toggle {
  border: 1px solid var(--main-ui-color);
  background-color: white;
  color: var(--main-body-color);
}

.mm_form {
  display: none;
}
.mm_form.form-show {
  display: block;
}

/* radio */
.abc-radio .radio-message {
  display: none;
  border: 1px solid var(--main-ui-color);
  padding: 1rem;
  margin: 1rem 0;
}
.abc-radio input[type=radio]:checked + label + .radio-message {
  display: block;
}

.form-guide .radio {
  border-top: 1px solid var(--main-ui-color);
  padding: 1rem 0 0.5rem;
}

.form-field-inline {
  display: flex;
  gap: 1rem;
  width: 100%;
  align-items: center;
  justify-content: space-between;
}
.form-field-inline .form-field {
  flex: 1;
}

.abc-checkbox label::before,
.abc-checkbox label::after {
  border-radius: 0;
}

.input-wrap .iti {
  width: 100%;
}

/* Modal */
body.modal-open {
  overflow: hidden;
  position: fixed;
  width: 100vw;
  height: 100vh;
}

.modal-header {
  border-bottom: 0;
  padding-bottom: 0;
}
.modal-footer {
  border-top: 0;
  display: flex;
  justify-content: space-between;
}
.modal-footer .btn {
  padding: 0.5rem 1rem;
}

.modal-content {
  box-shadow: none;
}

#modal-conditions .modal-body .container {
  height: calc(100vh - 170px);
  overflow: scroll;
}

.modal-bottom {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  max-width: 100% !important;
  margin: 0;
  z-index: 1;
}

.modal-backdrop {
  background-color: rgb(0, 0, 0);
}

/* Transitions */
/* Slide up / down */
.slide-up--leave-active,
.slide-up--enter-active {
  transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
}

.slide-down--enter-active,
.slide-down--leave-active {
  transition: transform 200ms cubic-bezier(0.4, 0, 1, 1);
}

.slide-up--enter,
.slide-down--leave-to {
  transform: translateY(100%);
}

.slide-up--leave-to,
.slide-down--enter {
  transform: translateY(0);
}

/* Slide left / right */
.slide-left--leave-active,
.slide-left--enter-active,
.slide-right--leave-active,
.slide-right--enter-active {
  transition: transform 250ms cubic-bezier(0.4, 0, 0.2, 1);
}

.slide-left--leave,
.slide-left--enter-to,
.slide-right--leave,
.slide-right--enter-to {
  transform: translateX(0);
}

.slide-left--enter,
.slide-right--leave-to {
  transform: translateX(-100%);
}

.slide-left--leave-to,
.slide-right--enter {
  transform: translateX(100%);
}

.animate-bottom {
  position: relative;
  animation: animatebottom 0.4s;
}

@keyframes animatebottom {
  from {
    bottom: -100px;
    opacity: 0;
  }
  to {
    bottom: 0;
    opacity: 1;
  }
}
svg path.svg-animate {
  stroke: #000;
  stroke-width: 1;
  stroke-dasharray: 100px;
  stroke-dashoffset: 100px;
  animation-name: draw;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in-out;
}

@keyframes draw {
  to {
    stroke-dashoffset: 0;
  }
}
.mme-cart-icon {
  width: 50px;
  padding: 0.5rem;
  height: auto;
  flex-shrink: 0;
  color: var(--main-brand-color);
}
.mme-cart-icon svg {
  width: 100%;
  height: auto;
  margin: 0 auto;
  border-radius: 50%;
  border: 3px solid var(--main-ui-color);
  background-color: var(--main-brand-color);
}

.mme-cart-icon img {
  width: 100%;
  height: auto;
  margin: 0 auto;
  border-radius: 50%;
  border: 3px solid var(--main-ui-color);
  background-color: var(--main-brand-color);
}

.mme-cart-title-text {
  flex-grow: 1;
  margin-right: 0.5rem;
}
.mme-cart-title-text h3 {
  font-size: 1em;
  font-weight: bold;
  margin: 0;
  padding: 0;
  text-transform: uppercase;
}

.mme-cart-edit {
  margin-right: 0.5rem;
}

.input-group .form-control,
.input-group-addon,
.input-group-btn {
  display: table-cell;
}

.input-group .form-control {
  position: relative;
  z-index: 2;
  float: left;
  width: 100%;
  margin-bottom: 0;
}

.input-group {
  position: relative;
  display: table;
  border-collapse: separate;
  height: min-content;
}

.input-group .form-control,
.input-group-addon,
.input-group-btn {
  display: table-cell;
}

.input-group-btn {
  position: relative;
  font-size: 0;
  white-space: nowrap;
}
.input-group-btn .btn {
  box-shadow: none;
}

.input-group-addon,
.input-group-btn {
  width: 1%;
  white-space: nowrap;
  vertical-align: middle;
}

.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group {
  margin-right: -1px;
}

.input-group .form-control:first-child,
.input-group-addon:first-child,
.input-group-btn:first-child > .btn,
.input-group-btn:first-child > .btn-group > .btn,
.input-group-btn:first-child > .dropdown-toggle,
.input-group-btn:last-child > .btn-group:not(:last-child) > .btn,
.input-group-btn:last-child > .btn:not(:last-child):not(.dropdown-toggle) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.mme-cart-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-grow: 1;
  width: 100%;
}

.mme-cart-price {
  width: auto;
  padding: 7px 0;
  flex-grow: 1;
  font-size: 14px;
  display: flex;
  flex-direction: column;
  text-align: right;
  min-width: auto;
}

.mme-input-qt {
  padding: 7px 0;
  margin-right: 0;
}

.mme-cart-metas {
  width: 100%;
  padding-left: 45px;
  padding-top: 0;
  flex: 1;
  justify-content: space-between;
}

.mme-cart-operations {
  text-align: left;
  flex-grow: 0;
  margin-left: 0;
  display: flex;
  flex-wrap: wrap;
}

.mme-cart-pack-content .mme-cart-icon {
  padding: 0 0.9em;
}

.mme-cart-content-sessions .btn-sessions {
  display: flex;
  flex-direction: column;
}
.mme-cart-content-sessions .btn-sessions .btn {
  margin-bottom: 0.5em;
}

.cart-background-session {
  padding: 0 1rem;
  background-color: var(--main-ui-color);
  border-radius: 5px;
  border-width: 1px;
  border-color: #e7eaec;
  border-style: solid;
  margin-bottom: 1rem;
}

.app-cart__topbottom {
  width: 100%;
  background-color: var(--main-ui-color);
}

.mme-basket-line hr:last-child {
  display: none;
}
.mme-basket-line:first-child::before {
  display: none;
}
.mme-basket-line::after {
  content: "";
  height: 1px;
  width: 100%;
  display: block;
  background-color: var(--main-ui-color);
  color: inherit;
  padding: 0;
  margin-bottom: 15px;
}
.mme-basket-line:last-child::before {
  display: none;
}

.mme-basket-line::before {
  display: none;
}

.code-promo {
  margin-bottom: 1em;
  border-radius: 5px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .code-promo {
    flex-direction: row;
  }
}
.code-promo .code-promo-field {
  flex: 1;
  padding: 0;
  width: 100%;
}
@media (min-width: 768px) {
  .code-promo .code-promo-field {
    margin: 0 1rem 0 0;
    width: auto;
  }
}

.cart-sidebar {
  position: sticky;
  top: 70px;
  margin-bottom: 1rem;
}

.upsell-container {
  border-radius: 0.5em;
}
@media (min-width: 768px) {
  .upsell-container {
    margin: 0;
    padding: 1em;
  }
}
.upsell-container .upsell-title {
  font-size: 0.8rem;
}
.upsell-container .app-item.trend {
  margin-left: 0;
  margin-right: 0;
}

@media (min-width: 768px) {
  .mme-cart-content-sessions .btn-sessions {
    display: flex;
    flex-direction: row;
  }
  .mme-cart-content-sessions .btn-sessions .btn {
    margin-bottom: 0;
    margin-right: 1em;
  }
}
.mme-step-container {
  max-width: 1140px;
  margin: 0 auto;
}

.app-cart__minicart {
  background-color: white;
  width: 100vw;
  padding: 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid var(--main-ui-color);
}
@media (min-width: 768px) {
  .app-cart__minicart {
    display: none;
    visibility: hidden;
    opacity: 0;
  }
}

.app-cart-floating {
  width: 88px;
  height: 88px;
  display: flex;
  padding: 1rem;
  justify-content: center;
  align-items: center;
  background-color: var(--main-ui-dark);
  animation: scaleOut 0.3s ease-in-out 0s 1 normal forwards, scaleIn 0.3s ease-in-out 0.3s 1 normal forwards;
}
.app-cart-floating .icon-cart {
  width: 88px;
}
.app-cart-floating .icon-cart .number-bg,
.app-cart-floating .icon-cart .number-txt {
  display: none;
}
.app-cart-floating .icon-cart.is-full .number-bg {
  display: block;
  fill: var(--main-brand-color);
}
.app-cart-floating .icon-cart.is-full .number-txt {
  fill: white;
}
.app-cart-floating svg {
  height: auto;
}

@keyframes scaleOut {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.3);
  }
}
@keyframes scaleIn {
  0% {
    transform: scale(1.3);
  }
  100% {
    transform: scale(1);
  }
}
.floating-cart-bg {
  opacity: 0.5;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: var(--main-ui-dark);
  display: none;
  z-index: 1028;
}
.floating-cart-bg.show {
  display: block;
}

.floating-message {
  bottom: 200px;
  position: fixed;
  left: 0;
  width: 100vw;
  height: auto;
  z-index: 1029;
  display: flex;
}
.floating-message.is-remove {
  bottom: 50px;
}
.floating-message-container {
  background-color: transparent;
  width: auto;
  color: var(--main-brand-color);
  font-weight: bold;
  padding: 1rem;
  text-align: center;
  margin: 1rem;
  border-radius: 5px;
  margin: 0 auto;
  font-size: 3rem;
}

.floating-message-up {
  bottom: 0;
  position: fixed;
  left: 0;
  width: 100vw;
  height: auto;
  z-index: 1029;
  display: flex;
}
.floating-message-up-container {
  background-color: transparent;
  width: auto;
  color: var(--main-brand-color);
  font-weight: bold;
  padding: 1rem;
  text-align: center;
  margin: 1rem;
  border-radius: 5px;
  margin: 0 auto;
  font-size: 3rem;
}

.floating-cart-total {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid var(--main-ui-color);
  padding: 1rem 0;
  font-size: 110%;
}

.app-cart__footer {
  width: 100%;
  background-color: white;
  opacity: 1;
  bottom: -1000px;
  transition: all ease-in-out 0.3s;
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
  height: 100vh;
  overflow: auto;
  padding-bottom: 210px;
}
.app-cart__footer .cart-promo {
  display: flex;
  justify-content: center;
  padding-top: 1rem;
}
.app-cart__footer h4 {
  margin: 0;
  padding: 0;
  font-weight: bold;
}
.app-cart__footer .cart-subnav {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  width: 100vw;
  border-top: 1em solid white;
  border-bottom: 1em solid white;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .app-cart__footer .cart-subnav {
    justify-content: center;
  }
}
.app-cart__footer .cart-subnav a.btn {
  width: auto;
  margin: 0.75rem 1rem;
}
@media (min-width: 768px) {
  .app-cart__footer .cart-subnav a.btn {
    margin: 0;
  }
}
.app-cart__footer .cart-subnav a.btn.btn-prev {
  padding: 0;
}
.app-cart__footer .cart-subnav a.btn.btn-prev::before {
  margin: 0;
  padding: 1rem;
  height: 1rem;
  width: 1rem;
  line-height: 1rem;
}

.cart-total {
  display: flex;
  flex-direction: row;
  color: white;
  width: 100%;
  border-bottom: 1px solid var(--main-body-color);
  padding: 1rem;
  justify-content: space-between;
}
.cart-sidebar .cart-total {
  color: var(--main-body-color);
}
.cart-total-info {
  flex-grow: 1;
  display: flex;
  justify-content: space-between;
  align-items: start;
  flex-direction: column;
}
@media (min-width: 768px) {
  .cart-total-info {
    flex-direction: row;
  }
}
@media (min-width: 768px) {
  .cart-total-info .event-info {
    flex-grow: 1;
    padding-left: 3rem;
  }
}
.cart-total.is-full circle {
  display: block;
}
.cart-total svg {
  width: 3rem;
  height: 3rem;
  margin-right: 2rem;
}
.cart-total svg circle {
  display: none;
  fill: var(--main-brand-color);
}
.js-cart-sticky .cart-total {
  padding-top: 1rem;
}

.cart-sidebar .app-cart__container {
  padding: 1rem;
  border: 1px solid var(--main-ui-color);
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .app-cart__footer .app-cart__container {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: center;
    padding: 2rem;
    padding-bottom: 0;
  }
  .app-cart__footer .cart-promo {
    padding-top: 0;
  }
}
.floating-cart-items {
  display: flex;
  flex-direction: row;
  color: white;
  width: 100%;
  border-bottom: 1px solid var(--main-body-color);
  padding: 1rem;
  justify-content: space-between;
}
.floating-cart-items:last-child {
  border-bottom: none;
}
.floating-cart-items .image {
  color: var(--main-brand-color);
  padding: 0.75rem;
}
.floating-cart-items .app-date-list__actions {
  padding: 0.75rem;
}

.list-bullet {
  margin: 0;
  padding: 0;
}
.list-bullet li::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
}
.list-bullet li:first-child::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date-short.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
}
.list-bullet li:last-child::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date-short.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
  transform: rotate(180deg);
}
.list-bullet li.list-presence-ok::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date-presence-ok.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
}
.list-bullet li.list-presence-ok:first-child::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date-presence-ok-short.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
}
.list-bullet li.list-presence-ok:last-child::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date-presence-ok.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
  transform: rotate(180deg);
}
.list-bullet li.list-presence-non::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date-presence-non.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
}
.list-bullet li.list-presence-non:first-child::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date-presence-non-short.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
}
.list-bullet li.list-presence-non:last-child::before {
  content: "";
  display: block;
  height: 5em;
  width: 15px;
  background-image: url("../img/list-date-presence-non.svg");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 1rem;
  padding: 1rem 0;
  transform: rotate(180deg);
}

.icons-in-a-row {
  padding: 1.5rem 0;
  display: flex;
  justify-content: center;
  font-size: 0.8em;
  line-height: 1.2;
}
.icons-in-a-row .icon-link {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: var(--main-body-color);
  padding: 0 1rem;
}
.icons-in-a-row .icon-link span {
  text-align: center;
  padding-top: 0.5rem;
}
.icons-in-a-row .icon-link:hover {
  color: var(--main-brand-color);
  text-decoration: none;
}
.icons-in-a-row .icon-link:hover svg path {
  stroke: var(--main-brand-color);
}

ol.big-numbers {
  max-width: 350px;
  counter-reset: my-awesome-counter;
  list-style: none;
  padding-left: 40px;
}

ol.big-numbers li {
  margin: 0 0 1.5rem 0;
  counter-increment: my-awesome-counter;
  position: relative;
}

ol.big-numbers li::before {
  content: counter(my-awesome-counter);
  color: white;
  font-size: 1.5rem;
  font-weight: bold;
  position: absolute;
  --size: 32px;
  left: calc(-1 * var(--size) - 10px);
  line-height: var(--size);
  width: var(--size);
  height: var(--size);
  top: 0;
  transform: rotate(-10deg);
  background: var(--main-brand-color);
  border-radius: 50%;
  text-align: center;
  box-shadow: 1px 1px 0 #999;
}

/* dates */
ol.list-numbers {
  counter-reset: my-awesome-counter;
  list-style: none;
  padding-left: 40px;
}

ol.list-numbers li {
  margin: 0 0 1.5rem 0;
  counter-increment: my-awesome-counter;
  position: relative;
}

ol.list-numbers li::before {
  content: counter(my-awesome-counter);
  color: var(--main-ui-dark);
  font-size: 1rem;
  font-weight: bold;
  position: absolute;
  --size: 24px;
  left: calc(-1 * var(--size) - 10px);
  line-height: var(--size);
  width: var(--size);
  height: var(--size);
  top: 0;
  transform: rotate(-10deg);
  background: white;
  border-radius: 50%;
  text-align: center;
  box-shadow: 1px 1px 0 #999;
}

.icon .number {
  color: white;
  font-size: 1.5rem;
  font-weight: bold;
  --size: 32px;
  line-height: var(--size);
  width: var(--size);
  height: var(--size);
  top: 0;
  transform: rotate(-10deg);
  background: var(--main-brand-color);
  border-radius: 50%;
  text-align: center;
  box-shadow: 1px 1px 0 #999;
}

.ribbon {
  position: absolute;
  left: 1.5em;
  top: var(--top, -3px);
  filter: drop-shadow(0px 2px 4px rgba(34, 34, 43, 0.1607843137));
}
@media (min-width: 768px) {
  .ribbon {
    left: 2em;
  }
}
.ribbon > .content {
  color: white;
  font-size: 0.3rem;
  text-align: center;
  font-weight: 400;
  background: var(--color, #2ca7d8) linear-gradient(45deg, rgba(0, 0, 0, 0) 0%, rgba(255, 255, 255, 0.25) 100%);
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 100%, 0 100%);
  width: var(--width, 24px);
  min-height: var(--height, 34px);
  transition: clip-path 1s, padding 1s, background 1s;
}
@media (min-width: 768px) {
  .ribbon > .content {
    padding: 8px 2px 4px;
    font-size: 1.25rem;
    width: var(--width, 32px);
    min-height: var(--height, 47px);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 100%, 0 100%);
  }
}
.ribbon > .content svg {
  width: 100%;
  min-height: var(--height, 34px);
  padding: 3px;
}
@media (min-width: 768px) {
  .ribbon > .content svg {
    padding: 3px;
  }
}
.ribbon.slant-up > .content {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 12px), 50% calc(100% - 6px), 0 100%);
}
.ribbon.slant-down > .content {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% calc(100% - 6px), 0 calc(100% - 12px));
}
.ribbon.down > .content {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 4px), 50% 100%, 0 calc(100% - 4px));
}
@media (min-width: 768px) {
  .ribbon.down > .content {
    clip-path: polygon(0 0, 100% 0, 100% calc(100% - 8px), 50% 100%, 0 calc(100% - 8px));
  }
}
.ribbon.up > .content {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% calc(100% - 4px), 0 100%);
}
@media (min-width: 768px) {
  .ribbon.up > .content {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 50% calc(100% - 8px), 0 100%);
  }
}
.ribbon.check > .content {
  clip-path: polygon(0 0, 100% 0, 100% calc(100% - 20px), 40% 100%, 0 calc(100% - 12px));
}

.c-tabs {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  justify-content: space-between;
  position: relative;
}
.iframe-no .c-tabs.is-sticky {
  position: sticky !important;
  top: 62px;
  background: white;
  z-index: 9;
}
.iframe-yes .c-tabs.is-sticky {
  position: sticky !important;
  top: 0;
  background: white;
  z-index: 9;
}
.c-tabs-li {
  flex-grow: 1;
}
.c-tabs-btn, .c-tabs-btn:hover {
  font-size: 0.9em;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1em;
  text-align: center;
  color: var(--main-body-color);
  text-transform: uppercase;
  text-decoration: none;
  cursor: pointer;
  border-bottom: 2px solid var(--main-ui-color);
}
.c-tabs-btn.is-active, .c-tabs-btn:hover.is-active {
  border-color: var(--main-brand-color);
}
.c-tabs-panel {
  padding: 2rem 0;
  width: 100%;
}
.c-tabs-panel > div {
  display: none;
}
.c-tabs-panel .is-active {
  display: block;
  height: 100%;
}
.catalogue-content-datas .c-tabs-panel {
  padding: 0;
}
.catalogue-content-datas .c-tabs-panel .mbsc-ios.mbsc-calendar {
  height: 100% !important;
}
.c-tabs--small {
  max-width: 100%;
  margin: 0 1rem 0;
  width: auto;
}
.catalogue-subnav-tools .c-tabs--small {
  margin: 0;
}
@media (min-width: 768px) {
  .c-tabs--small {
    max-width: 50%;
    margin: left;
  }
}
.c-tabs--scrollable {
  -ms-flex-order: 3;
  order: 3;
  padding: 0;
  border-top: 1px solid var(--main-ui-color);
  margin: 1rem 0;
  padding: 0 2px;
  white-space: nowrap;
  scroll-behavior: smooth;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  margin-bottom: 0;
}
.c-tabs--scrollable:not(.allow-overflow) {
  overflow-x: auto;
  overflow-y: hidden;
  position: relative;
  width: 100%;
}
.c-tabs--scrollable:not(.allow-overflow)::-webkit-scrollbar {
  display: none;
}
.c-tabs--scrollable .category {
  display: inline-block;
}
.c-tabs--scrollable .category a {
  display: inline-block;
  color: #6e6d7a;
  padding: 8px 10px;
  display: inline-block;
  -webkit-transition: all 200ms ease;
  transition: all 200ms ease;
  border-radius: 5px;
  background-color: transparent;
  color: var(--main-body-color);
  font-size: 13px;
  line-height: 16px;
  text-transform: uppercase;
  font-weight: bold;
  transition: background-color 0.2s ease-in-out;
}
.c-tabs--scrollable .category a.is-active, .c-tabs--scrollable .category a:hover {
  background-color: var(--main-ui-color);
  text-decoration: none;
}

/*--- Remove Bootstrap's styling for Nav Class if needed ---*/
.ProductNav .nav {
  display: inherit;
  flex-wrap: inherit;
  padding-left: inherit;
  margin-bottom: inherit;
  list-style: inherit;
}

/*--- Wrap Up ---*/
.c-tabs-wrapper {
  position: relative;
  padding: 0 1rem;
  box-sizing: border-box;
  border-color: var(--main-ui-color);
  border-radius: 5px;
  border-style: solid;
  border-width: 1px 0 0;
}

.ProductNav {
  /* Make this scrollable when needed */
  overflow-x: auto;
  /* We don't want vertical scrolling */
  overflow-y: hidden;
  /* For WebKit implementations, provide inertia scrolling */
  -webkit-overflow-scrolling: touch;
  /* We don't want internal inline elements to wrap */
  white-space: nowrap;
  /* If JS present, let's hide the default scrollbar */
  /* dont wait for .js on body */
  /* positioning context for advancers */
  position: relative;
  font-size: 0;
  -ms-overflow-style: -ms-autohiding-scrollbar;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.js .ProductNav {
  /* Make an auto-hiding scroller for the 3 people using a IE */
  -ms-overflow-style: -ms-autohiding-scrollbar;
  /* Remove the default scrollbar for WebKit implementations */
}
.js .ProductNav::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
.ProductNav::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

.ProductNav_Contents {
  float: left;
  transition: transform 0.2s ease-in-out;
  position: relative;
}

.ProductNav_Contents-no-transition {
  transition: none;
}

.ProductNav_Link {
  text-decoration: none;
  color: var(--main-body-color);
  text-transform: uppercase;
  font-size: 1rem;
  display: table-cell;
  vertical-align: middle;
  padding: 1em;
  line-height: 1.35;
  text-decoration: none;
}
.ProductNav_Link:focus, .ProductNav_Link:hover, .ProductNav_Link[aria-selected=true] {
  color: var(--main-body-color);
  text-decoration: none;
  border: 0;
  outline: 0;
}

.Advancer {
  /* Reset the button */
  appearance: none;
  background: transparent;
  padding: 0;
  border: 0;
  /* Now style it as needed */
  position: absolute;
  top: 0;
  bottom: 0;
  /* Set the buttons invisible by default */
  opacity: 0;
  transition: opacity 0.3s;
}
.Advancer:focus {
  outline: 0;
}
.Advancer:hover {
  cursor: pointer;
}

.Advancer_Left {
  left: 0;
}
[data-overflowing=both] ~ .Advancer_Left, [data-overflowing=left] ~ .Advancer_Left {
  opacity: 1;
}

.Advancer_Right {
  right: 0;
}
[data-overflowing=both] ~ .Advancer_Right, [data-overflowing=right] ~ .Advancer_Right {
  opacity: 1;
}

.Advancer_Icon {
  width: 12px;
  height: 44px;
  fill: #bbb;
}

.ProductNav_Indicator {
  position: absolute;
  bottom: 0;
  left: 0;
  height: 3px;
  width: 100px;
  background-color: transparent;
  transform-origin: 0 0;
  transition: transform 0.2s ease-in-out, background-color 0.2s ease-in-out;
}

.schema-container {
  border-radius: 0.5em;
  margin-bottom: 1rem;
}
.schema-title, .schema-path, .schema-card, .schema-end {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.schema-title:last-child, .schema-path:last-child, .schema-card:last-child, .schema-end:last-child {
  margin-bottom: 0;
}
.schema-title .icon, .schema-path .icon, .schema-card .icon, .schema-end .icon {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 2rem;
}
.schema-title .icon img, .schema-path .icon img, .schema-card .icon img, .schema-end .icon img {
  width: 36px;
  height: 36px;
  object-fit: cover;
  object-position: top;
}
.schema-title .icon i, .schema-path .icon i, .schema-card .icon i, .schema-end .icon i {
  font-size: 2rem;
  margin: 0 auto;
  width: 2rem;
  display: flex;
  justify-content: center;
}
.schema-end, .schema-card {
  margin-top: 1rem;
}
.schema-card {
  align-items: flex-start;
}
.schema-end, .schema-title {
  font-weight: bold;
}
.schema-path {
  margin-left: 3rem;
  align-items: center;
  margin-bottom: 0;
}
.schema-packgroup {
  width: 100%;
  opacity: 0.2;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}
.flickity-slider .schema-packgroup {
  width: 66%;
}
@media screen and (min-width: 1280px) {
  .schema-packgroup {
    width: 66%;
  }
}
.schema-packgroup.is-selected {
  opacity: 1;
}
.schema-packgroup-inner {
  border-radius: 0.5em;
  padding: 1rem;
  border: 1px solid var(--main-ui-color);
  margin-left: 0;
  margin-right: 0;
}
.schema-packgroup-head {
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
.schema-packgroup-footer {
  margin-left: 1.5em;
  margin-right: 1.5em;
}
.schema-packgroup-total {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.schema-packgroup.is-selected {
  opacity: 1;
}

.schema-module {
  padding-left: 0;
}
.schema-module .schema-path-label {
  flex: 1;
  align-items: flex-start;
  display: flex;
  flex-direction: column;
}
.schema-module .schema-path,
.schema-module .schema-end {
  margin-left: 0;
  padding-bottom: 2rem;
}
.schema-module .schema-path:before,
.schema-module .schema-end:before {
  content: "";
  height: 1px;
  width: 20px;
  background-color: var(--badge-bg);
  margin-right: 0.5rem;
}
@media screen and (min-width: 768px) {
  .schema-module .schema-path:before,
  .schema-module .schema-end:before {
    width: 1rem;
  }
}
.schema-module .schema-end {
  margin-top: 0;
  font-weight: normal;
}
.schema-module .schema-path {
  align-items: flex-start;
}
.schema-module .schema-path::before {
  margin-top: 1rem;
}
.schema-module .schema-path-session {
  display: flex;
  align-items: center;
  padding: 0.5rem 0;
}
.schema-module .schema-path-withcontent .schema-path-label strong {
  margin-top: 5px;
}

.schema-path .sidebar-icon i {
  color: var(--main-brand-color);
}

.schema-container .schema-display-past {
  margin-left: auto;
  font-weight: 500;
}
.schema-container .schema-display-past:active, .schema-container .schema-display-past:focus {
  color: var(--main-brand-color);
  outline: none;
}
.schema-container .schema-path {
  margin-left: 0;
}
@media screen and (min-width: 768px) {
  .schema-container .schema-path {
    margin-left: 2rem;
  }
}
@media screen and (min-width: 768px) {
  .schema-container .schema-path.schema-path-withcontent {
    margin-left: 0;
  }
}
.schema-container .schema-path .app-date-list--row {
  width: 100%;
  justify-content: flex-start;
  gap: 2rem;
}
.schema-container .schema-path .app-date-list--row .modifier_la_date,
.schema-container .schema-path .app-date-list--row .effacer_la_date,
.schema-container .schema-path .app-date-list--row .app-date-list__actions {
  display: none;
}
.schema-container .schema-path .cart-background-session {
  margin-bottom: 0;
}
.schema-container .schema-path .session-description .cart-background-session {
  margin-bottom: 1rem;
}
.schema-container .schema-path .schema-path-icon,
.schema-container .schema-path .icon {
  font-size: 2rem;
  padding-top: 1.3rem;
}
.schema-container .schema-path .schema-path-icon .fa-circle,
.schema-container .schema-path .schema-path-icon .fa-circle-1,
.schema-container .schema-path .schema-path-icon .fa-circle-2,
.schema-container .schema-path .schema-path-icon .fa-circle-3,
.schema-container .schema-path .schema-path-icon .fa-circle-4,
.schema-container .schema-path .schema-path-icon .fa-circle-5,
.schema-container .schema-path .schema-path-icon .fa-circle-6,
.schema-container .schema-path .schema-path-icon .fa-circle-7,
.schema-container .schema-path .schema-path-icon .fa-circle-8,
.schema-container .schema-path .schema-path-icon .fa-circle-9,
.schema-container .schema-path .icon .fa-circle,
.schema-container .schema-path .icon .fa-circle-1,
.schema-container .schema-path .icon .fa-circle-2,
.schema-container .schema-path .icon .fa-circle-3,
.schema-container .schema-path .icon .fa-circle-4,
.schema-container .schema-path .icon .fa-circle-5,
.schema-container .schema-path .icon .fa-circle-6,
.schema-container .schema-path .icon .fa-circle-7,
.schema-container .schema-path .icon .fa-circle-8,
.schema-container .schema-path .icon .fa-circle-9 {
  color: var(--badge-bg);
}
.schema-container .schema-path .schema-path-date {
  display: flex;
}
.schema-container .schema-path .schema-path-date .schema-path-icon i {
  position: relative;
  z-index: 2;
}
.schema-container .schema-path .schema-path-date .schema-path-icon i::before {
  background-color: white;
  border-radius: 100%;
  box-shadow: 0px 0px 0px 5px white;
}
.schema-container .schema-path .schema-path-date .schema-path-icon::before {
  content: "";
  display: block;
  height: 100%;
  width: 2px;
  background-color: var(--main-ui-color);
  position: absolute;
  left: 39px;
}
.schema-container .schema-path .schema-path-date.passe .session-description {
  opacity: 0.5;
}
.schema-container .schema-path .schema-path-date.passe .schema-path-icon i {
  color: var(--main-brand-color);
}
.schema-container .schema-path .schema-path-date.passe .schema-path-icon::before {
  background-color: var(--main-brand-color);
}
.schema-container .schema-path .schema-path-date:first-child .schema-path-icon::before {
  content: "";
  display: block;
  height: 100%;
  background-color: var(--main-ui-color);
  position: absolute;
  top: 7rem;
}
@media screen and (min-width: 768px) {
  .schema-container .schema-path .schema-path-date:first-child .schema-path-icon::before {
    top: 5rem;
  }
}
.schema-container .schema-path .schema-path-date:first-child.passe .schema-path-icon::before {
  background-color: var(--main-brand-color);
}
.schema-container .schema-path .schema-path-date:last-child .schema-path-icon::before {
  content: "";
  display: block;
  height: 75%;
  background-color: var(--main-ui-color);
  position: absolute;
  top: auto;
  bottom: 8rem;
}
@media screen and (min-width: 768px) {
  .schema-container .schema-path .schema-path-date:last-child .schema-path-icon::before {
    bottom: 5rem;
  }
}
.schema-container .schema-path .schema-path-date:last-child.passe .schema-path-icon::before {
  background-color: var(--main-brand-color);
}
.schema-container .schema-path .schema-path-edit-delete .app-date-list__actions,
.schema-container .schema-path .schema-path-edit-delete .app-date-list__actions .effacer_la_date,
.schema-container .schema-path .schema-path-edit-delete .app-date-list__actions .modifier_la_date {
  display: block;
}

.o-icon {
  display: inline-flex;
  color: var(--main-brand-color);
  line-height: inherit;
  width: 1rem;
  height: 1rem;
  text-align: center;
  padding: 0;
  justify-content: center;
}
.o-icon:focus {
  outline: none;
}
.o-icon--gray {
  color: var(--main-ui-dark);
}
.o-icon--lightgray {
  color: var(--badge-bg);
}
.o-icon svg {
  width: 100%;
  height: 100%;
}
.input-wrap .o-icon {
  align-self: center;
}

.module {
  position: relative;
  max-width: 780px;
  margin: 0 auto;
  padding-left: 2.5rem;
  padding-bottom: 1.5rem;
  margin-bottom: 1rem;
}
.module-center {
  position: relative;
  max-width: 780px;
  margin: 0 auto;
  padding-left: 2.5rem;
  padding-bottom: 1.5rem;
  margin-bottom: 1rem;
  display: flex;
  justify-content: center;
}
.module::before {
  content: "";
  background-image: url(../img/schema/cours-module.svg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top left;
  width: 36px;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
}
.module-schema {
  padding-left: 0;
  padding-bottom: 0;
}
.module-schema::before {
  margin-top: 0.5rem;
  background-image: none;
}
.module-schema .schema-module {
  margin-left: 1.5rem;
  position: relative;
}
.module-schema .schema-module::before {
  content: "";
  width: 1px;
  height: 100%;
  overflow: hidden;
  position: absolute;
  top: 0;
  left: 0;
  background-color: var(--main-body-color);
}
.module-schema .accordion .accordion-trigger {
  gap: 1rem;
}
.module-schema .accordion .icon {
  display: flex;
  justify-content: center;
  align-items: flex-start;
  width: 2rem;
}
.module-schema .accordion .icon i {
  font-size: 2rem;
  margin: 0 auto;
  width: 2rem;
  display: flex;
  justify-content: center;
}
.module-titre {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-right: 1rem;
  margin-left: 1rem;
  font-size: 0.9em;
}
.module-titre .btn {
  margin-top: 1rem;
  margin-bottom: 1rem;
  order: 3;
}
.module-titre .image {
  color: var(--main-brand-color);
}
.module-selection {
  margin-top: 0.5rem;
  margin-right: 0.5rem;
}
.module-date {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  font-size: 1rem;
  padding: 0.5rem;
}
.module-date-row {
  display: flex;
  justify-content: space-around;
  flex: 1;
  flex-direction: column;
  width: 100%;
  border: 0.5em;
  justify-content: space-between;
  margin: 0.5rem 0 1rem;
  margin-right: 1rem;
  background-color: var(--main-ui-color);
  padding: 1rem;
  background-color: var(--main-ui-color);
  border-radius: 5px;
  border-width: 1px;
  border-color: #e7eaec;
  border-style: solid;
}
@media (min-width: 768px) {
  .module-date-row {
    flex-direction: row;
  }
}
.module-date-row .app-date-list__actions {
  position: absolute;
  right: 2rem;
}
@media (min-width: 768px) {
  .module-date-row .app-date-list__actions {
    position: relative;
    right: 0;
  }
}
.module .bootstrap-select > .dropdown-toggle {
  border-color: var(--main-brand-color);
}
.module .bootstrap-select .dropdown-menu li a span.text {
  width: 100%;
}
.module .bootstrap-select > .dropdown-toggle.bs-placeholder,
.module .bootstrap-select > .dropdown-toggle.bs-placeholder:active,
.module .bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
.module .bootstrap-select > .dropdown-toggle.bs-placeholder:hover {
  background-color: transparent;
}
.module .dropdown .dropdown-menu .dropdown-item:focus,
.module .dropdown .dropdown-menu .dropdown-item:hover {
  color: var(--main-body-color) !important;
  background-color: rgba(148, 193, 31, 0.0901960784);
}
.module .dropdown-item.active,
.module .dropdown-item:active {
  background-color: rgba(148, 193, 31, 0.0901960784);
  color: var(--main-body-color) !important;
}
.module .btn:hover:before {
  background-color: rgba(148, 193, 31, 0.0901960784);
}

.mm_dialog-inner {
  margin: 0;
}
.mm_dialog-inner h6 {
  margin-bottom: 0;
}
.mm_dialog-inner.filters-options {
  background-color: var(--main-ui-color);
}
.mm_dialog-inner.filters-options .filter-fieldset {
  background-color: var(--main-ui-color);
}

.mm_dialog {
  transition: all 0.2s cubic-bezier(0.075, 0.82, 0.165, 1) 0s;
  opacity: 0;
  top: 100vh;
  display: flex;
  position: fixed;
  flex-direction: column;
  height: 100%;
  overflow-x: hidden;
  padding: 80px 0;
}
.mm_dialog.mm_dialog-is-open {
  opacity: 1;
  top: 0;
  background-color: white;
  z-index: 888;
  inset: 0px;
}
.mm_dialog.mm_dialog--details {
  padding-bottom: 0;
}
.mm_dialog.mm_dialog-is-static {
  opacity: 1;
  top: 0;
  background-color: white;
  inset: 0px;
  position: relative;
  padding: 0;
}
.mm_dialog.mm_dialog-is-static .mm_dialog-header {
  position: relative;
}
.mm_dialog.mm_dialog-is-static .mm_dialog-inner:not(.filters-options) {
  padding-bottom: 100px;
}
.mm_dialog-header {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 1000;
  flex-direction: row;
  display: flex;
  justify-content: space-between;
  background-color: white;
  border-bottom: 2px solid var(--main-ui-color);
  margin-bottom: 1rem;
}
.mm_dialog-header .icon-close,
.mm_dialog-header .icon-reset {
  display: flex;
  align-items: center;
  color: var(--main-body-color);
  cursor: pointer;
  padding-left: 1rem;
}
.mm_dialog-header .icon-close:hover,
.mm_dialog-header .icon-reset:hover {
  text-decoration: none;
  background-color: var(--main-ui-color);
}
.mm_dialog-header .icon-close i,
.mm_dialog-header .icon-reset i {
  font-size: 1.5rem;
  margin-right: auto;
}
@media (min-width: 768px) {
  .mm_dialog-header .icon-close i,
  .mm_dialog-header .icon-reset i {
    margin-right: 1rem;
  }
}
.mm_dialog-header .icon-close span,
.mm_dialog-header .icon-reset span {
  display: none;
}
@media (min-width: 768px) {
  .mm_dialog-header .icon-close span,
  .mm_dialog-header .icon-reset span {
    display: inline;
  }
}
.mm_dialog-header .icon-reset {
  padding-right: 1rem;
}
.mm_dialog-header-title {
  display: flex;
  align-items: center;
  color: var(--main-body-color);
  font-size: 0.9em;
  font-weight: bold;
  padding: 1rem;
  text-transform: uppercase;
}
.mm_dialog-footer {
  position: fixed;
  bottom: 0;
  background-color: var(--main-ui-color);
  width: 100%;
  flex-direction: row;
  display: flex;
  justify-content: center;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  opacity: 1;
  transition: all ease-in-out 0.3s;
  z-index: 99;
}
@media (min-width: 768px) {
  .mm_dialog-footer {
    width: 100vw;
    border-top: 1em solid white;
    border-bottom: 1em solid white;
    padding: 0 0;
  }
}

.accordion {
  display: flex;
  flex-direction: column;
  width: auto;
  /* dans */
  /** Version qui ne marche que en mobile */
}
.accordion-trigger {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-bottom: 0;
  padding: 0.5rem 0;
  align-items: self-start;
  border-radius: 5px;
  border-bottom: 1px solid var(--main-ui-color);
}
.accordion-trigger .fa-solid {
  color: var(--main-brand-color);
  transform: rotate(180deg);
}
.accordion-trigger.collapsed .fa-solid {
  transform: rotate(0);
}
.accordion-trigger.collapsed .accordion-resume {
  display: block;
}
.accordion-trigger.collapsed .accordion-arrow {
  transform: rotate(-90deg);
}
.accordion-trigger.collapsed .accordion-close {
  display: none;
  color: var(--main-brand-color);
}
.accordion-trigger.collapsed .accordion-edit {
  display: block;
  color: var(--main-brand-color);
}
.accordion-trigger .accordion-close {
  display: block;
  color: var(--main-brand-color);
}
.accordion-trigger .accordion-edit {
  display: none;
  color: var(--main-brand-color);
}
.accordion-trigger .accordion-delete {
  z-index: 1;
  color: var(--main-brand-color);
}
.accordion-trigger .accordion-resume {
  display: none;
  margin-top: 1rem;
  width: 100%;
}
.accordion-trigger .table {
  margin-bottom: 0;
}
.accordion-trigger:hover {
  cursor: pointer;
}
.accordion-trigger:hover .accordion-label {
  color: var(--main-brand-color);
}
.topmessage .accordion-trigger {
  padding: 0;
  align-items: center;
}
.accordion.accordion-alt .accordion-trigger {
  border-top: 1px solid var(--main-ui-color);
  background-color: var(--main-ui-color);
}
.accordion.accordion-alt .accordion-trigger.collapsed {
  background-color: white;
}
.accordion.accordion-alt .collapse,
.accordion.accordion-alt .collapsing {
  padding-left: 1rem;
  padding-right: 1rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.accordion.accordion-alt .radio-message {
  padding: 0;
}
.accordion.accordion-alt .accordion .accordion-trigger {
  border: 0;
}
.accordion-arrow {
  transform: rotate(90deg);
}
.accordion.accordion-small {
  margin-bottom: 0.5rem;
}
.accordion.accordion-small .accordion-trigger {
  padding: 0.5em;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.accordion.accordion-small .accordion-trigger:hover, .accordion.accordion-small .accordion-trigger[aria-expanded=true] {
  color: var(--main-brand-color);
}
.accordion.accordion-no-border .accordion-trigger {
  border: 0;
}
@media (min-width: 768px) {
  .accordion .collapseOnMobileOnly {
    display: block !important;
  }
}
@media (min-width: 768px) {
  .accordion.collapseOnMobileOnly .fa-solid {
    display: none !important;
  }
}
.accordion .o-icon.is-inactive .fa-bullseye {
  display: block;
  color: var(--badge-bg);
}
.accordion .o-icon.is-inactive .fa-bullseye-arrow {
  display: none;
}
.accordion .o-icon.is-active .fa-bullseye {
  display: none;
  color: var(--badge-bg);
}
.accordion .o-icon.is-active .fa-bullseye-arrow {
  display: block;
}
.accordion-group .accordion.accordion-small {
  margin: 0;
}
.accordion-group .accordion.accordion-small ~ div {
  margin-top: 1rem;
}

.topmessage.alert .accordion .alert-message {
  margin-left: 0;
}
.topmessage.alert .accordion .alert-message svg {
  margin-right: 0.25rem;
}

.abc-radio .form-field label {
  padding-left: 0;
}

.abc-radio .form-field label::before {
  display: none;
}

.background-clicable {
  position: fixed;
  height: 100%;
  width: 100%;
  top: 0;
  left: 0;
  background-color: transparent;
}

.form-steps {
  width: 100%;
  max-width: 400px;
  margin: 1rem auto;
}
@media (min-width: 768px) {
  .form-steps {
    margin: 4rem auto;
  }
}
.app-page__center-inner .form-steps {
  display: none;
}
.app-nav .form-steps {
  width: auto;
  flex: 1;
}
@media (min-width: 768px) {
  .app-nav .form-steps {
    margin: 0 auto;
    max-width: 100%;
  }
}

.form-title {
  font-size: 1rem;
  text-transform: uppercase;
  font-weight: bold;
  width: 100%;
  text-align: center;
  color: var(--main-brand-color);
  margin: 1rem 0;
}

.progressbar {
  counter-reset: step;
  display: flex;
  flex-direction: row;
  margin: 0;
  padding: 0;
}

.progressbar li {
  list-style-type: none;
  width: 25%;
  font-size: 12px;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  color: var(--main-ui-color);
}

.progressbar li:before {
  width: 30px;
  height: 30px;
  content: counter(step);
  counter-increment: step;
  line-height: 26px;
  border: 2px solid var(--main-ui-color);
  display: block;
  text-align: center;
  margin: 0 auto 0 auto;
  border-radius: 50%;
  background-color: white;
  font-weight: bold;
}

.progressbar li:after {
  width: 100%;
  height: 2px;
  content: "";
  position: absolute;
  background-color: var(--main-ui-color);
  top: 15px;
  left: -50%;
  z-index: -1;
}

.progressbar li:first-child:after {
  content: none;
}

.progressbar li.active {
  color: var(--main-brand-color);
}

.progressbar li.active:before {
  border-color: var(--main-brand-color);
}

.progressbar li.active + li:after {
  background-color: var(--main-brand-color);
}

.iti__flag {
  width: 20px;
}
.iti__flag.iti__be {
  width: 18px;
}
.iti__flag.iti__ch {
  width: 15px;
}
.iti__flag.iti__mc {
  width: 19px;
}
.iti__flag.iti__ne {
  width: 18px;
}
.iti__flag.iti__np {
  width: 13px;
}
.iti__flag.iti__va {
  width: 15px;
}
@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
  .iti__flag {
    background-size: 5652px 15px;
  }
}
.iti__flag.iti__ac {
  height: 10px;
  background-position: 0px 0px;
}
.iti__flag.iti__ad {
  height: 14px;
  background-position: -22px 0px;
}
.iti__flag.iti__ae {
  height: 10px;
  background-position: -44px 0px;
}
.iti__flag.iti__af {
  height: 14px;
  background-position: -66px 0px;
}
.iti__flag.iti__ag {
  height: 14px;
  background-position: -88px 0px;
}
.iti__flag.iti__ai {
  height: 10px;
  background-position: -110px 0px;
}
.iti__flag.iti__al {
  height: 15px;
  background-position: -132px 0px;
}
.iti__flag.iti__am {
  height: 10px;
  background-position: -154px 0px;
}
.iti__flag.iti__ao {
  height: 14px;
  background-position: -176px 0px;
}
.iti__flag.iti__aq {
  height: 14px;
  background-position: -198px 0px;
}
.iti__flag.iti__ar {
  height: 13px;
  background-position: -220px 0px;
}
.iti__flag.iti__as {
  height: 10px;
  background-position: -242px 0px;
}
.iti__flag.iti__at {
  height: 14px;
  background-position: -264px 0px;
}
.iti__flag.iti__au {
  height: 10px;
  background-position: -286px 0px;
}
.iti__flag.iti__aw {
  height: 14px;
  background-position: -308px 0px;
}
.iti__flag.iti__ax {
  height: 13px;
  background-position: -330px 0px;
}
.iti__flag.iti__az {
  height: 10px;
  background-position: -352px 0px;
}
.iti__flag.iti__ba {
  height: 10px;
  background-position: -374px 0px;
}
.iti__flag.iti__bb {
  height: 14px;
  background-position: -396px 0px;
}
.iti__flag.iti__bd {
  height: 12px;
  background-position: -418px 0px;
}
.iti__flag.iti__be {
  height: 15px;
  background-position: -440px 0px;
}
.iti__flag.iti__bf {
  height: 14px;
  background-position: -460px 0px;
}
.iti__flag.iti__bg {
  height: 12px;
  background-position: -482px 0px;
}
.iti__flag.iti__bh {
  height: 12px;
  background-position: -504px 0px;
}
.iti__flag.iti__bi {
  height: 12px;
  background-position: -526px 0px;
}
.iti__flag.iti__bj {
  height: 14px;
  background-position: -548px 0px;
}
.iti__flag.iti__bl {
  height: 14px;
  background-position: -570px 0px;
}
.iti__flag.iti__bm {
  height: 10px;
  background-position: -592px 0px;
}
.iti__flag.iti__bn {
  height: 10px;
  background-position: -614px 0px;
}
.iti__flag.iti__bo {
  height: 14px;
  background-position: -636px 0px;
}
.iti__flag.iti__bq {
  height: 14px;
  background-position: -658px 0px;
}
.iti__flag.iti__br {
  height: 14px;
  background-position: -680px 0px;
}
.iti__flag.iti__bs {
  height: 10px;
  background-position: -702px 0px;
}
.iti__flag.iti__bt {
  height: 14px;
  background-position: -724px 0px;
}
.iti__flag.iti__bv {
  height: 15px;
  background-position: -746px 0px;
}
.iti__flag.iti__bw {
  height: 14px;
  background-position: -768px 0px;
}
.iti__flag.iti__by {
  height: 10px;
  background-position: -790px 0px;
}
.iti__flag.iti__bz {
  height: 14px;
  background-position: -812px 0px;
}
.iti__flag.iti__ca {
  height: 10px;
  background-position: -834px 0px;
}
.iti__flag.iti__cc {
  height: 10px;
  background-position: -856px 0px;
}
.iti__flag.iti__cd {
  height: 15px;
  background-position: -878px 0px;
}
.iti__flag.iti__cf {
  height: 14px;
  background-position: -900px 0px;
}
.iti__flag.iti__cg {
  height: 14px;
  background-position: -922px 0px;
}
.iti__flag.iti__ch {
  height: 15px;
  background-position: -944px 0px;
}
.iti__flag.iti__ci {
  height: 14px;
  background-position: -961px 0px;
}
.iti__flag.iti__ck {
  height: 10px;
  background-position: -983px 0px;
}
.iti__flag.iti__cl {
  height: 14px;
  background-position: -1005px 0px;
}
.iti__flag.iti__cm {
  height: 14px;
  background-position: -1027px 0px;
}
.iti__flag.iti__cn {
  height: 14px;
  background-position: -1049px 0px;
}
.iti__flag.iti__co {
  height: 14px;
  background-position: -1071px 0px;
}
.iti__flag.iti__cp {
  height: 14px;
  background-position: -1093px 0px;
}
.iti__flag.iti__cr {
  height: 12px;
  background-position: -1115px 0px;
}
.iti__flag.iti__cu {
  height: 10px;
  background-position: -1137px 0px;
}
.iti__flag.iti__cv {
  height: 12px;
  background-position: -1159px 0px;
}
.iti__flag.iti__cw {
  height: 14px;
  background-position: -1181px 0px;
}
.iti__flag.iti__cx {
  height: 10px;
  background-position: -1203px 0px;
}
.iti__flag.iti__cy {
  height: 14px;
  background-position: -1225px 0px;
}
.iti__flag.iti__cz {
  height: 14px;
  background-position: -1247px 0px;
}
.iti__flag.iti__de {
  height: 12px;
  background-position: -1269px 0px;
}
.iti__flag.iti__dg {
  height: 10px;
  background-position: -1291px 0px;
}
.iti__flag.iti__dj {
  height: 14px;
  background-position: -1313px 0px;
}
.iti__flag.iti__dk {
  height: 15px;
  background-position: -1335px 0px;
}
.iti__flag.iti__dm {
  height: 10px;
  background-position: -1357px 0px;
}
.iti__flag.iti__do {
  height: 14px;
  background-position: -1379px 0px;
}
.iti__flag.iti__dz {
  height: 14px;
  background-position: -1401px 0px;
}
.iti__flag.iti__ea {
  height: 14px;
  background-position: -1423px 0px;
}
.iti__flag.iti__ec {
  height: 14px;
  background-position: -1445px 0px;
}
.iti__flag.iti__ee {
  height: 13px;
  background-position: -1467px 0px;
}
.iti__flag.iti__eg {
  height: 14px;
  background-position: -1489px 0px;
}
.iti__flag.iti__eh {
  height: 10px;
  background-position: -1511px 0px;
}
.iti__flag.iti__er {
  height: 10px;
  background-position: -1533px 0px;
}
.iti__flag.iti__es {
  height: 14px;
  background-position: -1555px 0px;
}
.iti__flag.iti__et {
  height: 10px;
  background-position: -1577px 0px;
}
.iti__flag.iti__eu {
  height: 14px;
  background-position: -1599px 0px;
}
.iti__flag.iti__fi {
  height: 12px;
  background-position: -1621px 0px;
}
.iti__flag.iti__fj {
  height: 10px;
  background-position: -1643px 0px;
}
.iti__flag.iti__fk {
  height: 10px;
  background-position: -1665px 0px;
}
.iti__flag.iti__fm {
  height: 11px;
  background-position: -1687px 0px;
}
.iti__flag.iti__fo {
  height: 15px;
  background-position: -1709px 0px;
}
.iti__flag.iti__fr {
  height: 14px;
  background-position: -1731px 0px;
}
.iti__flag.iti__ga {
  height: 15px;
  background-position: -1753px 0px;
}
.iti__flag.iti__gb {
  height: 10px;
  background-position: -1775px 0px;
}
.iti__flag.iti__gd {
  height: 12px;
  background-position: -1797px 0px;
}
.iti__flag.iti__ge {
  height: 14px;
  background-position: -1819px 0px;
}
.iti__flag.iti__gf {
  height: 14px;
  background-position: -1841px 0px;
}
.iti__flag.iti__gg {
  height: 14px;
  background-position: -1863px 0px;
}
.iti__flag.iti__gh {
  height: 14px;
  background-position: -1885px 0px;
}
.iti__flag.iti__gi {
  height: 10px;
  background-position: -1907px 0px;
}
.iti__flag.iti__gl {
  height: 14px;
  background-position: -1929px 0px;
}
.iti__flag.iti__gm {
  height: 14px;
  background-position: -1951px 0px;
}
.iti__flag.iti__gn {
  height: 14px;
  background-position: -1973px 0px;
}
.iti__flag.iti__gp {
  height: 14px;
  background-position: -1995px 0px;
}
.iti__flag.iti__gq {
  height: 14px;
  background-position: -2017px 0px;
}
.iti__flag.iti__gr {
  height: 14px;
  background-position: -2039px 0px;
}
.iti__flag.iti__gs {
  height: 10px;
  background-position: -2061px 0px;
}
.iti__flag.iti__gt {
  height: 13px;
  background-position: -2083px 0px;
}
.iti__flag.iti__gu {
  height: 11px;
  background-position: -2105px 0px;
}
.iti__flag.iti__gw {
  height: 10px;
  background-position: -2127px 0px;
}
.iti__flag.iti__gy {
  height: 12px;
  background-position: -2149px 0px;
}
.iti__flag.iti__hk {
  height: 14px;
  background-position: -2171px 0px;
}
.iti__flag.iti__hm {
  height: 10px;
  background-position: -2193px 0px;
}
.iti__flag.iti__hn {
  height: 10px;
  background-position: -2215px 0px;
}
.iti__flag.iti__hr {
  height: 10px;
  background-position: -2237px 0px;
}
.iti__flag.iti__ht {
  height: 12px;
  background-position: -2259px 0px;
}
.iti__flag.iti__hu {
  height: 10px;
  background-position: -2281px 0px;
}
.iti__flag.iti__ic {
  height: 14px;
  background-position: -2303px 0px;
}
.iti__flag.iti__id {
  height: 14px;
  background-position: -2325px 0px;
}
.iti__flag.iti__ie {
  height: 10px;
  background-position: -2347px 0px;
}
.iti__flag.iti__il {
  height: 15px;
  background-position: -2369px 0px;
}
.iti__flag.iti__im {
  height: 10px;
  background-position: -2391px 0px;
}
.iti__flag.iti__in {
  height: 14px;
  background-position: -2413px 0px;
}
.iti__flag.iti__io {
  height: 10px;
  background-position: -2435px 0px;
}
.iti__flag.iti__iq {
  height: 14px;
  background-position: -2457px 0px;
}
.iti__flag.iti__ir {
  height: 12px;
  background-position: -2479px 0px;
}
.iti__flag.iti__is {
  height: 15px;
  background-position: -2501px 0px;
}
.iti__flag.iti__it {
  height: 14px;
  background-position: -2523px 0px;
}
.iti__flag.iti__je {
  height: 12px;
  background-position: -2545px 0px;
}
.iti__flag.iti__jm {
  height: 10px;
  background-position: -2567px 0px;
}
.iti__flag.iti__jo {
  height: 10px;
  background-position: -2589px 0px;
}
.iti__flag.iti__jp {
  height: 14px;
  background-position: -2611px 0px;
}
.iti__flag.iti__ke {
  height: 14px;
  background-position: -2633px 0px;
}
.iti__flag.iti__kg {
  height: 12px;
  background-position: -2655px 0px;
}
.iti__flag.iti__kh {
  height: 13px;
  background-position: -2677px 0px;
}
.iti__flag.iti__ki {
  height: 10px;
  background-position: -2699px 0px;
}
.iti__flag.iti__km {
  height: 12px;
  background-position: -2721px 0px;
}
.iti__flag.iti__kn {
  height: 14px;
  background-position: -2743px 0px;
}
.iti__flag.iti__kp {
  height: 10px;
  background-position: -2765px 0px;
}
.iti__flag.iti__kr {
  height: 14px;
  background-position: -2787px 0px;
}
.iti__flag.iti__kw {
  height: 10px;
  background-position: -2809px 0px;
}
.iti__flag.iti__ky {
  height: 10px;
  background-position: -2831px 0px;
}
.iti__flag.iti__kz {
  height: 10px;
  background-position: -2853px 0px;
}
.iti__flag.iti__la {
  height: 14px;
  background-position: -2875px 0px;
}
.iti__flag.iti__lb {
  height: 14px;
  background-position: -2897px 0px;
}
.iti__flag.iti__lc {
  height: 10px;
  background-position: -2919px 0px;
}
.iti__flag.iti__li {
  height: 12px;
  background-position: -2941px 0px;
}
.iti__flag.iti__lk {
  height: 10px;
  background-position: -2963px 0px;
}
.iti__flag.iti__lr {
  height: 11px;
  background-position: -2985px 0px;
}
.iti__flag.iti__ls {
  height: 14px;
  background-position: -3007px 0px;
}
.iti__flag.iti__lt {
  height: 12px;
  background-position: -3029px 0px;
}
.iti__flag.iti__lu {
  height: 12px;
  background-position: -3051px 0px;
}
.iti__flag.iti__lv {
  height: 10px;
  background-position: -3073px 0px;
}
.iti__flag.iti__ly {
  height: 10px;
  background-position: -3095px 0px;
}
.iti__flag.iti__ma {
  height: 14px;
  background-position: -3117px 0px;
}
.iti__flag.iti__mc {
  height: 15px;
  background-position: -3139px 0px;
}
.iti__flag.iti__md {
  height: 10px;
  background-position: -3160px 0px;
}
.iti__flag.iti__me {
  height: 10px;
  background-position: -3182px 0px;
}
.iti__flag.iti__mf {
  height: 14px;
  background-position: -3204px 0px;
}
.iti__flag.iti__mg {
  height: 14px;
  background-position: -3226px 0px;
}
.iti__flag.iti__mh {
  height: 11px;
  background-position: -3248px 0px;
}
.iti__flag.iti__mk {
  height: 10px;
  background-position: -3270px 0px;
}
.iti__flag.iti__ml {
  height: 14px;
  background-position: -3292px 0px;
}
.iti__flag.iti__mm {
  height: 14px;
  background-position: -3314px 0px;
}
.iti__flag.iti__mn {
  height: 10px;
  background-position: -3336px 0px;
}
.iti__flag.iti__mo {
  height: 14px;
  background-position: -3358px 0px;
}
.iti__flag.iti__mp {
  height: 10px;
  background-position: -3380px 0px;
}
.iti__flag.iti__mq {
  height: 14px;
  background-position: -3402px 0px;
}
.iti__flag.iti__mr {
  height: 14px;
  background-position: -3424px 0px;
}
.iti__flag.iti__ms {
  height: 10px;
  background-position: -3446px 0px;
}
.iti__flag.iti__mt {
  height: 14px;
  background-position: -3468px 0px;
}
.iti__flag.iti__mu {
  height: 14px;
  background-position: -3490px 0px;
}
.iti__flag.iti__mv {
  height: 14px;
  background-position: -3512px 0px;
}
.iti__flag.iti__mw {
  height: 14px;
  background-position: -3534px 0px;
}
.iti__flag.iti__mx {
  height: 12px;
  background-position: -3556px 0px;
}
.iti__flag.iti__my {
  height: 10px;
  background-position: -3578px 0px;
}
.iti__flag.iti__mz {
  height: 14px;
  background-position: -3600px 0px;
}
.iti__flag.iti__na {
  height: 14px;
  background-position: -3622px 0px;
}
.iti__flag.iti__nc {
  height: 10px;
  background-position: -3644px 0px;
}
.iti__flag.iti__ne {
  height: 15px;
  background-position: -3666px 0px;
}
.iti__flag.iti__nf {
  height: 10px;
  background-position: -3686px 0px;
}
.iti__flag.iti__ng {
  height: 10px;
  background-position: -3708px 0px;
}
.iti__flag.iti__ni {
  height: 12px;
  background-position: -3730px 0px;
}
.iti__flag.iti__nl {
  height: 14px;
  background-position: -3752px 0px;
}
.iti__flag.iti__no {
  height: 15px;
  background-position: -3774px 0px;
}
.iti__flag.iti__np {
  height: 15px;
  background-position: -3796px 0px;
}
.iti__flag.iti__nr {
  height: 10px;
  background-position: -3811px 0px;
}
.iti__flag.iti__nu {
  height: 10px;
  background-position: -3833px 0px;
}
.iti__flag.iti__nz {
  height: 10px;
  background-position: -3855px 0px;
}
.iti__flag.iti__om {
  height: 10px;
  background-position: -3877px 0px;
}
.iti__flag.iti__pa {
  height: 14px;
  background-position: -3899px 0px;
}
.iti__flag.iti__pe {
  height: 14px;
  background-position: -3921px 0px;
}
.iti__flag.iti__pf {
  height: 14px;
  background-position: -3943px 0px;
}
.iti__flag.iti__pg {
  height: 15px;
  background-position: -3965px 0px;
}
.iti__flag.iti__ph {
  height: 10px;
  background-position: -3987px 0px;
}
.iti__flag.iti__pk {
  height: 14px;
  background-position: -4009px 0px;
}
.iti__flag.iti__pl {
  height: 13px;
  background-position: -4031px 0px;
}
.iti__flag.iti__pm {
  height: 14px;
  background-position: -4053px 0px;
}
.iti__flag.iti__pn {
  height: 10px;
  background-position: -4075px 0px;
}
.iti__flag.iti__pr {
  height: 14px;
  background-position: -4097px 0px;
}
.iti__flag.iti__ps {
  height: 10px;
  background-position: -4119px 0px;
}
.iti__flag.iti__pt {
  height: 14px;
  background-position: -4141px 0px;
}
.iti__flag.iti__pw {
  height: 13px;
  background-position: -4163px 0px;
}
.iti__flag.iti__py {
  height: 11px;
  background-position: -4185px 0px;
}
.iti__flag.iti__qa {
  height: 8px;
  background-position: -4207px 0px;
}
.iti__flag.iti__re {
  height: 14px;
  background-position: -4229px 0px;
}
.iti__flag.iti__ro {
  height: 14px;
  background-position: -4251px 0px;
}
.iti__flag.iti__rs {
  height: 14px;
  background-position: -4273px 0px;
}
.iti__flag.iti__ru {
  height: 14px;
  background-position: -4295px 0px;
}
.iti__flag.iti__rw {
  height: 14px;
  background-position: -4317px 0px;
}
.iti__flag.iti__sa {
  height: 14px;
  background-position: -4339px 0px;
}
.iti__flag.iti__sb {
  height: 10px;
  background-position: -4361px 0px;
}
.iti__flag.iti__sc {
  height: 10px;
  background-position: -4383px 0px;
}
.iti__flag.iti__sd {
  height: 10px;
  background-position: -4405px 0px;
}
.iti__flag.iti__se {
  height: 13px;
  background-position: -4427px 0px;
}
.iti__flag.iti__sg {
  height: 14px;
  background-position: -4449px 0px;
}
.iti__flag.iti__sh {
  height: 10px;
  background-position: -4471px 0px;
}
.iti__flag.iti__si {
  height: 10px;
  background-position: -4493px 0px;
}
.iti__flag.iti__sj {
  height: 15px;
  background-position: -4515px 0px;
}
.iti__flag.iti__sk {
  height: 14px;
  background-position: -4537px 0px;
}
.iti__flag.iti__sl {
  height: 14px;
  background-position: -4559px 0px;
}
.iti__flag.iti__sm {
  height: 15px;
  background-position: -4581px 0px;
}
.iti__flag.iti__sn {
  height: 14px;
  background-position: -4603px 0px;
}
.iti__flag.iti__so {
  height: 14px;
  background-position: -4625px 0px;
}
.iti__flag.iti__sr {
  height: 14px;
  background-position: -4647px 0px;
}
.iti__flag.iti__ss {
  height: 10px;
  background-position: -4669px 0px;
}
.iti__flag.iti__st {
  height: 10px;
  background-position: -4691px 0px;
}
.iti__flag.iti__sv {
  height: 12px;
  background-position: -4713px 0px;
}
.iti__flag.iti__sx {
  height: 14px;
  background-position: -4735px 0px;
}
.iti__flag.iti__sy {
  height: 14px;
  background-position: -4757px 0px;
}
.iti__flag.iti__sz {
  height: 14px;
  background-position: -4779px 0px;
}
.iti__flag.iti__ta {
  height: 10px;
  background-position: -4801px 0px;
}
.iti__flag.iti__tc {
  height: 10px;
  background-position: -4823px 0px;
}
.iti__flag.iti__td {
  height: 14px;
  background-position: -4845px 0px;
}
.iti__flag.iti__tf {
  height: 14px;
  background-position: -4867px 0px;
}
.iti__flag.iti__tg {
  height: 13px;
  background-position: -4889px 0px;
}
.iti__flag.iti__th {
  height: 14px;
  background-position: -4911px 0px;
}
.iti__flag.iti__tj {
  height: 10px;
  background-position: -4933px 0px;
}
.iti__flag.iti__tk {
  height: 10px;
  background-position: -4955px 0px;
}
.iti__flag.iti__tl {
  height: 10px;
  background-position: -4977px 0px;
}
.iti__flag.iti__tm {
  height: 14px;
  background-position: -4999px 0px;
}
.iti__flag.iti__tn {
  height: 14px;
  background-position: -5021px 0px;
}
.iti__flag.iti__to {
  height: 10px;
  background-position: -5043px 0px;
}
.iti__flag.iti__tr {
  height: 14px;
  background-position: -5065px 0px;
}
.iti__flag.iti__tt {
  height: 12px;
  background-position: -5087px 0px;
}
.iti__flag.iti__tv {
  height: 10px;
  background-position: -5109px 0px;
}
.iti__flag.iti__tw {
  height: 14px;
  background-position: -5131px 0px;
}
.iti__flag.iti__tz {
  height: 14px;
  background-position: -5153px 0px;
}
.iti__flag.iti__ua {
  height: 14px;
  background-position: -5175px 0px;
}
.iti__flag.iti__ug {
  height: 14px;
  background-position: -5197px 0px;
}
.iti__flag.iti__um {
  height: 11px;
  background-position: -5219px 0px;
}
.iti__flag.iti__un {
  height: 14px;
  background-position: -5241px 0px;
}
.iti__flag.iti__us {
  height: 11px;
  background-position: -5263px 0px;
}
.iti__flag.iti__uy {
  height: 14px;
  background-position: -5285px 0px;
}
.iti__flag.iti__uz {
  height: 10px;
  background-position: -5307px 0px;
}
.iti__flag.iti__va {
  height: 15px;
  background-position: -5329px 0px;
}
.iti__flag.iti__vc {
  height: 14px;
  background-position: -5346px 0px;
}
.iti__flag.iti__ve {
  height: 14px;
  background-position: -5368px 0px;
}
.iti__flag.iti__vg {
  height: 10px;
  background-position: -5390px 0px;
}
.iti__flag.iti__vi {
  height: 14px;
  background-position: -5412px 0px;
}
.iti__flag.iti__vn {
  height: 14px;
  background-position: -5434px 0px;
}
.iti__flag.iti__vu {
  height: 12px;
  background-position: -5456px 0px;
}
.iti__flag.iti__wf {
  height: 14px;
  background-position: -5478px 0px;
}
.iti__flag.iti__ws {
  height: 10px;
  background-position: -5500px 0px;
}
.iti__flag.iti__xk {
  height: 15px;
  background-position: -5522px 0px;
}
.iti__flag.iti__ye {
  height: 14px;
  background-position: -5544px 0px;
}
.iti__flag.iti__yt {
  height: 14px;
  background-position: -5566px 0px;
}
.iti__flag.iti__za {
  height: 14px;
  background-position: -5588px 0px;
}
.iti__flag.iti__zm {
  height: 14px;
  background-position: -5610px 0px;
}
.iti__flag.iti__zw {
  height: 10px;
  background-position: -5632px 0px;
}

.timeline-container {
  position: relative;
  margin: 2rem auto;
  padding: 0 1rem;
}
.timeline-container::after {
  content: "";
  display: block;
  height: calc(100% - 10rem);
  width: 2px;
  background: rgb(207, 207, 207);
  background: linear-gradient(180deg, rgb(207, 207, 207) 6%, rgb(255, 255, 255) 100%);
  position: absolute;
  top: 4rem;
  left: 44px;
  z-index: 1;
}
@media (min-width: 768px) {
  .timeline-container::after {
    left: 67px;
  }
}
.timeline-container-no-title::after {
  top: 0;
}
.timeline-container .is-done::after {
  content: "";
}
.timeline-container .is-done .icone-cours {
  display: none;
}
.timeline-container .is-done .icone-isdone {
  display: block;
  height: 40px;
  width: 40px;
  color: var(--main-brand-color);
  background-color: white;
  border: 3px solid var(--main-brand-color);
  border-radius: 100%;
  padding: 0.2rem;
}
.timeline-container .icone-cours {
  display: block;
}
.timeline-container .icone-isdone {
  display: none;
}
.timeline-header {
  text-transform: uppercase;
  font-weight: bold;
  margin: 0 0 2rem 0;
}
.timeline-title {
  display: flex;
  z-index: 2;
  position: relative;
  padding-bottom: 2rem;
}
.timeline-title h6 {
  margin: 0.5rem 0;
}
.timeline-title .icon {
  padding: 0 0.5rem 0;
}
@media (min-width: 768px) {
  .timeline-title .icon {
    padding: 0 2rem;
  }
}
.timeline-title img {
  background-color: var(--main-brand-color);
  border-radius: 100%;
  max-width: 40px;
}
.timeline-title .icon-white img {
  background-color: transparent;
  border-radius: 0;
}
.timeline-title a {
  color: var(--main-body-color);
  font-weight: normal;
}
.timeline-title a:hover {
  text-decoration: none;
}
.timeline-title-title {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
}
@media (min-width: 768px) {
  .timeline-title-title {
    flex-direction: row;
    justify-content: space-between;
  }
}
.timeline-title-title .btn {
  margin-top: 1rem;
}
@media (min-width: 768px) {
  .timeline-title-title .btn {
    margin: 0;
  }
}
.timeline-title.is-done::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(255, 255, 255, 0.6823529412);
  z-index: 99;
  pointer-events: none;
}
.timeline-content {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  width: 100%;
}
@media (min-width: 768px) {
  .timeline-content {
    flex-direction: row;
  }
}
.timeline-content .stat-container {
  display: flex;
  flex-direction: column;
  flex: 1;
  text-align: center;
  padding: 1rem 0;
  align-items: center;
}
.timeline-step {
  background-color: var(--main-ui-color);
  padding: 1rem;
  z-index: 2;
  position: relative;
  margin-bottom: 2rem;
  border-top: 2rem solid white;
}
.timeline-step-header {
  font-weight: bold;
  text-transform: uppercase;
  margin: 0 0 1rem 0;
}
.timeline-step-header a {
  color: var(--main-body-color);
}
.timeline-step-title {
  display: flex;
  z-index: 2;
  position: relative;
}
.timeline-step-title .icon {
  padding: 0 2rem 0 1rem;
  width: auto;
  height: auto;
}
.timeline-step-title img {
  max-width: 45px;
  width: 100px;
}

.tab-pane .timeline-container::after {
  left: 40px;
  top: 0;
}
@media (min-width: 768px) {
  .tab-pane .timeline-container::after {
    left: 64px;
  }
}

/* le cursus dans la page de prestation (per/post) */
#myServiceCursusTab .timeline-container {
  padding: 0;
}
#myServiceCursusTab .timeline-container::after {
  top: 4rem;
  left: 24px;
}
@media (min-width: 768px) {
  #myServiceCursusTab .timeline-container::after {
    left: 48px;
  }
}

/* Suivi Single */
.app-suivi {
  padding: 0 1rem 100px;
  width: 100%;
  /* Les infos en liste <ul> */
  /* Liste des dates disponibles */
}
.app-suivi.iframe-no {
  padding-top: 100px;
}
@media (min-width: 768px) {
  .app-suivi {
    padding-bottom: 0;
  }
}
.app-suivi-single {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .app-suivi-single {
    flex-direction: row;
    height: 100%;
    width: 100vw;
    overflow: auto;
    background-color: white;
    padding-bottom: 100px;
    margin: 0 -1rem;
  }
}
.app-suivi-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around;
  width: 100%;
  padding: 1rem 0 2rem;
  margin: 1rem 0;
  align-items: center;
}
@media (min-width: 768px) {
  .app-suivi-stats {
    justify-content: center;
  }
}
.app-suivi-stats .stat-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 1rem;
}
@media (min-width: 768px) {
  .app-suivi-stats .stat-container {
    margin: 2rem;
  }
}
.app-suivi-stats .stat {
  display: block;
  width: 120px;
  position: relative;
}
@media (min-width: 768px) {
  .app-suivi-stats .stat {
    width: 150px;
  }
}
.app-suivi-stats .stat svg {
  width: 100%;
}
.app-suivi-stats .stat svg .c3-chart-arcs-background {
  fill: var(--main-ui-color);
}
.app-suivi-stats .badge {
  /* badges */
  display: flex;
  align-items: center;
  justify-content: center;
  width: 150px;
  position: relative;
}
.app-suivi-stats .badge img {
  height: 100px;
  width: 100px;
  margin: 0 auto;
}
.app-suivi-stats-grid {
  display: grid;
  grid-template-columns: 50% auto;
  grid-template-rows: 50%;
  column-gap: 1rem;
  row-gap: 1rem;
  width: 100%;
  justify-items: center;
  align-items: center;
}
@media (min-width: 768px) {
  .app-suivi-stats-grid {
    grid-template-columns: 25% auto;
    grid-template-rows: 25%;
  }
}
.app-suivi-stats-grid .stat-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: 0 2rem;
  width: 100%;
}
.app-suivi-stats-grid .stat {
  display: block;
  width: 150px;
  position: relative;
}
.app-suivi-stats-grid .stat svg {
  width: 100%;
}
.app-suivi-stats-grid .stat svg .c3-chart-arcs-background {
  fill: var(--main-ui-color);
}
.app-suivi__header {
  background-color: white;
  padding: 1rem 1rem 0 0;
  margin: 0;
}
@media (min-width: 768px) {
  .app-suivi__header {
    height: auto;
    padding: 1rem 0;
    margin: 0;
  }
}
.app-suivi__header__title {
  font-size: 1.2em;
  font-weight: bold;
  display: flex;
  align-items: center;
  width: 100%;
}
.app-suivi__content {
  background-color: white;
  order: 2;
}
@media (min-width: 768px) {
  .app-suivi__content {
    order: 1;
    width: 50vw;
    height: 100%;
    padding: 0 2rem;
    margin: 0;
    max-width: 770px;
    margin-left: auto;
  }
}
.app-suivi__more {
  margin-top: 1rem;
  order: 1;
}
@media (min-width: 768px) {
  .app-suivi__more {
    order: 2;
    width: 50vw;
    height: 100%;
    padding: 1rem 2rem 10em 2rem;
    margin: 0;
    overflow: auto;
    max-width: 770px;
    margin-right: auto;
  }
}
.app-suivi__price {
  align-items: center;
  padding: 1rem;
  background-color: var(--main-ui-color);
}
.app-suivi__price .mme-input-qt {
  margin: 0;
}
.app-suivi__image {
  display: flex;
  position: relative;
  width: 100%;
  justify-content: center;
  background-color: var(--main-ui-color);
  border-radius: 0.5rem;
  margin: 0 0 1rem;
}
@media (min-width: 768px) {
  .app-suivi__image {
    margin: 1rem 0;
  }
}
.app-suivi__image img {
  margin: 0 auto;
  height: 25vh;
  width: 100vw;
  object-position: center;
}
.app-suivi__image img.contain {
  object-fit: contain;
}
.app-suivi__image img.cover {
  object-fit: cover;
}
@media (min-width: 768px) {
  .app-suivi__image img {
    width: 100%;
    height: 33vh;
    object-position: center;
  }
  .app-suivi__image img.contain {
    object-fit: contain;
  }
  .app-suivi__image img.cover {
    object-fit: cover;
  }
}
.app-suivi__image__title {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: flex;
  height: 100%;
  width: 100%;
  justify-content: flex-start;
  align-items: center;
  padding: 0 1rem;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .app-suivi__image__title {
    padding: 0 2rem;
  }
}
.app-suivi__image__title h2 {
  color: white;
  max-width: 1510px;
  margin: 0 auto;
  background-color: transparent;
  padding: 0.5rem;
  font-size: 2rem;
  font-weight: lighter;
  border-radius: 5px;
  text-align: center;
  width: 100%;
  position: relative;
  z-index: 4;
}
@media (min-width: 768px) {
  .app-suivi__image__title h2 {
    font-size: 3em;
    text-align: left;
  }
}
.app-suivi__image__title::after {
  content: "";
  height: 100%;
  width: 100%;
  z-index: 3;
  background-color: rgba(0, 0, 0, 0.33);
  position: absolute;
  top: 0;
  left: 0;
}
.app-suivi__footer {
  background-color: var(--main-ui-dark);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
@media (min-width: 768px) {
  .app-suivi__footer {
    width: 100vw;
    margin: 0;
    padding: 0;
  }
}
.app-suivi .icon-product {
  margin-right: 1rem;
}
.app-suivi .content__list {
  border-top: 1px solid var(--main-ui-color);
  margin: 0 -1rem;
  padding: 0 1rem;
  list-style: none;
}
.app-suivi .content__list li {
  border-bottom: 1px solid var(--main-ui-color);
  margin: 0 -1rem;
  padding: 0 1rem;
}
.app-suivi .content__list .label {
  width: 25%;
  min-width: 8em;
  display: inline-block;
  color: var(--badge-bg);
}
.app-suivi__dates {
  margin: 0 -1rem;
  padding: 2rem;
  padding-bottom: 100px;
}
.app-suivi__dates .date {
  font-weight: bold;
  font-size: 1rem;
}
.app-suivi__price {
  background-color: var(--main-ui-color);
  padding: 1rem;
  align-items: center;
}
.app-suivi__price .mme-input-qt {
  margin-bottom: 0;
}

@media (min-width: 768px) {
  .app-product__dates .date {
    font-weight: bold;
    font-size: 120%;
  }
}
.app-product-list__place {
  display: flex;
  margin-top: 1rem;
}

/* liste dates */
.app-product-list--row {
  width: 100%;
  font-size: 80%;
}
.mme-cart-item .app-product-list--row {
  width: 100%;
  justify-content: flex-start;
  margin-bottom: 1rem;
}

.icon-product {
  margin-right: 0.5rem;
}

@media (min-width: 768px) {
  .app-product-list--row {
    width: 50vw;
    display: flex;
    justify-content: space-around;
    flex: 1;
    font-size: 100%;
  }
  .mme-cart-item .app-product-list--row {
    width: 100%;
    justify-content: flex-start;
    margin-bottom: 1rem;
  }
  .app-product-list__place {
    margin-top: 0;
    margin-left: 1rem;
  }
}
.irs--round .irs-bar {
  top: 36px;
  height: 4px;
  background-color: var(--main-brand-color);
}

.irs--round .irs-handle {
  top: 26px;
  width: 24px;
  height: 24px;
  border: 4px solid var(--main-brand-color);
  background-color: white;
  border-radius: 24px;
  box-shadow: 0 1px 3px rgba(0, 0, 255, 0.3);
}

.irs--round .irs-from, .irs--round .irs-to, .irs--round .irs-single {
  font-size: 14px;
  line-height: 1;
  text-shadow: none;
  padding: 3px 5px;
  background-color: var(--main-brand-color);
  color: white;
  border-radius: 4px;
}

.irs--round .irs-from:before, .irs--round .irs-to:before, .irs--round .irs-single:before {
  position: absolute;
  display: block;
  content: "";
  bottom: -6px;
  left: 50%;
  width: 0;
  height: 0;
  margin-left: -3px;
  overflow: hidden;
  border: 3px solid transparent;
  border-top-color: var(--main-brand-color);
}

.irs-disabled {
  opacity: 0.8;
}

.table td {
  border-top: 1px solid var(--main-ui-color);
}
.table tr:first-child td {
  border-top: 0;
}
.table.table--price td + td {
  white-space: nowrap;
}
.table.table--price td {
  font-size: 75%;
  padding: 0.2em 0;
}
@media screen and (min-width: 768px) {
  .table.table--price td {
    font-size: 100%;
    padding: 0.75em;
  }
}
.table.table--small td {
  white-space: nowrap;
}
.table.table--small td + td {
  width: 100%;
}
.table.table--small td {
  color: var(--main-ui-dark);
  font-size: 0.9em;
  padding: 0.2em 0;
}
.table.table--dark th {
  background-color: var(--main-ui-dark);
  color: var(--main-ui-color);
}
.table.table--dark td {
  background-color: var(--main-ui-dark);
  color: var(--main-ui-color);
  width: 50%;
}
.table.table--light th {
  background-color: var(--main-ui-color);
  color: var(--main-ui-dark);
}
.table.table--light td {
  background-color: var(--main-ui-color);
  color: var(--main-ui-dark);
  width: 50%;
}
@media screen and (max-width: 767px) {
  .table.table--is-responsive tr {
    display: flex;
    flex-wrap: wrap;
  }
  .table.table--is-responsive td {
    width: 100%;
  }
}
.floating-cart-items .table td {
  padding: 0;
}
.table .label {
  color: var(--main-ui-dark);
  opacity: 0.7;
}

.dataTables_info,
.dataTables_paginate,
.dataTables_length,
.dataTables_filter {
  display: none;
}

@media screen and (max-width: 767px) {
  .table-responsive {
    font-size: 13px;
  }
}
.table-responsive .table-row {
  display: flex;
  width: 100%;
  justify-content: space-between;
}
.table-responsive .table-row.row-head {
  border-bottom: 1px solid var(--main-ui-color);
  color: var(--main-ui-dark);
  font-weight: bold;
  font-size: 0.8em;
}
@media screen and (max-width: 767px) {
  .table-responsive .table-row.row-head {
    display: none;
  }
}
.table-responsive .table-row.row-cells:nth-child(even) {
  background-color: var(--main-ui-color);
  color: var(--main-ui-dark);
}
.table-responsive .table-row .table-cell {
  text-align: center;
  padding: 0.35em;
  flex: 1;
}
.table-responsive .table-row .table-cell.open {
  color: red;
}
.table-responsive .table-row .table-cell.payed {
  color: green;
}

.rating-list li i.yellow {
  color: var(--main-brand-color);
}

.rating-list li i.gray {
  color: #eee;
}

.rating-list li i.white {
  color: #eee;
}

.list-inline > li {
  display: inline-block;
  padding-right: 5px;
  padding-left: 5px;
}
.list-inline > li:hover {
  cursor: pointer;
}

.rating-list li {
  padding: 0px;
  font-size: 2.5rem;
  position: relative;
}

.rating-list .fa-square {
  display: flex;
  align-items: center;
}
.rating-list .fa-square span {
  position: absolute;
  color: white;
  font-size: 1rem;
  left: 0;
  width: 100%;
  text-align: center;
}

.map.active {
  height: 350px;
  margin-bottom: 1rem;
}

.maps .map-directions {
  text-align: center;
}
.maps .map-directions a {
  display: inline-block;
  font-size: 1.5rem;
  padding: 0.5rem;
  margin: 0 0.5rem;
  color: var(--main-brand-color);
}
.maps .map-directions a:hover {
  color: var(--main-brand-color-alpha);
}

.mme-marker-icon::before {
  font-family: "Font Awesome 6 Pro";
  content: "\f3c5";
  position: absolute;
  color: var(--main-brand-color);
  font-size: 30px;
  position: absolute;
  top: -30px;
  left: -50%;
  font-weight: 900;
}

.chart-brand {
  color: var(--main-brand-color);
}

.chart-responsive {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.chart-responsive .stat-container {
  width: 33%;
}
@media (min-width: 768px) {
  .chart-responsive .stat-container {
    width: 33%;
  }
}
.chart-responsive .chart-legend {
  display: inline-block;
  width: 100%;
  text-align: center;
  font-weight: bold;
}

/*! Flickity v2.2.2
https://flickity.metafizzy.co
---------------------------------------------- */
.flickity-enabled {
  position: relative;
}

.flickity-enabled:focus {
  outline: none;
}

.flickity-viewport {
  overflow: hidden;
  position: relative;
  height: 100%;
}

.flickity-slider {
  position: absolute;
  width: 100%;
  height: 100%;
}

/* draggable */
.flickity-enabled.is-draggable {
  -webkit-tap-highlight-color: transparent;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.flickity-enabled.is-draggable .flickity-viewport {
  cursor: move;
  cursor: -webkit-grab;
  cursor: grab;
}

.flickity-enabled.is-draggable .flickity-viewport.is-pointer-down {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

/* ---- flickity-button ---- */
.flickity-button {
  position: absolute;
  background: hsla(0, 0%, 100%, 0.75);
  border: none;
  color: #333;
}

.flickity-button:hover {
  background: white;
  cursor: pointer;
}

.flickity-button:focus {
  outline: none;
  box-shadow: 0 0 0 5px #19f;
}

.flickity-button:active {
  opacity: 0.6;
}

.flickity-button:disabled {
  opacity: 0.3;
  cursor: auto;
  /* prevent disabled button from capturing pointer up event. #716 */
  pointer-events: none;
}

.flickity-button-icon {
  fill: currentColor;
}

/* ---- previous/next buttons ---- */
.flickity-prev-next-button {
  top: 50%;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  /* vertically center */
  transform: translateY(-50%);
}

.flickity-prev-next-button.previous {
  left: 10px;
}

.flickity-prev-next-button.next {
  right: 10px;
}

/* right to left */
.flickity-rtl .flickity-prev-next-button.previous {
  left: auto;
  right: 10px;
}

.flickity-rtl .flickity-prev-next-button.next {
  right: auto;
  left: 10px;
}

.flickity-prev-next-button .flickity-button-icon {
  position: absolute;
  left: 20%;
  top: 20%;
  width: 60%;
  height: 60%;
}

/* ---- page dots ---- */
.flickity-page-dots {
  position: absolute;
  width: 100%;
  bottom: -25px;
  padding: 0;
  margin: 0;
  list-style: none;
  text-align: center;
  line-height: 1;
}
@media (min-width: 768px) {
  .section .flickity-page-dots {
    bottom: auto;
    top: -1.5rem;
    right: 0;
    left: auto;
    text-align: right;
  }
}
.flickity-page-dots li:only-child {
  display: none;
}

.flickity-rtl .flickity-page-dots {
  direction: rtl;
}

.flickity-page-dots .dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin: 0 8px;
  background: #333;
  border-radius: 50%;
  opacity: 0.25;
  cursor: pointer;
}

.flickity-page-dots .dot.is-selected {
  opacity: 1;
}

.app-content-quiz {
  background-color: white;
}
.app-content-quiz .app-page {
  background-color: white;
}
.app-content-quiz .app-page__center {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  margin-bottom: 80px;
}
.app-content-quiz .app-page__1col,
.app-content-quiz .app-page__2col {
  background-color: white;
  border-radius: 5px;
  border: 1px solid var(--main-ui-dark-color);
  padding: 0;
}

.quiz-header {
  display: flex;
  justify-content: space-between;
  padding: 0.5rem;
  background-color: var(--main-ui-color);
  width: 100vw;
  margin-top: -2rem;
  margin-left: -2rem;
  margin-right: -2rem;
  position: sticky;
  top: 57px;
  z-index: 1;
}
@media (min-width: 768px) {
  .quiz-header {
    width: 100%;
    margin-bottom: 1rem;
    position: relative;
    top: auto;
    border-radius: 5px;
  }
}

.quiz-counter {
  background-color: white;
  border-radius: 5px;
  border: 1px solid var(--main-ui-dark-color);
  padding: 0 0.5rem;
  letter-spacing: 1px;
}

.app-quiz {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .app-quiz {
    max-width: 1440px;
    margin: 0 auto;
    flex-direction: row;
  }
}
.app-quiz-column {
  display: flex;
  flex-direction: column;
  padding: 1rem;
}
.app-quiz .app-quiz-image {
  margin-left: -1rem;
  margin-right: -1rem;
}
@media (min-width: 768px) {
  .app-quiz .app-quiz-image {
    width: 55%;
    padding-right: 1rem;
    margin: 0;
  }
}
@media (min-width: 768px) {
  .app-quiz .app-quiz-side {
    width: 45%;
    padding-left: 1rem;
  }
}
.app-quiz-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around;
  width: 100%;
  margin-bottom: 1rem;
  align-items: center;
}
.app-quiz-stats .stat-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
}
.app-quiz-stats .stat {
  display: block;
  width: 120px;
  position: relative;
}
.app-quiz-header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-around;
  width: 100%;
  margin-bottom: 1rem;
  align-items: center;
  border-bottom: 1px solid var(--main-ui-color);
  padding-bottom: 1rem;
}
.app-quiz-header .stat-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin-bottom: 1rem;
}
.app-quiz-header .stat {
  display: block;
  width: 120px;
  position: relative;
}
.app-quiz-header .tentative {
  width: 25%;
  border: 1px solid var(--main-ui-color);
  border-radius: 5px;
}
.app-quiz-header .tentative h3 {
  font-size: 3em;
}
.app-quiz-floater {
  background-color: white;
}
.app-quiz-floater .progress-bar {
  background-color: var(--main-brand-color);
}
.app-quiz .accordion .accordion-trigger {
  display: flex;
}
.app-quiz .accordion .accordion-content {
  flex: 1;
  padding: 0 1rem;
}
.app-quiz .accordion .failure {
  width: 40px;
  height: 40px;
}
.app-quiz-image .zoom {
  position: absolute;
  bottom: 0.5em;
  right: 0.5em;
  background-color: white;
  border-radius: 100%;
  height: 1.5rem;
  width: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}

.quiz-form {
  margin: 0 0 1rem 0;
}
.quiz-form .form-check {
  padding: 1rem;
  border-bottom: 1px solid var(--main-ui-color);
}
.quiz-form .form-check:first-child {
  border-top: 1px solid var(--main-ui-color);
}
.quiz-form .form-check .form-check-label {
  flex: 1;
  font-size: 0.9rem;
  font-weight: bolder;
}
.quiz-form .form-check .alert {
  margin-top: 1rem;
  background-color: white;
}
.quiz-form .abc-checkbox-success {
  background-color: rgba(76, 175, 79, 0.1607843137);
}
.quiz-form .abc-checkbox-success label::before {
  border: 2px solid #4caf50 !important;
}
.quiz-form .abc-checkbox-danger {
  background-color: rgba(220, 53, 70, 0.1058823529);
}
.quiz-form .abc-checkbox-danger label::before {
  border: 2px solid #dc3545 !important;
}
.quiz-form .abc-checkbox-empty-success {
  background-color: rgba(76, 175, 79, 0.1607843137);
}
.quiz-form .abc-checkbox-empty-success label::before {
  border: 2px solid #4caf50;
}
.quiz-form .abc-checkbox-empty-danger {
  background-color: rgba(220, 53, 70, 0.1058823529);
}
.quiz-form .abc-checkbox-empty-danger label::before {
  border: 2px solid #dc3545;
}
.quiz-form .abc-checkbox-success input[type=checkbox]:checked + label::before,
.quiz-form .abc-checkbox-success input[type=radio]:checked + label::before {
  background-color: #4caf50;
}
.quiz-form .abc-checkbox-danger input[type=checkbox]:checked + label::before,
.quiz-form .abc-checkbox-danger input[type=radio]:checked + label::before {
  background-color: #dc3545;
}

.quiz-grid {
  padding: 0.4em;
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  gap: 0.4em;
}
@media (min-width: 768px) {
  .quiz-grid {
    gap: 1em;
    padding: 1em;
    grid-template-columns: repeat(10, 1fr);
  }
}
.quiz-grid-item {
  border: 1px solid var(--main-ui-color);
  border-radius: 5px;
  width: 25px;
  height: 25px;
  line-height: 25px;
  text-align: center;
  position: relative;
}
@media (min-width: 768px) {
  .quiz-grid-item {
    width: 40px;
    height: 40px;
    line-height: 40px;
  }
}
.quiz-grid-item:hover {
  opacity: 0.6;
}
.quiz-grid-item.quiz-success {
  background-color: #cbff8e;
  border: 0;
}
.quiz-grid-item.quiz-fail {
  background-color: #ffb6b6;
  border: 0;
}
.quiz-grid-item a {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  color: var(--main-body-color);
}
.quiz-grid-item a:hover {
  text-decoration: none;
}

.floating-quiz-bg,
.floating-quizMenu-bg {
  opacity: 0.5;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: var(--main-ui-dark);
  display: none;
  z-index: 997;
}
.floating-quiz-bg.show,
.floating-quizMenu-bg.show {
  display: block;
}

.app-quiz__top {
  width: 100%;
  background-color: transparent;
  opacity: 1;
  top: -1000px;
  transition: all ease-in-out 0.3s;
  right: 1rem;
  z-index: 998;
}
@media (min-width: 768px) {
  .app-quiz__top {
    width: auto;
    max-width: fit-content;
    right: 1rem;
    left: auto;
  }
}
.app-quiz__top > div {
  background-color: white;
}

.app-quizMenu__top {
  width: 100%;
  background-color: transparent;
  opacity: 1;
  top: -1000px;
  transition: all ease-in-out 0.3s;
  z-index: 998;
  width: auto;
  max-width: 300px;
}
@media (min-width: 768px) {
  .app-quizMenu__top {
    max-width: 300px;
    right: 0;
    left: auto;
  }
}

.app-elearningMenu__top {
  width: 100%;
  background-color: transparent;
  opacity: 1;
  top: -1000px;
  transition: all ease-in-out 0.3s;
  z-index: 998;
  width: auto;
  max-width: 100%;
}
@media (min-width: 768px) {
  .app-elearningMenu__top {
    max-width: 300px;
    right: 0;
    left: auto;
  }
}

.sidebar-menu {
  display: flex;
  flex-direction: column;
  list-style: none;
  margin: 0;
  padding: 0;
  max-width: 300px;
}
.sidebar-menu li {
  margin: 0;
  padding: 0;
}
.sidebar-menu li a {
  display: flex;
  align-items: center;
  padding: 1rem;
  border-bottom: 1px solid var(--main-ui-color);
  color: var(--main-body-color);
}
.sidebar-menu .sidebar-menu .sidebar-icon {
  padding-left: 2rem;
}

.app-quizMenu {
  background-color: white;
  overflow: auto;
  height: auto;
  max-height: 85vh;
}
.hideQuizMenu .app-quizMenu {
  height: 0;
}
.app-quizMenu * {
  font-size: 0.8rem;
}
.app-elearning-sommaire .app-quizMenu {
  width: 100%;
  height: auto;
  max-height: 100%;
}
.app-quizMenu h3 {
  font-weight: bold;
  padding: 1rem;
}
.app-quizMenu h4 {
  font-weight: bold;
  padding: 1rem;
  margin-bottom: 0;
}
.app-quizMenu .accordion:not(:last-child) {
  border-bottom: 1px solid white;
}
.app-quizMenu .accordion-trigger {
  background-color: var(--main-ui-color);
  padding: 0;
  margin: 0;
  align-items: center;
}
.app-quizMenu .accordion-trigger .accordion-arrow {
  margin-left: auto;
  margin-right: 1rem;
  font-size: 1.5rem;
  color: var(--main-body-color);
}
.app-quizMenu .accordion-trigger h4 a {
  color: var(--main-body-color);
}
.app-quizMenu .sidebar-menu {
  position: relative;
  width: 100%;
  max-width: 100%;
}
.app-quizMenu .sidebar-menu::before {
  content: "";
}
.app-quizMenu .sidebar-menu li a {
  font-size: 1rem;
}
.app-quizMenu .sidebar-menu li a i {
  font-size: 1rem;
}
.app-quizMenu .sidebar-menu li a:hover {
  color: var(--main-brand-color);
  text-decoration: none;
  background-color: var(--main-ui-color) !important;
}
.app-quizMenu .sidebar-menu li a:hover .color {
  fill: var(--main-brand-color-alpha);
}
.app-quizMenu .sidebar-menu li a:hover .color-stroke {
  stroke: var(--main-brand-color);
}

.app-content-elearning .app-page__center {
  display: flex;
  justify-content: center;
  align-items: center;
}
.app-page__center .app-elearning-presentation p:hover {
  cursor: pointer;
}
.app-page__center .app-elearning-presentation p.js-Favorite .fa {
  color: var(--main-brand-color);
}
.app-page__center .app-elearning-presentation .js-hover i {
  color: var(--main-brand-color);
}
.app-page__center .app-elearning {
  padding: 0;
  padding-bottom: 4rem;
  flex-direction: column;
}
@media (min-width: 768px) {
  .app-page__center .app-elearning {
    flex-direction: row;
    padding-top: 2rem;
    gap: 2rem;
    padding: 2rem 1rem;
  }
}
.app-page__center .app-elearning-intro {
  height: 50vh;
  margin: 0 auto;
  text-align: center;
  width: 100%;
}
.app-page__center .app-elearning-intro img {
  height: 100%;
}
.app-page__center .app-elearning .app-elearning-image {
  flex: 1;
}
.app-page__center .app-elearning .app-elearning-sommaire {
  margin: 0 3vw;
  border: 1px solid var(--badge-bg);
  border-radius: 1rem;
  overflow: hidden;
  height: fit-content;
  position: sticky;
  top: 70px;
}
@media (min-width: 768px) {
  .app-page__center .app-elearning .app-elearning-sommaire {
    width: 25%;
    margin: 0;
  }
  .sommaire .app-page__center .app-elearning .app-elearning-sommaire {
    width: 50%;
  }
}

.page-progress {
  position: fixed;
  top: 61px;
  left: 0;
  width: 100%;
  height: 3px;
  background: transparent;
  z-index: 1;
}
.page-progress .bar {
  height: 100%;
  width: 0;
  background: var(--main-brand-color);
  transition: background 0.15s ease;
}

.hero-image-text-center {
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  min-height: 200px;
}
.hero-image-text-center img {
  position: absolute;
  z-index: 1;
  height: 100%;
  object-fit: cover;
}
.hero-image-text-center .hero-text {
  position: relative;
  z-index: 2;
  color: var(--main-body-color);
  font-weight: bold;
  background-color: white;
  max-width: 50%;
  text-align: center;
  display: inline-block;
  padding: 1rem;
}

.hero-facture {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .hero-facture {
    flex-direction: row;
  }
}
.hero-facture > div {
  padding: 2rem;
  padding-top: 4rem;
  position: relative;
}
.hero-facture .price {
  background-color: var(--main-ui-color);
  display: flex;
  align-items: end;
  line-height: 1;
}
.hero-facture .price h1 {
  font-weight: bold;
  font-size: 3rem;
  line-height: 1;
  color: var(--main-brand-color);
}
.hero-facture .price span {
  font-size: 1rem;
}
.hero-facture h5 {
  position: absolute;
  top: 0;
  left: 0;
  padding: 1rem;
  font-size: 0.8rem;
  color: var(--main-ui-dark-alpha);
  text-transform: uppercase;
}
@media (min-width: 768px) {
  .hero-facture .price {
    width: 33%;
  }
}
.hero-facture .data {
  padding: 1rem;
  padding-top: 3rem;
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .hero-facture .data {
    flex-direction: row;
    padding-top: 4rem;
  }
}
.hero-facture .data .message {
  color: var(--main-brand-color);
}
.hero-facture .data .data-content {
  display: flex;
  flex-direction: column;
}
@media (min-width: 768px) {
  .hero-facture .data .data-content {
    flex-direction: row;
  }
}
.hero-facture .data .data-content p {
  margin-bottom: 0;
}
.hero-facture .data .data-content .btn {
  margin-top: 1rem;
  margin-bottom: 1rem;
}
@media (min-width: 768px) {
  .hero-facture .data .data-content .btn {
    margin: 0;
  }
}
.hero-facture .preferences {
  padding: 1rem;
  padding-top: 3rem;
  background-color: var(--main-ui-color);
}
@media (min-width: 768px) {
  .hero-facture .preferences {
    padding-top: 4rem;
  }
}

.c-widget {
  min-height: 200px;
  background-color: white;
  border-radius: 15px;
  padding: 1rem;
}
.c-widget .c-widget-link {
  color: var(--main-body-color);
  transition: all 0.1s ease-in-out;
  border-radius: 15px;
  border: 1px solid transparent;
  display: block;
}
.c-widget .c-widget-link:hover {
  border: 1px solid var(--main-brand-color-alpha);
  text-decoration: none;
}
.c-widget .c-widget-footer {
  justify-content: center;
  display: flex;
  padding-bottom: 2rem;
}
.c-widget.c-widget-quiz, .c-widget.c-widget-cours, .c-widget.c-widget-eval {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.c-widget.c-widget-quiz .c-widget-title, .c-widget.c-widget-cours .c-widget-title, .c-widget.c-widget-eval .c-widget-title {
  color: var(--main-body-color);
  font-size: 1.3rem;
  padding: 1rem;
  text-align: center;
}
.c-widget.c-widget-quiz .c-widget-content, .c-widget.c-widget-cours .c-widget-content, .c-widget.c-widget-eval .c-widget-content {
  flex: 1;
  display: flex;
  justify-content: center;
  width: 100%;
}
.c-widget.c-widget-quiz .c-widget-content .chart-brand, .c-widget.c-widget-cours .c-widget-content .chart-brand, .c-widget.c-widget-eval .c-widget-content .chart-brand {
  height: 100%;
}

.fullscreen-video {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 999;
}

.app-elearning-container {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 999;
  display: flex;
  justify-content: center;
  height: 100%;
  align-items: center;
}

.full-width {
  width: 100vw;
  position: relative;
  left: 50%;
  right: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
}

.container {
  width: 100%;
}

.app-container-large {
  width: 100%;
}
@media (min-width: 768px) {
  .app-container-large {
    max-width: 1280px;
    margin: 0 auto;
  }
}
.app-container-large .mbsc-calendar {
  height: 100% !important;
}

/* typographic */
.header-cart-label {
  font-weight: 300;
  text-transform: uppercase;
  color: black;
  font-size: 12px;
}

.text-button {
  font-weight: 700;
  text-transform: uppercase;
  color: black;
  font-size: 12px;
}

.text-small {
  font-size: 12px;
}

.text-gray {
  color: #676a6c;
}

.text-brand {
  color: var(--main-brand-color);
}

.app-header {
  font-weight: 700;
  text-transform: uppercase;
  color: black;
  font-size: 12px;
  position: fixed;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  border-color: var(--main-ui-color);
  border-width: 0 0 1px 0;
  border-style: solid;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 777;
  width: 100vw;
}

/* variante pour le header du tableau de bord */
.app-header-main {
  position: relative;
  background-color: transparent;
  border: 0;
}

body.main,
body.mon-compte {
  background-color: var(--main-ui-color);
}

.app-nav {
  border-color: var(--main-ui-color);
  border-width: 0 1px 0 0;
  border-style: solid;
  flex-grow: 1;
  position: relative;
  overflow: hidden;
  display: flex;
}
.app-header-main .app-nav {
  border: 0;
}

.app-title {
  border-color: var(--main-ui-color);
  border-width: 0 0 0 1px;
  border-style: solid;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  width: 100%;
  letter-spacing: 1px;
}
.app-title-main {
  color: var(--main-body-color);
  font-weight: bold;
  font-size: 11px;
  text-align: center;
}
@media (min-width: 1024px) {
  .app-title-main {
    font-size: 0.9em;
  }
}
.app-title-sub {
  color: var(--main-body-color);
  padding: 0 0.5rem;
  text-align: center;
  font-weight: normal;
  font-size: 7px;
}
@media (min-width: 768px) {
  .app-title-sub {
    font-size: 0.9em;
  }
}

.app-cart {
  border-color: var(--main-ui-color);
  border-width: 0 1px 0 0;
  border-style: solid;
}
.app-cart a {
  height: 60px;
  display: flex;
  align-items: center;
  padding: 0 1rem;
}
.app-cart #jsAppCart.is-full {
  display: flex;
}
.app-cart #jsAppCart .icon-cart svg .number-bg,
.app-cart #jsAppCart .icon-cart svg circle {
  fill: var(--main-brand-color);
}
.app-cart__footer .cart-subnav {
  position: fixed;
  bottom: 0;
  background-color: var(--main-ui-color);
}
.app-cart__footer.hideCart .cart-subnav {
  position: relative;
}

.app-close a {
  color: var(--main-body-color);
}
.app-close a:hover {
  cursor: pointer;
  color: var(--main-brand-color);
}
.app-close a:hover rect {
  fill: var(--main-badge-bg);
}

.js-nav-link {
  display: block;
  text-decoration: none;
}

.js-nav-link:hover {
  text-decoration: none;
}

.app-main__footer {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}
.app-main__footer a {
  display: flex;
  padding: 1rem;
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
  text-align: center;
  color: var(--main-body-color);
  font-weight: normal;
  font-size: 0.9rem;
}
.app-main__footer a:hover {
  color: var(--main-body-color);
  text-decoration: none;
}
.app-main__footer a svg {
  height: 25px;
}

@media (min-width: 768px) {
  .app-main__footer {
    justify-content: space-evenly;
  }
}
.app-footer-navigation {
  width: 100%;
  background-color: var(--main-ui-color);
  padding: 0 1rem;
  border-bottom: 1rem solid white;
  border-top: 1rem solid white;
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  flex-direction: row;
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 99;
}
@media (min-width: 768px) {
  .app-footer-navigation {
    flex-direction: row;
    justify-content: center;
  }
}
.app-footer-navigation-quiz {
  flex-direction: row;
  gap: 0.5rem;
}
.app-footer-navigation-quiz .btn-prev:before {
  content: " " url("../img/btn/arrow-prev.svg");
}
.app-page__cours .app-footer-navigation {
  position: relative;
  padding: 1rem;
  flex-direction: column;
}
@media (min-width: 768px) {
  .app-page__cours .app-footer-navigation {
    flex-direction: row;
    justify-content: center;
  }
}

#collapseProfil {
  position: absolute;
  top: 2rem;
  left: 0.5rem;
  z-index: 10;
}
.section__container #collapseProfil {
  position: relative;
  top: 0;
  left: 0;
}

/* Header dans la page mon compte / main */
.app-main-profil {
  text-transform: none;
  color: var(--main-body-color);
  font-weight: normal;
  font-size: 0.9rem;
  line-height: 1.2;
}
.app-main-profil .name {
  font-weight: bold;
  display: inline-block;
}
@media (min-width: 768px) {
  .app-main-profil .name {
    font-size: 1.3rem;
    margin-bottom: 0.3rem;
  }
}
.app-main-account a {
  color: var(--main-brand-color);
}

.floating-main-bg {
  opacity: 0.5;
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: var(--main-ui-dark);
  display: none;
  z-index: 1040;
}
.floating-main-bg.show {
  display: block;
}

.app-main__top {
  width: 100%;
  opacity: 1;
  top: -1000px;
  transition: all ease-in-out 0.3s;
  z-index: 1050;
}

.app-MainMenu {
  overflow: auto;
  height: auto;
  max-height: 85vh;
}
.hideMainMenu .app-MainMenu {
  height: 0;
}
.app-elearning-sommaire .app-MainMenu {
  width: 100%;
}
.app-elearning-sommaire .app-MainMenu * {
  font-size: 1rem;
}
.app-MainMenu h3 {
  font-weight: bold;
  padding: 1rem 1rem 0 1rem;
}
.app-MainMenu h4 {
  font-weight: bold;
  padding: 1rem;
  margin-bottom: 0;
}
.app-MainMenu .sidebar-menu {
  position: relative;
  width: 100%;
  max-width: 100%;
  background-color: white;
  margin-bottom: 1rem;
  border-radius: 5px;
}
.app-MainMenu .sidebar-menu::before {
  content: "";
}
.app-MainMenu .sidebar-menu .dropdown-menu {
  width: 100%;
}
@media (min-width: 768px) {
  .app-MainMenu .sidebar-menu .dropdown-menu {
    width: auto;
  }
}
.app-MainMenu .sidebar-menu li:last-child a {
  border-bottom: none;
}
.app-MainMenu .sidebar-menu li:last-child a.dropdown-item {
  border-bottom: 1px solid var(--main-ui-color);
}
.app-MainMenu .sidebar-menu li a.btn-dropdown {
  display: flex;
  justify-content: space-between;
}
@media (min-width: 768px) {
  .app-MainMenu .sidebar-menu li a.btn-dropdown {
    justify-content: start;
  }
}
.app-MainMenu .sidebar-menu li a:hover {
  text-decoration: none;
  background-color: var(--main-ui-color);
  border-radius: 5px;
}
.app-MainMenu .sidebar-menu li a:hover .fa {
  color: var(--main-ui-dark);
}
.app-MainMenu .sidebar-menu li a .fa {
  margin-right: 0.5em;
  font-size: 1.5em;
  color: var(--main-brand-color);
  width: 1em;
  text-align: center;
}

/* le gros bouton du bas */
.app-menu__bottom {
  width: 100%;
  opacity: 1;
  bottom: -1000px;
  transition: all ease-in-out 0.3s;
  z-index: 1000;
  position: absolute;
}
.app-menu__bottom .trend .sidebar-menu {
  margin-bottom: 0;
}
.app-menu__bottom-overflow {
  overflow: hidden;
  bottom: 1.2rem;
  width: 100%;
  position: absolute;
  z-index: 2000;
}
@media (min-width: 768px) {
  .app-menu__bottom-overflow {
    width: 380px;
  }
}
.app-menu__bottom-button {
  display: flex;
  flex-direction: column;
  max-width: 100%;
  justify-content: center;
  align-items: center;
  z-index: 777;
}
.app-menu__bottom-button .btn-mainmenu {
  z-index: 2001;
  box-shadow: none;
  display: flex;
  bottom: 0;
  left: 0;
  flex: 1;
  padding: 0.5rem 0.5rem;
  justify-content: space-around;
  border-radius: 2rem;
}
@media (min-width: 768px) {
  .app-menu__bottom-button .btn-mainmenu {
    max-width: 300px;
  }
}
.app-menu__bottom-button .btn-mainmenu:hover, .app-menu__bottom-button .btn-mainmenu:focus, .app-menu__bottom-button .btn-mainmenu:active {
  box-shadow: none;
}
.app-menu__bottom-button .btn-mainmenu:hover::before, .app-menu__bottom-button .btn-mainmenu:focus::before, .app-menu__bottom-button .btn-mainmenu:active::before {
  background: none;
}
.app-menu__bottom-button .btn-mainmenu span {
  padding: 0.5rem 1.5rem;
}
.app-menu__bottom-button .btn-mainmenu svg {
  transition: all ease-in-out 0.3s;
}
.app-menu__bottom-button .btn-mainmenu.is-open svg {
  transform: rotate(180deg);
}

.app-Menu {
  overflow: auto;
  height: auto;
  max-height: 85vh;
}
.app-Menu h3 {
  font-weight: bold;
  padding: 1rem 1rem 0 1rem;
}
.app-Menu h4 {
  font-weight: bold;
  padding: 1rem;
  margin-bottom: 0;
}
.app-Menu .sidebar-menu {
  position: relative;
  width: 100%;
  max-width: 100%;
  background-color: white;
  margin-bottom: 1rem;
  border-radius: 5px;
}
.app-Menu .sidebar-menu::before {
  content: "";
}
.app-Menu .sidebar-menu li:last-child a {
  border-bottom: none;
}
.app-Menu .sidebar-menu li a {
  border: 0;
  padding: 0;
}
.app-Menu .sidebar-menu li .sidebar-link {
  padding: 1rem;
  display: block;
  border-bottom: 1px solid var(--main-ui-color);
}
.app-Menu .sidebar-menu li .sidebar-link:hover {
  text-decoration: none;
  background-color: var(--main-ui-color);
  border-radius: 5px;
}
.app-Menu .sidebar-menu li .sidebar-link:hover .fa {
  color: var(--main-ui-dark);
}
.app-Menu .sidebar-menu li .sidebar-link .fa {
  margin-right: 0.5em;
  font-size: 1.5em;
  color: var(--main-brand-color);
  width: 1em;
  text-align: center;
}
.app-Menu .sidebar-menu li .sidebar-link a {
  font-size: 0.8em;
  display: flex;
  justify-content: space-between;
  padding: 0.5em 0 0;
  align-items: center;
}

.floating-menu-bg {
  opacity: 0.5;
  position: fixed;
  z-index: 776;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  background-color: var(--main-ui-dark-alpha);
  display: none;
}
.floating-menu-bg.show {
  display: block;
}

/* LIENS NAVIGATION */
.js-nav-link .icon-nav,
.js-nav-link .label-nav {
  opacity: 0;
  transform: translateX(50px);
}
.js-nav-link.is-updating .icon-nav {
  transition: all 150ms cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateX(0);
  opacity: 1;
}
.js-nav-link.is-updating .label-nav {
  transition: all 550ms cubic-bezier(0.4, 0, 0.2, 1);
  transform: translateX(0);
  opacity: 1;
}

.quiz .js-openQuiz,
.quiz-result .js-openQuiz {
  display: none !important;
}

.label-nav {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* DATE List */
.app-date-list .icon-date {
  margin-right: 1rem;
}

/* LIENS EN LIGNE AVEC EFFET */
.alert-message a,
.link-inline {
  display: inline;
  color: var(--main-body-color) !important;
  border-bottom: 1px solid var(--main-brand-color-alpha);
  box-shadow: inset 0 -0.15rem 0 var(--main-brand-color-alpha);
  word-wrap: break-word;
  cursor: pointer;
  line-height: 1;
  width: auto;
  padding: 0;
}
.alert-message a:hover,
.link-inline:hover {
  box-shadow: inset 0 -0.6rem 0 var(--main-brand-color-alpha);
  text-decoration: none;
}

.top-navigation:hover {
  text-decoration: none;
}
.top-navigation:hover svg {
  color: var(--main-brand-color);
}
.top-navigation:hover svg path,
.top-navigation:hover svg rect {
  fill: var(--main-brand-color);
}
.top-navigation svg {
  color: var(--main-brand-color);
}

/* spécificité de la page contact */
.contact .app-page {
  justify-content: space-evenly;
}
.app-page__center {
  width: 100%;
  margin: 0 auto;
}
@media (min-width: 768px) {
  .app-page__center {
    max-width: 1440px;
  }
}
.app-page__center-inner {
  position: relative;
  max-width: 780px;
  margin: 0 auto;
}
.app-page__2col {
  width: 100%;
  padding: 1rem;
  padding-bottom: 6rem;
}
@media (min-width: 768px) {
  .app-page__2col {
    max-width: 1440px;
    margin: 0 auto;
    padding: 2rem;
  }
}
.app-page__1col {
  width: 100%;
  margin-bottom: 70px;
}
@media (min-width: 768px) {
  .app-page__1col {
    max-width: 960px;
    margin: 0 auto;
    padding: 2rem;
  }
}

.app-page__cours {
  margin: 0 auto;
}

.form__padding {
  padding: 1rem;
}

.color-link {
  color: var(--main-body-color);
  border-bottom: 2px solid var(--main-brand-color);
}
.color-link:hover {
  text-decoration: none;
  color: var(--main-brand-color);
}

@media only screen and (min-device-width: 375px) and (max-device-width: 667px) and (-webkit-min-device-pixel-ratio: 2) {
  html::-webkit-scrollbar,
  body::-webkit-scrollbar {
    width: auto;
  }
}
.mobile-hide {
  display: none !important;
}

@media (min-width: 768px) {
  .mobile-hide {
    display: block !important;
  }
}
@media (min-width: 768px) {
  .desktop-hide {
    display: none !important;
  }
}
.app-content {
  padding: 73px 0;
  height: auto;
}
@media (min-width: 768px) {
  .app-content {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-height: 100vh;
    padding: 73px 0;
    height: auto;
  }
}
.mm_dialog-inner .app-content {
  padding: 0;
}
.app-content--nopadding {
  padding: 0;
}
.app-content--nopadding .app-footer-navigation {
  margin-bottom: 0;
}

/* variante pour la page de login */
.app-content--noheader {
  padding: 0;
  min-height: 100vh;
}
.app-content--noheader .app-page__logo {
  margin: 0;
}

/* variante pour le contenu du tableau de bord */
.app-content-main {
  height: auto;
  gap: 1rem;
  padding: 1rem;
  padding-bottom: 93px;
  padding-left: 0;
  padding-right: 0;
}
@media (min-width: 768px) {
  .app-content-main {
    display: grid;
    grid-template-columns: 1fr 2fr;
    grid-column-gap: 0px;
    grid-row-gap: 0px;
    gap: 1rem;
  }
}

body.main {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: var(--main-ui-color);
}

.app-content.app-content-main {
  flex: 1;
}

.app-content-grid > span {
  height: auto;
  padding-bottom: 93px;
  padding: 0 0.5rem;
  display: block;
}
.app-content-grid > span .section {
  height: 100%;
  padding: 0.5rem;
  width: 100%;
}
.app-content-grid > span .sections {
  margin: 0 0 1rem;
}
.app-content-grid > span .table.table--small td:first-child {
  width: 33%;
}

.accordion-trigger .colonne-2 {
  display: none !important;
}

.accordion-trigger.collapsed .colonne-2 {
  display: block !important;
}
@media (min-width: 768px) {
  .accordion-trigger.collapsed .colonne-2 {
    display: flex !important;
  }
}

.app-content-evaluation {
  padding: 0;
}
.app-content-evaluation .app-page-fullimage {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: 1;
}
.app-content-evaluation .app-page-fullimage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.app-content-evaluation .app-page__center {
  padding: 0;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  z-index: 2;
  position: relative;
}
.app-content-evaluation .app-page__center .app-page__center-inner {
  width: 100%;
  margin: 1rem;
}
@media (min-width: 768px) {
  .app-content-evaluation .app-page__center .app-page__center-inner {
    margin: 0 auto;
  }
}
.app-content-evaluation .app-page__center .app-evaluation {
  background-color: white;
  padding: 1.5rem;
}

.faber {
  grid-area: faber;
}

.domaine {
  grid-area: tab;
}

@media (min-width: 768px) {
  body {
    overflow: unset;
  }
  .app-content--noheader {
    padding-top: 0;
  }
  .app-content.full-height {
    height: 100vh;
  }
}
.my-video-dimensions {
  width: 100vw;
  height: 200px;
}
@media (min-width: 768px) {
  .my-video-dimensions {
    height: 300px;
  }
}
.my-video-dimensions .vjs-tech {
  object-fit: cover;
}

/* replace font awesome with html for nunmbers */
.mme-number {
  display: flex;
  width: 2rem;
  height: 2rem;
  background: var(--main-ui-color);
  border-radius: 100%;
  border: 2px solid;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 1rem;
  font-style: normal;
  margin-top: -2rem;
}

.mme-number-simple {
  display: flex;
  width: 1.5em;
  height: 1.5em;
  background: var(--main-brand-color-alpha);
  border-radius: 100%;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 1rem;
  font-style: normal;
  color: var(--main-brand-color);
  flex-shrink: 0;
  flex-grow: 0;
}

.icon-color {
  color: var(--main-brand-color-alpha);
}