/* BASE TYPOGRPHY */

/* These are the default styles for the Simple theme */
body {
 font-size: 20px; /* This overrides the browsers default font size */
 line-height: 26px; /* If you change the font-size make sure you change the line-height value as well - the usual ratio is around 1.5 (font-size x 1.5 = line-height) */
 color: var(--primary-dark);
 font-family: var(--font-family-base), sans-serif;
}

body a {
 text-decoration: none;
}

/* this removes the underline from all links */
body a:link {
 color: inherit;
}

/* this sets the highlight color when links are tapped on Safari (browser) on iPhone */

.AnimationPage .main #mainContent,
.RecipesPage .main #mainContent,
.MagazinePage .main #mainContent,
.RestaurantPage .main #mainContent,
.Qualite .main {
 padding-top: 80px;
}

.RestaurantPage .main #mainContent {
 padding-top: 100px;
}

/* HEADERS */
h1,
h2,
h3,
h4,
h5,
h6,
.typography h1,
.typography h2,
.section.feedInsta .sectionTitle h2,
.typography h3,
.typography h4,
.typography h5,
.typography h6 {
 font-family: var(--font-family-title), sans-serif; /* This references one of the custom @font-face fonts - the other fonts that are referenced are fallbacks for browsers that don't support @fontface */
 margin-bottom: 10px;
 color: var(--primary);
}

.typography h1 {
 font-size: 36px;
 line-height: 45px;
 margin: 0 0 25px 0;
 padding-bottom: 5px;
}

.typography h2,
.section.feedInsta .sectionTitle h2 {
 font-size: 30px;
 line-height: 35px;
 font-family: var(--font-family-title), sans-serif;
}

.typography h3 {
 font-size: 22px;
 line-height: 30px;
 margin-bottom: 10px;
}

.typography h4 {
 font-size: 18px;
 line-height: 25px;
 margin-bottom: 5px;
}

.typography h5 {
 font-size: 16px;
 line-height: 20px;
 margin-bottom: 5px;
}

.typography h6 {
 font-size: 14px;
 line-height: 20px;
 font-weight: bold;
 margin-bottom: 5px;
}

/* PARAGRAGHS */
.typography p {
 font-size: 20px;
 line-height: 26px;
 margin: 0 0 20px;
}

.typography .intro {
 font-family: var(--font-family-title), sans-serif;
 font-size: 22px;
 line-height: 32px;
 margin-bottom: 20px;
}

.typography em {
 font-style: italic;
}

::selection,
::-moz-selection {
 /* Applies style to highlighted portion of a page */
 background: var(--primary-dark);
 color: var(--white);
 text-shadow: none;
}

/* LINKS */
.typography a,
.typography a.intro {
 color: inherit;
 text-decoration: none;
}

.typography a:hover {
 color: inherit;
 border-bottom: 1px dashed inherit;
}

/* LIST STYLES
-------------------------------------------- */
.typography ul,
.typography ol,
.typography dl {
 margin: 0 0 20px 25px;
}

.typography ul li {
 list-style-type: disc;
}

/* adds disc style bullet to the list */
.typography li {
 margin-bottom: 5px;
}

/* TABLE STYLES
-------------------------------------------- */
.typography table {
 border-collapse: collapse; /* borders are collapsed into a single border when possible */
 border: 1px solid var(--neutral-extra-light);
 border-spacing: 0; /* The border-spacing property sets the distance between the borders of adjacent cells - acts as a backup to border-collapse: collapse */
 margin: 0 0 10px;
 text-align: left;
}

.typography table tr:nth-child(even) {
 background-color: #EDEDED;
}

.typography table tr.even,
.typography table th,
.typography thead td {
 background-color: var(--neutral-light);
}

.typography table td,
.typography table th {
 padding: 2px 5px;
 border: 1px solid var(--neutral-light);
 vertical-align: top;
}

.typography table th {
 font-weight: bold;
}

/* WYSIWYG EDITOR ALIGNMENT CLASSES
-------------------------------------------- */
.typography .left {
 text-align: left;
}

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

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

/* IMAGES
-------------------------------------------- */

.typography .captionImage {
 width: 100%;
 margin-top: 5px;
}

.typography .captionImage img {
 margin: 0;
}

.typography .captionImage.left {
 float: left;
 margin: 5px 30px 20px 0px;
}

.typography .captionImage.right {
 float: right;
 margin: 5px 0 20px 30px;
}

.typography .captionImage.left[style],
.typography .captionImage.right[style] {
 max-width: 50%; /* Overides core width to make responsive */
}

.typography .captionImage.left img,
.typography .captionImage.right img {
 float: none;
 max-width: none;
 width: 100%;
}

.typography .captionImage.left img {
 margin-right: -10px;
}

.typography .captionImage.right img {
 margin-left: -10px;
}

.typography .captionImage.right p {
 margin-left: -10px;
 text-align: left;
 margin-left: -10px;
}

.typography .captionImage.leftAlone {
 float: none;
 margin: 0 20px 20px 0px;
}

.typography .captionImage.center {
 margin: 0 auto 20px;
}

.typography .captionImage p {
 clear: both;
 margin: 5px 0;
 font-style: italic;
 color: inherit;
}

/* BLOCKQUOTES
-------------------------------------------- */
.typography blockquote {
 background: transparent url(../images/blockquote.png) no-repeat 0px 6px;
 font-family: var(--font-family-title), sans-serif;
 color: inherit;
 display: block;
 font-style: italic;
 margin: 0 0 20px;
 float: right;
 text-indent: 30px;
 width: 50%;
 margin-left: 5%;
 clear: both;
}

