/* ---------------------------- */
/* ----- css for the site ----- */
/* ---------------------------- */

.open-close-info {
	color: var(--orange-theme-color);
	margin-right: 1em;
	padding: 1rem 2rem;
	cursor: pointer;
	border-radius: var(--border-radius);
	transition: all 0.5s ease-in-out;
}

.open-close-info:hover {
	background-color: #910c0c;
	color: var(--white-theme-color);
	padding: 1rem 5rem;
}

a:link {
	text-decoration: none;
	color: #910c0c;
}

body a:link:hover {
	text-decoration: underline;
}

a:visited {
	color: #910c0c;
}

body>header a:link {
	text-decoration: none;
	color: var(--white-theme-color);

}

body>header a:visited {
	color: var(--white-theme-color);
}

#logoOBCD {
	height: 60px;
}

#small-logo-obcd {
	width: 75px;
}

html,
body {
	min-height: 100%;
}

body>header {
	/* border-bottom: var(--border-size-thin) solid var(--blue-theme-color); */
	position: -webkit-sticky;
	position: sticky;
	top: 0px;
	background-color: var(--white-theme-color);
	z-index: 100;
	text-align: center;
}

main {
	margin-top: 2em;
}

.main-header {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	padding: 10px 15px 10px 15px;
	font-size: 1.6rem;
}

.main-header>div {
	flex-grow: 1;
	text-align: left;
}

.main-header>nav {
	flex-grow: 2;
}


nav>div {
	display: flex;
	justify-content: center;
	align-items: center;
	align-content: center;
}

nav ul.main-nav {
	display: none;
	border-radius: var(--border-radius);
}

nav ul.main-nav li {
	list-style-type: none;
	margin: 5px;
}

nav ul.main-nav li:hover {
	background-color: var(--grey-theme-color);
	width: 100%;
	text-align: center;
}

li {
	margin: 1em;
}

nav div:hover ul {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	align-content: center;
	padding: 1em;
	position: absolute;
	top: -1em;
}

/* ----- ergonomie ----- */

*::selection {
	background-color: orange;
}

/* ----- journey context animation-frame ----- */
.journey-context-animation-frame {
	border-left: var(--orange-theme-color) 10px solid;
	padding-left: 6rem;
}

/* ----- nav animation-frame ----- */

.nav-animation-frame {
	border-left: var(--blue-theme-color) 10px solid;
}

.nav-animation-frame li {
	list-style-type: none;
}

.nav-animation-frame>ul>li>ul {
	display: inline-flex;
	/* padding: 0; */
}

.nav-animation-frame li,
.nav-animation-frame ul {
	margin: 0.5em;
}


article>section>div label {
	margin-left: 0pt;
}


/* ----- card ----- */

.card,
.contact {
	border: var(--blue-theme-color) solid 1px;
	border-radius: var(--border-radius);
	margin-top: 5rem;
}

.card-section {
	margin: 1.5rem;
	overflow: scroll;
	max-height: 230px;
}

.card-section-form {
	margin: 1.5em;
	max-height: 52vh;
	overflow: scroll;
}

.card-section-left, 
.card-section-right {
	padding: 2rem;
}

.card-title {
	padding: 1rem;
}

/* ----- form ----- */


form,
.form {
	display: flex;
	flex-direction: column;
}

