@charset "utf-8";
/*++++++++++++ FONTS +++++++++++++*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Oxanium:wght@200..800&display=swap');
/*++++++++ BODY ET HTML ++++++++*/
/* ACTU */
.actu {
position: relative;
overflow: hidden;
border-radius: 0.75rem;
}
.vignette {
overflow: hidden;
position: relative;
padding: 0;
height: 250px;
display: flex;
justify-content: center;
align-items: center;
}
.vignette a {
height: 100%;
width: 100%;
}
.vignette img {
width: 100%;
height: 100%;
object-fit: contain;
object-position: center;
transition: all 0.4s;
opacity: 0.8;
}
.vignette:hover img {
transform: scale(1.5);
opacity: 0.4;
}
.btn-more::after {
content: '\2b';
font-family: "font Awesome 6 Pro";
padding: 0 0 0 0.25rem;
margin-left: 0;
transition: all 0.8s;
font-size: 0;
line-height: inherit;
vertical-align: middle;
}
.btn-more:hover::after {
font-size: inherit;
display: inline-block;
margin-left: 1.5rem;
}
.btn-more {
line-height: 1.5em;
}
.infos-actus-home .badge {
position: absolute;
left: 0;
top: -1rem;
}
.actu h3 {
font-size: 16px;
}
.actu ul {
font-size: 14px;
text-align: left;
padding: 0 2rem;
}
.actu ul li::marker {
color: var(--secondary);
}
/* BREADCRUMBS */
.breadcrumb-item + .breadcrumb-item::before {
color: var(--light);
content: ">";
vertical-align: middle;
line-height: 1.5em;
display: inline-block;
margin-bottom: -1.5em;
font-weight: 900;
margin-right: 0.15em;
font-size: 13px;
margin-left: -0.15em;
}
.breadcrumb-item.active {
color: var(--tertiary);
}
.breadcrumb-item a {
color: var(--primary);
}
.breadcrumb-item a:hover {
color: var(--tertiary);
}
/* BURGER */
.icon-bar {
width: 21px;
height: 3px;
background-color: var(--primary);
display: block;
transition: all 0.2s;
margin-top: 4px;
border-radius: 1rem;
}
.navbar-toggler:focus {
outline: 0px;
}
.navbar-toggler .top-bar {
transform: rotate(45deg);
transform-origin: 10% 190%;
background-color: var(--primary);
}
.navbar-toggler .middle-bar {
opacity: 0;
}
.navbar-toggler .bottom-bar {
transform: rotate(-45deg);
transform-origin: 10% -80%;
background-color: var(--primary);
}
.navbar-toggler.collapsed .top-bar {
transform: rotate(0);
background-color: var(--primary);
}
.navbar-toggler.collapsed .middle-bar {
opacity: 1;
}
.navbar-toggler.collapsed .bottom-bar {
transform: rotate(0);
background-color: var(--primary);
}
/* CARD */
.card {
border-radius: 2.5rem;
}
.card-img-top {
border-radius: 2.5rem 2.5rem 0 0;
}
.card-footer {
background-color: unset !important;
border: unset !important;
}
.card-body {
position: relative !important;
}
.card .badge-box {
width: 50%;
position: absolute;
top: 0%;
left: 50%;
transform: translate(-50%, -50%);
border: 1px solid var(--secondary);
}
.annuaire .card {
border: 1px solid var(--secondary) !important;
}
.card.sponsor {
border: 1px solid var(--secondary) !important;
overflow: hidden;
background-color: rgba(var(--secondaryRVB), 0.10);
}
.card.premium {
border: 1px solid var(--primary) !important;
overflow: hidden;
background-color: rgba(var(--primaryRVB), 0.10);
}
.sponsor::before, .premium::before, .urgent::before {
content: "";
position: absolute;
top: 0.5rem;
left: -3.5rem;
z-index: 999;
width: 8rem;
height: 3rem;
background: url(/img/logo-light.svg) center 60% no-repeat rgba(var(--secondaryRVB), 0.95);
background-size: 2rem 2rem;
transform: rotate(-45deg);
transform-origin: 50% 0;
}
.premium::before {
background-image: url(/img/logo.svg);
background-color: var(--primary);
}
.premium .premium-badge {
position: absolute;
top: 0.55rem;
left: 0.75rem;
width: 1.75rem;
height: 1.75rem;
transform: rotate(45deg);
}
.urgent::before {
content: "Urgent";
padding-top: 1.25rem;
background: rgba(var(--dangerRVB), 0.95);
text-align: center;
color: var(--light);
}
.text-transorm-normal {
text-transform: none !important;
}
/* DETAILS ACTU */
.header-actu {
background: var(--primary);
color: var(--light);
text-align: center;
padding: 3rem 0;
}
.header-actu a {
color: var(--secondary);
}
.header-actu h1 {
font-size: 2.2em;
font-weight: 900;
}
.header-actu .lead {
font-size: 1.3em;
}
.modal .close {
position: absolute;
right: -3rem;
background: var(--light);
z-index: 4;
top: -1rem;
padding: 0.5rem;
border-radius: 50%;
opacity: 1;
}
.modal-backdrop.show {
opacity: 0.6;
}
.modal-backdrop {
background-color: var(--primary);
}
/* DIVERS */
.bg-overlay {
position: absolute;
z-index: -1;
height: 100%;
width: 100%;
left: 0px;
background: rgb(1,1,99);
background: linear-gradient(0deg, rgba(1,1,99,1) 0%, rgba(1,1,99,0.05646008403361347) 79%);
}
body {
font-size: 17px;
background: #fff;
overflow-x: hidden;
}
.btn i {
vertical-align: sub;
font-size: 1.8em;
}
.card .badge.badge-pill, label {
cursor: pointer;
}
.clients a {
width: 100%;
min-height: 158px;
display: flex;
justify-content: center;
align-items: center;
}
.clients a:hover img {
filter: sepia(1);
-webkit-filter: sepia(1);
}
.clients a img {
transition: all 0.8s;
}
header {
height: 50vh;
z-index: -1;
}
.hero {
overflow: hidden;
position: relative;
color: #fff;
padding-bottom: 8rem;
padding-top: 4rem;
}
html, body {
scroll-behavior: smooth;
}
.img-fit-cover-center {
height: 100%;
object-fit: cover;
object-position: center;
width: 100%;
top: 0px;
left: 0px;
}
.logo {
height: auto;
max-width: 250px;
width: 100%;
transition: all 0.8s;
}
.page header {
height: auto;
z-index: inherit;
margin-bottom: 2rem;
}
.page .logo {
max-width: 200px;
}
.photo {
-webkit-mask-image: url(../img/masque-photos.svg);
mask-image: url(../img/masque-photos.svg);
mask-repeat: no-repeat;
mask-size: contain;
mask-position-x: 100%;
mask-position-y: 100%;
-webkit-mask-repeat: no-repeat;
-webkit-mask-size: contain;
-webkit-mask-position-x: 100%;
-webkit-mask-position-y: 100%;
color: #fff;
padding: 0;
}
.z-n3 {
z-index: -3;
}
.z-max {
z-index: 9999 !important;
}
/* FOOTER */
footer {
background: #010163;
padding: 7rem 0 3rem;
position: relative;
color: var(--light);
}
footer a {
color: var(--light);
}
.logo-footer {
max-width: 250px;
height: auto;
margin-bottom: 1rem;
}
#topcontrol {
width: 3.5rem;
height: 3.5rem;
border: 3px solid var(--white);
border-radius: 50%;
background: var(--secondary);
text-align: center;
font-size: 2rem;
color: var(--primary);
}
.mentions {
font-size: 13px;
text-align: center;
border-top: solid 2px rgba(var(--lightRVB),0.3);
padding-top: 3rem;
font-weight: 500;
}
.mentions .list-inline-item::after {
content: '|';
font-weight: 900;
font-size: 15px;
margin-left: 5px;
}
.mentions .list-inline-item:last-child::after {
content: '';
display: none;
}
/* ISOTOPE */
#filter .filter-flters li:hover, #filter .filter-flters li.filter-active {
color: #fff;
background: var(--primary);
border-color: var(--secondary);
}
.filter-flters li {
border: solid 0.025rem var(--primary);
transition: all 0.8s;
}
#filter .filter-flters li.filter-active {
background: var(--secondary);
color: var(--primary);
}
.filter-isotope a:not(.btn) {
color: var(--light);
}
.filter-isotope a:hover:not(.custom-select) {
color: var(--primary);
}
.actu .filter-wrap.card {
border: none;
background: var(--light);
border-radius: 2.5rem;
box-shadow: 0 0 1.5rem rgba(var(--lightRVB),0.9);
}
.actu .filter-wrap .vignette {
border-top-left-radius: 2.5rem;
border-top-right-radius: 2.5rem;
}
.actu {
position: relative;
overflow: hidden;
border-radius: 3rem;
}
/* LISTES */
.liste-stylisee {
list-style-type: none;
padding-left: 0.5rem;
}
.liste-stylisee li {
margin-bottom: 0.75em;
padding-left: 1.5em;
}
.liste-stylisee li:before {
content: "\f054";
margin-left: -1.5em;
margin-right: 0.75em;
font-size: 1.4rem;
line-height: 0;
display: inline-block;
font-weight: 900;
margin-top: 0.5rem;
color: var(--secondary);
font-size: 1em;
font-family: "Font Awesome 6 Pro";
transition: margin-left 0.1s ease-in-out;
}
.liste-stylisee li li {
margin-bottom: 0.25rem;
}
.liste-stylisee li li:before {
content: '•';
font-family: var(--font-family-titres);
font-size: 0.8em;
font-weight: 900;
}
.liste-stylisee ul {
list-style-type: none;
padding-left: 0;
font-size: 0.9em;
margin-top: 0.75rem;
}
footer .liste-stylisee li:hover:before {
margin-left: -1.25rem;
}
.list-inline.liste-stylisee li::before {
transform: none;
content: '|';
}
.mentions a {
color: var(--light);
}
.mentions a:hover {
color: var(--secondary);
}
.liste-num {
counter-reset: numbers;
padding-left: 0;
margin: 2rem auto;
}
.liste-num li {
list-style-type: none;
counter-increment: numbers;
margin-bottom: 1.25rem;
padding-left: 35px;
line-height: 1.3em;
}
.liste-num li:before {
content: counter(numbers);
padding: 0.15em 0.5em;
vertical-align: top;
background: var(--secondary);
font-weight: 600;
font-size: 1em;
color: white;
margin-left: -35px;
border-radius: 50%;
margin-right: 7px;
position: relative;
display: inline-block;
min-width: 10px;
text-align: center;
height: 1.65em;
width: 1.65em;
border: dotted 1px;
position: absolute;
}
.liste-num li ol li::before, .liste-num li ul li::before {
content: "•" !important;
background: none !important;
margin-left: -1em !important;
padding: 0 !important;
color: var(--secondary) !important;
width: 10px;
height: auto;
margin-right: 5px;
border: none;
}
.liste-num li ol li, .liste-num li ul li {
margin-left: -2em;
padding-left: 30px;
line-height: 1.2em;
margin-bottom: 0.5rem;
font-size: 0.9em;
}
.liste-num li ul, .liste-num li ol {
padding-left: 0;
margin-top: 0.5rem;
font-size: .9em;
}
/* NAVBAR */
.fixed-top {
top: -40px;
transform: translateY(40px);
transition: transform .3s;
}
.navbar-brandnavbar-brand {
min-width: 220px;
}
.nav-item.consult {
padding-right: 0.5rem;
padding-left: 0.5rem;
display: flex;
align-items: center;
font-size: 0.8rem;
font-weight: 800;
color: var(--primary);
}
.nav-item.consult::after {
content: '\e4b1';
font-size: 1.4rem;
color: var(--secondary);
font-family: "Font Awesome 6 Pro";
padding-left: 0.5rem;
}
#navbar_top.fixed-top {
background: rgba(var(--secondaryRVB), 0.95);
height: 60px;
width: 90vw;
margin-left: 5vw;
margin-right: 5vw;
border-bottom-right-radius: 0.5rem;
border-bottom-left-radius: 0.5rem;
position: fixed;
}
#navbar_top.fixed-top .nav-link {
font-size: 0.75rem;
color: var(--light);
}
#navbar_top.fixed-top .logo {
display: none;
}
.fixed-top .navbar-brandnavbar-brand {
background: url(../img/logo-plast2bee-light.png) no-repeat center center;
background-size: 55%;
height: 100%;
width: 10%;
}
.fixed-top .navbar-collapse.collapse.show {
background: var(--secondary);
box-shadow: 0 2rem 3rem rgba(104,104,104, 0.3);
margin-top: -3px;
left: 0;
padding: 1rem;
border-radius: 1rem;
border-left: solid var(--light);
border-right: solid var(--light);
border-bottom: solid var(--light);
}
.navbar-nav .show > .nav-link, .navbar-nav .active > .nav-link, .navbar-nav .nav-link.show, .navbar-nav .nav-link.active {
color: var(--secondary);
}
.navbar {
flex-wrap: wrap;
position: relative;
z-index: 1000;
width: 100vw;
left: 0;
}
.fixed-top .navbar-nav {
align-items: center !important;
}
.navbar.fixed-top {
flex-wrap: inherit;
}
.navbar.fixed-top .col-xl-12.col-9.p-0 {
max-width: 20vw;
}
.navbar-nav .nav-item .nav-link, .navbar-dark .navbar-nav .nav-item.active .nav-link, .navbar-dark .navbar-nav .nav-item .nav-link:hover {
color: var(--light);
font-size: 0.9em;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.02em;
transition: all 0s;
border: dotted 0.2em transparent;
border-radius: 1.5rem;
}
.navbar-nav .nav-item .nav-link:hover, .overlap .navbar-nav .nav-item.active .nav-link {
background: rgba(var(--primaryRVB),0.6);
border-bottom-color: var(--light);
padding-left: 0.5rem;
}
.navbar-dark .navbar-nav .nav-item .nav-link {
color: var(--dark);
}
.navbar-dark .navbar-nav .nav-item.active .nav-link, .navbar-dark.overlap .navbar-nav .nav-item .nav-link:hover {
border-bottom-color: var(--secondary);
}
.fixed-top .navbar-nav .nav-item .nav-link {
color: inherit;
}
.navbar-collapse.show, .navbar-collapse.show .dropdown .dropdown-menu {
background: rgba(var(--primaryRVB),0.2);
}
.navbar-collapse .nav-link {
color: var(--light);
}
.navbar-collapse.show {
background: transparent;
}
.fixed-top .navbar-collapse.collapse.show {
position: absolute;
width: 100%;
top: 60px;
}
.dropdown-menu {
margin-top: 0;
border: none;
box-shadow: none;
background: rgba(var(--whiteRVB), 0.95);
border-radius: 0.25rem;
}
.dropdown-item {
color: var(--dark);
border-radius: 0;
white-space: normal;
min-width: 250px;
line-height: 1.2em;
border-bottom: none;
padding: 0.05rem 1.5em;
font-size: 0.9em;
font-weight: 500;
}
.dropdown-item::after {
content: '';
margin-left: 0;
line-height: 0;
display: block;
margin-top: 0.25rem;
margin-bottom: 0.5rem;
transition: all 0.6s;
width: 0.5rem;
height: 5px;
background: var(--primary);
border-radius: 1.5rem;
position: relative;
left: 0;
opacity: 0;
}
.dropdown-item:hover::after, .dropdown-item.active::after {
width: 100%;
opacity: 1;
}
.dropdown-menu li {
padding: 0 1rem;
}
.dropdown-item:hover, .dropdown-item.active, .dropdown-item:active {
color: var(--secondary) !important;
border-color: var(--light);
background: transparent !important;
}
.navbar-nav .nav-link {
color: #fff;
font-size: 0.9em;
text-transform: uppercase;
}
.dropdown-toggle::after {
display: inline-block;
margin-left: 0.5em;
vertical-align: middle;
content: "\f13a";
font-size: 20px;
border: none;
line-height: 0;
font-weight: 900;
font-family: "Font Awesome 6 Pro";
transition: all 0.4s;
transform: rotate(-90deg);
}
.dropdown:hover > .dropdown-toggle::after {
transform: rotate(0deg);
}
.top-bar {
font-size: 14px;
}
/* PAGINATION */
:root, ::before, ::after {
--pagination-border-width: 3px;
--pagination-border-color: Transparent;
--pagination-hover-border-color: var(--secondary);
--pagination-jumper-hover-color: var(--pagination-color);
--pagination-jumper-hover-bg-color: var(--light);
}
.pagination-control .page-item .page-link {
margin: 0;
border-radius: calc(var(--pagination-inner-height) / 2 + var(--pagination-border-width));
}
.pagination-control .page-item.active .page-link {
border-color: var(--pagination-hover-border-color);
}
/* PANIER TOP */
li.cart-icon {
position: relative;
}
li.cart-icon:hover .cart-hover {
opacity: 1;
visibility: visible;
top: 40px;
z-index: 3000;
}
li.cart-icon.nav-item a.nav-link {
color: var(--secondary);
position: relative;
display: inline-block;
}
.cart-icon .nav-link {
padding: 0.5rem;
}
li.cart-icon .cart-hover {
position: absolute;
right: -3.5rem;
top: -1rem;
min-width: 250px;
background: #ffffff;
z-index: 99;
text-align: left;
padding: 30px;
opacity: 0;
visibility: hidden;
-webkit-box-shadow: 0 13px 32px rgb(51 51 51 / 10%);
box-shadow: 0 13px 32px rgb(51 51 51 / 10%);
z-index: 3000;
}
li.cart-icon .cart-hover .select-items table {
width: 100%;
}
li.cart-icon .cart-hover .select-items table tr td {
padding-bottom: 20px;
}
li.cart-icon .cart-hover .select-items table tr td.si-close {
color: #252525;
font-size: 16px;
cursor: pointer;
}
li.cart-icon .cart-hover .select-total {
overflow: hidden;
border-top: 1px solid #e5e5e5;
padding-top: 26px;
margin-bottom: 30px;
}
li.cart-icon .cart-hover .select-total span {
font-size: 14px;
color: var(--primary);
text-transform: uppercase;
letter-spacing: 0.5px;
float: left;
}
li.cart-icon .cart-hover .select-total h5 {
color: var(--primary);
float: right;
}
.cart-hover::before {
content: '';
display: block;
position: absolute;
width: 0;
border-right: 10px solid transparent;
border-bottom: 20px solid #fff;
border-left: 10px solid transparent;
top: -20px;
left: 42%;
}
/* SLICK */
.slick-slider {
position: relative;
display: block;
box-sizing: border-box;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-ms-touch-action: pan-y;
touch-action: pan-y;
-webkit-tap-highlight-color: transparent;
}
.slick-list {
position: relative;
overflow: hidden;
display: block;
margin: 0 2.2rem;
}
.slick-list:focus {
outline: none;
}
.slick-list.dragging {
cursor: grabbing;
}
.slick-slider .slick-track, .slick-slider .slick-list {
-webkit-transform: translate3d(0, 0, 0);
-moz-transform: translate3d(0, 0, 0);
-ms-transform: translate3d(0, 0, 0);
-o-transform: translate3d(0, 0, 0);
transform: translate3d(0, 0, 0);
}
.slick-track {
position: relative;
left: 0;
top: 0;
display: flex;
margin-left: auto;
margin-right: auto;
align-items: start;
}
.slick-track:before, .slick-track:after {
content: "";
display: table;
}
.slick-track:after {
clear: both;
}
.slick-loading .slick-track {
visibility: hidden;
}
.slick-slide {
float: left;
height: 100%;
min-height: 1px;
display: none;
padding: 0 1rem;
}
[dir="rtl"] .slick-slide {
float: right;
}
.slick-slide img {
display: block;
transition: all 0.8s;
}
#clients .slick-slide img:hover {
filter: none;
-webkit-filter: none
}
.slick-slide.slick-loading img {
display: none;
}
.slick-slide.dragging img {
pointer-events: none;
}
.slick-initialized .slick-slide {
display: block;
}
.slick-loading .slick-slide {
visibility: hidden;
}
.slick-vertical .slick-slide {
display: block;
height: auto;
border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
display: none;
}
/* STYLES DE TEXTE */
a:hover, a:focus, a:active {
text-decoration: none !important;
outline: none !important;
box-shadow: none;
}
.active, .active:hover {
cursor: default;
}
h1, .h1 {
font-size: 5em;
font-weight: 900;
line-height: 1.2em;
white-space: normal;
}
header h1 {
font-size: 4rem !important;
}
h2, .h2 {
font-size: 2.25em;
font-weight: 900;
line-height: 1.2em;
font-family: var(--font-family-titres);
text-transform: uppercase;
letter-spacing: 0;
margin-bottom: 3.5rem;
}
h3, .h3 {
font-size: 2em;
font-weight: 700;
line-height: 1.05em;
font-family: var(--font-family-titres);
text-transform: none;
letter-spacing: 0;
}
h4, .h4 {
font-size: 1.6em;
font-weight: 800;
line-height: 1.1em;
font-family: var(--font-family-titres);
letter-spacing: 0;
}
h5, .h5 {
font-size: 1.2em;
font-weight: 700;
letter-spacing: 0.025em;
line-height: 1.1em;
font-family: var(--font-family-titres);
text-transform: uppercase;
letter-spacing: 0;
}
h6, .h6 {
font-size: 1.1em;
font-weight: 900;
line-height: 1em;
text-transform: uppercase;
font-family: var(--font-family-titres);
letter-spacing: 0;
}
.surligne {
display: inline-block;
padding: 0.75rem 1rem 0.25rem;
border-radius: 3rem;
position: relative;
text-align: center;
}
.surligne::before {
content: '';
background: var(--secondary);
width: 100%;
height: 50%;
position: absolute;
z-index: -1;
bottom: -0.05em;
left: 0;
border-radius: 1.5rem;
}
.display-5 {
font-size: 2.5rem;
line-height: 1.2;
}
.display-6 {
font-size: 1.5rem;
line-height: 1.2;
}
.lead {
line-height: 1.8rem;
font-weight: 500;
font-size: 1.6em;
font-family: var(--font-family-sans-serif);
}
/*++++++++ MEDIAS QUERIES ++++++++*/
@media only screen and (min-width:979px) {
.dropdown:hover .dropdown-menu {
display: block;
}
}
@media (min-width:1280px) {
.dropdown .dropdown-menu {
display: block;
visibility: hidden;
opacity: 0;
transform: translateY(20px);
}
.dropdown:hover > .dropdown-menu {
visibility: visible;
opacity: 1;
transform: scaleY(1);
}
}
@media only screen and (min-width:1980px) {
body {
font-size: 18px;
}
}
@media only screen and (max-width:640px) {
body {
font-size: 12px;
}
}
@media only screen and (max-width:800px) {
body {
font-size: 13px;
}
}
@media only screen and (max-width:980px) {
body {
font-size: 13px;
}
.logo {
max-width: 150px;
}
}
@media only screen and (max-width:1023px) {
.navbar {
border-top: solid 2px var(--light);
}
h1, .h1 {
font-size: 8vw;
}
header h1 {
font-size: 8vw !important;
margin-bottom: -1rem;
}
h2, .h2 {
font-size: 6vw;
}
}
@media only screen and (max-width:1279px) {
body {
font-size: 14px;
}
}
/*++++++++ MODIF ALEX P ++++++++*/
/* DIVERS */
.card.selected .card-body {
background-color: rgba(var(--primaryRVB), 0.10);
}
.choose-switch {
cursor: pointer;
}
.float-left {
float: left !important;
}
.float-right {
float: right !important;
}
.formula-selection {
display: none !important;
}
.formula-selection + label {
cursor: pointer;
}
.formula-selection:checked + label {
background-color: rgba(var(--primaryRVB), 0.1);
}
.sticky-top {
top: 8vh !important;
}
.sticky-top {
z-index: 1 !important;
}
.tva-switch-option {
cursor: pointer;
}
.vertical-align {
vertical-align: text-bottom;
}
.vertical-align-middle {
vertical-align: middle;
}
#infoPrivate .liste-stylisee li, #infoPro .liste-stylisee li {
margin-bottom: 0.15em !important;
padding-left: 0.5em !important;
font-size: 0.90rem !important;
}
#inputPassword {
box-sizing: content-box !important;
}
img[src^="https://i.ytimg.com/vi/"] {
aspect-ratio: 16/9;
object-fit: cover !important;
}
/* FANCYBOX */
.fancy-gallery .photo-item {
position: relative;
}
.fancy-gallery .photo-item .photo-text-more {
position: absolute;
z-index: 3;
top: 50%;
left: 50%;
width: 100%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
margin-top: 30px;
-webkit-transition: .3s all ease;
-o-transition: .3s all ease;
transition: .3s all ease;
opacity: 0;
visibility: hidden;
text-align: center;
}
.fancy-gallery .photo-item img {
width: 100%;
max-height: 480px;
-o-object-fit: contain;
object-fit: contain;
}
.fancybox-button svg path {
stroke: var(--secondary) !important;
stroke-linejoin: round;
stroke-width: 2 !important;
}
.fancybox-thumbs {
background: #000 !important;
}
.fancybox-thumbs > ul > li:before {
border: 4px solid var(--secondary) !important;
}
.fancybox-button.disabled svg path, .fancybox-button.disabled:hover svg path, .fancybox-button[disabled] svg path, .fancybox-button[disabled]:hover svg path {
color: #888 !important;
stroke: #888 !important;
cursor: default;
}
.fancy-gallery .photo-item:hover .photo-text-more {
margin-top: 0;
opacity: 1;
visibility: visible;
}
.fancybox-navigation .fancybox-button {
background-color: transparent !important;
}
.fancybox-navigation .fancybox-button svg {
width: 50px;
height: 50px;
}
.fancybox-navigation .fancybox-button--arrow_right {
right: 3rem !important
}
.fancybox-navigation .fancybox-button--arrow_left {
left: 1.5rem !important;
}
/* FIXED TOP */
.fixed-top .btn-secondary {
background-color: var(--primary);
}
.fixed-top .btn-secondary:hover {
color: var(--light);
background-color: rgba(var(--primaryRVB),0.7);
border-color: var(--primary);
}
.fixed-top .nav-item.consult::after {
color: var(--primary);
}
/* INPUT FILE */
.file-upload-button, .file-upload-input {
font-size: 0.9rem;
border: none;
float: left;
font-family: var(--font-condensed-sans-serif);
font-weight: 400
}
.custom-file-upload-hidden {
display: none;
visibility: hidden;
}
.file-upload-wrapper {
position: relative;
margin-bottom: 5px;
display: flex;
flex-direction: row
}
.file-upload-input {
width: 0%;
padding: 0px;
background: rgba(var(--gray-lightRVB),0.15);
-moz-transition: .2s ease-in;
-o-transition: .2s ease-in;
-webkit-transition: .2s ease-in;
transition: .2s ease-in;
color: var(--primary);
border-top-left-radius: 1.5rem;
border-bottom-left-radius: 1.5rem;
}
.file-upload-input:focus, .file-upload-input:hover {
background-color: var(--secondary);
outline: 0
}
.file-upload-button {
cursor: pointer;
display: inline-block;
color: var(--secondary);
text-transform: uppercase;
padding: 11px 5px;
margin-left: -1px;
background-color: unset;
-moz-transition: .2s ease-in;
-o-transition: .2s ease-in;
-webkit-transition: .2s ease-in;
transition: .2s ease-in;
width: 100%;
border-radius: 1.5rem;
border: 1px solid var(--secondary) !important;
text-align: center;
}
.file-delete-button {
float: right;
margin-top: 1px;
margin-right: 5px;
border-radius: 50%;
padding: 5px;
transition: 0.2s ease-in;
}
.file-upload-button:hover {
border-color: var(--primary) !important;
color: var(--primary) !important;
}
.file-upload-button:hover .file-delete-button {
background-color: var(--gray-light);
color: var(--primary);
}
.inputFilePhoto button {
aspect-ratio: 1 / 1 !important;
}
/* PANIER BOX */
.panier-box {
position: fixed;
bottom: 40vh;
right: 0;
display: block;
width: 100px;
height: 100px;
cursor: pointer;
z-index: 999999;
background: var(--secondary) !important;
border-top-left-radius: 25px;
border-bottom-left-radius: 25px;
}
.panier {
user-select: none;
position: absolute;
top: 25%;
left: 30%;
color: var(--white);
}
/* SLIDING MODAL */
.modal-dialog.modal-dialog-slideout {
max-width: 40%;
}
.modal-dialog.modal-dialog-slideout .modal-body {
overflow-y: scroll;
}
.modal-dialog-slideout .modal-content {
background-color: var(--light) !important;
border: 0;
}
.dark-theme .modal-dialog-slideout .modal-content {
background-color: var(--dark) !important;
border: 0;
color: var(--white);
}
.modal.fade .modal-dialog.modal-dialog-slideout {
-webkit-transform: translate(100%, 0)scale(1);
transform: translate(100%, 0)scale(1);
margin: 0 0 0 auto;
}
.modal.fade.show .modal-dialog.modal-dialog-slideout {
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
display: flex;
align-items: stretch;
-webkit-box-align: stretch;
height: 100%;
}
.modal-dialog-slideout .modal-header {
height: 10vh;
border: none;
}
.modal-dialog-slideout .close {
font-size: 5rem !important;
color: var(--primary) !important;
opacity: 1;
text-shadow: unset !important;
right: unset !important;
top: unset !important;
background-color: unset !important;
}
/* SWITCH XL */
.custom-switch.custom-switch-lg {
padding-bottom: 1rem;
padding-left: 2.25rem;
}
.custom-switch.custom-switch-lg .custom-control-label {
padding-left: 0.75rem;
padding-top: 0.15rem;
}
.custom-switch.custom-switch-lg .custom-control-label::before {
border-radius: 1rem;
height: 1.5rem;
width: 2.5rem;
}
.custom-switch.custom-switch-lg .custom-control-label::after {
border-radius: 0.65rem;
height: calc(1.5rem - 4px);
width: calc(1.5rem - 4px);
}
.custom-switch.custom-switch-lg .custom-control-input:checked ~ .custom-control-label::after {
transform: translateX(1rem);
}
/* MEDIAS QUERIES */
@media (max-width:575.98px) {
.fancy-gallery .photo-item img {
height: 200px;
}
}
/* TABLEAUX */
table {
border-collapse: collapse;
}
.table {
width: 100%;
margin-bottom: 1rem;
}
.table th, .table td {
padding: 0.75rem;
vertical-align: top;
border-top: 1px solid var(--light);
}
.table thead th {
vertical-align: bottom;
border-bottom: 2px solid var(--light);
text-transform: uppercase;
font-size: 0.85em;
}
.table tbody + tbody {
border-top: 2px solid var(--light);
}
.table-striped tbody tr:nth-of-type(odd) {
background-color: var(--light);
color: var(--dark);
}
.table-hover tbody tr:hover {
color: var(--dark);
background-color: rgba(0, 0, 0, 0.075);
}
.table-light thead th {
background-color: var(--gray-dark);
color: var(--light)
}
.table-light th, .table-light td, .table-light thead th, .table-light tbody + tbody {
border-color: var(--gray-light);
}
.table-hover .table-light:hover {
background-color: var(--gray-light);
color: var(--gray);
}
.table-hover .table-light:hover > td, .table-hover .table-light:hover > th {
background-color: var(--gray-light);
color: var(--gray);
}
.table .thead-light th {
color: var(--gray);
background-color: var(--light);
border-color: var(--light);
}
.table-hover tbody tr:hover, .table-striped tbody tr:hover {
color: var(--dark);
background-color: var(--light);
}
.table-responsive {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-responsive > .table-bordered {
border: 0;
}
@media (max-width: 575.98px) {
.table-responsive-sm {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-responsive-sm > .table-bordered {
border: 0;
}
}
@media (max-width: 767.98px) {
.table-responsive-md {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-responsive-md > .table-bordered {
border: 0;
}
}
@media (max-width: 991.98px) {
.table-responsive-lg {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-responsive-lg > .table-bordered {
border: 0;
}
}
@media (max-width: 1199.98px) {
.table-responsive-xl {
display: block;
width: 100%;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
}
.table-responsive-xl > .table-bordered {
border: 0;
}
}
/* MESSAGE */
div.message-control > div {
background-color: White;
}