.typography blockquote p {
 font-size: 17px;
 line-height: 25px;
}

.typography pre {
 background: inherit;
 border: 1px solid inherit;
 font-family: var(--font-family-base), sans-serif;
 margin: 0 0 20px 0;
 padding: 15px;
 clear: both;
}

.xs-column-md-row {
 flex-direction: column;
 align-items: center;
}

/*.slick-track {*/
/*    margin-left: unset;*/
/*    margin-right: unset;*/
/*}*/

.bg-pattern-white {
 background-image: url(../images/pattern-bg-bis-white.png);
 background-size: cover;
 background-repeat: no-repeat;
}

/* ADDRESS
-------------------------------------------- */
address {
 display: block;
 margin-bottom: 20px;
}

/*  OVERWRITE BOOTSTRAP */
a {
 color: inherit;
 text-decoration: none;
 background-color: transparent;
}

a:hover {
 color: inherit;
 text-decoration: underline;
}

.socials a:hover {
 color: inherit;
 text-decoration: none;
}

.gap-2 {
 gap: 10px;
}

.scrollXContainer {
 width: 100%;
 overflow-x: scroll;
 overflow-y: hidden;
}

.scrollXContainer::-webkit-scrollbar {
 opacity: 0;
}

.scrollYContainer {
 width: 100%;
 overflow-y: scroll;
 overflow-x: hidden;
}

.scrollYContainer::-webkit-scrollbar {
 opacity: 0;
}

.header {
 position: fixed;
 z-index: 1000;
 background-color: var(--bg-header);
 width: 100%;
 /*  border-bottom: 1px solid var(--neutral-light); */
 height: fit-content;
}

.header.isOpen {
 border-bottom: 5px solid var(--primary);
}

.headerContent {
 height: 80px;
}

.headerLogo {
 height: 80px;
 width: 100px;
 display: flex;
 align-items: center;
}

.headerLogo img {
 height: auto;
 width: 100%;
}

.header .langs .lang span {
 margin: 0 auto;
 line-height: 32px;
}

.header .langs .lang {
 width: 34px;
 height: 34px;
 border-radius: 3px;
 cursor: pointer;
}

.header .langs .lang.unSelected {
 border: 1px solid var(--border-lang-btn);
 background-color: var(--bg-lang-btn);
 color: var(--color-text-lang-btn);
}

.header .langs .lang.selected {
 border: 1px solid var(--border-lang-btn-selected);
 background-color: var(--bg-lang-btn-selected);
 color: var(--color-text-lang-btn-slected);
}

.header .iconsMenu .isClosed svg.bi-list {
 height: 44px;
 width: 44px;
 color: var(--white);
 display: none;
}

.header .iconsMenu .isOpen svg.bi-x-lg {
 height: 30px;
 width: 30px;
 color: var(--white);
 display: none;
}

.header.isOpen .iconsMenu .isOpen svg.bi-x-lg,
.header.isClosed .iconsMenu .isClosed svg.bi-list {
 display: block;
 cursor: pointer;
}

.header .headerNavigation {
 display: flex;
 transition: all;
 overflow: hidden;
 transition: height 0.3s ease;
 height: 0;
 opacity: 0;
}

.header.isClosed .headerNavigation {
 height: 0;
 opacity: 0;
}

.header.isOpen .headerNavigation {
 height: calc(100vh - 90px);
 opacity: 1;
}

.headerNavigation nav.navigation.mainNav {
 display: flex;
 flex-direction: column;
 justify-content: space-evenly;
 flex: 1;
}

.headerNavigation nav.navigation.mainNav ul.list li.listItem a.link {
 font-size: 20px;
 height: 60px;
 border-bottom: 1px solid var(--primary-light);
}

.headerNavigation nav.navigation.mainNav ul.list li.listItem.link a.link:hover {
 text-decoration: none;
 font-size: 21px;
 color: var(--primary);
 border-bottom: 2px solid var(--primary);
}

.headerNavigation nav.navigation.mainNav ul.list li.listItem.current {
 color: var(--primary);
}

.headerNavigation nav.navigation.mainNav ul.list li.listItem.current a.link {
 border-bottom: 1px solid var(--primary);
}

.headerNavigation nav.navigation.mainNav ul.list li.listItem.current a.link:hover {
 text-decoration: none;
}

/* START subNav */
.subNav {
 position: absolute;
 top: 97px;
 left: 0;
 background-color: white;
 z-index: 1;
 height: fit-content;
 width: 100%;
 padding: 0 10px;
 font-size: 14px;
 display: flex;
 align-items: center;

 .navList {
	display: flex;
	text-decoration: underline;
	flex-wrap: wrap;
	gap: 6px;
 }
}

/* END subNav */
.topActu {
 position: relative;
 top: 140px;
 left: 0;
 background-color: var(--primary);
 width: 100%;
 text-align: center;
 padding: 9px 20px;
 color: var(--white);
 border-radius: 0 0 15px 0;
 border-top: 1px solid var(--primary-light);

 .info {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;

	a {
	 text-decoration: underline;
	 font-size: 16px;
	}

	p {
	 overflow: hidden;
	 text-overflow: ellipsis;
	 white-space: nowrap;
	 width: calc(100% - 90px);
	 margin-bottom: 0;
	}
 }
}