.form-inline {
	display: inline-flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	column-gap: 2rem;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.form-inline-label {
	width: 10%;
}

.form-inline-label-long {
	width: 20%;
}

.form-inline-label-xlong {
	width: 30%;
}

.form-inline-input {
	width: 90%;
}

.form-inline-input select {
	width: 100%;
	/* margin-top: 2rem;
	margin-bottom: 2rem; */
}

.form-row {
	display: inline-flex;
	flex-direction: row;
	width: 100%;
}

.form-row-label {
	width: 40%;
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.message {
	text-align: center;
	line-height: 2em;
	border-radius: var(--border-radius);
	margin: 2em;
	padding: 0.7em;
}

.vertical-form {
	padding-top: 2vh;
	margin: auto;
	display: flex;
	flex-direction: column;
}


label {
	margin-top: 1rem;
	padding-bottom: 1rem;
}

input {
	max-width: 100%;
	width: 100%;
	font-size: var(--fontsize-form);
	padding: 0.2em 0.5em;
}

textarea {
	max-width: 100%;
	width: 100%;
	height: 2em;
	margin: 2rem 0;
	font-size: var(--fontsize-form);
	padding: 0.2em 0.5em;
}

textarea {
	height: 15em;
}

input[type="file"] {
	width: auto;
	max-width: 100%;
	font-size: var(--fontsize-form);
}

input[type="date"] {
	font-size: var(--fontsize-form);
}

select {
	font-size: var(--fontsize-form);
	padding: 6px 12px;
	margin-top: 1rem;
	margin-bottom: 1rem; 
}

fieldset {
	box-sizing: border-box;

	border-radius: var(--border-radius);
	margin: 2rem 0 1rem 0;
	padding: 1em 1em 2em 1em;

	display: flex;
	flex-direction: column;
}

.legend-text {
	padding: 1rem 4rem;
	border-radius: var(--border-radius);
	font-size: 2.4rem;
}

.label-text {
	padding: 2rem;
}

.upload {
	margin: 3.8vh;
	background-color: var(--blue-theme-l4-color);
	border: var(--blue-theme-color) 1px solid;
	border-radius: var(--border-radius);
	padding: 0 6em;

}

div.question-answer {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

div.question-answer>section>textarea {
	width: auto;
}

.free-answer-header {
	background-color: var(--blue-theme-l4-color);

	border-bottom: var(--blue-theme-color) solid 1px;
	border-top-left-radius: calc(var(--border-radius) - 1px);
	border-top-right-radius: calc(var(--border-radius) - 1px);
	padding: 0.3em 1.5em;
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
}

/* ----- tom-select ----- */

.ts-wrapper input[type='text']{
	height: 3rem;
	font-size: 1.6rem;
}
.ts-control>div.item {
	width: 100%;
	justify-content: space-between;
	font-size: 1.6rem;
	padding: 0.8rem !important;
}

.ts-dropdown.multi {
	padding: 1rem !important;
	box-shadow: rgba(0, 0, 0, 0.07) 0px 1px 2px, rgba(0, 0, 0, 0.07) 0px 2px 4px, rgba(0, 0, 0, 0.07) 0px 4px 8px, rgba(0, 0, 0, 0.07) 0px 8px 16px, rgba(0, 0, 0, 0.07) 0px 16px 32px, rgba(0, 0, 0, 0.07) 0px 32px 64px;
}

.ts-dropdown-content>.option {
	font-size: 1.6rem;
	padding: 0.8rem !important;
}

div.option.active {
	color: var(--red-theme-color);
}

/* ----- checkbox ----- */

/* input[type="checkbox"] {
	display: none;
}

input[type="checkbox"]+label {
	box-sizing: border-box;
	border: 1px solid var(--orange-theme-color);
	margin: 1rem;
	padding: 1rem 2rem;
	border-radius: var(--border-radius);
	display: inline-block;

	width: 100%;
	margin: 0.4em auto;

} */

/* input[type="checkbox"]:hover+label {
	border: 1px solid transparent;
	background-color: var(--blue-theme-l4-color);
}

input[type="checkbox"]:checked+label {
	border: 1px solid transparent;
	background-color: var(--green-theme-color);
	color: var(--white-theme-color);
}

 */

.label-text.label-js~input[type='text'], 
.label-text.label-js~input[type='email'] {
	margin-top: 3rem;
	margin-bottom: 3rem;
}

input[type="checkbox"].classical {
	display: initial;
}

.circle {
	width: 2.9em;
	height: 2.9em;
	border-radius: 50%;
	border: 1px var(--grey-theme-color) solid;

	display: flex;
	justify-content: center;
	align-items: center;
}

.circle>i {
	font-size: 2.8em;
}

.js-draggable .order-position,
.js-draggable-theme .order-position {
	display: inline-flex;
}

.order-container {
	cursor: grabbing;
}

.order-container {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: center;
	gap: 3rem;

	cursor: grab;
	border-radius: var(--border-radius);
	padding: 1rem;

	transition: 0.3s;
}

.order-container:hover {
	background-color: var(--orange-theme-color);
	color: var(--white-theme-color);
}

.order-container:active {
	box-shadow: 1px 1px 30px var(--red-theme-color);
	cursor: grabbing;
}


.order-label {
	width: 90%;
}

.js-shaker {
	animation: shaker 0.6s;
}

@keyframes shaker {
	20% {transform: translateX(30px)}
	40% {transform: translateX(-60px)}
	60% {transform: translateX(60px)}
	80% {transform: translateX(-30px)}
}

.no-hover {
	outline: none !important;
	text-decoration: none !important;
}

.shadow-bottom {
	box-shadow: 0px 10px 49px -14px rgba(79, 79, 79, 0.19);
	-webkit-box-shadow: 0px 10px 49px -14px rgba(79, 79, 79, 0.19);
	-moz-box-shadow: 0px 10px 49px -14px rgba(79, 79, 79, 0.19);
}

.horizontalize {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-evenly;
	align-items: stretch;
}

.oval {
	border: none;
	border-radius: 46px;
	text-align: center;
	display: inline-block;
	padding: 10px 20px;
	margin: 4px 2px;
	min-width: 6.6em;
}

.link-header {
	text-decoration: none;
	cursor: pointer;
	transform: rotate(-15deg);
	transition-duration: 0.2s;
}

.my-account {
	display: flex;
	flex-flow: row nowrap;
	justify-content: flex-end;
	align-items: center;
}

.my-account-word {
	border: none;
	border-radius: var(--border-radius);
	padding: 6px 3px;
	text-align: center;
	display: inline-block;
	cursor: pointer;
	width: 6rem;
}

/* article>header,  */
.card-header {
	font-weight: bolder;
	background-color: var(--blue-theme-l4-color);
	border-bottom: var(--blue-theme-color) solid 1px;
	border-top-left-radius:6px;
	border-top-right-radius: 6px;
	padding: 0.3em 1.5em;
	position: relative;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.card-horizontal {
	border: var(--blue-theme-color) solid 1px;
	border-radius: var(--border-radius);
	margin-top: 5rem;

	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: flex-start;
	align-items: flex-start;
	align-content: stretch;
}

.card-header-left {
	font-weight: bolder;
	background-color: var(--blue-theme-l4-color);
	border-top-left-radius: 7px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 7px;
	border-bottom-right-radius: 0px;
	padding: 1.5rem;

	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: center;
}

article>footer {
	background-color: var(--blue-theme-l4-color);
	border-top: var(--blue-theme-color) solid 1px;
	border-bottom-left-radius: 6px;
	border-bottom-right-radius: 6px;
	padding: 0.3em 1.5em;
	margin-top: 2em;
}

header ul>li {
	list-style-type: none;
	display: inline;
}

.plan {
	width: 20%;
}

.assistant-question {
	width: 77%;
}

.column-gap {
	column-gap: 1rem;
}

.flex {
	display: flex;
	justify-content: space-evenly;
}

.flex-space-between {
	display: flex;
	justify-content: space-between;
  }  

.flex-reverse {
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
}

.flex>div,
.flex-reverse>div {
	flex-grow: 1;
	flex-shrink: 1;
	width: 50%;
}

.trainer-list-row {
	display: flex;
	justify-content: space-between;
}

.trainer-list-row ul {
	padding-left: 0;
}

.row-right {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.cadre {
	box-sizing: border-box;
	border-radius: var(--border-radius);
	border: var(--blue-theme-color) solid 1px;
	margin: 2cm auto;
	padding: 2cm;
	/* width: 100%; */
}

.help {
	width: max-content;
	padding: 1em;
	border-radius: var(--border-radius);
	background-color: var(--orange-theme-color);
}


.flash-info,
.ask-info,
.give-info {
	color: var(--white-theme-color);
	background: linear-gradient(270deg, var(--red-theme-color), var(--orange-theme-color) 90%);
}

.ask-info,
.give-info {
	border-radius: var(--border-radius);
	padding: 1rem;
	margin: 1em 3em;
}

.info {
	margin: 1.5em;
	padding: 0.5em 1em;
	border-radius: var(--border-radius);
	text-align: center;
}

.info-simple {
	margin: 0%;
	padding: 1rem;
	border-radius: var(--border-radius);
	text-align: center;
	width: max-content;
}

.badge {
	border-radius: var(--border-radius);
	padding: 1rem 3rem;
	color: var(--white-theme-color);
	background-color: var(--green-theme-color);
	transform: rotate(-15deg); 
	text-align: center;
	box-shadow: 5px -5px 55px var(--grey-theme-color);
	width: auto;
	height: auto;
	position: absolute;
	top: -0.1rem;
	left: -2rem;
	border: 0.1px solid var(--white-theme-color);
}

.contour-section {
	margin: 1em;
}

.contour-page {
	margin: 3em;
}

.padding-top-0 {
	padding-top: 0;
}

.padding-top-1 {
	padding-top: 1em;
}

.padding-y {
	padding-top: 2rem;
	padding-bottom: 2rem;
}

.padding-y-big {
	padding-top: 3rem;
	padding-bottom: 3rem;
}

.padding-x {
	padding-left: 2rem;
	padding-right: 2rem;
}

.right-section {
	margin: 1em;
	text-align: right;
}

/* .card>header,  */
.rounded-top {
	border-top-left-radius: calc(var(--border-radius) - 1px);
	border-top-right-radius: calc(var(--border-radius) - 1px);
}

.rounded-bottom {
	border-bottom-right-radius: calc(var(--border-radius) - 1px);
	border-bottom-left-radius: calc(var(--border-radius) - 1px);
}

.rounded-bottom-right {
	border-bottom-right-radius: calc(var(--border-radius) - 1px);
}

.rounded-bottom-left {
	border-bottom-left-radius: calc(var(--border-radius) - 1px);
}

/* ----- tableau ----- */

table {
	width: 100%;
	text-align: left;
	border-collapse: collapse;
}

table ul {
	padding-left: 0%;
}

.table-li {
	list-style: none;
	margin-left: 0%;
}

table p {
	padding-top: 1.5rem;
}

.table-card {
	box-sizing: border-box;
	width: 100%;
}

.col-25 {
	width: 25%;
}


.link {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-evenly;
	gap: 3px;
}

tr {
	height: 2.5em;
}

th,
td {
	border-bottom: var(--grey-theme-color) solid 1px;
	padding: 0em 1em;
}

.border-left-td {
	border-left: var(--grey-theme-color) solid 1px;
}

.border-white {
	border: 1px solid var(--white-theme-color) !important;
}

th.formateur {
	min-width: 14rem;
}

.header-feedback {
	display: flex;
	flex-direction: row;
}

.header-feedback>div {
	flex-grow: 1;
}


body>footer {
	text-align: center;
	padding: 0.7em;
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
	margin-top: 40px;
}

.credit-section {
	margin-left: 3cm;
	margin-right: 3cm;
	margin-top: 2cm;
	padding: 2cm;
	border: var(--blue-theme-color) 1px solid !important;
	border-radius: var(--border-radius);
}


/* ----- alignment ----- */

.step-theme-and-button {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: center;
}


.align-button {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

.justify {
	text-align: justify;
}

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

.left {
	text-align: left;
}

.right {
	text-align: right;
}

.row {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
}

.col {
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: stretch;
	align-content: stretch;
}

.col>article {
	height: 100%;
}

.child-row-1 {
	flex-grow: 1;
}

.child-row-2 {
	flex-grow: 2;
}

.col-gap-1 {
	column-gap: 3%;
}

.middle {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	/* align-content: space-around; */
	padding: 0.6em;

}

.vertical-middle {
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.block {
	display: block;
}

.relative {
	position: relative;
}

.step-content {
	display: flex;
	justify-content: space-between;
	box-sizing: content-box;
}

.w-80pc {
	max-width: 80%;
}

.non {
	background-color: #910c0c;
}

header>div.left {
	flex-grow: 2;
}

header>div.right {
	flex-grow: 1;
}

.action {
	min-width: 70px;
}

.left-label-tr {
	text-align: left;
	min-width: 100px;
}

.fa-chevron-circle-up {
	font-size: 64px;
}

small {
	background-color: var(--orange-theme-color);
}

.note {
	padding: 1em;
	box-shadow: var(--grey-theme-color) 2px 2px 8px;
	border-radius: var(--border-radius);
	max-width: 50%;
	z-index: 2;
}

.note-contact {
	position: absolute;
	top: -12px;
	right: 12%;
}

ul.sessions>li {
	list-style-type: none;
	margin-left: 0;
}

.li-inline {
	display: flex;
}

li.inline {
	display: inline;
	text-decoration: none;
}

ul.inline {
	padding-left: 0;
}
  

.easy-to-read {
	font-size: 1.2em;
	line-height: 2em;
}

.title-simple {
	font-size: 1.2em;
	text-decoration: underline;
}

/* ici */
.session-content { 
	margin-top: 1em;
	margin-bottom: 1em;
}

.session-footer {
	padding: 1em 1.5em;
	border: 1px solid var(--blue-theme-color);
}

.session {
	margin-top: 4em;
	margin-bottom: 4em;
}

.journey,
.step,
.sequence {
	margin-top: 1em;
	margin-bottom: 1em;
}

.journey,
.journey>header,
.sequence,
.sequence>header,
.step,
.step>header {
	border-radius: 0;
	border-bottom: none;
}

.journey>header,
.journey-article {
	border-left: var(--border-size) solid var(--red-theme-color);
}

.sequence>header,
.sequence-article {
	border-left: var(--border-size) solid var(--orange-theme-color);
}

.step>header,
.step-content {
	border-left: var(--border-size) solid var(--green-theme-color);
}

.journey-article,
.sequence-article,
.step-content {
	padding-left: 2em;
	padding-top: 2em;
	padding-bottom: 2em;

	margin-bottom: 1em;
}

.button-action-article {
	border-left: var(--border-size) solid var(--orange-theme-color);
}

hr {
	margin-top: 1.6em;
}

.margin-small {
	margin: 3rem !important;
}

.margin-x-1 {
	margin: 3em !important;
}

.margin-x-small {
	margin: 0 1.2em !important;
}

.margin-t-small {
	margin-top: 5rem;
}

.margin-t-xsmall {
	margin-top: 3rem;
}

.margin-t-xxsmall {
	margin-top: 2rem;
}

.margin-right {
	margin-right: 3rem;
}

.margin-y-small {
	margin-top: 1rem;
	margin-bottom: 1rem;
}
.margin-y-medium {
	margin-top: 3rem;
	margin-bottom: 3rem;
}

.margin-b-medium {
	margin-bottom: 3rem;
}

.w-50 {
	min-width: 50%;
	width: 50%;
	max-width: 50%;
}

/* ----- mise en valeur ----- */
.satisfaction, 
.stat {
	font-size: 300%;
	/* padding: 0%; */
}

.important-text {
	background-color: var(--orange-theme-color)!important;
	color: var(--white-theme-color);
	padding: 0.3em 0.5em;
	border-radius: var(--border-radius);
}

.important-text-green {
	background-color: var(--green-theme-color)!important;
	color: var(--white-theme-color);
	padding: 0.3em 0.5em;
	border-radius: var(--border-radius);
}

.insignificant-text {
	color: gray;
	font-weight: bold;
}

.underline {
	font-style: italic;
	text-decoration: underline;
}

.valid-text {
	background-color: var(--green-theme-color);
	color: var(--white-theme-color);
	padding: 0.3em 0.6em;
	border-radius: var(--border-radius);
}

.bold-text {
	font-weight: bold;
}

.role-dev {
	background-color: var(--grey-theme-color) ;
	color: var(--white-theme-color);
	border-radius: 6px;
	padding: 0.5rem 1rem;
	margin-left: 1rem;
	margin-right: 1rem;
}
  
/* ----- font ----- */
.normal-font {
	font-weight: normal;
}

/* ----- barre "action" dans l'onglet formation ----- */
.action-bar {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: stretch;
	align-content: center;
	column-gap: 0%;

	background-color: var(--grey-theme-color);

	border-radius: var(--border-radius);

}

.action-item {
	/* border: 2px solid #910c0c; */
	padding: 1% 3%;
}

a.action-item {
	color: var(--white-theme-color);
}

.action-item-active {
	background-color: var(--orange-theme-color);
}

.action-item:hover {
	background-color: var(--red-theme-color);
}

.action-item-left,
.action-item-left:hover {
	border-top-left-radius: var(--border-radius);
	border-bottom-left-radius: var(--border-radius);
}

.action-item-right,
.action-item-right:hover {
	border-top-right-radius: var(--border-radius);
	border-bottom-right-radius: var(--border-radius);
}

/* ----- header-context ----- */

.project-label-box {
	width: 0% !important;
}

/* ----- title ----- */

.h2-table {
	margin: 0 1rem;
	padding: 0;
	font-size: 2.2rem;
}

h2.text-center {
	margin-left: 0%;
}

/* ----- page header ----- */

.page-header {
	color: var(--white-theme-color);
}

.page-header-title {
	background-color: var(--blue-theme-color);
	border-top-left-radius: var(--border-radius);
	border-top-right-radius: var(--border-radius);
	padding: 5rem 0;
	position: relative;
}

.page-header-action-bar {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items: stretch;
	align-content: center;
	column-gap: 0%;

	background-color: var(--grey-theme-color);
	border-bottom-left-radius: var(--border-radius);
	border-bottom-right-radius: var(--border-radius);
}

.page-header-action-item {
	padding: 2rem;
}

.page-action-item-left,
.page-action-item-left:hover {
	border-bottom-left-radius: var(--border-radius);
}

.page-action-item-right,
.page-action-item-right:hover {
	border-bottom-right-radius: var(--border-radius);
}


.page-header-action-item:hover {
	background-color: var(--red-theme-color);
}

.page-header-action-item-active {
	background-color: var(--orange-theme-color);
}

a.page-header-action-item {
	color: var(--white-theme-color);
}

/* ----- navigation item ----- */

.config-nav-bar{
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: stretch;
	align-content: center;
	/* column-gap: 0%; */

	background-color: var(--grey-theme-color);

	border-radius: var(--border-radius);
}

.config-nav-item {
	padding: 1% 1%;
}

a.config-nav-item {
	color: var(--white-theme-color);
}

a.config-nav-item:active,
a.config-nav-item:hover {
	background-color: var(--red-theme-color);
}

/* ----- stat ----- */

.flex-stat {
	display: flex;
	justify-content: center;
	gap: 2.5%;
	margin-bottom: 2.5%;
}

.square {
	height: 37vh;
	width: 37vh;
}

/* ----- qualiopi ----- */

.qualiopi-present {
	display: flex;
	column-gap: 2rem;
}

.non-conform-box {
	border: var(--red-theme-color) solid 1px;
	border-radius: var(--border-radius);
	display: flex;
	flex-direction: column;
	align-items: stretch;
	align-content: stretch;
}

.indicator-box {
	border-radius: var(--border-radius);
}

.indicator-box-title {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: center;
	column-gap: 2rem;
	padding: 2rem;
}

.box-content {
	padding: 2rem;
	text-align: justify;
}

.button-box {
	background-color: var(--blue-theme-l4-color);
	border: solid 1px var(--blue-theme-color);
	border-radius: var(--border-radius);
	padding: 1.3rem 1.5rem;
	display: flex;
	flex-direction: column;
	justify-content: space-evenly;
}

.button-box .button {
	height: 6rem;
}

/* ----- feedback ask a question ----- */
#feedback_ask_a_question>div {
	display: flex;
	flex-direction: column;
}