/* --- FEUILLE DE STYLE --- */
/* ////////////////////////////////////////////////////////////////////////////
Office de Tourisme de Bayeux // CSS
NetConception 2021
//////////////////////////////////////////////////////////////////////////// */
/* main.css 2.1.0 | MIT License | https://github.com/h5bp/main.css#readme */
/*
* What follows is the result of much research on cross-browser styling.
* Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
* Kroc Camen, and the H5BP dev community and team.
*/
/* ------ BLONDE SCRIPT ------ */
@font-face {
font-family: 'blondescript';
src: url('../fonts/blonde-script/blondescript-regular-webfont.woff2') format('woff2'),
url('../fonts/blonde-script/blondescript-regular-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}
/* ------ INTELO ------ */
@font-face {
font-family: 'intelo';
src: url('../fonts/intelo/intelo_light-webfont.woff2') format('woff2'),
url('../fonts/intelo/intelo_light-webfont.woff') format('woff');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'intelo';
src: url('../fonts/intelo/intelo_regular-webfont.woff2') format('woff2'),
url('../fonts/intelo/intelo_regular-webfont.woff') format('woff');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'intelo';
src: url('../fonts/intelo/intelo_semibold-webfont.woff2') format('woff2'),
url('../fonts/intelo/intelo_semibold-webfont.woff') format('woff');
font-weight: 600;
font-style: normal;
}
@font-face {
font-family: 'intelo';
src: url('../fonts/intelo/intelo_bold-webfont.woff2') format('woff2'),
url('../fonts/intelo/intelo_bold-webfont.woff') format('woff');
font-weight: 700;
font-style: normal;
}
/* ==========================================================================
Base styles: opinionated defaults
========================================================================== */
*,
*::before,
*::after {
box-sizing: inherit;
}
/**
* 1. Correct the line height in all browsers.
* 2. Prevent adjustments of font size after orientation changes in iOS.
*/
html {
color: #313130;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
font-smoothing: antialiased;
-webkit-box-sizing:border-box;
box-sizing:border-box;
font-size: 62.5%; /* Ré-équilibrage du Rem face au Pixel pour des calculs simples / 1.0rem = 10px */
font-family: 'intelo', sans-serif;
}
body {
background: #FFF;
scroll-behavior: smooth;
width: 100%;
height: 100%;
margin: 0;
padding: 0;
/* Attention les fonctions JS scroll ne marcheront pas avec overflow-x: hidden; */
/*overflow-x: hidden;*/
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem);
}
/*
* Remove text-shadow in selection highlight:
* https://twitter.com/miketaylr/status/12228805301
*
* Vendor-prefixed and regular ::selection selectors cannot be combined:
* https://stackoverflow.com/a/16982510/7133471
*
* Customize the background color to match your design.
*/
::-moz-selection {
color: #FFF;
background: #EE743B;
text-shadow: none;
}
::selection {
color: #FFF;
background: #EE743B;
text-shadow: none;
}
/*
* A better looking default horizontal rule
*/
hr {
display: block;
height: 1px;
border: 0;
border-top: 1px solid #ccc;
margin: 1em 0;
padding: 0;
}
/*
* Remove the gap between audio, canvas, iframes,
* images, videos and the bottom of their containers:
* https://github.com/h5bp/html5-boilerplate/issues/440
*/
audio,
canvas,
iframe,
img,
svg,
video {
vertical-align: middle;
}
/*
* Remove default fieldset styles.
*/
fieldset {
border: 0;
margin: 0;
padding: 0;
}
/*
* Allow only vertical resizing of textareas.
*/
textarea {
resize: vertical;
}
/* ==========================================================================
Normalize
========================================================================== */
img {
max-width: 100%;
}
main {
display: block;
}
button,
input[type=text],
input[type=email],
input[type=url],
input[type=number],
input[type=tel],
input[type=file],
input[type=submit],
input[type=button],
optgroup,
select,
textarea {
font-family: inherit;
font-size: 100%;
line-height: 1.15;
/*margin: 0;*/ /* masqué car casse les checkbox */
outline: none;
}
/* ==========================================================================
Helper classes
========================================================================== */
/*
* Hide visually and from screen readers
*/
.hidden,
[hidden] {
display: none !important;
}
/*
* Hide only visually, but have it available for screen readers:
* https://snook.ca/archives/html_and_css/hiding-content-for-accessibility
*
* 1. For long content, line feeds are not interpreted as spaces and small width
* causes content to wrap 1 word per line:
* https://medium.com/@jessebeach/beware-smushed-off-screen-accessible-text-5952a4c2cbfe
*/
.sr-only {
border: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
white-space: nowrap;
width: 1px;
/* 1 */
}
/*
* Extends the .sr-only class to allow the element
* to be focusable when navigated to via the keyboard:
* https://www.drupal.org/node/897638
*/
.sr-only.focusable:active,
.sr-only.focusable:focus {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
white-space: inherit;
width: auto;
}
/*
* Hide visually and from screen readers, but maintain layout
*/
.invisible {
visibility: hidden;
}
/*
* Clearfix: contain floats
*
* For modern browsers
* 1. The space content is one way to avoid an Opera bug when the
* `contenteditable` attribute is included anywhere else in the document.
* Otherwise it causes space to appear at the top and bottom of elements
* that receive the `clearfix` class.
* 2. The use of `table` rather than `block` is only necessary if using
* `:before` to contain the top-margins of child elements.
*/
.clearfix::before,
.clearfix::after {
content: " ";
display: table;
}
.clearfix::after {
clear: both;
}
.alignleft {
float: left;
margin: 0 40px 20px 0;
}
.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}
.alignright {
float: right;
margin: 0 0 20px 40px;
}
@supports (object-fit: cover) {
/* IF object-fit IS SUPPORTED */
.object-fit-cover {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
}
.ratio-box > img {
height: 100%;
object-fit: cover;
object-position: center center;
}
}
.ratio-box {
position: relative;
display: block;
width: 100%;
height: 0;
padding-bottom: 56.25%;
overflow: hidden;
}
.ratio-box > img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
}
.ratio-box > iframe {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
}
.ratio-16-9 {
padding-bottom: 56.25%;
}
.ratio-4-3 {
padding-bottom: 75%;
}
.ratio-1-1 {
padding-bottom: 100%;
}
.container-xs {
max-width: 880px;
margin: auto;
}
.container {
max-width: 1200px;
margin: auto;
}
.container-xl {
max-width: 1920px;
margin: auto;
}
main {
min-height: 100px;
}
/* ==========================================================
Author's custom styles
========================================================== */
/* -------------------------------------
HEADER
------------------------------------- */
header#main-header {
position: relative;
height: 100vh;
background-color: #FFF;
}
header#main-header .topbar {
position: relative;
z-index: 100;
background-color: #FFF;
transition: all 0.2s ease;
}
#main-header .topbar.nav-down,
#main-header .topbar.nav-up {
position: fixed;
background-color: #FFF;
width:100%;
}
#main-header .topbar.nav-up {
transform: translateY(-100%);
box-shadow: none;
}
header#main-header .logo {
position: absolute;
z-index: 1000;
top: 0;
right: 60px;
left: 0;
display: flex;
flex-direction: column;
align-items: center;
max-width: 200px;
margin: auto;
padding: 20px;
background-color: #FFF;
transition: all 0.2s ease;
}
#main-header .topbar.nav-down .logo {
}
#main-header .topbar.nav-up .logo {
display:none;
}
@media (min-width: 1281px) {
header#main-header .logo.menu-is-open {
background-color: transparent;
pointer-events: none;
}
header#main-header .logo.menu-is-open img:last-child {
opacity: 0;
visibility: hidden;
}
}
/* header#main-header .logo img {
width: 150px;
} */
header#main-header .logo img:first-child {
width: 85px;
}
header#main-header .logo img:last-child {
width: 150px;
margin-top: 16px;
transition: all 0.2s ease;
}
h1.home {
position: absolute;
z-index: 1;
right: 0;
bottom: 170px;
left: 0;
color: #FFF;
text-align: center;
font-size: 4.0rem;
font-size: clamp(2.4rem, 2.2vw, 4.0rem);
font-weight: 600;
padding-right: 60px;
margin: 0;
text-shadow: 0px 0px 4px rgba(0, 0, 0, 0.8),
0px 0px 30px rgba(0, 0, 0, 0.9);
}
.header-group-links {
display: flex;
justify-content: space-between;
padding: 20px 80px 20px 20px;
}
.header-group-links a {
display: block;
transition: all 0.2s ease;
}
.header-group-links a:hover {
opacity: 0.65;
}
.header-group-links .group-infos {
position: relative;
z-index: 10;
display: flex;
align-items: center;
}
.header-group-links .group-infos ul {
display: flex;
align-items: center;
list-style: none;
padding: 0;
margin: 0;
}
.header-group-links .group-infos ul li {
margin-right: 10px;
}
.header-group-links .group-infos ul.group-infos-links li {
margin-left: 10px;
}
.header-group-links .group-infos ul.group-infos-links li a {
display: block;
text-decoration: none;
color: #313130;
font-weight: 400;
background-color: #FFF;
padding: 5px 10px;
border-radius: 4px;
}
.header-group-links .acces-espace .acces-groupes a {
background-color: #313130;
}
#a-rdv-jour {
background-color:#efff00;
background-image: url("../images/calendar-rdv.svg");
background-repeat: no-repeat;
background-position: 10px center;
background-size: 20px;
padding-left:40px;
}
@media (max-width: 1281px) {
.main-nav {
display: none;
}
}
@media (min-width: 1281px) {
.main-nav {
display: flex;
height: 110px;
justify-content: center;
align-items: center;
padding: 0 60px 0 0;
}
.main-nav__left,
.main-nav__right {
width: 50%;
}
.main-nav__left .main-nav__list {
justify-content: flex-end;
padding-right: 100px;
}
.main-nav__left .main-nav__list .main-nav__item:last-child {
margin-right: 0;
}
.main-nav__right .main-nav__list {
justify-content: flex-start;
padding-left: 100px;
}
.main-nav__right .main-nav__list .main-nav__item:first-child {
margin-left: 0;
}
.main-nav__list {
display: flex;
justify-content: center;
width: 100%;
height: 100%;
margin: 0 auto;
padding: 0 30px;
list-style: none;
max-width: 1620px;
}
.main-nav__list:first-child {
justify-content: flex-end;
padding-right: 80px;
}
.main-nav__list:last-child {
justify-content: flex-start;
padding-left: 80px;
}
.page .main-nav__list:first-child {
padding-right: 40px;
}
.page .main-nav__list:last-child {
padding-left: 40px;
}
.main-nav__item {
display: flex;
align-items: center;
justify-content: center;
text-align: center;
padding: 0 20px;
}
/* .main-nav__item::after {
content: '';
opacity: 0;
visibility: hidden;
position: absolute;
left: 0;
top: 110px;
display: block;
height: 150px;
opacity: 0.2;
width: 100%;
background: rgb(0,0,0);
background: -moz-linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
background: linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
} */
.main-nav__link {
color: #EE743B;
font-size: 2.0rem;
font-size: clamp(1.6rem, 1.1vw, 2.0rem);
font-weight: 700;
letter-spacing: 2px;
text-transform: uppercase;
text-decoration: none;
transition: all 0.2s ease;
}
.main-nav__item:hover .main-nav__link {
color: #313130;
}
.main-nav__item:hover:after {
opacity: 1;
visibility: visible;
}
.main-nav__item:hover .main-nav-2nd__list {
top: 110px;
opacity: 1;
visibility: visible;
pointer-events: auto;
}
.main-nav-2nd__list {
opacity: 0;
visibility: hidden;
pointer-events: none;
position: absolute;
z-index: 100;
top: 110px;
right: 60px;
left: 0;
background-color: #FFF;
width: 1000px;
min-height: 180px;
list-style: none;
padding: 20px 30px 20px 30px;
margin: auto;
text-align: left;
background-image: url('../images/assets/logo-signature-30op.svg');
background-repeat: no-repeat;
background-size: 160px;
background-position: left 20px bottom 20px;
column-count: 2;
box-shadow: 0 10px 20px rgba(0,0,0,0.03), 0 6px 6px rgba(0,0,0,0.03);
transition: all 0.2s ease;
}
/* .main-nav-2nd__list::before,
.main-nav-2nd__list::after {
content: '';
position: absolute;
z-index: -1;
top: -12px;
left: 0;
display: block;
width: 45%;
height: 12px;
background-color: #FFF;
}
.main-nav-2nd__list::after {
right: 0;
left: unset;
} */
/*
.main-nav-2nd__list::after {
content: '';
position: absolute;
z-index: -1;
top: -12px;
left: 50%;
right: 0;
display: flex;
justify-content: center;
align-items: center;
width: 100vw;
height: 100%;
transform: translateX(-50%);
}
*/
.main-nav-2nd__item {
padding: 10px 0;
}
.main-nav-2nd__item {
text-decoration: none;
font-size: 1.8rem;
font-weight: 500;
color: #575756;
letter-spacing: 0.05em;
text-transform: uppercase;
transition: all 0.2s ease;
}
.main-nav-2nd__item:hover {
color: #EE743B;
}
}
/* ------------------ BOUTON MENU RESPONSIVE ------------------ */
#button-menu-resp {
position: relative;
z-index: 10;
top: 0;
height: 30px;
cursor: pointer;
border: none;
margin: 0;
padding: 0;
flex: none;
background-color: transparent;
}
.hc-nav-trigger span, .hc-nav-trigger span::before, .hc-nav-trigger span::after {
background-color: #EE743B;
border-radius: 4px;
}
/* ------------------ MENU RESPONSIVE ------------------ */
.hc-offcanvas-nav.nav-levels-overlap .nav-content {
background-image: url('../images/assets/logo-signature-30op.svg');
background-repeat: no-repeat;
background-size: 100px;
background-position: left 15px bottom 65px;
}
.hc-offcanvas-nav .nav-container, .hc-offcanvas-nav .nav-wrapper, .hc-offcanvas-nav ul {
background-color: #FFF;
font-family: 'intelo', sans-serif;
}
.hc-offcanvas-nav ul {
padding-left: 10px;
}
.hc-offcanvas-nav .nav-wrapper-0>.nav-content>ul:not(:last-child) {
margin-bottom: 0;
}
.hc-offcanvas-nav .nav-content>h2:first-child, .hc-offcanvas-nav .nav-content>h3:first-child, .hc-offcanvas-nav .nav-content>h4:first-child, .hc-offcanvas-nav .nav-content>h5:first-child, .hc-offcanvas-nav .nav-content>h6:first-child {
margin: 0;
font-weight: 700;
}
.hc-offcanvas-nav .nav-content>h2, .hc-offcanvas-nav .nav-content>h3, .hc-offcanvas-nav .nav-content>h4, .hc-offcanvas-nav .nav-content>h5, .hc-offcanvas-nav .nav-content>h6 {
text-align: center;
color: #EE743B;
padding: 10px 20px 10px 20px;
border-bottom: 1px solid #D9D9D9;
}
.hc-offcanvas-nav.nav-close-button-empty .nav-title {
padding-right: 20px;
}
.hc-offcanvas-nav a.nav-next:before {
top: 0;
left: 0;
height: 100%;
width: 1px;
background-color: #D9D9D9;
}
.hc-offcanvas-nav li.nav-parent .nav-item-link:not(:last-child) {
margin-right: 40px;
}
.hc-offcanvas-nav .nav-item-link, .hc-offcanvas-nav li.nav-close a, .hc-offcanvas-nav .nav-back a {
color: #EE743B;
}
.hc-offcanvas-nav .nav-next span::before,
.hc-offcanvas-nav .nav-back span::before {
border-color: #7E7E7C;
}
.hc-offcanvas-nav .nav-close-button span::before,
.hc-offcanvas-nav .nav-close-button span::after {
border-color: #7E7E7C;
}
.hc-offcanvas-nav:not(.touch-device) li:not(.nav-item-custom) a:not([disabled]):hover,
.hc-offcanvas-nav .nav-content>.nav-close a:hover {
background-color: #FCE4D9;
border-radius: 0;
}
.hc-offcanvas-nav .nav-title+.nav-close a:not(.has-label) {
right: unset;
top: 0;
left: 10px;
}
.hc-offcanvas-nav .nav-back a {
background-color: hsl(19, 84%, 95%);
}
.hc-offcanvas-nav .nav-close-button span::before {
display: none;
}
.hc-offcanvas-nav .nav-close-button span::before, .hc-offcanvas-nav .nav-close-button span::after {
width: 10px;
height: 10px;
margin-top: -4px;
margin-left: -2px;
}
.hc-offcanvas-nav .nav-content {
padding: 0;
}
.search-responsive {
display: none;
width: 40px;
height: 40px;
}
/* ------------------ SIDEBAR ------------------ */
.sidebar {
position: fixed;
z-index: 100;
top: 0;
right: 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: space-between;
width: 60px;
height: 100vh;
background-color: rgba(255, 255, 255, 0.4);
backdrop-filter: blur(30px);
padding-top: 110px;
transition: all 0.2s ease;
}
.sidebar.js-scrolled {
padding-top: 0;
}
.sidebar ul {
list-style: none;
padding: 10px 0;
margin: 0;
}
.sidebar ul li {
margin: 10px 0;
}
.sidebar ul li a,
.sidebar ul li button {
cursor: pointer;
position: relative;
display: flex;
align-items: center;
background-color: transparent;
border: none;
padding: 0;
transition: all 0.2s ease;
}
.sidebar .tooltip {
position: absolute;
left: -10px;
display: block;
font-size: 1.6rem;
font-weight: 300;
color: #FFF;
background-color: rgba(49, 49, 48, 0.9);
border-radius: 4px;
padding: 5px 8px;
white-space: nowrap;
opacity: 0;
visibility: hidden;
transform: translateX(-80%);
transition: all 0.2s ease;
}
.sidebar ul li a:hover,
.sidebar ul li button:hover {
transform: scale(1.1);
}
.sidebar ul li a:hover .tooltip,
.sidebar ul li button:hover .tooltip {
opacity: 1;
visibility: visible;
transform: translateX(-100%);
}
#uci_link {
position: absolute;
opacity: 0;
visibility: hidden;
}
/* ------------------ SLIDER HOME ------------------ */
.home-slider-wrapper {
position: absolute;
z-index: 0;
top: 110px;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: calc(100% - 110px);
}
.home-slider-wrapper .lSSlideOuter,
.home-slider-wrapper .lSSlideWrapper,
.home-slider-wrapper .lightSlider {
height: 100%!important;
padding-bottom: 0 !important;
}
.lSSlideOuter .lSPager.lSGallery li {
border-radius: 0;
border: 2px solid #FFF;
padding: 1px;
transition: all 0.2s ease;
}
.lSSlideOuter .lSPager.lSGallery li.active,
.lSSlideOuter .lSPager.lSGallery li:hover {
border-radius: 0;
border: 2px solid #EE743B;
}
.home-slider {
background-color: #313130;
}
.home-slider > * {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: hidden;
}
.home-slider img {
width: 100%;
}
@supports (object-fit: cover) {
/* IF object-fit IS SUPPORTED */
.home-slider img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center center;
}
}
.scroll-next {
position: relative;
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
background: rgba(255, 255, 255, 0.2);
backdrop-filter: blur(30px);
width: 80px;
height: 80px;
width: clamp(40px, 5vw, 80px);
height: clamp(40px, 5vw, 80px);
border-radius: 100px;
border: none;
padding: 0;
transition: all 0.2s ease;
}
.scroll-next:hover {
background: rgba(255, 255, 255, 0.4);
}
.scroll-next img {
width: 38%;
}
.scroll-next::after {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
z-index: -1;
box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.1);
border-radius: 100px;
opacity: 0;
-webkit-animation: wave 2.5s infinite;
animation: wave 2.5s infinite;
}
header#main-header .scroll-next {
position: absolute;
right: 60px;
bottom: 0;
left: 0;
margin: 0 auto 50px auto;
margin-bottom: clamp(20px, 3vw, 50px);
}
@-webkit-keyframes wave {
0% {
opacity: 0;
}
30% {
opacity: 1;
}
60% {
box-shadow: 0 0 0 50px rgba(255, 255, 255, .1);
opacity: 0;
}
100% {
opacity: 0;
}
}
@keyframes wave {
0% {
opacity: 0;
}
30% {
opacity: 1;
}
60% {
box-shadow: 0 0 0 50px rgba(255, 255, 255, .1);
opacity: 0;
}
100% {
opacity: 0;
}
}
/* -------------------------------------
MAIN
------------------------------------- */
main {
position: relative;
padding-right: 60px;
}
main::after {
content: '';
position: absolute;
top: 0;
right: 0;
display: block;
width: 60px;
height: 100%;
background-color: #F4A580;
}
/* ==========================================================
FOOTER
========================================================== */
/* --- NEWSLETTER --- */
.newsletter {
padding: 30px 60px 30px 0;
text-align: center;
background-color: hsl(60,1%,95%);
border-top: 1px solid white;
}
.newsletter label,
.newsletter span {
display: block;
}
.newsletter label span:nth-child(1) {
color: #EE743B;
font-family: 'blondescript', serif;
font-size: 5.0rem;
font-size: clamp(3.0rem, 2.7vw, 5.0rem);
font-weight: 400;
line-height: 0.9;
}
.newsletter label span:nth-child(2) {
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem);
font-weight: 300;
line-height: 3.0rem;
text-align: center;
max-width: 450px;
margin: 10px auto;
}
.newsletter .champs, .recherche .champs {
display: flex;
justify-content: center;
}
.newsletter .champs *, .recherche .champs * {
height: 40px;
padding: 0 15px;
}
.newsletter .champs input[type="email"], .recherche .champs input[type="text"] {
color: #7E7E7C;
font-weight: 300;
width: 320px;
margin-right: 10px;
}
.newsletter .champs input[type="submit"], .recherche .champs input[type="submit"] {
color: #FFF;
font-weight: 400;
background-color: #EE743B;
border: none;
cursor: pointer;
transition: all 0.2s ease;
}
.newsletter .champs input[type="submit"]:hover, .recherche .champs input[type="submit"]:hover {
background-color: hsl(19, 84%, 40%);
}
.recherche {
padding: 30px;
text-align: center;
background-color: hsl(60,1%,95%);
}
footer#main-footer {
padding: 30px 90px 20px 30px;
background-color: #313130;
}
footer a {
transition: all 0.2s ease;
}
footer a:hover {
opacity: 0.6;
}
footer .linksbar {
display: flex;
justify-content: center;
align-items: flex-end;
padding: 0;
margin: 0 0 20px 0;
}
.linksbar .footer-links:first-child {
justify-content: flex-end;
}
.linksbar .footer-links:first-child li {
margin: 10px 0 10px 20px;
}
.footer-links {
list-style: none;
display: flex;
flex: 1;
flex-wrap: wrap;
padding: 0;
margin: 0;
}
.footer-links li {
display: flex;
align-items: center;
flex-wrap: nowrap;
white-space: nowrap;
margin: 10px 20px 10px 0;
}
.footer-links li::after {
content:'';
display: block;
width: 8px;
height: 8px;
margin: 0 0 0 20px;
border-radius: 10px;
background-color: #FFF;
}
.footer-links li:last-child:after {
display: none;
}
.footer-links li a {
color: #FFF;
font-weight: 400;
font-size: 2.0rem;
font-size: clamp(1.6rem, 1.1vw, 2.0rem);
text-decoration: none;
text-transform: uppercase;
letter-spacing: 0.05em;
}
footer .rs-list {
list-style: none;
display: flex;
justify-content: space-between;
padding: 0;
margin: 0 -5px;
}
footer .rs-list li {
margin: 10px 5px;
}
footer .rs-list li a {
display: block;
}
footer .branding {
max-width: 120px;
flex: none;
margin: 0 4%;
margin: 0 min(4%, 60px);
}
footer .partenaires {
margin: 0 0 40px 0;
}
footer .partenaires ul {
list-style: none;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
padding: 0;
margin: 0;
}
footer .partenaires ul li {
margin: 20px;
}
footer .partenaires ul li a {
display: block;
}
footer .partenaires ul li a img {
max-width: 180px;
}
footer .bottombar {
display: flex;
justify-content: space-between;
align-items: center;
}
footer .bottombar a {
color: #D9D9D9;
font-size: 1.6rem;
font-size: clamp(1.4rem, 1.0vw, 1.6rem);
font-weight: 300;
text-decoration: none;
}
footer .bottombar p {
color: #D9D9D9;
font-size: 1.6rem;
font-size: clamp(1.4rem, 1.0vw, 1.6rem);
font-weight: 300;
margin: 0;
}
.acces-espace {
position: relative;
z-index: 10;
display: flex;
align-items: center;
color: #FFF;
}
.acces-espace ul {
display: flex;
align-items: center;
list-style: none;
padding: 0;
margin: 0;
}
.acces-espace a {
display: inline-block;
color: #313131;
font-weight: 400;
background-color: #FFF;
border-radius: 4px;
padding: 5px 8px;
margin: 0 0 0 5px;
text-decoration: none;
}
footer .bottombar .acces-espace a {
color: #313131;
font-weight: 400;
}
.acces-espace .acces-groupes a {
display: flex;
align-items: center;
color: #FFF;
font-weight: 400;
background-color: #7E7E7C;
margin-left: 20px;
}
footer .bottombar .acces-groupes a {
color: #FFF;
font-weight: 400;
}
.acces-groupes a .icon {
display: inline-block;
width: 16px;
height: 16px;
margin-right: 6px;
background-image: url(../images/assets/icon-infos.svg);
background-repeat: no-repeat;
background-size: contain;
}
/* -------------------------------------
HOME > EDITO
------------------------------------- */
.edito {
position: relative;
display: block;
margin: 30px 0;
text-align: center;
}
.edito::after {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100px;
height: 100px;
margin: auto;
background-image: url('../images/assets/logo-signature-30op.svg');
background-size: contain;
background-repeat: no-repeat;
background-position: center center;
}
.edito * {
text-align: center;
letter-spacing: 0.05em;
line-height: 1.8;
margin: 0 auto;
}
.netc-editor {
margin: 30px auto;
}
.netc-editor * {
letter-spacing: 0.05em;
line-height: 1.8;
}
.netc-editor a {
color: #EE743B;
font-weight: 700;
}
.netc-editor h2 {
color: #EE743B;
font-size: 2.4rem;
font-size: clamp(2.0rem, 1.3vw, 2.4rem);
font-weight: 700;
letter-spacing: 0.05em;
}
.edito * + * {
margin-top: 20px;
}
/* -------------------------------------
MENU FILS
------------------------------------- */
ul#items_fils {
display: flex;
width: 100%;
flex-wrap: wrap;
list-style: none;
padding: 0;
margin: 25px -5px;
}
ul#items_fils li {
position: relative;
margin: 5px;
padding: 0;
width: calc(33.33% - 10px);
border-bottom: 2px solid #EE743B;
}
ul#items_fils li > a {
position: relative;
display: block;
width: 100%;
height: 0;
padding-bottom: 56.25%;
overflow: hidden;
color: #FFF;
font-size: 2.4rem;
font-size: clamp(2.0rem, 1.3vw, 2.4rem);
font-weight: 700;
}
ul#items_fils li > a p {
display: block;
margin: 0;
}
.items-fils__sous-titre {
font-weight: 300;
font-size: 1.6rem;
}
ul#items_fils li > a span {
position: absolute;
z-index: -1;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: flex;
flex-direction: column;
justify-content: flex-end;
align-items: flex-start;
padding: 15px;
text-align: left;
text-shadow: 0px 2px 2px rgb(0 0 0 / 25%);
background-color: #575756;
background-repeat: no-repeat;
background-size: cover;
background-position: center;
}
ul#items_fils li > a span::before {
content: '';
position: absolute;
z-index: -1;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
background: rgba(0,0,0,0.5);
background: -moz-linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 70%, rgba(0,0,0,0) 100%);
background: -webkit-linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 70%, rgba(0,0,0,0) 100%);
background: linear-gradient(0deg, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 70%, rgba(0,0,0,0) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
transition: all 0.2s ease;
}
ul#items_fils li > a:hover span::before {
background-color: rgba(0, 0, 0, 0.5);
}
@media (max-width: 801px) {
ul#items_fils li {
width: calc(50% - 10px);
}
}
@media (max-width: 609px) {
ul#items_fils li {
width: 100%;
}
}
.mini-items_fils {
padding: 5px 0;
background-color: #FBDED0;
}
.mini-items_fils ul#items_fils {
/* background-image: url('../images/assets/logo-pattern-orange.svg');
background-position: center;
background-repeat: no-repeat;
background-size: 100px; */
}
.mini-items_fils ul#items_fils li > a {
position: relative;
height: auto;
padding-bottom: 0;
text-decoration: none;
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem);
}
.mini-items_fils ul#items_fils li > a:hover span {
color: #EE743B;
background-color: #FFF;
}
.mini-items_fils ul#items_fils li > a span {
position: static;
display: block;
text-align: center;
color: #FFF;
font-weight: 400;
background-color: #EE743B;
border: 1px solid #EE743B;
text-shadow: none;
transition: all 0.2s ease;
}
.mini-items_fils ul#items_fils li > a span::before {
position: static;
display: inline-block;
background: none;
}
/* -------------------------------------
HOME > ACTUS & AGENDA
------------------------------------- */
.titre-eclats {
display: flex;
justify-content: center;
align-items: center;
margin: 0;
}
.titre-eclats:before,
.titre-eclats:after {
content: '';
display: inline-block;
width: 30px;
height: 40px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
.titre-eclats:before {
background-image: url("data:image/svg+xml,%3Csvg width='30' height='44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.9919 41.9265v-.2241c-.01652-.5832.16191-1.1556.50788-1.6293.02509-.0351.06256-.0596.10508-.069.29772-.1034.59544-.2155.87565-.3017.68302-.2155 1.37478-.4224 2.0578-.6207l2.56569-.7586 2.1016-.6293 2.2066-.6811c.7356-.2413 1.4186-.4655 2.1191-.7241.9632-.3621 1.9177-.7155 2.8459-1.1121.9282-.3965 1.9089-.862 2.8634-1.3448.0594-.021.1244-.021.1839 0 .1869.0777.3658.173.5341.2845.1318.0885.2365.2107.3029.3536.0664.1428.0918.3007.0737.4567 0 .4742 0 .9569-.0701 1.4311-.0909 1.264-.452 2.4949-1.0595 3.612-.0361.0602-.0803.1153-.1314.1638-.6806.633-1.4769 1.1332-2.3468 1.4742-.6791.2608-1.3791.4656-2.0928.612-.6742.1552-1.3572.2931-2.0403.4052-.683.1121-1.2872.1897-1.9352.2673-.8756.112-1.7513.2155-2.6795.3017-1.07702.0948-2.16283.181-3.23989.2414-.76182.0431-1.52365.0517-2.28547.0775-.06014.0166-.12374.0166-.18388 0-.47466-.2777-.86714-.673-1.13836-1.1465l-.07005-.2759-.07005-.1638zM18.3001 24.349l-1.4361.2069c-.548.0242-1.0797.1908-1.5411.4827-.0648.0246-.1366.0246-.2014 0-1.2985-.1902-2.5726-.5168-3.8004-.9741-1.37578-.5062-2.71814-1.0964-4.01925-1.7672-1.56742-.7932-3.12609-1.6035-4.70227-2.388-.48162-.2414-.9895-.4396-1.47986-.6638-.07539-.0286-.139725-.0799-.183892-.1465-.366881-.5125-.677991-1.0614-.92819568-1.638-.00499577-.0458-.00499577-.092 0-.1379-.03769142-.5505.06463548-1.1016.29772368-1.6034.171309-.3856.48399-.6935.875654-.8621.35421-.1587.75321-.1922 1.1296-.0948 2.3993.862 4.78984 1.7241 7.11909 2.6982 1.3894.5748 2.7496 1.2213 4.0806 1.9397.5511.2833 1.141.4865 1.7513.6034 1.4224.347 2.823.7759 4.1944 1.2845.1488.0518.3502.0776.4203.1811.07.1034 0 .2844-.0526.4396-.0814.4812-.1108.9696-.0875 1.4569 0 .0533-.0185.1051-.0526.1466-.2775.3085-.63.5428-1.0245.681l-.3765.1379.0175.0173zM27.5208 10.7538c-.2158.0133-.4322.0133-.648 0-.1052-.0122-.2035-.0575-.2802-.1293-.6918-.65515-1.3748-1.32757-2.0753-1.98274l-6.1296-5.79311-1.1034-1.06896c-.0432-.02377-.0761-.06241-.0923-.10853-.0161-.04612-.0144-.09649.0048-.14147.0963-.26724.1839-.543105.2889-.818967.0288-.049725.0758-.086736.1314-.103448.6504-.176562 1.3373-.176562 1.9877 0 1.1287.285142 2.1691.838695 3.0298 1.612065 1.2347 1.10345 2.4693 2.2069 3.7128 3.28449.9498.85238 2.0393 1.54026 3.2224 2.03448.023.00989.0431.02536.0584.04495.0153.0196.0254.04268.0292.06712-.1713 1.00184-.6877 1.91509-1.4624 2.58622-.2145.1849-.4396.3576-.6742.5172z' fill='%23EE743B'/%3E%3C/svg%3E");
}
.titre-eclats:after {
background-image: url("data:image/svg+xml,%3Csvg width='31' height='44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M26.323 2.07346v.22414c.0165.5832-.162 1.15561-.5079 1.62931-.0251.03505-.0626.05964-.1051.06896-.2977.10345-.5955.21552-.8757.30173-.683.21551-1.3747.42241-2.0578.62069l-2.5656.75862-2.1016.6293-2.2067.68104c-.7355.24138-1.4185.46552-2.1191.72414-.9632.36207-1.9176.71551-2.8458 1.11207-.9282.39655-1.90897.86207-2.86344 1.34484-.05942.021-.12445.021-.18388 0-.18694-.0777-.36582-.17297-.53415-.2845-.13179-.08849-.23651-.21075-.30287-.35356-.06636-.14281-.09183-.30076-.07367-.45678 0-.47414 0-.9569.07006-1.43104.09094-1.26403.452-2.49491 1.05954-3.61207.03609-.06017.08027-.11526.13135-.16379.6806-.63296 1.47691-1.13317 2.34676-1.47413.6791-.26085 1.3792-.46558 2.0928-.61208.6743-.15517 1.3573-.2931 2.0403-.40517.683-.11207 1.2872-.18965 1.9352-.26724.8757-.112067 1.7513-.215513 2.6795-.301721 1.0771-.094827 2.1629-.181036 3.2399-.241381.7619-.043103 1.5237-.051724 2.2855-.077586.0602-.016552.1238-.016552.1839 0 .4746.277746.8671.673048 1.1383 1.146558l.0701.27586.0701.16379zM12.0146 19.651l1.4361-.2069c.548-.0242 1.0797-.1908 1.5412-.4827.0648-.0246.1365-.0246.2014 0 1.2984.1902 2.5725.5168 3.8003.9741 1.3758.5062 2.7182 1.0964 4.0193 1.7672 1.5674.7932 3.1261 1.6035 4.7023 2.388.4816.2414.9894.4396 1.4798.6638.0754.0286.1397.0799.1839.1465.3669.5125.678 1.0614.9282 1.638.005.0458.005.092 0 .1379.0377.5505-.0646 1.1016-.2977 1.6034-.1713.3856-.484.6935-.8757.8621-.3542.1587-.7532.1922-1.1296.0948-2.3993-.862-4.7898-1.7241-7.1191-2.6982-1.3893-.5748-2.7495-1.2213-4.0805-1.9397-.5512-.2833-1.1411-.4865-1.7513-.6034-1.4225-.347-2.823-.7759-4.1944-1.2845-.1489-.0518-.3503-.0776-.4204-.1811-.07-.1034 0-.2844.0526-.4396.0814-.4812.1108-.9696.0876-1.4569-.0001-.0534.0184-.1051.0525-.1466.2776-.3085.63-.5428 1.0245-.681l.3765-.1379-.0175-.0173zM2.79397 33.2462c.21578-.0133.4322-.0133.64799 0 .10513.0122.20343.0575.28021.1293.69176.6552 1.37478 1.3276 2.0753 1.9827l6.12963 5.7931 1.1033 1.069c.0433.0238.0761.0624.0923.1085.0162.0462.0145.0965-.0047.1415-.0964.2673-.1839.5431-.289.819-.0288.0497-.0758.0867-.1314.1034-.6504.1766-1.3373.1766-1.9877 0-1.12871-.2851-2.16908-.8387-3.02977-1.612-1.23467-1.1035-2.46935-2.2069-3.71278-3.2845-.94978-.8524-2.03933-1.5403-3.22242-2.0345-.023012-.0099-.043106-.0254-.058415-.045-.015311-.0196-.025339-.0426-.029149-.0671.171243-1.0018.687634-1.9151 1.462344-2.5862.21453-.1849.43965-.3576.67426-.5172z' fill='%23EE743B'/%3E%3C/svg%3E");
}
.inner-eclats {
display: inline-block;
margin: 0 40px;
}
.titre-eclats span {
display: block;
margin: 0;
line-height: 1;
text-align: center;
}
.titre-eclats span:nth-child(1) {
color: #EE743B;
font-family: 'blondescript', serif;
font-size: 5.0rem;
/* font-size: clamp(4.0rem, 2.7vw, 5.0rem); */
font-size: clamp(4.0rem, 4.167vw, 8.0rem);
font-weight: 400;
line-height: 0.9;
}
.titre-eclats span:nth-child(2) {
color: #575756;
text-transform: uppercase;
font-size: 2.4rem;
font-size: clamp(1.8rem, 1.3vw, 2.4rem);
font-weight: 700;
letter-spacing: 0.05em;
}
.page-entete-wrapper .titre-eclats span:nth-child(1) {
font-family: 'intelo', sans-serif;
text-transform: uppercase;
font-size: 3.2rem;
font-size: clamp(2.2rem, 1.8vw, 3.2rem);
font-weight: 700;
}
.actus-agenda {
}
.actus-agenda .actus,
.actus-agenda .agenda {
padding: 25px 15px;
}
.actus-agenda .actus {
background-color: #575756;
}
.actus-agenda .agenda {
background-color: #E0E0E0;
}
.actus-agenda .actus .titre-eclats span:nth-child(2) {
color: #FFF;
}
.article__list {
display: flex;
justify-content: center;
padding: 0 4%;
margin: 15px auto;
list-style: none;
}
.actus-agenda .article__list {
}
.article__item {
position: relative;
width: calc(25% - 20px);
flex: none;
margin: 10px;
}
.article__link {
position: relative;
display: flex;
border-bottom: 4px solid #FFF;
text-decoration: none;
margin: auto;
}
.agenda .article__link {
border-color: #EE743B;
}
.article__link:hover .article__picture:before {
opacity: 0.8;
}
.article__link:hover .article__img {
transform: scale(1.1);
}
.article__text {
position: absolute;
z-index: 10;
left: 0;
right: 0;
bottom: 0;
display: block;
padding: 10px 20px 14px 20px;
}
.article__date {
position: absolute;
z-index: 10;
top: 10px;
right: 10px;
display: block;
width: 60px;
height: 72px;
background-image: url('../images/assets/puce.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: top center;
padding-top: 13px;
}
/* pour doubles dates */
.article__dates {
position: absolute;
z-index: 10;
top: 10px;
right: 10px;
display: flex;
width: auto;
height: 72px;
}
.article__dates_el {
background-image: url('../images/assets/puce.svg');
background-repeat: no-repeat;
background-size: contain;
background-position: top center;
padding-top: 13px;
width: 60px;
height: 72px;
margin-left:5px;
}
.article__date-day,
.article__date-month {
display: block;
color: #FFF;
text-align: center;
line-height: 1;
}
.article__date-day {
font-size: 2.2rem;
font-weight: 700;
}
.article__date-month {
font-size: 1.6rem;
font-weight: 400;
}
.fma__dates {
color:#EE743B;
height:30px;
margin:0 0 10px 0;
font-size: 2rem;
}
.fma__dates_expo {
position: absolute;
z-index: 10;
top: 10px;
right: 0;
display: block;
width: auto;
height: auto;
padding:4px 8px;
background-color:#EE743B;
color:#fff;
font-size: 1.4rem;
font-weight: 400;
}
.article__lieu {
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem);
font-weight: 400;
color: #FFFFFF;
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
margin: 0;
}
.article__titre {
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem);
font-weight: 700;
line-height: 1.2;
letter-spacing: 0.04em;
text-transform: uppercase;
color: #FFFFFF;
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
margin: 10px 0 0 0;
}
.article__picture {
position: relative;
}
.article__picture:before {
content: '';
opacity: 0.6;
position: absolute;
z-index: 1;
left: 0;
right: 0;
top: 0;
bottom: 0;
display: block;
width: 100%;
height: 100%;
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 1)));
background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
transition: all 0.2s ease;
}
.article__img {
transition: all 0.2s ease;
}
.see-all-wrapper {
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
width: 100%;
margin: 10px 0 0 0;
}
.see-all {
display: flex;
align-items: center;
font-weight: 400;
margin: auto;
padding: 10px 15px;
border: 1px solid #FFF;
text-decoration: none;
transition: all 0.2s ease;
}
.see-all:hover {
background-color: rgba(0, 0, 0, 0.2);
}
#see-all-agenda {
}
#see-all-agenda a {
position: relative;
margin: 0 10px 10px 10px;
}
.see-all.blanc {
border: 1px solid #FFF;
}
.see-all.blanc:hover {
background-color: rgba(0, 0, 0, 0.2);
}
.see-all.orange {
border: 1px solid #EE743B;
background-color: #FFF;
}
.see-all.orange:hover {
background-color: hsl(19, 84%, 96%);
}
.see-all__label {
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem);
display: block;
color: #FFF;
}
.see-all.blanc .see-all__label {
color: #FFF;
}
.see-all.orange .see-all__label {
color: #EE743B;
}
.see-all__icon {
display: flex;
flex: none;
justify-self: center;
align-self: center;
width: 18px;
height: 18px;
margin-right: 10px;
background-position: center;
background-size: 18px;
background-repeat: no-repeat;
background-image: url('../images/assets/icon-actus.svg');
}
.icon-etincelles {
background-image: url('../images/assets/icon-actus.svg');
}
.see-all.orange .icon-etincelles {
background-image: url('../images/assets/icon-actus-orange.svg');
}
.icon-calendar {
background-image: url('../images/assets/icon-agenda.svg');
}
.see-all__icon img {
width: 100%;
}
/* -------------------------------------
HOME > DESTINATION & EXPERIENCES
------------------------------------- */
.description-section {
text-align: center;
letter-spacing: 0.05em;
line-height: 1.8;
margin: 20px auto;
}
.fond-orange .description-section {
color: #FFF;
}
.bandeau-bulles {
padding: 40px 0;
}
.fond-orange {
background-color: #EE743B;
}
.fond-orange .titre-eclats span:nth-child(1) {
color: #FFF;
}
.fond-orange .titre-eclats:before {
background-image: url("data:image/svg+xml,%3Csvg width='30' height='44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.9919 41.9265v-.2241c-.01652-.5832.16191-1.1556.50788-1.6293.02509-.0351.06256-.0596.10508-.069.29772-.1034.59544-.2155.87565-.3017.68302-.2155 1.37478-.4224 2.0578-.6207l2.56569-.7586 2.1016-.6293 2.2066-.6811c.7356-.2413 1.4186-.4655 2.1191-.7241.9632-.3621 1.9177-.7155 2.8459-1.1121.9282-.3965 1.9089-.862 2.8634-1.3448.0594-.021.1244-.021.1839 0 .1869.0777.3658.173.5341.2845.1318.0885.2365.2107.3029.3536.0664.1428.0918.3007.0737.4567 0 .4742 0 .9569-.0701 1.4311-.0909 1.264-.452 2.4949-1.0595 3.612-.0361.0602-.0803.1153-.1314.1638-.6806.633-1.4769 1.1332-2.3468 1.4742-.6791.2608-1.3791.4656-2.0928.612-.6742.1552-1.3572.2931-2.0403.4052-.683.1121-1.2872.1897-1.9352.2673-.8756.112-1.7513.2155-2.6795.3017-1.07702.0948-2.16283.181-3.23989.2414-.76182.0431-1.52365.0517-2.28547.0775-.06014.0166-.12374.0166-.18388 0-.47466-.2777-.86714-.673-1.13836-1.1465l-.07005-.2759-.07005-.1638zM18.3001 24.349l-1.4361.2069c-.548.0242-1.0797.1908-1.5411.4827-.0648.0246-.1366.0246-.2014 0-1.2985-.1902-2.5726-.5168-3.8004-.9741-1.37578-.5062-2.71814-1.0964-4.01925-1.7672-1.56742-.7932-3.12609-1.6035-4.70227-2.388-.48162-.2414-.9895-.4396-1.47986-.6638-.07539-.0286-.139725-.0799-.183892-.1465-.366881-.5125-.677991-1.0614-.92819568-1.638-.00499577-.0458-.00499577-.092 0-.1379-.03769142-.5505.06463548-1.1016.29772368-1.6034.171309-.3856.48399-.6935.875654-.8621.35421-.1587.75321-.1922 1.1296-.0948 2.3993.862 4.78984 1.7241 7.11909 2.6982 1.3894.5748 2.7496 1.2213 4.0806 1.9397.5511.2833 1.141.4865 1.7513.6034 1.4224.347 2.823.7759 4.1944 1.2845.1488.0518.3502.0776.4203.1811.07.1034 0 .2844-.0526.4396-.0814.4812-.1108.9696-.0875 1.4569 0 .0533-.0185.1051-.0526.1466-.2775.3085-.63.5428-1.0245.681l-.3765.1379.0175.0173zM27.5208 10.7538c-.2158.0133-.4322.0133-.648 0-.1052-.0122-.2035-.0575-.2802-.1293-.6918-.65515-1.3748-1.32757-2.0753-1.98274l-6.1296-5.79311-1.1034-1.06896c-.0432-.02377-.0761-.06241-.0923-.10853-.0161-.04612-.0144-.09649.0048-.14147.0963-.26724.1839-.543105.2889-.818967.0288-.049725.0758-.086736.1314-.103448.6504-.176562 1.3373-.176562 1.9877 0 1.1287.285142 2.1691.838695 3.0298 1.612065 1.2347 1.10345 2.4693 2.2069 3.7128 3.28449.9498.85238 2.0393 1.54026 3.2224 2.03448.023.00989.0431.02536.0584.04495.0153.0196.0254.04268.0292.06712-.1713 1.00184-.6877 1.91509-1.4624 2.58622-.2145.1849-.4396.3576-.6742.5172z' fill='%23FFF'/%3E%3C/svg%3E");
}
.fond-orange .titre-eclats:after {
background-image: url("data:image/svg+xml,%3Csvg width='31' height='44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M26.323 2.07346v.22414c.0165.5832-.162 1.15561-.5079 1.62931-.0251.03505-.0626.05964-.1051.06896-.2977.10345-.5955.21552-.8757.30173-.683.21551-1.3747.42241-2.0578.62069l-2.5656.75862-2.1016.6293-2.2067.68104c-.7355.24138-1.4185.46552-2.1191.72414-.9632.36207-1.9176.71551-2.8458 1.11207-.9282.39655-1.90897.86207-2.86344 1.34484-.05942.021-.12445.021-.18388 0-.18694-.0777-.36582-.17297-.53415-.2845-.13179-.08849-.23651-.21075-.30287-.35356-.06636-.14281-.09183-.30076-.07367-.45678 0-.47414 0-.9569.07006-1.43104.09094-1.26403.452-2.49491 1.05954-3.61207.03609-.06017.08027-.11526.13135-.16379.6806-.63296 1.47691-1.13317 2.34676-1.47413.6791-.26085 1.3792-.46558 2.0928-.61208.6743-.15517 1.3573-.2931 2.0403-.40517.683-.11207 1.2872-.18965 1.9352-.26724.8757-.112067 1.7513-.215513 2.6795-.301721 1.0771-.094827 2.1629-.181036 3.2399-.241381.7619-.043103 1.5237-.051724 2.2855-.077586.0602-.016552.1238-.016552.1839 0 .4746.277746.8671.673048 1.1383 1.146558l.0701.27586.0701.16379zM12.0146 19.651l1.4361-.2069c.548-.0242 1.0797-.1908 1.5412-.4827.0648-.0246.1365-.0246.2014 0 1.2984.1902 2.5725.5168 3.8003.9741 1.3758.5062 2.7182 1.0964 4.0193 1.7672 1.5674.7932 3.1261 1.6035 4.7023 2.388.4816.2414.9894.4396 1.4798.6638.0754.0286.1397.0799.1839.1465.3669.5125.678 1.0614.9282 1.638.005.0458.005.092 0 .1379.0377.5505-.0646 1.1016-.2977 1.6034-.1713.3856-.484.6935-.8757.8621-.3542.1587-.7532.1922-1.1296.0948-2.3993-.862-4.7898-1.7241-7.1191-2.6982-1.3893-.5748-2.7495-1.2213-4.0805-1.9397-.5512-.2833-1.1411-.4865-1.7513-.6034-1.4225-.347-2.823-.7759-4.1944-1.2845-.1489-.0518-.3503-.0776-.4204-.1811-.07-.1034 0-.2844.0526-.4396.0814-.4812.1108-.9696.0876-1.4569-.0001-.0534.0184-.1051.0525-.1466.2776-.3085.63-.5428 1.0245-.681l.3765-.1379-.0175-.0173zM2.79397 33.2462c.21578-.0133.4322-.0133.64799 0 .10513.0122.20343.0575.28021.1293.69176.6552 1.37478 1.3276 2.0753 1.9827l6.12963 5.7931 1.1033 1.069c.0433.0238.0761.0624.0923.1085.0162.0462.0145.0965-.0047.1415-.0964.2673-.1839.5431-.289.819-.0288.0497-.0758.0867-.1314.1034-.6504.1766-1.3373.1766-1.9877 0-1.12871-.2851-2.16908-.8387-3.02977-1.612-1.23467-1.1035-2.46935-2.2069-3.71278-3.2845-.94978-.8524-2.03933-1.5403-3.22242-2.0345-.023012-.0099-.043106-.0254-.058415-.045-.015311-.0196-.025339-.0426-.029149-.0671.171243-1.0018.687634-1.9151 1.462344-2.5862.21453-.1849.43965-.3576.67426-.5172z' fill='%23FFF'/%3E%3C/svg%3E");
}
.destination {
background-color: #fff;
}
.lSPager.lSGallery {
}
.lSPager.lSGallery a {
position: relative;
display: block;
height: 0;
padding-bottom: 56.25%;
}
.lSPager.lSGallery a img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100%!important;
object-fit: cover;
object-position: center;
}
.bulles__wrapper {
margin: 25px 0;
}
.bulles__list {
display: flex;
justify-content: center;
margin: auto;
}
.bulles__item {
margin: 0 10px!important;
}
.bulles__link {
position: relative;
display: flex;
justify-content: center;
align-items: center;
max-width: 240px;
margin: auto;
}
.bulles__text {
position: absolute;
z-index: 10;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 30px;
}
.bulles__titre,
.bulles__theme {
display: block;
color: #FFF;
text-align: center;
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.6);
}
.bulles__titre {
font-size: 3.0rem;
font-size: clamp(2.4rem, 1.6vw, 3.0rem);
font-weight: 700;
margin: 0 0 5px 0;
}
.experiences .bulles__titre {
font-size: 2.4rem;
font-size: clamp(2.0rem, 1.3vw, 2.4rem);
}
.bulles__theme {
font-size: 1.8rem;
font-size: clamp(1.6rem, 1.1vw, 1.8rem);
font-weight: 400;
}
.bulles__picture {
position: relative;
border-radius: 500px;
border: 2px dashed #EE743B;
}
.fond-orange .bulles__picture {
border-color: #FFF;
}
.bulles__picture:before {
content: '';
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.25);
border-radius: 500px;
border: 8px solid #E0E0E0;
transition: all 0.2s ease;
}
.fond-orange .bulles__picture:before {
border-color: #EE743B;
}
.bulles__link:hover .bulles__picture:before {
background-color: rgba(49, 49, 48, 0.6);
border-width: 4px;
}
.bulles__img {
transition: all 0.2s ease;
}
.lSAction>.lSPrev {
left: 0;
background-image: url("data:image/svg+xml,%3Csvg width='40' height='36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M19.35 1.144c.867.854.867 2.24 0 3.093L5.364 18.003 19.349 31.77c.868.854.868 2.24 0 3.093a2.247 2.247 0 01-3.143 0L.651 19.55a2.163 2.163 0 010-3.094L16.206 1.144a2.247 2.247 0 013.143 0z' fill='%23EE743B'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 18.003c0-1.208.995-2.187 2.222-2.187h35.556c1.227 0 2.222.98 2.222 2.187 0 1.208-.995 2.188-2.222 2.188H2.222C.995 20.19 0 19.21 0 18.003z' fill='%23EE743B'/%3E%3C/svg%3E");
background-position: center;
}
.fond-orange .lSAction>.lSPrev {
background-image: url("data:image/svg+xml,%3Csvg width='40' height='36' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M19.35 1.144c.867.854.867 2.24 0 3.093L5.364 18.003 19.349 31.77c.868.854.868 2.24 0 3.093a2.247 2.247 0 01-3.143 0L.651 19.55a2.163 2.163 0 010-3.094L16.206 1.144a2.247 2.247 0 013.143 0z' fill='%23FFF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M0 18.003c0-1.208.995-2.187 2.222-2.187h35.556c1.227 0 2.222.98 2.222 2.187 0 1.208-.995 2.188-2.222 2.188H2.222C.995 20.19 0 19.21 0 18.003z' fill='%23FFF'/%3E%3C/svg%3E");
}
.lSAction>.lSNext {
right: 0;
background-image: url("data:image/svg+xml,%3Csvg width='40' height='35' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M20.65 34.36a2.163 2.163 0 010-3.094L34.636 17.5 20.651 3.734a2.163 2.163 0 010-3.093 2.247 2.247 0 013.143 0l15.555 15.312c.868.855.868 2.24 0 3.094L23.794 34.359a2.247 2.247 0 01-3.143 0z' fill='%23EE743B'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M40 17.5c0 1.208-.995 2.188-2.222 2.188H2.222C.995 19.688 0 18.707 0 17.5c0-1.208.995-2.188 2.222-2.188h35.556c1.227 0 2.222.98 2.222 2.188z' fill='%23EE743B'/%3E%3C/svg%3E");
background-position: center;
}
.fond-orange .lSAction>.lSNext {
background-image: url("data:image/svg+xml,%3Csvg width='40' height='35' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M20.65 34.36a2.163 2.163 0 010-3.094L34.636 17.5 20.651 3.734a2.163 2.163 0 010-3.093 2.247 2.247 0 013.143 0l15.555 15.312c.868.855.868 2.24 0 3.094L23.794 34.359a2.247 2.247 0 01-3.143 0z' fill='%23FFF'/%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M40 17.5c0 1.208-.995 2.188-2.222 2.188H2.222C.995 19.688 0 18.707 0 17.5c0-1.208.995-2.188 2.222-2.188h35.556c1.227 0 2.222.98 2.222 2.188z' fill='%23FFF'/%3E%3C/svg%3E");
}
.lSAction>a {
top: 0;
bottom: 0;
z-index: 10;
margin: 0;
width: 50px;
height: 100%;
background-repeat: no-repeat;
background-size: 30px;
opacity: 1;
background-color: rgba(0, 0, 0, 0);
transition: all 0.2s ease;
}
.listing-prestataire__item:hover .lSAction>a {
background-color: rgba(0, 0, 0, 0.6);
}
/* -------------------------------------
HOME > RESEAUX SOCIAUX
------------------------------------- */
.reseaux-sociaux {
padding: 25px 0 20px 0;
}
.reseaux-sociaux__wrapper {
display: flex;
margin: 25px -20px;
}
.reseaux-sociaux__wrapper > * {
flex: 1;
margin: 0 20px;
}
.rs-facebook__wrapper {
display: flex;
flex-direction: column;
}
.rs-facebook__wrapper .rs__titre-icon {
background-image: url('../images/assets/rs-color-facebook.svg');
}
.rs-facebook__wrapper .rs__titre-label,
.rs-facebook__wrapper .rs__identifiant {
color: #355292;
}
#facebook__content {
display: flex;
justify-content: center;
align-items: center;
background-color: #f3f3f3;
}
#facebook__content,
.fb_iframe_widget,
.fb_iframe_widget > span,
.fb_iframe_widget > span > iframe {
min-height: 300px;
height: 100%!important;
}
.rs-instagram__wrapper .rs__titre-icon {
background-image: url('../images/assets/rs-color-instagram.svg');
}
.rs-instagram__wrapper .rs__titre-label,
.rs-instagram__wrapper .rs__identifiant {
color: #ED333B;
}
.rs-autres__wrapper .rs__titre-icon {
background-image: url('../images/assets/rs-autres.svg');
}
.rs-autres__wrapper .rs__titre-label,
.rs-autres__wrapper .rs__identifiant {
color: #575756;
}
.rs__link {
display: flex;
justify-content: space-between;
align-items: center;
text-decoration: none;
margin-bottom: 10px;
}
.rs__titre {
display: flex;
align-items: center;
}
.rs__titre-icon {
display: block;
width: 40px;
height: 40px;
margin-right: 10px;
background-repeat: no-repeat;
background-size: contain;
background-position: center;
}
.rs__titre-label {
font-size: 2.0rem;
font-weight: 700;
text-transform: uppercase;
}
.rs__identifiant {
font-size: 1.8rem;
font-weight: 400;
}
.rs-autres__wrapper {
display: flex;
flex-direction: column;
}
.rs__block {
flex: auto;
display: flex;
flex-direction: column;
}
.rs__block > * + * {
margin-top: 40px;
}
.rs__block-link {
position: relative;
flex: 1;
display: block;
text-decoration: none;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
}
.rs__block-link:after {
content: '';
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
}
.rs__block .rs__titre-icon {
position: absolute;
z-index: 10;
top: 15px;
right: 15px;
margin: 0;
}
.rs__block .rs__titre {
position: absolute;
z-index: 10;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 20px;
}
.rs__block .rs__titre-label,
.rs__block .rs__identifiant {
margin: 2px 0;
color: #FFF;
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.2);
}
#twitter__content .rs__titre-icon {
background-image: url('../images/assets/rs-color-twitter.svg');
}
#twitter__content.rs__block-link:after {
background-color: rgba(0, 172, 238, 0.33);
}
#linkedin__content .rs__titre-icon {
background-image: url('../images/assets/linkedin.svg');
}
#linkedin__content.rs__block-link:after {
background-color: rgba(0, 172, 238, 0.33);
}
#youtube__content .rs__titre-icon {
background-image: url('../images/assets/rs-color-youtube.svg');
}
#youtube__content.rs__block-link:after {
background-color: rgba(255, 0, 0, 0.33);
}
.rs__content img {
width: 100%;
}
/* -------------------------------------
HOME > CARTE
------------------------------------- */
.carte {
position: relative;
display: flex;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
max-height: 700px;
}
.carte__img {
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
}
.carte__img img {
display: block;
height: 100%;
margin-left: auto;
}
.carte .titre-eclats:before {
background-image: url("data:image/svg+xml,%3Csvg width='30' height='44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.9919 41.9265v-.2241c-.01652-.5832.16191-1.1556.50788-1.6293.02509-.0351.06256-.0596.10508-.069.29772-.1034.59544-.2155.87565-.3017.68302-.2155 1.37478-.4224 2.0578-.6207l2.56569-.7586 2.1016-.6293 2.2066-.6811c.7356-.2413 1.4186-.4655 2.1191-.7241.9632-.3621 1.9177-.7155 2.8459-1.1121.9282-.3965 1.9089-.862 2.8634-1.3448.0594-.021.1244-.021.1839 0 .1869.0777.3658.173.5341.2845.1318.0885.2365.2107.3029.3536.0664.1428.0918.3007.0737.4567 0 .4742 0 .9569-.0701 1.4311-.0909 1.264-.452 2.4949-1.0595 3.612-.0361.0602-.0803.1153-.1314.1638-.6806.633-1.4769 1.1332-2.3468 1.4742-.6791.2608-1.3791.4656-2.0928.612-.6742.1552-1.3572.2931-2.0403.4052-.683.1121-1.2872.1897-1.9352.2673-.8756.112-1.7513.2155-2.6795.3017-1.07702.0948-2.16283.181-3.23989.2414-.76182.0431-1.52365.0517-2.28547.0775-.06014.0166-.12374.0166-.18388 0-.47466-.2777-.86714-.673-1.13836-1.1465l-.07005-.2759-.07005-.1638zM18.3001 24.349l-1.4361.2069c-.548.0242-1.0797.1908-1.5411.4827-.0648.0246-.1366.0246-.2014 0-1.2985-.1902-2.5726-.5168-3.8004-.9741-1.37578-.5062-2.71814-1.0964-4.01925-1.7672-1.56742-.7932-3.12609-1.6035-4.70227-2.388-.48162-.2414-.9895-.4396-1.47986-.6638-.07539-.0286-.139725-.0799-.183892-.1465-.366881-.5125-.677991-1.0614-.92819568-1.638-.00499577-.0458-.00499577-.092 0-.1379-.03769142-.5505.06463548-1.1016.29772368-1.6034.171309-.3856.48399-.6935.875654-.8621.35421-.1587.75321-.1922 1.1296-.0948 2.3993.862 4.78984 1.7241 7.11909 2.6982 1.3894.5748 2.7496 1.2213 4.0806 1.9397.5511.2833 1.141.4865 1.7513.6034 1.4224.347 2.823.7759 4.1944 1.2845.1488.0518.3502.0776.4203.1811.07.1034 0 .2844-.0526.4396-.0814.4812-.1108.9696-.0875 1.4569 0 .0533-.0185.1051-.0526.1466-.2775.3085-.63.5428-1.0245.681l-.3765.1379.0175.0173zM27.5208 10.7538c-.2158.0133-.4322.0133-.648 0-.1052-.0122-.2035-.0575-.2802-.1293-.6918-.65515-1.3748-1.32757-2.0753-1.98274l-6.1296-5.79311-1.1034-1.06896c-.0432-.02377-.0761-.06241-.0923-.10853-.0161-.04612-.0144-.09649.0048-.14147.0963-.26724.1839-.543105.2889-.818967.0288-.049725.0758-.086736.1314-.103448.6504-.176562 1.3373-.176562 1.9877 0 1.1287.285142 2.1691.838695 3.0298 1.612065 1.2347 1.10345 2.4693 2.2069 3.7128 3.28449.9498.85238 2.0393 1.54026 3.2224 2.03448.023.00989.0431.02536.0584.04495.0153.0196.0254.04268.0292.06712-.1713 1.00184-.6877 1.91509-1.4624 2.58622-.2145.1849-.4396.3576-.6742.5172z' fill='%23FFF'/%3E%3C/svg%3E");
}
.carte .titre-eclats:after {
background-image: url("data:image/svg+xml,%3Csvg width='31' height='44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M26.323 2.07346v.22414c.0165.5832-.162 1.15561-.5079 1.62931-.0251.03505-.0626.05964-.1051.06896-.2977.10345-.5955.21552-.8757.30173-.683.21551-1.3747.42241-2.0578.62069l-2.5656.75862-2.1016.6293-2.2067.68104c-.7355.24138-1.4185.46552-2.1191.72414-.9632.36207-1.9176.71551-2.8458 1.11207-.9282.39655-1.90897.86207-2.86344 1.34484-.05942.021-.12445.021-.18388 0-.18694-.0777-.36582-.17297-.53415-.2845-.13179-.08849-.23651-.21075-.30287-.35356-.06636-.14281-.09183-.30076-.07367-.45678 0-.47414 0-.9569.07006-1.43104.09094-1.26403.452-2.49491 1.05954-3.61207.03609-.06017.08027-.11526.13135-.16379.6806-.63296 1.47691-1.13317 2.34676-1.47413.6791-.26085 1.3792-.46558 2.0928-.61208.6743-.15517 1.3573-.2931 2.0403-.40517.683-.11207 1.2872-.18965 1.9352-.26724.8757-.112067 1.7513-.215513 2.6795-.301721 1.0771-.094827 2.1629-.181036 3.2399-.241381.7619-.043103 1.5237-.051724 2.2855-.077586.0602-.016552.1238-.016552.1839 0 .4746.277746.8671.673048 1.1383 1.146558l.0701.27586.0701.16379zM12.0146 19.651l1.4361-.2069c.548-.0242 1.0797-.1908 1.5412-.4827.0648-.0246.1365-.0246.2014 0 1.2984.1902 2.5725.5168 3.8003.9741 1.3758.5062 2.7182 1.0964 4.0193 1.7672 1.5674.7932 3.1261 1.6035 4.7023 2.388.4816.2414.9894.4396 1.4798.6638.0754.0286.1397.0799.1839.1465.3669.5125.678 1.0614.9282 1.638.005.0458.005.092 0 .1379.0377.5505-.0646 1.1016-.2977 1.6034-.1713.3856-.484.6935-.8757.8621-.3542.1587-.7532.1922-1.1296.0948-2.3993-.862-4.7898-1.7241-7.1191-2.6982-1.3893-.5748-2.7495-1.2213-4.0805-1.9397-.5512-.2833-1.1411-.4865-1.7513-.6034-1.4225-.347-2.823-.7759-4.1944-1.2845-.1489-.0518-.3503-.0776-.4204-.1811-.07-.1034 0-.2844.0526-.4396.0814-.4812.1108-.9696.0876-1.4569-.0001-.0534.0184-.1051.0525-.1466.2776-.3085.63-.5428 1.0245-.681l.3765-.1379-.0175-.0173zM2.79397 33.2462c.21578-.0133.4322-.0133.64799 0 .10513.0122.20343.0575.28021.1293.69176.6552 1.37478 1.3276 2.0753 1.9827l6.12963 5.7931 1.1033 1.069c.0433.0238.0761.0624.0923.1085.0162.0462.0145.0965-.0047.1415-.0964.2673-.1839.5431-.289.819-.0288.0497-.0758.0867-.1314.1034-.6504.1766-1.3373.1766-1.9877 0-1.12871-.2851-2.16908-.8387-3.02977-1.612-1.23467-1.1035-2.46935-2.2069-3.71278-3.2845-.94978-.8524-2.03933-1.5403-3.22242-2.0345-.023012-.0099-.043106-.0254-.058415-.045-.015311-.0196-.025339-.0426-.029149-.0671.171243-1.0018.687634-1.9151 1.462344-2.5862.21453-.1849.43965-.3576.67426-.5172z' fill='%23FFF'/%3E%3C/svg%3E");
}
.carte .titre-eclats span:nth-child(1),
.carte .titre-eclats span:nth-child(2) {
color: #FFF;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
}
.carte:before {
content: '';
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
background-color: rgba(0, 0, 0, 0.33);
}
.carte__text {
position: relative;
z-index: 10;
display: flex;
flex-direction: column;
justify-content: center;
align-items: flex-start;
padding: 10% 40px;
}
.carte__text p {
color: #FFF;
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem);
font-weight: 700;
line-height: 3.0rem;
letter-spacing: 0.05em;
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
max-width: 550px;
}
.carte .see-all {
margin: 0;
}
.carte .see-all__label {
text-shadow: 0 2px 2px rgba(0, 0, 0, 0.4);
}
/* ////////////////////////////////////////////////////////////////////////////
AJOUTS
/////////////////////////////////////////////////////////////////////////// */
.header-group-links {
background-color: #EE743B;
}
/* --- PAGE --- */
.page header#main-header {
height: auto;
}
.page header#main-header .logo {
max-width: 120px;
padding: 15px;
}
.page header#main-header .logo img:first-child {
width: 52px;
}
.page header#main-header .logo img:last-child {
width: 90px;
margin-top: 11px;
}
.page .edito {
margin: 60px 0;
}
.page-bandeau-wrapper {
position: relative;
z-index: 0;
margin-top: -80px;
width: 100%;
height: 50vh;
max-height: 350px;
overflow: hidden;
}
.page-bandeau:after {
content: '';
position: absolute;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100px;
background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.6)));
background: -o-linear-gradient(top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}
.page-bandeau {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background-color: hsl(60, 1%, 50%);
}
.page-bandeau picture {
display: block;
width: 100%;
height: 100%;
}
.page-bandeau img {
display: block;
width: 100%;
}
@supports (object-fit: cover) {
.page-bandeau img {
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
}
.page-bandeau-wrapper .titre-eclats {
position: absolute;
z-index: 10;
top: 0;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}
.page-bandeau-wrapper .titre-eclats span:nth-child(1),
.page-bandeau-wrapper .titre-eclats span:nth-child(2) {
color: #FFF;
text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.25);
}
.titre-eclats span:nth-child(2) {
font-weight: 400;
}
.page-bandeau-wrapper .titre-eclats:before {
background-image: url("data:image/svg+xml,%3Csvg width='30' height='44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3.9919 41.9265v-.2241c-.01652-.5832.16191-1.1556.50788-1.6293.02509-.0351.06256-.0596.10508-.069.29772-.1034.59544-.2155.87565-.3017.68302-.2155 1.37478-.4224 2.0578-.6207l2.56569-.7586 2.1016-.6293 2.2066-.6811c.7356-.2413 1.4186-.4655 2.1191-.7241.9632-.3621 1.9177-.7155 2.8459-1.1121.9282-.3965 1.9089-.862 2.8634-1.3448.0594-.021.1244-.021.1839 0 .1869.0777.3658.173.5341.2845.1318.0885.2365.2107.3029.3536.0664.1428.0918.3007.0737.4567 0 .4742 0 .9569-.0701 1.4311-.0909 1.264-.452 2.4949-1.0595 3.612-.0361.0602-.0803.1153-.1314.1638-.6806.633-1.4769 1.1332-2.3468 1.4742-.6791.2608-1.3791.4656-2.0928.612-.6742.1552-1.3572.2931-2.0403.4052-.683.1121-1.2872.1897-1.9352.2673-.8756.112-1.7513.2155-2.6795.3017-1.07702.0948-2.16283.181-3.23989.2414-.76182.0431-1.52365.0517-2.28547.0775-.06014.0166-.12374.0166-.18388 0-.47466-.2777-.86714-.673-1.13836-1.1465l-.07005-.2759-.07005-.1638zM18.3001 24.349l-1.4361.2069c-.548.0242-1.0797.1908-1.5411.4827-.0648.0246-.1366.0246-.2014 0-1.2985-.1902-2.5726-.5168-3.8004-.9741-1.37578-.5062-2.71814-1.0964-4.01925-1.7672-1.56742-.7932-3.12609-1.6035-4.70227-2.388-.48162-.2414-.9895-.4396-1.47986-.6638-.07539-.0286-.139725-.0799-.183892-.1465-.366881-.5125-.677991-1.0614-.92819568-1.638-.00499577-.0458-.00499577-.092 0-.1379-.03769142-.5505.06463548-1.1016.29772368-1.6034.171309-.3856.48399-.6935.875654-.8621.35421-.1587.75321-.1922 1.1296-.0948 2.3993.862 4.78984 1.7241 7.11909 2.6982 1.3894.5748 2.7496 1.2213 4.0806 1.9397.5511.2833 1.141.4865 1.7513.6034 1.4224.347 2.823.7759 4.1944 1.2845.1488.0518.3502.0776.4203.1811.07.1034 0 .2844-.0526.4396-.0814.4812-.1108.9696-.0875 1.4569 0 .0533-.0185.1051-.0526.1466-.2775.3085-.63.5428-1.0245.681l-.3765.1379.0175.0173zM27.5208 10.7538c-.2158.0133-.4322.0133-.648 0-.1052-.0122-.2035-.0575-.2802-.1293-.6918-.65515-1.3748-1.32757-2.0753-1.98274l-6.1296-5.79311-1.1034-1.06896c-.0432-.02377-.0761-.06241-.0923-.10853-.0161-.04612-.0144-.09649.0048-.14147.0963-.26724.1839-.543105.2889-.818967.0288-.049725.0758-.086736.1314-.103448.6504-.176562 1.3373-.176562 1.9877 0 1.1287.285142 2.1691.838695 3.0298 1.612065 1.2347 1.10345 2.4693 2.2069 3.7128 3.28449.9498.85238 2.0393 1.54026 3.2224 2.03448.023.00989.0431.02536.0584.04495.0153.0196.0254.04268.0292.06712-.1713 1.00184-.6877 1.91509-1.4624 2.58622-.2145.1849-.4396.3576-.6742.5172z' fill='%23FFF'/%3E%3C/svg%3E");
}
.page-bandeau-wrapper .titre-eclats:after {
background-image: url("data:image/svg+xml,%3Csvg width='31' height='44' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M26.323 2.07346v.22414c.0165.5832-.162 1.15561-.5079 1.62931-.0251.03505-.0626.05964-.1051.06896-.2977.10345-.5955.21552-.8757.30173-.683.21551-1.3747.42241-2.0578.62069l-2.5656.75862-2.1016.6293-2.2067.68104c-.7355.24138-1.4185.46552-2.1191.72414-.9632.36207-1.9176.71551-2.8458 1.11207-.9282.39655-1.90897.86207-2.86344 1.34484-.05942.021-.12445.021-.18388 0-.18694-.0777-.36582-.17297-.53415-.2845-.13179-.08849-.23651-.21075-.30287-.35356-.06636-.14281-.09183-.30076-.07367-.45678 0-.47414 0-.9569.07006-1.43104.09094-1.26403.452-2.49491 1.05954-3.61207.03609-.06017.08027-.11526.13135-.16379.6806-.63296 1.47691-1.13317 2.34676-1.47413.6791-.26085 1.3792-.46558 2.0928-.61208.6743-.15517 1.3573-.2931 2.0403-.40517.683-.11207 1.2872-.18965 1.9352-.26724.8757-.112067 1.7513-.215513 2.6795-.301721 1.0771-.094827 2.1629-.181036 3.2399-.241381.7619-.043103 1.5237-.051724 2.2855-.077586.0602-.016552.1238-.016552.1839 0 .4746.277746.8671.673048 1.1383 1.146558l.0701.27586.0701.16379zM12.0146 19.651l1.4361-.2069c.548-.0242 1.0797-.1908 1.5412-.4827.0648-.0246.1365-.0246.2014 0 1.2984.1902 2.5725.5168 3.8003.9741 1.3758.5062 2.7182 1.0964 4.0193 1.7672 1.5674.7932 3.1261 1.6035 4.7023 2.388.4816.2414.9894.4396 1.4798.6638.0754.0286.1397.0799.1839.1465.3669.5125.678 1.0614.9282 1.638.005.0458.005.092 0 .1379.0377.5505-.0646 1.1016-.2977 1.6034-.1713.3856-.484.6935-.8757.8621-.3542.1587-.7532.1922-1.1296.0948-2.3993-.862-4.7898-1.7241-7.1191-2.6982-1.3893-.5748-2.7495-1.2213-4.0805-1.9397-.5512-.2833-1.1411-.4865-1.7513-.6034-1.4225-.347-2.823-.7759-4.1944-1.2845-.1489-.0518-.3503-.0776-.4204-.1811-.07-.1034 0-.2844.0526-.4396.0814-.4812.1108-.9696.0876-1.4569-.0001-.0534.0184-.1051.0525-.1466.2776-.3085.63-.5428 1.0245-.681l.3765-.1379-.0175-.0173zM2.79397 33.2462c.21578-.0133.4322-.0133.64799 0 .10513.0122.20343.0575.28021.1293.69176.6552 1.37478 1.3276 2.0753 1.9827l6.12963 5.7931 1.1033 1.069c.0433.0238.0761.0624.0923.1085.0162.0462.0145.0965-.0047.1415-.0964.2673-.1839.5431-.289.819-.0288.0497-.0758.0867-.1314.1034-.6504.1766-1.3373.1766-1.9877 0-1.12871-.2851-2.16908-.8387-3.02977-1.612-1.23467-1.1035-2.46935-2.2069-3.71278-3.2845-.94978-.8524-2.03933-1.5403-3.22242-2.0345-.023012-.0099-.043106-.0254-.058415-.045-.015311-.0196-.025339-.0426-.029149-.0671.171243-1.0018.687634-1.9151 1.462344-2.5862.21453-.1849.43965-.3576.67426-.5172z' fill='%23FFF'/%3E%3C/svg%3E");
}
#breadcrumb {
position: absolute;
z-index: 10;
right: 0;
bottom: 0;
left: 0;
margin: auto;
}
.breadcrumb__list {
display: flex;
flex-wrap: wrap;
list-style: none;
justify-content: center;
align-items: center;
padding: 30px 10px;
margin: 0;
}
.breadcrumb__item {
display: flex;
align-items: center;
color: #FFF;
font-size: 1.6rem;
font-size: clamp(1.2rem, 1.0vw, 1.6rem);
font-weight: 400;
}
.breadcrumb__item + .breadcrumb__item {
padding-left: 8px;
}
.breadcrumb__item > a {
text-decoration: none;
display: flex;
align-items: center;
color: inherit;
font-size: inherit;
font-weight: inherit;
}
.breadcrumb__item + .breadcrumb__item::before {
content: '>';
font-weight: 700;
padding-right: 8px;
color: #EE743B;
}
/* --- LISTING PRESTATAIRE --- */
.liens-filtre__list {
list-style: none;
padding: 0;
margin: 25px 0;
display: flex;
flex-wrap: wrap;
justify-content: center;
align-items: center;
}
.liens-filtre__list li {
display: inline-block;
}
.liens-filtre__list a {
display: block;
text-decoration: none;
border-radius: 4px;
font-size: 1.6rem;
font-size: clamp(1.2rem, 1.0vw, 1.6rem);
font-weight: 400;
padding: 5px 10px;
margin: 5px;
color: #EE743B;
background-color: #FBDED0;
transition: all 0.2s ease;
}
.liens-filtre__list a:hover {
color: #FFF;
background-color: #EE743B;
}
.inner-page {
padding: 0 20px;
margin: 0 0 20px 0;
}
.flex-prestataire {
display: flex;
flex-direction: row-reverse;
}
.recherche-prestataire {
width: 60%;
}
#btn-prestataire-carte {
display: none;
}
.cartographie-wrapper {
position: relative;
width: 40%;
margin-right: 30px;
background-color: #D7EFC0;
}
.cartographie-wrapper .cartographie {
position: sticky!important;
top: 0;
height: 100vh !important;
max-height: 100vh;
}
/* TOOLBAR */
.toolbar-recherche-prestataire {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 30px;
}
.type-ORG .toolbar-recherche-prestataire {
display: none;
}
.nb-results {
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem)
font-weight: 300;
letter-spacing: 0.05em;
padding: 0;
margin: 0;
line-height: 1;
}
.nb-results-value {
font-size: 3.0rem;
font-size: clamp(2.0rem, 1.6vw, 3.0rem);
font-weight: 700;
line-height: 1;
}
.toolbar-item-wrapper {
display: flex;
}
.toolbar-item-wrapper > * {
border: none;
margin-left: 10px;
}
.btn-link .icon {
width: 15px;
height: 15px;
}
.btn-icon-right .icon {
margin-left: 10px;
}
.btn-icon-left .icon {
margin-right: 15px;
}
.btn-filtre {
color: #FFF;
background-color: #EE743B;
}
.btn-tri {
position: relative;
display: flex;
align-items: center;
color: #EE743B;
border: 1px solid #EE743B;
padding: 0;
border: none;
}
.btn-tri select {
min-width: 110px;
background-color: transparent;
border: none;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
-ms-appearance: none;
color: #EE743B;
background-color: #FFF;
border: 1px solid #EE743B;
cursor: pointer;
display: block;
height: 100%;
padding: 9px 30px 9px 35px;
}
.btn-tri::before {
content: '';
flex: none;
position: absolute;
top: 0;
left: 15px;
bottom: 0;
display: block;
width: 15px;
height: 15px;
background-image: url(../images/assets/icon-tri.svg);
background-repeat: no-repeat;
background-size: contain;
background-position: center;
margin: auto;
pointer-events: none;
}
.btn-tri::after {
content: '';
flex: none;
position: absolute;
top: 0;
right: 15px;
bottom: 0;
display: block;
width: 10px;
height: 5px;
background-image: url(../images/assets/select-triangle.svg);
margin: auto;
pointer-events: none;
}
.type-affichage {
display: flex;
align-items: center;
}
.type-affichage-label {
display: block;
color: #575756;
border: 1px solid #575756;
background-color: #FFF;
height: 100%;
padding: 10px 15px;
}
.btn-affichage-wrapper {
display: flex;
height: 100%;
}
.btn-affichage-wrapper button {
cursor: pointer;
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 100%;
border: none;
background-color: #D9D9D9;
}
.btn-affichage-wrapper .btn-affichage-grille {
background-color: #575756;
}
.btn-affichage-wrapper button img {
width: 20px;
}
.listing-prestataire {
min-height: 250px;
position:relative;
}
#listing-prestataire-load {
position: absolute;
top: 0;
left: 0;
width:100%;
height:100%;
background-image:url('../images/spinner-1s-200px.svg');
background-position:top center;
background-repeat:no-repeat;
z-index:999999;
display:block;
}
#listing-prestataire-noresult {
position: absolute;
top: 0;
left: 0;
width:100%;
text-align:center;
font-style:italic;
display:none;
}
#listing-prestataire-up {
position: fixed;
bottom: 20px;
right: 80px;
display:none;
width: 40px;
height: 40px;
background-color:#EE743B;
color:transparent;
border-radius: 40px;
box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2);
z-index:99999;
cursor:pointer;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none'%3E%3Cpath fill='%23FFF' fill-rule='evenodd' d='M3.29289 9.70711c-.39052-.39053-.39052-1.02369 0-1.41422l6-6c.39053-.39052 1.02371-.39052 1.41421 0l6 6c.3905.39053.3905 1.02369 0 1.41422-.3905.39049-1.0237.39049-1.4142 0L11 5.41421V17c0 .5523-.4477 1-1 1-.55228 0-1-.4477-1-1V5.41421l-4.29289 4.2929c-.39053.39049-1.02369.39049-1.41422 0Z' clip-rule='evenodd'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
background-size: 24px;
transition: all 0.2s ease;
}
#listing-prestataire-up:hover {
background-color:hsl(19, 84%, 40%);
}
/* --- Reseaux Sociaux --- */
#socials {
display: flex;
flex-wrap: wrap;
background-color: hsl(19, 84%, 95%);
}
.btn-social {
display: block;
margin: 5px;
text-decoration: none;
width: 30px;
height: 30px;
background-color: #FFF;
transition: all 0.2s ease;
}
.btn-social:hover {
opacity: 0.6;
}
.btn-social img {
width: 100%;
}
.listing-prestataire__list {
display: flex;
flex-wrap: wrap;
list-style: none;
padding: 0;
margin: 0 -15px;
}
.listing-prestataire__item {
display: flex;
flex-direction: column;
width: calc(33.33% - 30px);
margin: 0 15px 30px 15px;
transition: all 0.2s ease;
position:relative;
transform-origin: center;
}
.type-ORG .listing-prestataire__item {
width: calc(50% - 30px);
}
@media (max-width: 609px) {
.type-ORG .listing-prestataire__item {
width: 100%;
margin:10px 0;
}
}
.listing-bloc_date {
display: flex;
width:100%;
/*
flex-direction: column;
justify-content:space-around;
*/
}
.listing-bloc_date-content {
display: flex;
/*
flex-direction: column;
justify-content:space-between;
*/
background-color: #EE743B;
margin:15px;
}
.listing-bloc_date-content div {
color:#fff;
margin:5px;
}
.listing-bloc_break {
flex-basis: 100%;
height: 0;
}
/*
.listing-bloc_date-numero {
color:#fff;
font-family: 'blondescript', serif;
font-size: 10.0rem;
text-align:center;
}
.listing-bloc_date-jour, .listing-bloc_date-mois {
color:#fff;
text-align:center;
padding:10px;
text-transform:uppercase;
font-size: 2.0rem;
}
*/
.listing-prestataire__galerie,
.details-prestataire__galerie {
position: relative;
display: block;
width: 100%;
}
.listing-prestataire__galerie {
/*min-height:150px; */
/* necessaire pour que le bloc ait une hauteur déjà en place avant que JS soit chargé mais cassse la structure ...*/
background-color:#eee;
}
.listing-prestataire__item {
opacity:0;
}
.listing-prestataire__galerie-item {
/*display:none; */
/* necessaire pour ne pas voir une bande d'image avant que JS soit chargé*/
}
.listing-prestataire__galerie-wrapper {
/* display: flex; */
height: auto!important;
}
.listing-prestataire__galerie-item img {
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
}
.listing-prestataire__galerie-item .ratio-box > * {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.listing-prestataire__link {
text-decoration: none;
display: flex;
flex-direction: column;
height: 100%;
padding: 15px;
border: 1px solid #D9D9D9;
background-color: #FFF;
transition: all 0.2s ease;
}
.listing-prestataire__link > * {
margin-top: 0;
margin-bottom: 10px;
}
.listing-prestataire__galerie .lSAction>.lSPrev,
.details-prestataire__galerie .lSAction>.lSPrev {
background-image: url("../images/assets/arrow-left-listing.svg");
}
.listing-prestataire__galerie .lSAction>.lSNext,
.details-prestataire__galerie .lSAction>.lSNext {
background-image: url("../images/assets/arrow-right-listing.svg");
}
.prestataire-titre {
color: #575756;
font-size: 1.8rem;
font-size: clamp(1.4rem, 1.1vw, 1.8rem);
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.04em;
margin-top: 0;
transition: all 0.2s ease;
}
.prestataire-classement {
display: flex;
align-items: center;
color: #7E7E7C;
font-style: italic;
font-size: 1.6rem;
font-weight: 300;
line-height: 2.2rem;
}
.type-ORG .prestataire-classement {
display: none;
}
.prestataire-classement img {
margin-right: 5px;
max-height: 30px;
}
.prestataire-classement .image_par_classement {
width: auto;
height: 30px;
}
.prestataire-resume {
color: #575756;
font-size: 1.6rem;
line-height: 2.2rem;
font-weight: 300;
}
.prestataire-localisation {
color: #EE743B;
font-size: 1.4rem;
line-height: 2.2rem;
font-weight: 300;
margin-top: auto;
margin-bottom: 0;
}
.type-ORG .prestataire-localisation {
display: none;
}
.prestataire-localisation:before {
content: '';
display: inline-block;
width: 16px;
height: 18px;
margin-bottom: -4px;
margin-right: 8px;
background-image: url('../images/assets/puce-signature.svg');
background-position: center;
background-size: contain;
background-repeat: no-repeat;
}
/* PAGINATION */
#pagination {
margin:20px auto;
}
.pagination__list {
display: flex;
justify-content: center;
align-items: center;
list-style: none;
padding: 0;
margin: 0;
}
.pagination__item {
display: flex;
justify-content: center;
align-items: center;
width: 40px;
height: 40px;
color: #575756;
border: 1px solid #575756;
margin: 0 7.5px;
}
.pagination__item.active {
color: #FFF;
background-color: #575756;
}
.pagination__item.inactive {
cursor: default;
opacity: 0.33;
}
.pagination__link {
text-decoration: none;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
height: 100%;
color: inherit;
}
.page-entete-wrapper {
display: flex;
flex-direction: column-reverse;
}
.page-entete-wrapper .prestataire-classement {
justify-content: center;
padding: 0 0 30px 0;
}
.page-entete-wrapper .titre-eclats {
padding: 0 0 30px 0;
}
.page-entete-wrapper #breadcrumb {
position: relative;
}
.page-entete-wrapper .breadcrumb__item {
color: #575756;
}
.details-partenaire {
display: flex;
margin-bottom: 60px;
}
.details-partenaire__article {
display: block;
width: 100%;
}
.details-partenaire__article .details-prestataire__galerie {
display: block;
max-width: 830px;
}
.details-partenaire__aside {
display: block;
flex: none;
width: 300px;
margin-left: 30px;
}
.details-partenaire__aside > * {
margin-bottom: 20px;
}
.nb-photo {
position: absolute;
z-index: 10;
right: 10px;
bottom: 10px;
display: flex;
justify-content: center;
align-items: center;
color: #FFF;
font-size: 1.6rem;
padding: 5px 10px;
border-radius: 4px;
background: rgba(238, 116, 59, 0.6);
-webkit-backdrop-filter: blur(15px);
backdrop-filter: blur(15px);
}
.nb-photo img {
width: 15px;
margin-right: 10px;
}
.details-prestataire__contenu {
color: #575756;
font-weight: 300;
letter-spacing: 0.05em;
line-height: 3.0rem;
}
.details-prestataire__contenu a {
color: #EE743B;
font-weight: 700;
}
.details-prestataire__contenu ul,
.details-prestataire__contenu ol {
padding-left: 30px;
}
.details-prestataire__contenu .tags__list {
padding: 0;
}
.tags__list {
list-style: none;
display: flex;
flex-wrap: wrap;
padding: 0;
margin: 0 -7.5px;
}
.tags__item {
display: flex;
align-items: center;
padding: 5px 10px 5px 5px;
margin: 0 7.5px 15px 7.5px;
font-size: 1.6rem;
font-size: clamp(1.4rem, 1.0vw, 1.6rem);
color: #EE743B;
background: #FFFFFF;
border: 1px solid #EE743B;
border-radius: 4px;
line-height: 1;
}
.tags__item__horaire {
width:31%;
text-align:center;
justify-content: center;
}
.tags__item.icon::before {
content: '';
display: inline-block;
width: 22px;
height: 22px;
background-position: center;
background-size: contain;
background-repeat: no-repeat;
margin: 0 5px 0 0;
}
.tags__item.icon-agenda::before {
background-image: url('../images/assets/events/icon-agenda.svg');
}
.tags__item.icon-horaires::before {
background-image: url('../images/assets/events/icon-horaires.svg');
}
.tags__item.icon-tarifs::before {
background-image: url('../images/assets/events/icon-tarifs.svg');
}
.tags__item.icon-localisation::before {
background-image: url('../images/assets/events/icon-localisation.svg');
}
.tags__item.icon-infos::before {
background-image: url('../images/assets/events/icon-infos.svg');
}
.titre-trait {
position: relative;
display: block;
margin: 30px 0 20px 0;
}
.titre-trait h2 {
display: inline-block;
white-space: nowrap;
color: #EE743B;
background: #FFFFFF;
font-size: 2.4rem;
font-size: clamp(2.0rem, 1.3vw, 2.4rem);
font-weight: 700;
letter-spacing: 0.05em;
margin: 0;
padding: 0 12px 0 0;
}
.titre-trait h2::after {
content: '';
position: absolute;
z-index: -1;
top: 16px;
display: block;
width: 100%;
height: 1px;
background-color: #D9D9D9;
}
.details-partenaire__map {
display: block;
margin-bottom: 5px!important;
}
.details-partenaire__adresse-text {
padding: 5px 10px;
border: 1px solid #575756;
}
.details-evenement__adresse .details-partenaire__adresse-text {
padding: 0;
border: none;
}
.details-partenaire__adresse-text p {
margin: 10px 0;
font-weight: 300;
line-height: 1.2;
}
.details-partenaire__adresse-text p:first-child {
text-transform: uppercase;
font-weight: 700;
letter-spacing: 0.05em;
line-height: 1.2;
}
.btn-link {
text-decoration: none;
display: flex;
justify-content: center;
align-items: center;
width: 100%;
font-weight: 400;
line-height: 1;
color: #FFF;
background-color: #575756;
padding: 10px 15px;
border: 1px solid transparent;
transition: all 0.2s ease;
cursor: pointer;
}
.modal__footer .btn-link {
width: auto;
}
.details-partenaire__link-infos > * + * {
margin-top: 10px;
}
.btn-link:hover {
filter: brightness(80%);
}
.btn-link.btn-orange {
background-color: #EE743B;
}
.btn-link.btn-blanc {
color: #EE743B;
background-color: #FFF;
border-color: #EE743B;
}
.btn-link img {
width: 20px;
}
.btn-link-icon-left img {
margin-right: 5px;
}
.details-partenaire__label, .details-partenaire__label_th {
display: flex;
flex-wrap: wrap;
margin-left: -5px;
margin-right: -5px;
}
.details-partenaire__label > div {
display: block;
width: 110px;
margin: 0 5px 10px 5px;
}
.details-partenaire__label > div > img {
max-width:110px;
}
.details-partenaire__label_th > div {
display: block;
/*width: 40px;*/
margin: 0 5px 10px 5px;
}
.details-partenaire__label_th > div > img {
/*max-width:40px;*/
}
.details-partenaire__offre {
margin-bottom:10px;
transition: all 0.2s ease;
text-decoration: none;
display: block;
}
.details-partenaire__offre__infos {
border:1px solid #D9D9D9;
padding:10px;
}
.details-partenaire__offre:hover {
text-decoration: none;
}
.details-partenaire__offre:hover .details-partenaire__offre__infos {
background-color:#eee;
}
.details-partenaire__offre__infos > * {
margin-top: 0;
margin-bottom: 10px;
}
.office-label {
padding: 0!important;
margin: 0 0 10px 0;
list-style: none;
text-align: center;
display: flex;
flex-wrap: wrap;
justify-content: center;
}
.office-label.justify-content--left {
justify-content: flex-start;
}
.office-label li {
display: flex;
justify-content: center;
align-items: center;
width: 130px;
height: 130px;
border-radius: 200px;
margin: 10px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
overflow: hidden;
}
.office-label li img {
max-width: 105px;
}
/* --------------------------------
MODAL
-------------------------------- */
.modal-container {
position: fixed;
z-index: 100;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
padding: 40px;
display: flex;
justify-content: center;
align-items: center;
}
.modal-background {
position: absolute;
z-index: 100;
top: 0;
right: 0;
bottom: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.6);
}
.modal {
position: relative;
z-index: 200;
width: 100%;
max-width: 900px;
max-height: 100%;
border-radius: 4px;
display: flex;
flex-direction: column;
background-color: #EE743B;
-webkit-box-shadow: 0px 8px 28px rgba(0, 0, 0, 0.28);
box-shadow: 0px 8px 28px rgba(0, 0, 0, 0.28);
}
.modal__header {
position: relative;
padding: 20px;
/*border-bottom: 1px solid #999;*/
}
.modal__title {
font-size: 1.8rem;
font-weight: 700;
color: #FFF;
text-align: center;
line-height: 1.2;
padding: 0;
margin: 0 20px;
}
.modal__close-btn {
position: absolute;
top: 20px;
right: 20px;
display: block;
border: none;
padding: 0;
margin: 0;
background-color: transparent;
cursor: pointer;
transition: all 0.2s ease;
}
.modal__close-btn:hover {
opacity: 0.6;
}
.modal__close-btn img {
display: block;
}
.modal__content {
height: 100%;
overflow: auto;
padding: 30px 20px 0 20px;
background-color: #EEE;
}
.modal__footer {
display: flex;
justify-content: space-between;
align-items: center;
padding: 20px;
border-top: 1px solid #EE743B;
border-bottom-right-radius: 4px;
border-bottom-left-radius: 4px;
background-color: #FFF;
}
.modal a,
#filtres-effacer {
font-size: 1.4rem;
font-weight: 600;
text-decoration: underline;
cursor: pointer;
color: #EE743B;
}
#filtres-reload {
font-size: 1.4rem;
background-color: #EE743B;
}
.modal a:hover {
opacity: 0.6;
}
.modal__group {
padding: 0 0 30px 0;
margin: 0 20px 30px 20px;
/*border-bottom:1px solid #999;*/
}
.modal__group:last-child {
border: none;
}
.modal__group * {
color: #222;
line-height: 1.2;
}
.modal .filtre {
display: flex;
/*justify-content: space-between;*/
margin-bottom:20px;
}
.modal .filtre-entete {
width:25%;
}
.modal .filtre-switch {
display: flex;
justify-content: space-between;
align-items: flex-end;
}
.modal .filtre-switch > * + * {
margin-left: 15px;
}
.modal legend {
font-size: 2.4rem;
font-weight: 700;
letter-spacing: -0.05em;
margin: 0 0 20px 0;
}
.modal .filtre__title {
font-size: 1.8rem;
font-weight: 600;
margin: 10px 10px 5px 0;
color:#EE743B;
}
.modal .filtre_nb {
color:#888;
font-size: 0.7em;
}
.modal .filtre__description {
font-size: 1.6rem;
margin: 0;
}
.modal .group-input {
display: flex;
flex-wrap: wrap;
width:75%;
}
.modal .group-input > * {
/* flex-basis: 50% !important;*/
}
.modal .custom-input {
padding: 10px 10px 0 10px;
margin: 0 -10px;
flex-basis: 50% !important;
flex:1;
height:auto;
}
/* SWITCH INPUT */
.switch {
position: relative;
display: inline-block;
margin: 0;
}
/* Hide the checkbox input (only needed for `:checked` property) */
.switch-input {
display: none;
}
/* Switch */
.switch-label {
display: block;
width: 50px;
height: 30px;
text-indent: -150%;
clip: rect(0 0 0 0);
color: transparent;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
/* Switch Rail & Knob */
/* Switch Rail */
/* Switch Knob */
}
.switch-label:before,
.switch-label:after {
content: "";
display: block;
position: absolute;
cursor: pointer;
}
.switch-label:before {
width: 100%;
height: 100%;
background-color: #999;
border-radius: 9999em;
transition: background-color 0.25s ease;
}
.switch-label:after {
top: 2px;
left: 2px;
width: 26px;
height: 26px;
border-radius: 50%;
background-color: #fff;
box-shadow: 0 0 2px rgba(0, 0, 0, 0.45);
background-position: center;
background-size: 26px;
background-repeat: no-repeat;
transition: left 0.25s ease;
}
/* When input is checked */
.switch-input:checked + .switch-label {
/* Switch Rail */
/* Switch Knob */
}
.switch-input:checked + .switch-label:before {
background-color: #EE743B;
}
.switch-input:checked + .switch-label:after {
left: 22px;
background-color: #EE743B;
background-image: url('../images/assets/icon-check-40x.svg');
}
/* CHECKBOX INPUT */
/* Basic styles */
.custom-input input[type="checkbox"],
.custom-input input[type="radio"] {
position: absolute;
opacity: 0;
z-index: -1;
}
.custom-input label {
position: relative;
display: inline-block;
padding: 0 10px 0 30px;
/*height: 24px;*/
/*line-height: 1.6;*/
cursor: pointer;
font-size: 1.6rem;
}
.custom-input label::before,
.custom-input label::after {
position: absolute;
top: 0;
left: 0;
display: block;
width: 20px;
height: 18px;
}
.custom-input label::before {
content: "";
border: 1px solid #999;
border-radius: 4px;
background-color: #FFF;
background-position: center;
background-size: 20px;
background-repeat: no-repeat;
}
/* Checkbox */
.custom-input input[type="checkbox"] + label::after {
background-color: #EE743B;
}
/* Radio */
.custom-input input[type="radio"] + label::before {
border-radius: 50px;
}
/* :checked */
.custom-input input[type="checkbox"]:checked + label::before,
.custom-input input[type="radio"]:checked + label::before {
background-color: #EE743B;
border-color: #EE743B;
background-image: url('../images/assets/icon-check-40x.svg');
}
.custom-input input[type="checkbox"] + label::after,
.custom-input input[type=radio] + label::after {
-webkit-transform: scale(0);
-ms-transform: scale(0);
-o-transform: scale(0);
transform: scale(0);
}
.custom-input input[type="checkbox"]:checked + label::after,
.custom-input input[type=radio]:checked + label::after {
-webkit-transform: scale(1);
-ms-transform: scale(1);
-o-transform: scale(1);
transform: scale(1);
}
/* Transition */
.custom-input label::before,
.custom-input label::after {
-webkit-transition: .25s all ease;
-o-transition: .25s all ease;
transition: .25s all ease;
}
/* RANGE INPUT */
.range-slider-conteneur {
padding-top: 14px;
}
.ui-slider-horizontal .ui-slider-range {
background-color: #EE743B;
}
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
border: 1px solid #999!important;
}
.ui-slider .ui-slider-handle {
cursor: pointer!important;
}
.range-slider {
margin: 2px 0;
flex: auto;
}
.range-slider-description {
display: block;
width: 100%;
text-align: left!important;
}
.rangeValueMin,
.rangeValueMax {
flex: none;
width: 50px!important;
white-space: nowrap;
}
.rangeValueMin {
padding-right: 15px;
}
.rangeValueMax {
padding-left: 15px;
}
/* PAGE CONTACT */
#page_contact_intro {
text-align: center;
color: #575756;
font-weight: 600;
font-size: 1.4rem;
line-height: 1.8rem;
margin: 0 auto 10px auto;
max-width: 500px;
}
#page_contact {
}
#page_contact .rs-list {
list-style: none;
display: flex;
justify-content: space-between;
padding: 0;
margin: 0 -5px;
}
#page_contact .rs-list li {
margin: 10px 5px;
}
#page_contact .rs-list li a {
display: block;
}
#page_contact .rs-list li a img {
display: block;
width: 40px;
}
.details-bureau {
}
.listing-bureau h2 {
position: relative;
display: flex;
align-items: center;
color: #EE743B;
background: #FFFFFF;
font-size: 2.4rem;
font-size: clamp(2.0rem, 1.3vw, 2.4rem);
font-weight: 700;
letter-spacing: 0.05em;
margin-top: 30px;
}
#map-placeholder {
background-color: red;
min-height: 300px;
margin-bottom: 10px;
}
.listing-bureau__list {
display: flex;
flex-wrap: wrap;
list-style: none;
padding: 0;
margin: 0 -5px;
}
.listing-bureau__item {
position: relative;
display: flex;
flex-direction: column;
width: 100%;
margin: 0 5px 10px 5px;
transition: all 0.2s ease;
}
.listing-bureau__item a {
display: block;
}
@media (min-width: 640px) {
.listing-bureau__item {
width: calc(50% - 10px);
}
}
@media (min-width: 800px) {
.listing-bureau-map {
display: flex;
}
.listing-bureau-map #map-placeholder {
width: 40%;
margin: 0 10px 10px 0;
}
.listing-bureau-map .listing-bureau__list {
width: 60%;
}
}
.listing-bureau__item-titre,
.bureau__item-titre {
position: absolute;
z-index: 1;
right: 0;
bottom: 0;
left: 0;
display: block;
text-align: center;
color: #FFFFFF;
font-weight: 600;
font-size: 2.4rem;
line-height: 1;
text-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
margin: 0;
padding: 10px;
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.6) 100%);
}
.bureau__item-adresse {
margin: 0;
}
.bureau__adresse-text {
text-align: center;
margin: 0;
padding: 5px 10px;
border: 1px solid #575756;
font-weight: 300;
line-height: 1.8rem;
}
.bureau__adresse-text p {
margin: 5px 0;
line-height: 2.4rem;
}
.listing-bureau__links a {
margin: 10px 0;
}
.form_contact_ligne {
display: flex;
align-items: space-around;
flex-wrap: wrap;
width: 100%;
margin: 0 0 10px 0;
}
.form_contact_ligne > * {
flex: 1;
width: 100%;
}
.form_contact_ligne > * + * {
margin-left: 20px;
}
.form_contact_ligne h2 {
margin-bottom:0;
padding-bottom:0;
}
.login-wrapper {
padding: 20px;
margin:0 auto 40px auto;
background-color: hsl(60,1%,95%);
border-radius: 4px;
}
.form_contact_ligne input[type=text],
.form_contact_ligne input[type=email],
.form_contact_ligne input[type=url],
.form_contact_ligne input[type=number],
.form_contact_ligne input[type=tel],
.form_contact_ligne input[type=file],
.form_contact_ligne input[type=password],
.form_contact_ligne select,
.form_contact_ligne textarea {
padding: 10px;
width: 100%;
}
#a_ip {
cursor: pointer;
font-weight: 700;
text-decoration: underline;
font-size: 1.4rem;
}
#div_ip {
padding: 20px;
margin: 10px 0 0 0;
background-color: hsl(60,1%,85%);
border-radius: 4px;
}
#div_ip p {
margin: 10px 0;
}
.form_contact_ligne textarea {
padding: 10px;
width: 100%;
min-height:80px;
}
.form_contact_ligne input,
.form_contact_ligne textarea {
font-size: 1.6rem;
font-weight: 400;
color: hsla(60, 1%, 34%, 1);
border: 1px solid hsla(60, 1%, 34%, 1);
}
.form_contact_ligne textarea[name=message] {
}
.form_contact_ligne input[type=submit] {
display: block;
width: 100%;
text-align: center;
border: none;
color: #FFFFFF;
background-color:#EE743B;
padding: 10px 20px;
cursor: pointer;
transition: all 0.2s ease;
}
.form_contact_ligne input[type=submit]:hover {
background-color:hsl(19, 84%, 40%);
}
.form_contact_rgpd {
padding: 10px;
color: #575756;
background-color:hsl(19, 84%, 95%);
}
.form_contact_rgpd_mention {
font-size: 1.4rem;
font-weight: 600;
line-height: 2.4rem;
}
.form_contact_rgpd_infos {
font-size: 1.4rem;
font-weight: 300;
line-height: 2.4rem;
}
.form_contact_rgpd a {
color: #EE743B;
font-weight: 600;
}
#page_contact_erreur {
color:#a00;
text-align:center;
margin:10px auto;
}
#page_contact_message {
color:#0A0;
text-align:center;
margin:10px auto;
}
#page_contact .rs-list {
margin: 20px 0;
padding: 0;
list-style: none;
display: flex;
justify-content: center;
}
#page_contact .rs-list > li {
margin: 0 10px;
}
#page_contact .rs-list li a {
display: block;
transition: all 0.2s ease;
}
#page_contact .rs-list li a:hover {
opacity: 0.6;
}
#page_contact .rs-list li a img {
width: 40px;
}
/*special champ à ignorer pour contrer les robots*/
.mon_champ {
display:none;
}
.champ--item {
position: relative;
}
.champ--item label {
position: absolute;
top: 10px;
left: 0;
padding: 0 10px;
display: flex;
justify-content: center;
align-items: center;
color: #7E7E7C;
font-size: 1.8rem;
font-weight: 300;
pointer-events: none;
transition: all 0.2s ease;
}
.champ--item input:not(:placeholder-shown) ~ label,
.champ--item input:focus ~ label,
.champ--item textarea:not(:placeholder-shown) ~ label,
.champ--item textarea:focus ~ label {
font-size: 1.2rem;
padding: 0 2px;
top: -8px;
left: 9px;
color: #EE743B;
background-color: #fff;
}
/* PLACEHOLDER (Prefixed for last 10 versions Browsers) */
.champ--item input::-webkit-input-placeholder,
.champ--item textarea::-webkit-input-placeholder {
color: transparent;
}
.champ--item input::-webkit-input-placeholder,
.champ--item textarea::-webkit-input-placeholder {
color: transparent;
}
.champ--item input::-moz-placeholder,
.champ--item textarea::-moz-placeholder {
color: transparent;
}
.champ--item input:-ms-input-placeholder,
.champ--item textarea:-ms-input-placeholder {
color: transparent;
}
.champ--item input::-ms-input-placeholder,
.champ--item textarea::-ms-input-placeholder {
color: transparent;
}
.champ--item input::placeholder,
.champ--item textarea::placeholder {
color: transparent;
}
.modal-is-open {
overflow: hidden;
padding-right: 15px;
}
.details-contact {
max-width: 800px;
display: flex;
align-items: center;
margin: 1.75rem auto;
width: 800px;
}
@media (max-width: 805px) {
.details-contact {
width: 100%;
}
}
.details-contact-wrapper {
background-color: #FFF;
padding: 10px;
border-radius: 4px;
width:100%;
}
.popin-contact {
position: fixed;
z-index: 10000;
top: 0;
left: 0;
width: 100%;
height: 100%;
/* display: flex;
justify-content: center;
align-items: center;
*/
padding: 10px;
background-color: rgba(0,0,0,0.6);
overflow-x: hidden;
overflow-y: auto;
outline: 0;
display: none;
}
.popin-contact-title {
text-align: center;
color: rgb(238, 116, 59);
font-size: clamp(2rem, 1.3vw, 2.4rem);
font-weight: 700;
letter-spacing: 0.05em;
margin: 0 0 10px 0;
}
.popin-contact-close {
display: inline-block;
text-decoration: none;
border-radius: 4px;
font-size: 1.6rem;
font-size: clamp(1.2rem, 1.0vw, 1.6rem);
padding: 5px 10px;
margin: 5px;
color: #c80032;
background-color: hsl(345, 100%, 90%);
border: none;
cursor: pointer;
transition: all 0.2s ease;
}
.popin-contact-close:hover {
color: #FFF;
background-color: #c80032;
}
.trombinoscope tr {
display: flex;
align-items: center;
}
.trombinoscope td {
}
.trombinoscope img {
flex: none;
width: 270px;
height: 270px;
object-fit: cover;
object-position: center;
border-radius: 100%;
padding: 5px;
border: 2px dashed #EE743B;
margin-right: 20px;
}
@media (max-width: 805px) {
.trombinoscope tr {
flex-direction: column;
}
.trombinoscope td {
text-align: center;
}
.trombinoscope img {
margin-right: 0;
margin-bottom: 10px;
}
}
/* ------- MEDIA RESPONSIVE ----------------| 640px |-------------------- */
@media (max-width: 640px) {
#page_contact .inner-page {
padding: 0;
}
#page_contact {
display:block;
}
#page_contact_intro {
margin: 0 0 10px 0;
}
.form_contact_ligne {
display:block;
margin: 0 0 10px 0;
}
.form_contact_ligne > * + * {
margin-left: 0;
margin-top: 10px;
}
.form_contact_ligne input[type=text],
.form_contact_ligne input[type=email],
.form_contact_ligne input[type=url],
.form_contact_ligne input[type=number],
.form_contact_ligne input[type=tel],
.form_contact_ligne input[type=file],
.form_contact_ligne select,
.form_contact_ligne textarea {
width:100%;
}
.listing-bureau h2 {
white-space: normal;
}
}
#form_info {
padding:10px;
background-color:#eee;
margin:10px 0;
}
#form_erreur {
padding:10px;
background-color:#fcd4d4;
margin:10px 0;
}
/* ----- ESPACE ADHERENT ----- */
.fil_info__wrapper {
display: flex;
flex-wrap: wrap;
margin: 0 -1%;
}
.cat_intro {
margin:0 auto 20px auto;
}
.fil_info {
display: flex;
flex-direction: column;
width: calc(31.33%);
margin: 1%;
}
@media (max-width: 801px) {
.fil_info {
width: 48%;
}
}
@media (max-width: 609px) {
.fil_info {
width: 100%;
}
}
.fil_info_img {
min-height:200px;
}
.fil_info_img::before {
content: '';
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
background-color: rgba(87, 87, 86, 0.1);
}
.fil_info h3 {
color: #EE743B;
margin: 10px 0;
}
.fil_info p {
margin: 0;
margin: 10px 0;
}
.fil_info__titre {
display: block;
text-align: center;
color: #EE743B;
background-color: #FBDED0;
padding: 10px;
margin: 2% 0;
width: auto;
font-weight: 600;
font-size: 1.8rem;
font-size: clamp(1.6rem, 1.1vw, 1.8rem);
border-radius: 4px;
}
.fil_info_liens {
display: flex;
flex-wrap: wrap;
}
.fil_info_liens > a {
display: flex;
align-items: center;
width: auto;
color: #FFF;
background-color: #575756;
padding: 5px 10px;
margin: 0 5px 5px 0;
border-radius: 4px;
text-decoration: none;
transition: all 0.2s ease;
}
.btn-voir-tout-wrapper {
display:flex;
justify-content:space-around;
margin:20px auto;
}
a.url-display::before,
a.url-download::before,
a.url-download-orange::before,
a.url-plus::before,
a.url-grid::before {
content: '';
flex: none;
display: inline-block;
width: 15px;
height: 15px;
margin: 0 5px 0 0;
background-size: contain;
background-position: center;
background-repeat: no-repeat;
}
a.url-display::before {
background-image: url(../images/assets/icon-eye.svg);
}
a.url-download::before {
background-image: url(../images/assets/icon-download.svg);
}
a.url-download-orange::before {
background-image: url(../images/assets/icon-download-orange.svg);
}
a.url-plus::before {
background-image: url(../images/assets/icon-plus.svg);
}
a.url-grid::before {
background-image: url(../images/assets/icon-grid.svg);
}
/* ------------------------
GRANDS EVENEMENTS
------------------------ */
.details-evenement__date-lieu {
color: #EE743B;
font-weight: 700;
text-align: center;
margin: 0 0 30px 0;
}
.details-evenement__date-lieu span {
display: inline-block;
border: 1px solid #EE743B;
padding: 5px 10px;
border-radius: 4px;
font-weight: 400;
font-size: 2.0rem;
font-size: clamp(1.8rem, 1.2vw, 2.0rem);
}
.details-evenement__contact {
display: flex;
margin: 10px 0 0 0;
}
.details-evenement__contact > * + * {
margin: 0 0 0 10px;
}
@media (max-width: 801px) {
.details-evenement__contact {
display: block;
}
.details-evenement__contact > * + * {
margin: 10px 0 0 0;
}
}
.details-prestataire__contenu a.btn-link {
font-weight: 400;
}
.details-prestataire__contenu a.btn-orange {
color: #FFF;
}
.bandeau-alerte {
display: flex;
align-items: center;
color: #FF414F;
border: 1px solid #FF414F;
background-color: #FFE5E7;
padding: 10px;
margin: 0 0 10px 0;
}
.bandeau-alerte::before {
content: '';
display: inline-block;
width: 20px;
height: 20px;
background-image: url(../images/assets/icon-alert.svg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
margin: 0 10px 0 0;
}
.capture-programme .btn-link {
margin-top: 5px;
}
.programme__list {
display: flex;
flex-wrap: wrap;
margin: 0 -1%;
padding: 0!important;
list-style: none;
}
.programme__item {
width: 23%;
margin: 0 1% 2% 1%;
}
.programme__item a {
display: block;
text-decoration: none;
text-align: center;
font-weight: 400;
color: #EE743B;
background-color: #FFF;
border: 1px solid #EE743B;
padding: 5px;
margin: 0;
transition: all 0.2s ease;
}
.programme__item a:hover {
background-color: hsl(19, 84%, 90%);
}
@media (max-width: 1025px) {
.programme__item {
width: 31.33%;
}
}
@media (max-width: 609px) {
.programme__item {
width: 48%;
}
}
/* ------------------------
DOCUMENTS
------------------------ */
.documents.listing-wrapper {
display: flex;
flex-wrap: wrap;
margin: 0 -1%;
padding: 0;
list-style: none;
}
.documents .listing--element {
position: relative;
width: 23%;
margin: 0 1% 4% 1%;
text-decoration:none;
display: block;
}
.documents.col-2 .listing--element {
width: 48%;
}
.listing--element:hover {
text-decoration:none;
}
.listing--element .document_capture {
position: relative;
width: 100px;
border-radius: 4px;
float: left;
margin: 0 10px 0 0;
}
.listing--element .document_capture::before {
content: '';
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 4px;
}
.listing--element .document_capture img {
width: 100%;
border-radius: 4px;
}
.listing--element .date {
position: relative;
display: inline-block;
font-weight: 400;
font-size: 14px;
color:hsl(60, 1%, 34%);
}
.listing--element .einfos {
}
.listing--element .einfos span,
.listing--element .einfos a {
display: inline-block;
color:hsl(60, 1%, 34%);
font-size: 12px;
margin: 0 5px 0 0;
}
.listing--element .titre {
color: hsl(19, 84%, 58%);
margin: 10px 0 0 0;
font-size: 18px;
font-weight: 700;
}
.listing--element .texte {
color: #575756;
font-size: 14px;
letter-spacing: 0.05em;
margin: 10px 0 0 0;
}
.documents .list-links {
clear: both;
display: flex;
flex-wrap: wrap;
}
.documents .list-links a {
display: flex;
align-items: center;
color: #FFF;
background-color: #575756;
padding: 5px 10px;
margin: 10px 10px 10px 0;
border-radius: 4px;
text-decoration: none;
font-weight: 400;
transition: all 0.2s ease;
}
.documents .list-links a:hover {
background-color: hsl(60, 1%, 20%);
}
@media (max-width: 1025px) {
.documents .listing--element {
width: 31%;
}
}
@media (max-width: 801px) {
.documents .listing--element {
width: 48%;
}
}
@media (max-width: 609px) {
.documents .listing--element {
width: 100%;
}
}
/* ------------------------
RENDEZ-VOUS
------------------------ */
.rdv-date {
display: flex;
flex-wrap: wrap;
background-color: hsl(19, 84%, 95%);
border-radius: 4px;
padding: 5px;
margin: 20px 0;
}
.rdv-date > * {
flex: 1;
}
.rdv-date__today,
.rdv-date__prev a,
.rdv-date__next a {
display: flex;
justify-content: center;
align-items: center;
padding: 10px;
border-radius: 4px;
text-align: center;
}
.rdv-date__today {
text-transform: capitalize;
color: #ee743b;
background-color: #FFF;
border: 1px solid #ee743b;
margin: 0 10px;
}
.rdv-date__prev a,
.rdv-date__next a {
height: 100%;
color: #FFF;
background-color: #ee743b;
text-decoration: none;
transition: all 0.2s ease;
}
.rdv-date__prev a:hover,
.rdv-date__next a:hover {
background-color: hsl(19, 84%, 48%);
}
.rdv-date__prev-icon,
.rdv-date__next-icon {
margin: 0 4px;
}
@media (max-width: 609px) {
.rdv-date__prev,
.rdv-date__next {
flex: none;
width: 40px;
}
.rdv-date__prev-label,
.rdv-date__next-label {
display: none;
}
}
.rdv-activites {
display: flex;
margin: 30px 0 60px 0;
}
.rdv-activites > * {
display: flex;
flex-direction: column;
flex: 1;
padding: 20px 20px 10px 20px;
margin: 0 5px;
background-color: hsl(60,1%,95%);
border-radius: 4px;
}
.rdv-activites__nb-elm {
margin: 10px 0;
text-align: center;
color: #ee743b;
}
.rdv-activites__nb-elm-value {
font-weight: 700;
}
.rdv-activites ul {
display: flex;
justify-content: center;
flex-wrap: wrap;
list-style: none;
padding: 0;
margin: 0;
}
.rdv-activites a {
display: flex;
align-items: center;
color: #FFF;
background-color: #575756;
padding: 5px 10px;
margin: 5px;
border-radius: 4px;
text-decoration: none;
font-weight: 400;
transition: all 0.2s ease;
}
.rdv-activites a:hover {
background-color: hsl(60, 1%, 20%);
}
.lien-mini-bloc {
display: inline-block;
color: #FFF;
font-style: normal;
background-color: #575756;
padding: 5px 10px;
margin: 5px;
border-radius: 4px;
text-decoration: none;
font-weight: 400;
transition: all 0.2s ease;
}
.lien-mini-bloc:hover {
background-color: hsl(60, 1%, 20%);
}
.rdv-activites__titre {
text-transform: uppercase;
font-weight: 700;
letter-spacing: 0.05em;
line-height: 1.2;
text-align: center;
}
.rdv-activites__infos {
margin: auto;
}
@media (max-width: 609px) {
.rdv-activites {
flex-direction: column;
margin: 20px 0 60px 0;
}
.rdv-activites > * {
margin: 5px 0;
}
}
.no-rdv {
opacity: 0.8;
filter: grayscale(100%)
}
/* ------------------------
EXPERIENCES
------------------------ */
.cadre-infos {
position: relative;
padding: 30px 10px;
background-color: #EE743B;
border-radius: 2px;
box-shadow: 0px 4px 6px rgb(6 22 58 / 25%);
transform: rotate(-4deg);
overflow: hidden;
}
.cadre-infos::after {
content: '';
position: absolute;
bottom: -25px;
right: -25px;
display: block;
width: 50px;
height: 50px;
background-color: hsl(19, 60%, 50%);
transform: rotate(45deg);
}
.cadre-infos p {
margin: 0;
}
.cadre-infos .cadre-infos__titre {
font-size: 2.8rem;
color: #8e4523;
font-family: 'blondescript', serif;
margin: 0 0 5px 0;
line-height: 1;
}
.cadre-infos .cadre-infos__texte,
.cadre-infos .cadre-infos__texte * {
color: #FFF;
font-size: 1.6rem;
line-height: 1.4;
text-align: justify;
margin: 0;
}
/* ------------------------
ACTUALITES
------------------------ */
.list-extended {
padding: 0;
margin: 0;
list-style: none;
}
.list-extended__item {
display: flex;
margin: 0 0 40px 0;
}
.list-extended__photo {
min-width: 33%;
}
.list-extended__photo img {
border-radius: 4px;
}
.credits-photo {
position: absolute;
left: 0;
bottom: 0;
display: block;
width: 100%;
color: #FFF;
font-weight: 400;
font-size: 1.4rem;
padding: 10px;
transition: all 0.2s ease;
}
.home-slider .credits-photo {
display: inline-block;
width: auto;
}
.js-slider-mini:hover .credits-photo,
.js-slider-2-item:hover .credits-photo,
.js-prestataire:hover .credits-photo,
.js-lightgallery:hover .credits-photo,
._embed_galerie:hover .credits-photo,
.home-slider .credits-photo:hover {
background-color: rgba(0,0,0,0.5);
}
.list-extended__infos {
padding: 0 0 0 20px;
}
.list-extended__titre {
margin: 0;
color: #EE743B;
font-size: 2.4rem;
font-size: clamp(2.0rem, 1.3vw, 2.4rem);
}
.list-extended__texte {
line-height: 1.4;
}
.list-extended__more {
font-weight: 100;
color: hsl(60, 1%, 40%);
font-style: italic;
}
/* .list-extended__more a {
color: #EE743B;
font-weight: 600;
} */
/* ------------------------
LIGHTGALLERY
------------------------ */
.js-lightgallery {
position: relative;
}
.js-lightgallery a {
display: block;
}
.js-slider-2-item .lslide,
.js-slider-mini .lslide,
.js-prestataire .lslide {
position: relative;
}
.js-slider-2-item .lslide::after,
.js-slider-mini .lslide::after,
.js-prestataire .lslide::after,
.js-lightgallery::after {
content: '';
position: absolute;
top: 10px;
right: 10px;
display: block;
width: 40px;
height: 40px;
border-radius: 100%;
margin: 0 0 0 auto;
background-color: rgba(0,0,0,0.25);
background-image: url("data:image/svg+xml,%3Csvg fill='none' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M4 11a7 7 0 1 1 14 0 7 7 0 0 1-14 0zm7-9a9 9 0 1 0 5.618 16.032l3.675 3.675a1 1 0 0 0 1.414-1.414l-3.675-3.675A9 9 0 0 0 11 2zm1 6a1 1 0 1 0-2 0v2H8a1 1 0 1 0 0 2h2v2a1 1 0 1 0 2 0v-2h2a1 1 0 1 0 0-2h-2V8z' fill='%23fff'/%3E%3C/svg%3E");
background-repeat: no-repeat;
background-position: center;
background-size: 20px;
backdrop-filter: blur(10px);
transition: all 0.2s ease;
pointer-events: none;
opacity: 0;
}
.js-slider-2-item .lslide:hover:after,
.js-slider-mini:hover .lslide::after,
.js-prestataire:hover .lslide::after,
.js-lightgallery:hover::after {
opacity: 1;
}
.listing-prestataire__list .js-prestataire .lslide::after {
display: none;
}
.lg-backdrop {
background-color: rgba(0,0,0,0.6);
}
.lg-outer .lg-thumb-item.active,
.lg-outer .lg-thumb-item:hover {
border-color: #EE743B;
}
.lg-outer .lg-thumb-item {
border-radius: 0;
}
/* ------------------------
INSTAFEED
------------------------ */
#instafeed {
display: flex;
flex-wrap: wrap;
background-color: #575756;
}
#instafeed a {
position: relative;
display: block;
width: 33.33%;
overflow: hidden;
}
#instafeed a:hover:before {
opacity: 1;
visibility: visible;
}
#instafeed a::before {
content: '';
position: absolute;
z-index: 1;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
background-color: rgba(238,116,59,0.4);
opacity: 0;
visibility: hidden;
transition: all 0.2s ease;
}
#instafeed a div {
position: relative;
height: 0;
width: 100%;
padding-bottom: 100%;
transition: all 0.2s ease;
}
#instafeed a div img {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
display: block;
width: 100%;
height: 100%;
object-fit: cover;
object-position: center;
transform: scale(1.1);
transition: all 0.2s ease;
}
#instafeed a:hover div img {
transform: scale(1);
}
/* ------------------------
RECHERCHE
------------------------ */
#recherche-nb-results {
margin:10px;
}
#recherche_resultats {
display:flex;
flex-wrap:wrap;
}
.recherche_resultat {
display:flex;
text-decoration:none;
width:48%;
margin:1%;
}
.recherche_resultat_photo_container {
width:32%;
margin:0 2% 1% 0;
}
.recherche_resultat_photo {
width:100%;
height:160px;
background-color:#ddd;
background-image:url('../images/placeholder.svg');
background-repeat:no-repeat;
background-size:cover;
background-position:center;
border-radius:5px;
}
.recherche_resultat_texte {
width:66%;
margin:0;
}
.recherche_resultat_texte h2 {
margin-top:0;
}
.recherche_resultat_resume {
font-size: 1.4rem;
color:#000;
font-weight:normal;
text-align:justify;
}
@media (max-width: 800px) {
#recherche_resultats {
display:block;
}
.recherche_resultat {
width:100%;
margin:1% 0;
}
.recherche_resultat_photo {
height:140px;
}
}
#mapid {
z-index: 1;
}
/* ------------------------
POPIN RECHERCHE
------------------------ */
#popin-recherche {
position:fixed;
z-index: 10;
top:0;
left:0;
width:100%;
height:100%;
background-color:rgba(255,255,255,0.7);
display:none;
}
#popin-recherche-content {
width:100%;
height:100%;
display:flex;
align-items: center;
justify-content: center;
}
@media (max-width: 800px) {
.recherche .champs {
display:flex;
flex-direction:column;
}
.recherche .champs input[type="text"] {
margin-bottom:10px;
width:100%;
}
}
#popin-recherche-content .recherche {
position:relative;
}
#recherche-close {
position:absolute;
top:-10px;
right:-10px;
background-color:#666;
padding:1px 6px;
color:#fff;
text-align:center;
border-radius:3px;
cursor:pointer;
}
/* ------------------------
EXCURSIONNISTES
------------------------ */
.excursion {
display:flex;
flex-wrap:no-wrap;
margin:auto;
margin-bottom:5px;
max-width:800px;
}
.excursion_title {
text-align:left;
font-size:16px;
flex:4;
padding:2px;
}
.excursion_day {
font-size:14px;
text-align:center;
flex:1;
padding:2px;
margin-left:1px;
display:flex;
align-items: center;
justify-content: center;
}
@media (max-width: 800px) {
.excursion_title {
flex:2;
font-size:14px;
}
}
/* ** alerte **/
#popin-alerte {
position: fixed;
z-index: 10000;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
padding: 10px;
background-color: rgba(0,0,0,0.6);
overflow-x: hidden;
overflow-y: auto;
outline: 0;
display: block;
}
#popin-alerte-content {
position:relative;
width:800px;
max-width:90%;
margin:auto;
height:fit-content;
max-height:75%;
margin-top:10%;
overflow-y:auto;
overflow-x:hidden;
background-color:#FFF;
border-radius: 4px;
padding:20px;
}
.popin-alerte-el {
margin:10px 0;
}
.popin-alerte-el h2 {
}
#popin-alerte-close {
display: inline-block;
text-decoration: none;
border-radius: 4px;
font-size: 1.6rem;
font-size: clamp(1.2rem, 1.0vw, 1.6rem);
padding: 5px 10px;
color: #c80032;
background-color: hsl(345, 100%, 90%);
border: none;
cursor: pointer;
transition: all 0.2s ease;
position:absolute;
right:-4px;
top:-4px;
}
#popin-alerte-close:hover {
color: #FFF;
background-color: #c80032;
}