#map {
 height: 180px;
 filter: sepia(0.1) saturate(0.6) brightness(1.05) grayscale(0.4);
}

.footer {
 background-color: var(--primary);
 color: var(--white);
 padding: 20px 0;

 .adress {
	min-width: 170px;
 }
}

.footer strong {
 font-size: 16px;
 font-family: var(--font-family-title), sans-serif;
}

.footer .info {
 padding: 0 20px 20px 20px;
 display: flex;
 flex-direction: column;
 gap: 15px;
}

.footerLogo {
 padding: 60px;
 border-top: 1px solid var(--white);
}

.footerLogo img.logoImage {
 width: 100%;
 height: auto;
}

.socials {
 position: relative;
 bottom: 0;
 margin-top: 30px;
 height: 44px;
 gap: 4px;

 .bg-social-icon {
	display: flex;
	width: 44px;
	height: 44px;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	background-color: var(--secondary-light);
 }

 .bg-social-icon:hover {
	background-color: var(--primary);
 }

 .social-icon {

	path {
	 fill: white;
	}
 }
}

.feedInsta .sectionTitle .socials {
 margin-top: 0;
}

.noMobile .socials {
 position: unset;
 bottom: unset;
 margin-top: unset;
 gap: 5px;
}

.btn {
 width: fit-content;
 min-width: 114px;
 border-radius: 40px;
 min-height: 44px;
 display: flex;
 justify-content: center;
 align-items: center;
 gap: 6px;
 padding: 0 20px;
}

.btn span {
 line-height: 44px;
 cursor: pointer;
}

/* primary */
.btn.primary {
 border: 1px solid var(--primary);
 background-color: var(--primary);
 color: var(--secondary);
 z-index: 100;
}

.btn.primary.mvreader {
 min-width: 400px;
 min-height: 100px;
 background-color: black;
}

.btn.primary svg {
 fill: var(--blue-extra-dark);
}

.btn.primary:hover {
 background-color: var(--primary-extralight);
 color: var(--primary-dark);
}

.btn.primary:hover svg {
 fill: var(--primary-dark);
}

/* neutral */
.btn.neutral {
 border: 1px solid var(--neutral);
 background-color: var(--neutral);
 color: var(--white);
}

.btn.neutral svg {
 fill: white;
}

.btn.neutral:hover {
 background-color: var(--neutral-extralight);
 color: var(--neutral-dark);
}

.btn.neutral:hover svg {
 fill: var(--neutral-dark);
}

#dlMenuAllergen {
 margin: 0 auto;
}

.select {
 border-color: var(--primary);
 border-radius: 50px;
 height: 44px;
 padding: 0 20px;
 background: url(../images/chevron-down.svg) no-repeat;
 background-position: calc(100% - 10px) center !important;
 -moz-appearance: none !important;
 -webkit-appearance: none !important;
 appearance: none !important;
 padding-right: 30px !important;
 min-width: 120px;
 color: var(--blue-extra-dark);
}

:focus-visible {
 outline: var(--primary) auto 1px;
}

/* diseable */
.btn.diseable {
 border: 1px solid var(--neutral-extralight);
 background-color: var(--neutral-extra-light);
 color: var(--neutral-light);
 cursor: none;
 pointer-events: none;
}

.checkboxes {
 align-items: center;
 gap: 14px;
}

.checkboxes input[type='checkbox'] {
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
 width: 20px;
 height: 20px;
 border-radius: 50%;
 border: 1px solid var(--primary);
 outline: none;
}

.checkboxes input[type='checkbox']:checked {
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;
 width: 20px;
 height: 20px;
 border-radius: 50%;
 border: 1px solid var(--primary);
 background-color: var(--primary);
 outline: none;
}

.form-control,
textarea {
 display: block;
 width: 100%;
 height: calc(1.5em + 0.75rem + 2px);
 padding: 0.375rem 0.75rem;
 font-size: 1rem;
 font-weight: 400;
 line-height: 1.5;
 color: var(--neutral-dark);
 background-color: var(--neutral-extra-light);
 background-clip: padding-box;
 border: none;
 border-radius: 0.25rem;
 transition: border-color 0.15s ease-in-out,
 box-shadow 0.15s ease-in-out;
}

textarea {
 min-height: 100px;
}

input.btn.btn-default {
 background-color: var(--primary);
 color: var(--white);
}

#mainForm {
 height: auto;
}

#mainForm .avis {
 height: auto;
 flex-direction: column-reverse;
}

#mainForm .avis .texte {
 min-height: 100%;
 width: 100%;
 display: flex;
 justify-content: space-around;
 padding: 20px;
}

#mainForm .avis .bg {
 height: 200px;
 width: 100%;
 background-color: var(--primary);
 display: flex;
}

#mainForm .avis .bg .img {
 width: 100%;
 height: 100%;
 background-image: url(../images/Artichaud.jpg);
 background-position-y: center;
 background-position-x: right;
 opacity: 90%;
}

#MemberLoginForm_LoginForm {
 margin: 80px 0;
}

/* main  container */
#mainContent {
 width: 100%;
 margin: 0 auto;
}

#mainContent.restaurant {
 /* background-image: url(http://app.eldora.ch/common_file/img/Logo-Eldora-fond-v3.png);
 background-position: right bottom;
 background-repeat: no-repeat;
 background-attachment: fixed; */
 padding: 5px;
 padding-top: 70px;
 font-size: 18px;
 width: 100%;
 min-height: 100vh;
 margin: 0 auto;
 display: flex;
 justify-content: center;
}

#mainContent.restaurant h3 {
 color: var(--neutral-dark);
}

#mainContent.restaurant #Catering,
#mainContent.restaurant #CharterSupply {
 width: 100%;
 min-height: 200px;
 margin: 50px 0;
}

.sideRestaurant ul {
 list-style: none;
 position: sticky;
 top: 100px;
}

.sideRestaurant ul li {
 display: block;
 list-style-type: none;
 margin: 10px 0;
}

/* .hours{
  width: 490px;
} */
.hours h3 {
 text-align: center;
 color: var(--neutral-dark);
 font-family: var(--font-family-title), sans-serif;
 font-size: 16px;
 margin: 10px 0;
}

.hours .controlCollapse {
 position: relative;
 height: 34px;
 width: 100%;
}

.hours .controlCollapse .line {
 height: 1px;
 background-color: var(--primary);
}

.hours .controlCollapse .button {
 height: 34px;
 width: 34px;
 border: 1px solid var(--primary);
 border-radius: 40px;
 display: flex;
 align-items: center;
 justify-content: center;
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -100%);
 background-color: var(--white);
 cursor: pointer;
}

#hoursOpen.hours .controlCollapse .button svg {
 transition: all 0.3s ease;
}

#hoursOpen.hours.show .controlCollapse .button svg {
 transform: rotate(180deg);
}

.hours .planning {
 height: 0;
 opacity: 0;
 transition: all 0.3s ease;
}

.hours .planning.show {
 opacity: 1;
 display: flex;
 justify-content: space-between;
 flex-direction: column;
 background-color: var(--neutral-extra-light);
 padding: 8px;
 height: 250px;
}

.hours .planning .texts {
 font-size: 22px;
 line-height: 26px;
 display: flex;
 flex-direction: row;
 justify-content: space-between;
}

.hours .planning .texts .infoGlobal {
 font-family: var(--font-family-title), sans-serif;
 color: var(--success);
 display: flex;
 flex-direction: column;
 align-items: center;
}

.hours .planning .infoGlobal .infoOpen.close,
.hours .planning .infoGlobal .hour.close {
 color: var(--error);
}

.hours .planning .infoAffluence.red {
 color: var(--error);
}

.hours .planning .infoAffluence.medium {
 color: var(--warning);
}

.graph {
 position: relative;
 height: 120px;
}

.graph .line {
 position: absolute;
 bottom: 35px;
 left: 0;
 height: 1px;
 width: 100%;
 background-color: var(--neutral-dark);
}

.graph .periodes {
 position: absolute;
 bottom: 35px;
 left: 50%;
 display: flex;
 align-items: baseline;
 transform: translate(-50%, 0);
 opacity: 70%;
}

.graph .periode {
 width: 75px;
 border-radius: 4px 4px 0 0;
}

.graph .periode.small {
 height: 25px;
 background-color: var(--success);
}

.graph .periode.medium {
 height: 50px;
 background-color: var(--warning-light);
}

.graph .periode.large {
 height: 75px;
 background-color: var(--error-light);
}

.hoursList {
 display: flex;
 position: absolute;
 bottom: 10px;
 left: 50%;
 transform: translate(-50%, 0);
 width: 100%;
 justify-content: center;
}

.hoursList .hour .stroke {
 width: 1px;
 position: absolute;
 top: -13px;
 height: 14px;
 background-color: var(--neutral-dark);
}

.hour {
 width: 75px;
 display: flex;
 position: relative;
 align-items: center;
 justify-content: center;
}

/* section  base */
.section {
 flex-direction: column;
 justify-content: space-between;
 gap: 20px;
 align-items: center;

 &#mealplan {
	background-color: var(--neutral-extra-light);
	padding: 30px 0;
	margin: 75px 0;
	background-image: url(../images/pattern-bg-bis-grey.png);
	background-size: 80%;
 }
}

.section.feedInsta {
 margin: 120px 0 0 0;
 padding: 0 30px;
 overflow-x: hidden;
}

.section .sectionTitle {
 justify-content: space-between;
 align-items: center;
 width: 100%;
 flex-direction: column;
}

.section .sectionTitle h2,
.section .sectionTitle div h2,
.section.feedInsta .sectionTitle h2 {
 line-height: 45px;
 text-align: center;
}

.section .labels {
 margin-right: 20px;
}

.section .labels .label {
 height: 120px;
 width: 120px;
 gap: 10px;
 display: flex;
 align-items: center;
 justify-content: center;
}

.section .labels .label img {
 height: auto;
 width: auto;
 max-width: 110px;
 max-height: 110px;
}

/* hero banner */

.heroBanner {
 position: relative;
 width: 100%;
 height: calc(100dvh - 80px); /* Hauteur de la fenêtre visible */
 overflow: hidden;
 top: 80px;
}

/* Style pour la vidéo de fond */
.videoBackground,
.imgBackground {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 object-fit: cover;
 z-index: -1;
}

.videoBackground {
 position: unset;
}

/* Style pour le fond semi-transparent */
.overlay {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background-color: rgba(0, 0, 0, 0.5); /* Opacité faible */
 z-index: -1;
}

/* Style pour le bloc de texte */
.heroBanner .textBlock {
 position: absolute;
 color: var(--white);
 text-align: center;
 width: 100%;
 margin: auto;
 position: absolute;
 top: 0;
 left: 0;
 bottom: 0;
 right: 0;
 text-align: center;
 height: calc(100% - 110px);
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 gap: 5px;
}

/* Style pour le titre */
.heroBanner .textBlock .title {
 font-size: 24px;
 line-height: 24px;
 margin-bottom: 20px;
 color: var(--white);
}

/* Style pour le sous-titre */
.heroBanner .textBlock .subtitle h3 {
 font-size: 30px;
 font-weight: bold;
 color: var(--primary);
}

.arrowBlock {
 height: 44px;
 width: 44px;
 border: 1px solid var(--white);
 border-radius: 44px;
 color: var(--white);
 position: absolute;
 bottom: 30px;
 left: 50%;
 transform: translate(-50%, 0);
 display: flex;
 justify-content: center;
 align-items: center;
 animation: floatArrow 2s infinite;
 cursor: pointer;
}

@keyframes floatArrow {
 0%,
 100% {
	transform: translateY(0);
 }
 50% {
	transform: translateY(-10px);
 }
}

.menuWeeks {
 width: 100dvw;
 /* height: 460px; */
 /* background-color: var(--neutral-extra-light); */
 display: flex;
 flex-direction: column;
 justify-content: space-between;
 align-items: center;
 position: relative;
 padding: 20px 8px 14px 8px;
 border-radius: 4px;
}

.menuWeeks .filters {
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 gap: 25px;
 width: calc(100% - 8px);
}

.menuWeeks .filters .days {
 width: 100%;

}

.menuWeeks .filters .prices .checkboxes input[type='checkbox'] {
 width: 30px;
 height: 30px;
 margin-right: 8px;
}

.menuWeeks .filters .prices .checkboxes label {
 line-height: 30px;
 font-size: 16px;
}

.menuWeeks .filters .days select {
 width: 100%;
}

.menuWeeks.visual {
 height: fit-content;
 gap: 25px;
}

/* .slideMenu {
  display: none;
  width: 100%;
  height: 300px;
  background-color: var(--neutral-extra-light);
  border-radius: 4px;
  padding: 0 20px 0 20px;
  justify-content: center;
  align-items: start;
} */
.listMenu,
.listHorsMenu {
 display: flex;
 width: 100%;
 height: 300px;
 background-color: var(--neutral-extra-light);
 border-radius: 4px;
 padding: 0 0 0 8px;
 justify-content: start;
 align-items: start;
 overflow-x: scroll;
 gap: 8px;
}

.listMenu::-webkit-scrollbar,
.listPostInsta::-webkit-scrollbar,
.listHorsMenu::-webkit-scrollbar {
 opacity: 0;
}

.listPostInsta::-webkit-scrollbar {
 opacity: 0;
 height: 0px;
 width: 0px;
}

.listPostInsta {
 width: 100vw;
 max-width: 100vw;
 height: 298px;
 background-color: var(--neutral-extra-light);
 border-radius: o;
 padding: unset;
 justify-content: start;
 align-items: start;
 overflow-x: scroll;
 overflow-y: hidden;
 gap: 0;
 margin-bottom: 4px;
}

@keyframes scroll {
 0% {
	transform: translateX(0px);
 }
 100% {
	transform: translateX(-1500px);
 }
}

.listPostInsta .post {
 width: 300px;
 height: 300px;
 max-width: 300px;
 position: relative;
 display: flex;
 align-items: center;
 animation: scroll 30s linear infinite;
 border-left: 4px solid white;
}

.listPostInsta .post img {
 width: 300px;
 height: auto;
}

.listPostInsta .post.thumbnail {
}

.listPostInsta .post img.thumbnail {
 width: 300px;
 height: auto;
}

/* .slick-initialized .slick-slide {
  display: block;
  align-items: center;
  justify-content: center;
} */
.menuWeeks.visual {
 width: 100%;
 /* height: 450px; */

 border-radius: 4px;
 padding: 0 20px;
}

.menuWeeks.visual .listMenu,
.listHorsMenu {
 height: fit-content;
 background-color: var(--neutral-extra-light);
 border-radius: 4px;
}

.listHorsMenu {
 padding-top: 15px;
}

/* .cardMenu {
  height: 296px;
  width: 240px;
  background-color: var(--white);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 4px;
  margin: 0 auto;
} */
/* .menuWeeks.visual .slideMenu .cardMenu {
  height: 505px;
} */
/* .menuWeeks.visual .listMenu .cardMenu, */
.listHorsMenu .cardMenu {
 height: 80vh;
 width: 80vw;
}

.menuWeeks.visual .listMenu .cardMenu {
 width: 80vw;
}

/* .slideMenu .cardMenu .avatar, */
/* .listMenu .cardMenu .avatar, */
.listHorsMenu .cardMenu .avatar {
 position: relative;
 width: 100%;
 height: 48px;
}

/* .menuWeeks.visual .slideMenu .cardMenu .avatar, */
/* .menuWeeks.visual .listMenu .cardMenu .avatar, */
.listHorsMenu .cardMenu .avatar {
 position: relative;
 width: 100%;
 height: 211px;
}

/* .menuWeeks.visual .listMenu .cardMenu .avatar, */
.listHorsMenu .cardMenu .avatar {
 height: 80vw;
}

/* .slideMenu .cardMenu .avatar .avatarBg, */
/* .listMenu .cardMenu .avatar .avatarBg, */
.listHorsMenu .cardMenu .avatar .avatarBg {
 position: absolute;
 top: 0;
 left: 0;
 height: 100%;
 width: 100%;
 background-color: var(--secondary);
 border-radius: 4px;
}

/* .slideMenu .cardMenu .avatar .avatarImg, */
/* .listMenu .cardMenu .avatar .avatarImg, */
.listHorsMenu .cardMenu .avatar .avatarImg {
 position: absolute;
 top: 0;
 left: 0;
 height: 100%;
 width: 100%;
 border-radius: 4px;
 overflow: hidden;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
}

/* .slideMenu .cardMenu .avatar .avatarImg img, */
/* .listMenu .cardMenu .avatar .avatarImg img, */
.listHorsMenu .cardMenu .avatar .avatarImg img {
 height: auto;
 width: 100%;
}

/* .slideMenu .cardMenu .avatar .avatarImg.default, */
/* .listMenu .cardMenu .avatar .avatarImg.default, */
.listHorsMenu .cardMenu .avatar .avatarImg.default {
 background-size: 500%;
 background-position: center;
 background-image: url(../images/pattern-bg-bis-white.png);
}

/* .slideMenu .cardMenu .avatar .avatarImg.default img, */
/* .listMenu .cardMenu .avatar .avatarImg.default img, */
.listHorsMenu .cardMenu .avatar .avatarImg.default img {
 display: none;
}

/* .slideMenu .cardMenu .avatar .avatarPrice, */
/* .listMenu .cardMenu .avatar .avatarPrice, */
.listHorsMenu .cardMenu .avatar .avatarPrice {
 position: absolute;
 bottom: 2px;
 left: 2px;
 min-height: 30px;
 min-width: 80px;
 padding: 0 4px;
 background-color: var(--white);
 border-radius: 2px;
 display: flex;
 align-items: center;
 justify-content: center;
 font-size: 18px;
 color: var(--primary);
}

.listHorsMenu .cardMenu .avatar .avatarPrice {
 height: 56px;
 width: calc(100% - 20px);
 padding: 4px;
 box-sizing: border-box;
 margin: auto;
 position: absolute;
 top: 0;
 left: 0;
 bottom: 0;
 right: 0;
 text-align: center;
}

/* .slideMenu .cardMenu .avatar .avatarPrice.prix2, */
.listHorsMenu .cardMenu .avatar .avatarPrice.prix2,
 /* .menuWeeks.showPrix2 .slideMenu .cardMenu .avatar .avatarPrice.prix, */
.menuWeeks.showPrix2 .cardMenu .avatar .avatarPrice.prix,
.menuWeeks .cardMenu .avatar .avatarPrice.prix2 {
 opacity: 0;
}

/* .slideMenu .cardMenu .avatar .avatarPrice.prix, */
.listMenu .cardMenu .avatar .avatarPrice.prix,
.listMenu .cardMenu .avatar .avatarPrice.prix,
 /* .menuWeeks.showPrix2 .slideMenu .cardMenu .avatar .avatarPrice.prix2, */
.menuWeeks.showPrix2 .cardMenu .avatar .avatarPrice.prix2 {
 opacity: 1;
}

/* .slideMenu .cardMenu .avatar .avatarPrice span, */
.listMenu .cardMenu .avatar .avatarPrice span,
.listHorsMenu .cardMenu .avatar .avatarPrice span {
 font-size: 12px;
 margin-right: 3px;
}

/* .slideMenu.visuel .cardMenu .avatar, */
.listMenu.visuel .cardMenu .avatar {
 height: 210px;
}

/* .slideMenu.visuel .cardMenu .avatar, */
.listMenu.visuel .cardMenu .avatar,
.listHorsMenu .cardMenu .avatar {
 height: 85px;
}

/* .cardMenu .menuTitle {
  height: 44px;
  font-size: 20px;
  display: flex;
  align-items: center;
  text-align: center;
  justify-content: center;
} */
/* .cardMenu .menuInfo {
  height: 175px;
  font-size: 18px;
  display: flex;
  align-items: center;
  text-align: center;
} */
.listMenu .cardMenu .menuInfo {
 padding: 0 4px;
 /* min-height: 200px; */
 /* height: calc(100% - 50px); */
}

.listHorsMenu .cardMenu .menuInfo {
 padding: 0 4px;
 min-height: 200px;
 width: 100%;
 height: 100%;
 justify-content: center;
 overflow-y: scroll;
 scrollbar-width: none;
}

.bulle .info {
 opacity: 0;
 display: none;
 transition: all ease 500ms;
 transform-origin: center;
 overflow-y: scroll;
}

.bulle .info.show {
 opacity: 1;
 display: flex;
 scrollbar-width: none;
}

/* .cardMenu .menuInfo p {
  width: 100%;
}

.cardMenu {
  &.Hidden {
    .avatar {
      overflow: hidden;
      display: none;
    }
    .menu {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: start;

      .menuTitle {
        color: var(--primary);
      }
      .menuInfo {
        flex: 1;
      }
    }
  }
}
.cardMenu {
  &.OnlyPrice {
    .avatar {
      height: 34px !important;
      .avatarImg {
        opacity: 0;
      }
      .avatarPrice {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        color: white;
        background: none;
      }
    }
    .menu {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: start;
      .menuInfo {
        flex: 1;
      }
    }
  }
} */
/* .bulles {
  height: 55px;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  font-size: 12px;
  position: relative;
  gap: 6px;
  padding: 3px 0;
} */
/* .closeInfo {
  position: absolute;
  top: 7px;
  right: 11px;
}
.bulle {
  cursor: pointer;
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  font-size: 12px;
} */

/* .bulle .icon {
  height: 25px;
  width: 25px;
  color: var(--primary);
}
.bulle span {
  height: 20px;
}
.bulle .icon img {
  height: 100%;
}

/* .bulle .info::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 50%;
  margin-left: -10px;
  border-width: 10px;
  border-style: solid;
  border-color: var(--primary-extralight) transparent transparent transparent;
  border-radius: 0 0 4px 4px;
} */
/* .bulle .info.show {
  opacity: 1;
  height: 400px;
  scrollbar-width: none;
}
.bulle .info.show::-webkit-scrollbar {
  display: none;
}
.bulle .info .allergen .allergenTitle,
.originsTitle {
  color: var(--primary);
  font-size: 14px;
}
.bulle .info .infoTitle {
  color: var(--primary);
  font-size: 22px;
  position: absolute;
  top: 7px;
  left: 5px;
} */
/* .allergenList {
  display: flex;
  flex-direction: row;
  gap: 4px;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
}
.allergenList .icon {
  height: 75px;
  width: 75px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
}
.allergenList .icon img {
  height: 120px;
  width: 120px;
  border: none;
} */
ul.slideDaysBtns,
ul.slideCardsBtns {
 display: none;
 position: absolute;
 top: 15px;
 margin: unset;
 right: 15px;
 overflow: hidden;
}

ul.slideDaysBtns li,
ul.slideCardsBtns li {
 list-style-type: none;
}

ul.slideDaysBtns li button,
ul.slideCardsBtns li button {
 background: none;
 border: none;
 cursor: pointer;
}

ul.slideDaysBtns li button svg,
ul.slideCardsBtns li button svg {
 color: var(--white);
 height: 34px !important;
 width: 34px !important;
 pointer-events: none;
}

ul.slideDaysBtns li button svg {
 color: var(--primary);
}

button.slick-prev.slick-arrow {
 position: absolute;
 z-index: 10;
 right: 50px;
 top: 0;
}

button.slick-next.slick-arrow {
 position: absolute;
 z-index: 10;
 right: 0;
 top: 0;
}

/* actuality */
.actuality,
.eldoraApp,
.pulpeMain,
.customSection {
 display: flex;
 flex-direction: column;
 gap: 25px;
}

.eldoraApp.takeandpay {
 flex-direction: column-reverse;
}

.magazineList .pulpeMain {
 margin: 0 0 50px 0;
}

.actualityVisuel,
.eldoraAppVisuel,
.pulpeMainVisuel,
.customVisuel {
 width: calc(100vw - 8px);
 height: calc(100vw - 8px);
 border-radius: 4px;
 overflow: hidden;
 background-color: var(--neutral-light);
 position: relative;
}

.eldoraAppVisuel {
 background-color: var(--primary);
}

.visuelBG {
 width: 100%;
 height: 100%;
 background-image: url(../images/pattern-bg-bis-white.png);
 background-size: 300%;
 background-position: center;
 background-repeat: no-repeat;
 position: absolute;
 top: 0;
 left: 0;
}

.visuelImg {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 padding: 20px;
 display: flex;
 align-items: center;
 overflow: hidden;
 border-radius: 4px;
}

.visuelImg img {
 width: 100%;
 height: auto;
 margin: 0 auto;
}

.pulpeMain .pulpeMainVisuel {
 .visuelBG {
	background-color: white;
 }

 .visuelImg {
	padding: 0;

	img {
	 width: 100%;
	 height: 100%;
	 margin: 0 auto;
	 object-fit: cover;
	 object-position: center;
	}
 }
}

.eldoraAppVisuel,
.customVisuel {
 height: 600px;
}

.eldoraAppVisuel .visuelImg,
.customVisuel .visuelImg {
 width: 360px;
 height: 560px;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 position: relative;
}

.customVisuel .visuelImg {
 width: 100%;
 height: 100%;
 padding: 0;
}

.eldoraAppVisuel.takeandpay .visuelImg {
 width: 80dvw;
 height: auto;
}

.visuelAnimation {
 position: absolute;
 top: 26px;
 left: 60px;
 height: 426px;
 width: 241px;
}

.eldoraAppVisuel .visuelAnimation,
.customVisuel .visuelAnimation {
 top: 53px;
 left: 74px;
 height: 468px;
 width: 215px;
 z-index: 100;
}

.eldoraAppVisuel.takeandpay .visuelAnimation,
.customVisuel .visuelAnimation {
 top: 50%;
 left: 50%;
 height: 225px;
 width: 400px;
 z-index: 100;
 transform: translate(-50%, -50%);
}

.eldoraAppVisuel.takeandpay .visuelAnimation iframe {
 width: 100%;
 height: 100%;
}

.eldoraAppVisuel .visuelImg img,
.customVisuel .visuelImg img {
 width: auto;
 height: 100%;
}

.actualityTexts,
.eldoraAppTexts,
.pulpeMainTexts,
.customTexts {
 flex-direction: column;
 width: calc(100vw - 8px);
 height: calc(100vw - 8px);
 text-align: center;
 gap: 25px;
 height: fit-content;
}

.eldoraAppTexts,
.pulpeMainTexts,
.customTexts {
 gap: unset;
}

.eldoraAppTexts,
.customTexts {
 align-items: center;
 gap: 20px;
}

.pulpeMainTexts .btn {
 margin: 0 auto;
}

.eldoraAppQrCodes {
 display: flex;
 justify-content: space-evenly;
 width: 100%;
}

.eldoraAppQrCode {
 width: 150px;
 height: 150px;
}

.eldoraAppQrCode img {
 width: 100%;
 height: auto;
}

.eldoraAppLinks {
 display: flex;
 flex-direction: row;
 justify-content: space-evenly;
 width: 100%;
}

.eldoraAppLinks .link {
 display: block;
}

.sectionContent,
.kitchen,
.advice,
.survey,
.instagram {
 width: 100%;
 background-color: var(--neutral-extra-light);
 border-radius: 4px;
}

.animationMain {
 width: 100%;
 border-radius: 4px;
}

.sectionContent,
.survey {
 overflow-x: scroll;
 overflow-y: hidden;
 scrollbar-width: none;
}

.sectionContent {
 .d-flex {
	flex-direction: column;
	width: 100%;
	overflow: hidden;
	gap: 20px;

	.card {
	 padding: 12px;
	 display: flex;
	 flex-direction: column;
	 gap: 8px;
	 justify-content: space-between;
	 border-color: white;

	 &:hover {
		border-width: 2px;
		border-color: var(--primary);
		background-color: var(--primary-extralight);
	 }

	 .visual {
		height: 300px;
		width: 300px;
		border-radius: 50%;
		overflow: hidden;
		margin: 0 auto;

		img {
		 height: 100%;
		 width: 100%;
		 object-fit: cover;
		}
	 }

	 .title {
		text-align: center;
	 }

	 .info {
		text-align: center;
	 }

	 a {
		margin: 0 auto;
	 }
	}
 }
}

.kitchen::-webkit-scrollbar,
.animationMain::-webkit-scrollbar,
.advice::-webkit-scrollbar,
.instagram::-webkit-scrollbar {
 opacity: 0;
}

.recipeList {
 flex-wrap: wrap;
 flex-direction: unset;
 padding: 30px;
 background-color: var(--neutral-extra-light);
 border-radius: 8px;
 justify-content: center;
 align-items: center;
 gap: 30px 0;
}

.modal {
 opacity: 0;
 pointer-events: none;
 transition: opacity 0.3s ease;
 display: block;
}

.modal::-webkit-scrollbar,
.modalCard::-webkit-scrollbar {
 opacity: 0;
 height: 0px;
 width: 0px;
}

.modal.show {
 opacity: 1;
 pointer-events: auto;
}

.modal .modalBg {
 width: 100vw;
 height: 100vh;
 background-color: var(--neutral-dark);
 opacity: 60%;
 position: absolute;
 top: 0;
 left: 0;
}

.modalBg {
 display: none;
}

.modalCard {
 position: absolute;
 height: 100%;
 width: 100%;
 background-color: var(--white);
 overflow-y: scroll;
}

.modalCard::-webkit-scrollbar {
 opacity: 0;
}

.imgModal {
 height: 300px;
 overflow: hidden;
 display: flex;
 align-items: center;
 justify-content: center;
}

.imgModal img {
 width: 100%;
 height: auto;
}

.infoModal {
 display: flex;
 flex-direction: column;
 gap: 20px;
 padding: 10px;
}

.infoModal .title {
 color: var(--primary);
}

.infoModal .btn {
 width: 100%;
}

.closeModal {
 position: fixed;
 height: 28px;
 width: 28px;
 top: 10px;
 right: 10px;
 background-color: var(--white);
 border-radius: 30px;
 padding: 4px;
 display: flex;
}

.closeModal svg {
 height: 100%;
 width: 100%;
}

.recipes .filter {
 background-color: var(--primary);
 border-radius: 4px;
 min-height: 140px;
 padding: 8px;
 margin: 20px 0;
 position: relative;
 display: flex;
 flex-direction: column;
 align-items: center;
 justify-content: center;
}

.recipes .filter .filterTitle {
 text-align: center;
 color: var(--white);
}

.recipes .filter .filterList {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 8px;
 color: var(--white);
}

.recipes .filter .filterList .catBlock {
 display: flex;
 flex-direction: column;
 align-items: start;
 gap: 4px;
}

.recipes .filter .filterList .select {
 color: var(--white);
 border-color: var(--white);
 background: url(../images/chevron-down-white.svg) no-repeat;
}

.filterBG {
 position: absolute;
 top: 0;
 left: 0;
 height: 100%;
 width: 100%;
 pointer-events: none;
}

.filterBG .filterImgLeft {
 position: absolute;
 top: -16px;
 left: 0;
 width: 100px;
 height: 60px;
 background-image: url(../images/totmato-draw-white.png);
 background-size: contain;
 background-repeat: no-repeat;
 opacity: 80%;
}

.filterBG .filterImgRight {
 position: absolute;
 top: 0;
 right: -13px;
 width: 76px;
 height: 44px;
 background-image: url(../images/orange-draw-white.png);
 background-size: contain;
 background-repeat: no-repeat;
 opacity: 80%;
}

.priceList {
 .accordion {
	width: 100%;

	.accordion-item {
	 width: 100%;

	 .accordion-header {
		.accordion-button {
		 width: 100%;
		 color: var(--neutral-dark);
		 background-color: var(--primary-extralight);
		 border: 1px solid var(--primary);
		 padding: 4px;
		 border-radius: 4px;
		}
	 }

	 .accordion-body {
		.lineItem {
		 display: flex;
		 flex-direction: row;
		 padding: 8px;
		 border-bottom: 1px solid var(--neutral-extra-light);
		}
	 }
	}
 }
}

#Iframe {
 .section {
	&#mealplan {
	 margin: 0;
	}
 }
}