@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-ExtraBold.woff2') format('woff2'),
        url('../font/Poppins-ExtraBold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-SemiBoldItalic.woff2') format('woff2'),
        url('../font/Poppins-SemiBoldItalic.woff') format('woff');
    font-weight: 600;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-ExtraLightItalic.woff2') format('woff2'),
        url('../font/Poppins-ExtraLightItalic.woff') format('woff');
    font-weight: 200;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-BlackItalic.woff2') format('woff2'),
        url('../font/Poppins-BlackItalic.woff') format('woff');
    font-weight: 900;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-BoldItalic.woff2') format('woff2'),
        url('../font/Poppins-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-ThinItalic.woff2') format('woff2'),
        url('../font/Poppins-ThinItalic.woff') format('woff');
    font-weight: 100;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-MediumItalic.woff2') format('woff2'),
        url('../font/Poppins-MediumItalic.woff') format('woff');
    font-weight: 500;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-Italic.woff2') format('woff2'),
        url('../font/Poppins-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-Light.woff2') format('woff2'),
        url('../font/Poppins-Light.woff') format('woff');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-LightItalic.woff2') format('woff2'),
        url('../font/Poppins-LightItalic.woff') format('woff');
    font-weight: 300;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-ExtraLight.woff2') format('woff2'),
        url('../font/Poppins-ExtraLight.woff') format('woff');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-Black.woff2') format('woff2'),
        url('../font/Poppins-Black.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-SemiBold.woff2') format('woff2'),
        url('../font/Poppins-SemiBold.woff') format('woff');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-Medium.woff2') format('woff2'),
        url('../font/Poppins-Medium.woff') format('woff');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-ExtraBoldItalic.woff2') format('woff2'),
        url('../font/Poppins-ExtraBoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-Regular.woff2') format('woff2'),
        url('../font/Poppins-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-Thin.woff2') format('woff2'),
        url('../font/Poppins-Thin.woff') format('woff');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Poppins';
    src: url('../font/Poppins-Bold.woff2') format('woff2'),
        url('../font/Poppins-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Century Gothic';
    src: url('../font/CenturyGothic-Bold.woff2') format('woff2'),
        url('../font/CenturyGothic-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../font/CenturyGothic.woff2') format('woff2'),
        url('../font/CenturyGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Century Gothic';
    src: url('../font/CenturyGothic-Italic..woff2') format('woff2'),
        url('../font/CenturyGothic-Italic..woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}
@font-face {
    font-family: 'Century Gothic';
    src: url('../font/CenturyGothic-BoldItalic..woff2') format('woff2'),
        url('../font/CenturyGothic-BoldItalic..woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../font/CenturyGothic-BoldItalic.woff2') format('woff2'),
        url('../font/CenturyGothic-BoldItalic.woff') format('woff');
    font-weight: bold;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../font/CenturyGothic.woff2') format('woff2'),
        url('../font/CenturyGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../font/CenturyGothic-Italic.woff2') format('woff2'),
        url('../font/CenturyGothic-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
}

@font-face {
    font-family: 'Century Gothic';
    src: url('../font/CenturyGothic-Bold.woff2') format('woff2'),
        url('../font/CenturyGothic-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}


@media screen and (max-width: 1600px ){
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}

* {
    -webkit-box-sizing: inherit;
    -moz-box-sizing: inherit;
    box-sizing: inherit;
}
.row > div{
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
html {
	font-size: 100%;
}

@media screen and (max-width: 1600px ){
            html { font-size:85%; }
    @media screen and (max-width: 1200px){
        html { font-size:80%; }
        @media screen and (max-width: 992px){
            html { font-size: 75%; }
            @media screen and (max-width: 768px){
                html { font-size: 75%; }
                @media screen and (max-width: 576px){ 
                }
            }
        }
    }
}
body {
	background-color: #fff;
	color: #000;
    font-family: "Poppins", helvetica, arial, sans-serif;
	font-size: .9rem; /* equiv 14px */
	line-height: 1.5; /* adapt to your design */
}

@media screen and (max-width: 992px){
    body { font-size: 1rem; }
    @media screen and (max-width: 768px){
        body {
        font-size: 1rem; /* equiv 14px */
        }
        
    }
}

/* font-sizing for content */
/* preserve vertical-rythm, thanks to http://soqr.fr/vertical-rhythm/ */
p,
ul,
ol,
dl,
blockquote,
pre,
td,
th,
label,
textarea,
caption,
details, 
figure, 
hgroup {
/*	font-size: 1.15rem; */ /* equiv 14px */
font-size: .9rem;
	line-height: 1.3rem;
	margin: 1.5rem 0 0;
    
    word-break: normal;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  -o-hyphens: none;
  hyphens: none;
}
h1, .h1-like {
	font-size: 2.6rem; /* equiv 26px */
	font-weight: normal;
	line-height: 2.6rem;
	margin: 1rem 0 0 0;
}
h2, .h2-like {
	font-size: 2.4rem; /* equiv 24px */
	font-weight: normal;
	line-height: 4rem;
	margin: 1.1rem 0 0 0;
}
h3, .h3-like {
	font-size: 1.75rem; /* equiv 22px */
	font-weight: normal;
	line-height: 3.2rem;
	margin: 1rem 0 0 0;
}
h4, .h4-like {
	font-size: 1.5rem; /* equiv 20px */
	font-weight: normal;
	line-height: 1.8rem;
	margin:  1.05rem 0 0 0;
}
h5, .h5-like {
	font-size: 1.3rem; /* equiv 18px */
	font-weight: normal;
	line-height: 1.4rem;
	margin:  1.1667rem 0 0 0;
}
h6, .h6-like {
	font-size: 1rem; /* equiv 16px */
	font-weight: normal;
	line-height: 1.5rem;
	margin:  1rem 0 0 0;
}

/* alternate font-sizing */
.smaller {
	font-size: 1rem; /* equiv 10px */
	line-height: 2rem;
}
.small {
	font-size: 1.2rem; /* equiv 12px */
	line-height: 2rem;
}
.big {
	font-size: 1.6rem; /* equiv 16px */
	line-height: 1.5rem;
}
.bigger {
	font-size: 1.8rem; /* equiv 18px */
	line-height: 1.6rem;
}
.biggest {
	font-size: 2rem; /* equiv 20px */
	line-height: 1.8rem;
}

/* soft reset */
html,
body,
textarea,
figure,
label {
	margin: 0;
	padding: 0;
}
ul,
ol {
	padding-left: 2rem;
    padding-right: 2rem;
}
code, 
pre,
samp {
	white-space: pre-wrap;
	font-family: consolas, 'DejaVu Sans Mono', courier, monospace;
}
code { line-height: 1.4rem; }
table { margin-bottom: 1.5rem; }

/* avoid top margins on first content element */
/*p:first-child,
ul:first-child,
ol:first-child,
dl:first-child,
blockquote:first-child,
pre:first-child,
h1:first-child,
h2:first-child,
h3:first-child,
h4:first-child,
h5:first-child,
h6:first-child {
	margin-top: 0;
}*/

/* avoid margins on nested elements */
li p,
li ul,
li ol {
	margin-top: 0;
	margin-bottom: 0;
}

/* HTML5 tags */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
	display: block;
}

/* max values */
img, table, td, blockquote, code, pre, textarea, input, video {
	max-width: 100%;
}

/* you shall not pass */
div, textarea, table, td, th, code, pre, samp {
	word-wrap: break-word;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	-o-hyphens: auto;
	hyphens: auto;
}

/* pictures */
img {
	width: auto;
	height: auto;
	vertical-align: middle;
}
a img { border: 0; }

/* scripts */
body > script {display: none !important;}

/* skip-links */
.skip-links {
	position: absolute;
}
.skip-links a {
	position: absolute;
	left: -9999px;
	padding: 0.5rem;
	background: #000;
	color:#fff;
	text-decoration: none;
}
.skip-links a:focus {
	position: static;
}

/* Firefox */
input[type=number] {
    -moz-appearance:textfield;
  }
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}


header {
  /*  box-shadow: 1px 5px 19px 0 rgba(0, 0, 255, 0.2);*/
    padding-bottom: 0;
    position: relative;
}
@media screen and (max-width: 768px){
    header { position: absolute; top: 0; z-index: 9996;}
}

header .logo-container {
    text-align: center;
    font-weight: 900;
    font-style: italic;
    padding: 30px 10px 0;
    background: #fff; 
    padding-bottom: 40px;
    margin-bottom: 0;
    position: relative;
}
header .logo-container a{
    position: absolute;
    left: 2%;
}
header .logo-container h3{
    color: #1c2667;
    margin: 0;
    line-height: inherit;
    font-size: 2.4rem;
    font-family: 'Poppins';
    font-style: normal;
    font-weight: 600;
    margin-top: 15px; 
    display: inline-block;
}
header .logo-container h3 span{
    color: #51c5a1;
}
header .nav{
    transition: all ease 500ms;
    background-color: #fff;
    line-height: 1.75rem;
}
@media screen and (max-width: 768px){
    
header .logo-container a{
    position: relative;
    left: inherit;
    display: inline-block;
}
header .logo-container h3{
    display: block;
}
header {overflow: hidden;}
    header .logo-container {  margin-bottom: 0; }
    .nav{ width: 100%;}
    .fixedhead{
        height: 0;
    }
.fixedhead{
    position: fixed;
    top: 0;
    max-height: 0;
}
    .headshow{
        height: auto !important;
        max-height: inherit !important;
        background-color: #fff;
    }
}
header .nav.list-item {
    margin: auto;
    display: flex;
    align-items: center;
    justify-content: space-around;
    font-size: 1.4rem;
    max-width: 1300px;
    color: #576f8a;
    flex-wrap: wrap;
}

header .nav.list-item {
    margin-top: 0;
    padding: 0 2rem;
    list-style: none;
    height: auto;
}

@media screen and (max-width: 1200px){
    header .nav.list-item{font-size: 15px;}
    @media screen and (max-width: 992px){
        header .nav.list-item{font-size: 15px;}
        @media screen and (max-width: 768px){
            header .nav.list-item{font-size: 18px;}
            header .nav.list-item .item-menu{  width: 100%; text-align: center; }
            header .nav.list-item{position: relative;}
        }
    }
}
header .nav.list-item a {
  /* color: #337ab7; */
    color: #1c2667;
    text-decoration: none;
    padding: .6rem 15px;
display: block;
height: 2rem;
font-family: 'Poppins';
box-sizing: content-box;
    }

.nav.list-item .item-menu.active a{
    color: #51c5a1;
    font-weight: 600;
}
    header .nav.list-item .img-head a {
        padding-top: 0;
    }
    
.nav.list-item .item-menu:hover {
   font-weight: 700 
}

.item-menu .img-drap {
    border-radius: 50%;
    width: auto;
    height: 23px;
}
@media screen and (max-width: 992px){
    header .nav.list-item a{padding: 8px 5px;}
    @media screen and (max-width: 768px){
        @media screen and (max-width: 576px){
            
        }
    }
}
.mentionsleg{
    position: relative;
    top: 20%;
    left: 5%;
    text-decoration: none;
}
.reseaux{
    position: absolute;
    right: 2%;
    top: 20%;
}

.reseaux ul{
    margin: 0;
    padding: 0;
}
.reseaux .img-head{
    text-decoration: none;
    display: inline-block;
}
.reseaux .img-head a{
    padding: 0;
}
.reseaux .img-head a img{
    width: 50px;
   height: 50px;
  /*  filter: grayscale(75%);
    -webkit-filter: grayscale(75%);
    -moz-filter: grayscale(75%);
    -ms-filter: grayscale(75%);
    -o-filter: grayscale(75%); */ 
}
.imgsit{
    width: 50px;
}
.imgdev{
    width: 40px;
}
.reseaux .img-head a img:hover{
 /*   filter: grayscale(0%);
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%); */
}

@media screen and (max-width: 1600px ){
    header .logo-container h3{ font-size: 2.1rem; }
    @media screen and (max-width: 1200px){
        header .logo-container h3{ font-size: 2rem; }
        .reseaux{top: 25%; right: 1%;}
        .reseaux .img-head a img{width: 30px; height: 30px;}
        @media screen and (max-width: 992px){
            header .logo-container h3{margin-top: 0rem;
                display: inline-block;
                margin-bottom: 0;}
                .reseaux{top: 39%;}
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
@media screen and (max-width: 768px){
    .reseaux{ position: relative; margin-bottom: 15px; margin-top: 5px; right: 0;}
    .reseaux ul{ width: auto; text-align: center;}
    .reseaux ul li{margin-left: 10px; margin-right: 10px;}
    .reseaux .img-head a img{
    /*    filter: grayscale(0%);
-webkit-filter: grayscale(0%);
-moz-filter: grayscale(0%);
-ms-filter: grayscale(0%);
-o-filter: grayscale(0%);*/
    }
}
.logodiv{
text-align: center;
padding-top: 30px;
padding-bottom: 30px;
display: none;
}
#menu{display: none;}
.logoimg{
    height: 90px;
}

@media screen and (max-width: 768px){
    .logoimg{
        max-width: 50%;
        height: auto;
        max-height: 80px;
    }
}
.filterside{
    position: fixed;
width: 20%;
overflow-x: auto;
overflow-x: hidden;
height: 100vh;
}
#filtres{
    width: 100%;
    min-height: 100vh;
    /*  background-color: #fafbfc;  */
    background-color: #fff;
    position: relative;
top: -1px;
float: left;  
}
#gestmodal{ 
display: flex; 
cursor: pointer;
border-top-right-radius: 15px;
border-bottom-right-radius: 15px;
flex-direction: column;
width: 50px;
justify-content: center;
align-items: center;
position: absolute;
right: 5px;
}
#gestmodal svg{
    width: 30px;
height: 30px; 
}
#gestmodal > span{
    position: relative;
    display: inline-block;
    font-size: 1.2rem;
    transition: all ease 500ms;
    font-style: normal !important;
}
#gestmodal > img{
    width: 56px; 
    position: relative;
left: 0;
    transition: all ease 500ms;
}
.isfilter{
    height: 0;
    overflow: hidden;
}

.bartserv{
    position: relative;
  }
#gestmodal1{ 
    display: flex; 
    cursor: pointer;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px;
    flex-direction: column;
    width: 50px;
    justify-content: center;
    align-items: center;
    position: absolute;
    left: 5px; 
    bottom: -10px;
    }
    #gestmodal1 svg{
        width: 30px;
    height: 30px; 
    }
    #gestmodal1 > span{
        position: relative;
        display: inline-block;
        font-size: 1.2rem;
        transition: all ease 500ms;
        font-style: normal !important;
    }
    #gestmodal1 > img{
        width: 56px; 
        position: relative;
    left: 0;
        transition: all ease 500ms;
    }
@media screen and (max-width: 1600px ){ 
    .filterside{ 
        width: 25%;
    }
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){ 
            .filterside{ 
                width: 100%;
                z-index: 8000;
            }
            #afffiltre{width: 40px !important;height: 40px !important;}
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#filtres .bloctop{
    padding: 20px;
    padding-left: 10%;
 /*   background-color: #49535e;*/
 
    border-bottom: 1px solid #5b6972;
    position: relative;
top: 1px;
text-align: center;
}
#filtres .bloctop2{
    display: none;
    text-align: center;
}
@media screen and (max-width: 768px){
    #filtres .bloctop2{ margin-top: 45px; }
    #divfilter{z-index: 9998;}
}
#filtres .bloctop2 img{
width: 50%;
margin-top: 20px;
cursor: pointer;
}
#filtres .bloctop button{
margin: 0;
/* color: #fff; */
color: #34404c;
 background-color: #f6f8f9; 
border: none;
cursor: pointer;
font-family: 'Poppins';
font-weight: 500;
font-style: normal;
}
#filtres .bloctop label{
    margin: 6%;
 /*  color: #fff;  */
    color: #34404c;
    cursor: pointer;  
    font-family: 'Poppins';
    font-style: normal;
    font-size: .9rem;
}
#erasefilter{
    font-size: .9rem;
}
#filtres .bloctop input{
display: none;
}
#filtres .blocfiltre{
    padding-top: 20px;
    padding-bottom: 25px;
    padding-left: 0%;
padding-right: 0%;
    border-top: 1px solid #5b6972;
    margin-left: 5% ;
    margin-right: 5%;
    position: relative;
}
#filtres .blocfiltre h3{
text-align: center;    
/* color: #b9d2ed; */
color:#000;
font-family: 'Poppins';
font-weight: 400;
margin-top: 0;
font-size: 1.5rem;
cursor: pointer;
}
#filtres .blocfiltre h3:hover{
    color: #51c5a1;
}
#filtresel1 > h3{
    margin-bottom: 1.3rem;
}
#filtresel2 #filtre_tousveh{
    margin-bottom: .9rem;
}
.hide{
    display: none;
}
#filtres .blocfiltre .servbutton{
 /*   background-color: #858c94;*/ 
    border-radius: 40px;
    width: 31%;
    display: inline-block;
    text-align: center;
    color: #34404c;
    cursor: pointer;
    font-family: 'Poppins';
    font-weight: 300;
    font-style: normal;
    font-size: 1.25rem;
    margin-left: 5%;
    border: 1px solid #fafbfc;
    padding: 4px;
} 
#filtre_location:checked ~ .filtre_location{
  /*  background-color: #eaeced; */
    border: 1px solid #51c5a1;
    background-color: #51c5a1;
    color: #000;
}
#filtres .blocfiltre .pbold{
    font-weight: bold;
    color: #000;
    display: inline-block;
    width: 100%;
}
#filtres .blocfiltre .pcolor{
    color: #000;
}
#filtres .blocfiltre .onover{
    margin-top: 0;
}
@media screen and (max-width: 1600px ){
    #filtres .blocfiltre .servbutton{
        width: 30%;
        margin-left: 7%;
    }
    #filtres .bloctop{
        padding-left: 10px;
        padding-right: 10px;
    }
    @media screen and (max-width: 1200px){ 
        #filtres .blocfiltre .servbutton{ 
            width: 32%;
            
            margin-left: 4%;
        }
        #filtres .blocfiltre h3{
            margin-top: 0;
            
        }
        #filtres .bloctop button{
            margin: 1%;
        }
        #filtres .bloctop label{margin: 2%;}
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#filtre_achat:checked ~ .filtre_achat{
  /*  background-color: #eaeced;*/
    border: 1px solid #51c5a1;
    background-color: #51c5a1;
    color: #fff;
}

#filtre_neuf:checked ~ .filtre_neuf{
    /*  background-color: #eaeced;*/
      border: 1px solid #51c5a1;
      background-color: #51c5a1;
      color: #fff;
  }
  
#filtre_occasion:checked ~ .filtre_occasion{
    /*  background-color: #eaeced;*/
      border: 1px solid #51c5a1;
      background-color: #51c5a1;
      color: #fff;
  }

#filtres .blocfiltre .blocradio{
    display: block;
    margin-bottom: 10px;
    position: relative;
}
#filtres .blocfiltre .blocradio input{
    display: none;
}
#filtres .blocfiltre .blocradio label{
    margin-left: 5%;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    font-size: 1rem;
    /* color: #fff; */
     color: #000;
    margin-left: 30px;
    position: relative;
    display: inline-block;
}
#filtres .blocfiltre .bloclabel{
    display: block;
    margin-bottom: 10px;
    position: relative;
}
#filtres .blocfiltre .bloclabel label{
    margin-left: 5%;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    
    /* color: #fff; */
     color: #000;
    margin-left: 30px;
    position: relative;
}
.asinbul{
    width: 96%;
display: block;
}
#filtres .blocfiltre .blocradio label::before{
    display: block;
    width: 10px;
    height: 10px;
/* border: 2px solid
#fff; */
border: 2px solid #51c5a1;
content: '';
border-radius: 50%;
position: absolute;
top: 4px;
left: -24px;
}
#filtres .blocfiltre .blocradio label::after {
    content: '';
    display: none;
    width: 13px;
height: 13px;
    margin: 4px;
   /* background-color: #fff; */
    background-color: #51c5a1;
    position: absolute;
    border-radius: 50%;
    top: 1px;
    left: -28px;
  }
  #filtres .blocfiltre .blocradio input:checked + label::after {
    display: block;
  }
#filtres .blocfiltre .intext{
    height: 25px;
    background-color: #fff;
    border: 1px solid #51c5a1;
    border-radius: 5px;
}

#filtres .blocfiltre .bloccheck{
    display: block;
    margin-bottom: 10px;
    position: relative;
}
#filtres .blocfiltre .demi{
    float: left;
}
#filtres .blocfiltre .bloccheck input{
    display: none;
}
#filtres .blocfiltre .floatleft{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#filtres .blocfiltre .bloccheck label{
    margin-left: 5%;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    font-size: 1rem;
    /* color: #fff; */
     color: #000;
    margin-left: 30px;
    position: relative;
    display: inline-block;
}
#filtres .blocfiltre .bloccheck label::before{
    display: block;
    width: 10px;
    height: 10px;
/* border: 2px solid
#fff; */
border: 2px solid #51c5a1;
content: ''; 
position: absolute;
top: 4px;
left: -24px;
}
#filtres .blocfiltre .bloccheck label::after {
    content: '';
    display: none;
    width: 13px;
height: 13px;
    margin: 4px;
   /* background-color: #fff; */
    background-color: #51c5a1;
    position: absolute; 
    top: 1px;
    left: -28px;
  }
  #filtres .blocfiltre .bloccheck input:checked + label::after {
    display: block;
  }
.aligncenter{text-align: center;}
.aligncenter .inputwidth{
    width: 100%;
border: none;
text-align: center;
background-color: #c1d1e0;
height: 24px;
color: #000;
border-radius: 30px;
}
#filtres .blocfiltre span{
    font-family: 'Poppins';
    font-weight: 300;
font-style: normal;
    color: #000;
    text-align: justify;
    display: inline-block;
}
#filtres .blocfiltre .hovertxt{
    color: #51c5a1;
}
#filtres .typevehicule {
    display: inline-block;
}
#filtres .typevehicule label{
    display: inline-block;
    padding :3px 5px;
    border-radius: 10px;
    margin: 1px;
    cursor: pointer;
    border-radius: 20px;
    border: 1px solid #51c5a1;
    color: #000;
    font-size: .9rem;
}
#filtres .typevehicule > input[type=checkbox]:checked + label{
    color: #000;
    background-color: #51c5a1;
}
#filtres .blocfiltre .buttinfo{
    display: block;
    width: 50%;
    margin: auto;
    margin-top: 20px;
    height: 30px;
    border-radius: 30px;
    line-height: 30px;
    text-decoration: none;
    color: #fff;
    background-color: #858c94;
    border: none;
    cursor: pointer;
}
#filtres .blocfiltre p{
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    text-align: left;
    color: #b9d2ed;
    font-size: .95rem;
    margin-top: 25px;
    margin-bottom: 5px;
    margin-left: 7px;
}
#filtres .blocfiltre .radioelem{
    text-align: center;
}

#filtres .blocfiltre .radioelem label{
    margin-left: 3%;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    
   /* color: #fff; */
    color: #000;
    margin-right: 6%;
}
.showoff{
    width: 0% !important; 
}
.showoff #filtres{ 
    background-color: #336699;
}
.showoff .blocfiltre{
    display: none !important;
}
.showoff .bloctop{
    display: none;
}
.showoff .bloctop2{
    display: block !important;
}
#div_filtre_volume{
    width: 100%;
}
#div_filtre_volume .original{
    width: 80%;
}
#div_filtre_volume p{
    position: relative;
    margin-top: 0 !important;
}
#div_filtre_largeur{
    width: 100%;
}
#div_filtre_largeur .original{
    width: 80%;
}
#div_filtre_largeur p{
    position: relative;
    margin-top: 0 !important;
}
#div_filtre_longueur{
    width: 100%;
}
#div_filtre_longueur .original{
    width: 80%;
}
#div_filtre_longueur p{
    position: relative;
    margin-top: 0 !important;
}
#div_filtre_hauteur{
    width: 100%;
}
#div_filtre_hauteur .original{
    width: 80%;
}
#div_filtre_hauteur p{
    position: relative;
    margin-top: 0 !important;
}
#filtre_surface{
    width: 100%;
}
#div_filtre_surface .pcolor{
    margin-top: 0 !important;
}
#div_filtre_surface .original{
    width: 80%;
}
#div_filtre_surface p{
    position: relative;
    margin-top: 0 !important;
}
#filtres .blocfiltre .nomarg{
    margin: 0;
}
.prixmod{
    width: 50px;
border: none;
text-align: center;
background-color: #f0f8fc;
height: 24px;
}

#filtre_volume{
    width: 100%;
}
#filtre_largeur{
    width: 100%;
}
#filtre_longueur{
    width: 100%;
}
#filtre_hauteur{
    width: 100%;
}
#filtre_Surfacept{
    width: 100%;
}
#filtre_nb_vehicule{
    width: 40px;
    height: 30px;
    background-color: #34404c;
    border: none;
    border-bottom: 1px solid #b9d2ed;
    color: #fff;
    text-align: center;
    
    font-family: 'Poppins';font-weight: 500;
    font-style: normal;
}
.datediplay{ 
    width: 140px;
    height: 30px;
    background-color: #34404c;
    border: none;
    border-bottom: 1px solid #b9d2ed;
    color: #fff;
    text-align: center;
    
    margin-left: 5px;
    margin-right: 5px;
    font-family: 'Poppins';
    font-weight: 500;
    font-style: normal;
}
#formulaire{
    margin-left: 20%;
    width: 80%; 
    display: inline-block;
    text-align: center;
    background-color: #f6f8f9;
    min-height: 100vh;
    position: relative;
    padding-top: 25px;
}
.details-wrapper #formulaire{
    width: 90vw;
    margin-left: 0;
    padding-top: 0;
    min-height: auto;
}
/*  background-color: #fafbfc;  */
#formulaire .formulaireliste{
    min-height: 1400px;
    padding-bottom: 60px;
    text-align: left;
padding-left: 3%;
padding-right: 3%;
}
#formulaire .formulaireliste > h3{
    color: #000;
    font-size: 2.5rem;
    margin-bottom: 1rem;
    margin-left: 1%;
    font-weight: bold;
}

.grandwidth{
    margin-left: 0% !important;
    width: 100% !important;
}

@media screen and (max-width: 1600px ){
    #formulaire{ 
        width: 75%;
        margin-left: 25%;
    }
    #filtres .typevehicule > label{
        
        margin: 1px;
    }
    #filtres .blocfiltre .blocradio label{
        
    }
    #filtres .blocfiltre .bloccheck label{
        
    }
    
    #filtres .blocfiltre .bloclabel label{
        
    }
    
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            #formulaire{ 
                width: 100%;
                margin-left: 0%;
                padding-top: 20px;
            }
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
.fullwidth{
    width: 100% !important;
    margin-left: 0 !important;
}
#formulaire .gestionlist{
    justify-content: center;
    display: flex;
    flex-direction: row;
    margin-bottom:3rem;
    margin-top:3rem;
    position: relative;
}
@media screen and (max-width: 768px){
    #formulaire .gestionlist{ margin-top: 1.5rem; margin-bottom: 1.5rem; }
}
#formulaire .buttcatalogue{
    border: none;
border-radius: 30px;
background-color:#c4cdd7;
height: 45px;
width: 17%;
font-weight: normal;
font-style: normal;
font-family: 'Poppins';
font-size: 1rem;
color:
#fff;
margin-left: 10px;
margin-right: 10px;
cursor: pointer;    
}
@media screen and (max-width: 1600px ){
    @media screen and (max-width: 1200px){
        #formulaire .buttcatalogue{ width: 27%; }
        @media screen and (max-width: 992px){
            #formulaire .buttcatalogue{ width: 38%; } 
            @media screen and (max-width: 768px){ 
                #formulaire .buttcatalogue{ } 
                @media screen and (max-width: 576px){
                    #formulaire .buttcatalogue{ } 
                }
            }
        }
    }
}
.hidden{
    display: none;
}

.hidefilter{
    width: 0 !important;
}

.divvehiculedetail{ 
    width: 100%;
   /* height: 450px; */
margin: auto;
margin-bottom: 15px;
display: inline-block;
flex-direction: row;
justify-content:flex-end;
transition-property: box-shadow;
  transition-duration:1s;
  background-color: #fff;
  position: relative;
}

.details-wrapper .divvehiculedetail{
    width: 90vw;
    margin-top: 10px;
    margin-bottom: 0;
}
.divvehiculedetail:hover{ 
}
@media screen and (max-width: 1600px ){
    .divvehiculedetail{ 
        /*  height: 360px; */
       /* width:76%;*/
    }
     
    @media screen and (max-width: 1200px){
        
        @media screen and (max-width: 992px){
            .divvehiculedetail{  
              /*  width:85%; 
                height:310px;*/
            }
            @media screen and (max-width: 768px){
                .divvehiculedetail{  
                    width: 100%;
                }
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
.divvehiculedetail .nbvehicules{
    position: absolute;
right: -15px;
top: -3px;
width: 44px;
height: 44px;
border-radius: 44px;
background-color:
#51c5a1;
z-index: 7500;
color: #fff;
line-height: 44px;
text-align: center;

}

#formulaire .vehiculedetail{
    width: 100%;
  /*  height: 450px; 
 overflow: hidden; */
position: relative;
display: flex;
/*
background-color: #eeeadf;*/
padding-top: 10px;
padding-bottom: 10px;
background-color: #fff;
}

.divvehiculedetail .voirbloctarif
{ 
    position: fixed;
width: 90vw;
height: 80vh;
top: 10vh;
background-color: #fbfbfb;
left: 4vw;
text-align: left; 
display: none;
overflow: hidden;
z-index: 8888;
padding: 20px;
}
.details-wrapper .divvehiculedetail .voirbloctarif
{ 
    position: relative;
width: 90vw;
height: 80vh;
top: 0;
left: 0;
}

.divvehiculedetail .voirbloctarifback{ 
    position: fixed;
width: 100vw;
height: 100vh;
top: 0;
background-color: #444;
opacity: .7;
left: 0;
display: none; 
overflow: hidden;
z-index: 8000;
}

.vehiculedetail > div{
    overflow-y: auto;
overflow-x: hidden;
scrollbar-color: #eaeff2 #f0f8fc;
scrollbar-width: thin;
}
.vehiculedetail .left .slick-slider{
    border-radius: 10px;
    overflow: hidden;
}
.btn-annuler{
    border: 2px solid #fc9047;
border-radius: 30px;
background-color:#f0f8fc;
height: 45px;
width: 40%;
font-weight: normal;
font-style: normal;
font-family: 'Poppins';

color:#fc9047;
cursor: pointer;
margin-left: 1%;
margin-right: 1%;
}
.btn-annuler:hover{
    border: 2px solid #51c5a1;
    color:#51c5a1;
}
.btn-save{
    border: 2px solid #fc9047;
border-radius: 30px;
background-color:#fc9047;
height: 45px;
width: 40%;
font-weight: normal;
font-style: normal;
font-family: 'Poppins';

color:#f0f8fc;
cursor: pointer;
margin-left: 1%;
margin-right: 1%;
}
.btn-save:hover{
    background-color:#51c5a1;
    border: 2px solid #51c5a1;
}
#formulaire .blocinput{
    display: block;
    color: #000;
    border: none; 
    width: 70.5%;
    text-align: left;
    font-size: 1.8rem;
    position: relative;
    margin-left: 26.5%;
    margin-bottom: 20px;
    display: flex;
align-items: center;
justify-content: space-between;
height: 40px;
margin-top: 15px;
}

@media screen and (max-width: 768px){
    #formulaire .blocinput{
        display: flex;
    }
}
#formulaire .blocinput .inputel{
    display: inline-block;
    color: #1a1a1a;
    border: none;
    background-color: #fff;
    width: 35%;
    text-align: left;
    font-size: 1.2rem;
height: 35px;
}
#formulaire .blocinput .inpubut{
    display: inline-block;
    color: #000;
    border: none;
    background-color: #51c5a1;
    width: 29%;
    text-align: center;
    font-size: 1.2rem;
cursor: pointer;
height: 35px;
}
/*
#formulaire .blocinput::before{
    content: '';
    display: inline-block;
    height: 4px;
    width: 20%;
    background-color: #51c5a1;
    position: absolute;
    bottom: -4px;
    left: 0;
}*/
#formulaire .blocinput .inputed{
    position: absolute;
    right: 69%;
    height: 100%;
    background: none;
    border: none;
    cursor: pointer;
    font-size: 1.6rem;
}
#formulaire .blocinput .inputed:hover{
    color: #fc9047;
}
#formulaire .vehiculedetail .left{
    display: flex;
    width: 33%;
    min-height: 23vw;
    height: 100%;
    overflow-y: hidden;
}
#formulaire .vehiculedetail .left .subleft{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    width: 100%;
}
#formulaire .vehiculedetail .left .subleft ul{
    padding-left: 3rem;
}

#formulaire .vehiculedetail .left ul li{
    margin-bottom: 5px;
}
#formulaire .vehiculedetail .bloctitre{ 
    color: #000;
    width: 100%;
 }
 #formulaire .vehiculedetail .bloctitre h3{
    text-align: left;
    margin-top: 10px;
    margin-left: 10px;
    line-height: 1.8rem;
    color: #51c5a1;
    font-weight: 600;
    font-size: 1.6rem;
 }
 #formulaire .vehiculedetail .bloctitre h3 a{
    color: #51c5a1;
    text-decoration: none;
 }
 #formulaire .vehiculedetail .bloctitre h3 a:hover{
    text-decoration: underline;
 }
 #formulaire .vehiculedetail .bloctitre h5{
    color: #1c2667;
    font-size: 1.2rem;
    margin-left: 4%;
    margin-top: 5px;
    font-weight: 500;
 }
 #formulaire .vehiculedetail .bloctitre .stock{
     text-align: left;
     font-size: 1.1rem;
     margin-top: 0;
     margin-left: 11px;
 }
 #formulaire .vehiculedetail .bloctitre .stock{
    margin-top: 0;
 }
 #formulaire .vehiculedetail .left .slick-slide{
    height: 16.9vw;
    overflow: hidden;
 }
 
 #formulaire .vehiculedetail .left .dispbloc .slick-slide{
    height: 87vh;
 }
#formulaire .vehiculedetail .left .slick-slide img{
    max-width: 22.5vw;
    max-height: 16.9vw;
}
#formulaire .vehiculedetail .left .dispbloc .slick-slide img{
    max-width: 80vw;
    max-height: 87vh;
} 

#formulaire .vehiculedetail .left .slidphoto .slick-slide{
    height: 83vh;
 }
 #formulaire .vehiculedetail .left .slidphoto .slick-slide img{
    max-width: 90vw;
    max-height: 83vh;
 }
 #formulaire .divvehiculedetail .bloca{
    position: absolute;
    top: 0;
    left: 0;
 }
#formulaire .divvehiculedetail .bloccaution{
width: 100%; 
background-color: #fff;
}
#formulaire .divvehiculedetail .bloccaution .description{
    position: relative;
    padding: 15px;
    width: calc(100% - 30px) !important; 
}
#formulaire .divvehiculedetail .bloccaution .description .closedescr-wrapper{
    text-align: right;
    padding-bottom: 0 !important;
    width: 96%;
}

@media screen and (max-width: 1600px ){
   
#formulaire .vehiculedetail .left .slick-slide img{
    max-height: 300px;
}
#formulaire .vehiculedetail .dispbloc .slick-slide img{
    max-height: 90vh;
}
#formulaire .blocinput .inputel{
    font-size: 1.4rem;
}
    @media screen and (max-width: 1200px){
        
#formulaire .blocinput .inputel{
    font-size: 1.2rem;
}
        @media screen and (max-width: 992px){ 
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .vehiculedetail .right{
    display: inline-block;
    width: 34%;
   /*  height: 450px; */
   /* z-index: 6000;*/
    position: relative;
   /* padding-top: 50px; */
    padding-left: 15px;
display: flex; 
align-items: flex-start;
flex-direction: column;
justify-content: space-between;
padding-top: 20px;
padding-bottom: 20px;
}
#formulaire .vehiculedetail .right > div{
width: 90%;
}
#formulaire .vehiculedetail .right h3{
    font-weight: bold;
    font-style: normal;
    font-family: 'Poppins';
    line-height: 1.6rem;
    color: #336699;
    margin-top: 35px;
  /*  margin-bottom: 25px; */
    padding-left: 60px;
padding-right: 60px;
}
#formulaire .vehiculedetail .right h3 a{
    text-decoration: none;
    color: #336699;
    transition: all ease 600ms;
    border-bottom: 1px solid #336699;
    position: relative;
    top: 0;
    transition: all ease 500ms;
    font-size: 1.3rem;
}
#formulaire .vehiculedetail .right h3 a:hover{
    color: #ee662b;
    border-bottom: 1px solid #ee662b;
    padding-bottom: 5px;
position: relative;
top: -5px;
}
#formulaire .vehiculedetail .right p{
    margin-top: 0;
}
#formulaire .vehiculedetail .right .optlist{
    margin-top: .5rem;
}
#formulaire .vehiculedetail .right ul{
    padding: .5rem;
    padding-top: 0;
    margin: 0;
}
#formulaire .vehiculedetail .right ul li{
    color: #808080;
}
#formulaire .vehiculedetail .right .detdate{
    color: #808080;
}
#formulaire .vehiculedetail .right ul li p{
    margin-top: 0;
    color: #808080;
}
#formulaire .vehiculedetail .right .stock{
    margin-top: 2px;
    min-height: 1.5rem;
    font-size: .9rem;
    font-weight: bold;
}
@media screen and (max-width: 1600px ){
    #formulaire .vehiculedetail .right h3{
    margin-top: 24px;
         
      /*  margin-bottom:10px;*/
        line-height: 20px;
    }
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                #formulaire .vehiculedetail .right h3{
                     padding-left: 5px;
                     padding-right: 25px;
                }
                
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .vehiculedetail .right .listebutton{
    text-align: left; 
    margin-top: 5px; 
    line-height: 1.0rem;
    position: relative;
    width: 100%;
}
#formulaire .vehiculedetail .right .listebutton > img{
    transition: all ease .5s;
    top: -2px;
position: relative;
}
@media screen and (max-width: 1600px ){
    #formulaire .vehiculedetail .right .listebutton{
        line-height: 1.0rem;
        margin-top: 9px;
    }
    @media screen and (max-width: 1200px){
        #formulaire .vehiculedetail .right .listebutton{
            line-height: 12px;
            margin-top: 6px;
        }
        @media screen and (max-width: 992px){
            #formulaire .vehiculedetail .right .listebutton{
                line-height: 10px;
                margin-top: 4px;
            }
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .vehiculedetail .right .listebutton button{
    margin-left: 55px;
    border: none;
    background-color: rgba(0,0,0,0);
    color: #336699;
    font-weight: normal;
    font-style: normal;
    font-family: 'Poppins';
    font-size: 1.25rem;
    cursor: pointer;    
    transition: all ease .5s;
}
.extarif{
    color: #000; 
    margin-left: 0;
    margin-top: 9px;
    text-align: left;
    font-size: 1rem;
    text-align: center;
   /* padding: .8rem 0;*/
   width: 99%;
   display: flex;
justify-content: space-between;
align-items: center;
}
.extarif2{
    color: #000;
    font-size: 1rem; 
    text-align: center;
   width: 99%;
   display: flex;
   justify-content: center;
   align-items: center;
   line-height: 1.2rem;
   height: 100%;
}
.butcaut{
    border-radius: 20px;
    background-color: #33f4a3;
font-size: 1.4rem;
color: #000;
cursor: pointer;
padding: 0;
text-decoration: none;
/* position: absolute;  
bottom: 115px;
left: 6%; */
width: 95%;
text-align: center;
height: 45px;
}
.ach > .extarif{
    height: 5rem;
    line-height: 1.8rem;
}
.extarif .nbve{
    width: 45px;
    height: 55px;
    text-align: center;
    border: none;
    display: flex;
}
.extarif .nbve input{
    display: inline-block;
    height: 45px;
    line-height: 45px;
    color: #25b377;
    font-size: 1.3rem;
    font-weight: 600;
    width: 70%;
    text-align: center;
    border: none;
    background-color: transparent;
}
.detailacht .nbve{
    width: 45px;
    height: 45px;
    text-align: center;
    border: none;
    display: flex;
    background-color: #fff;
flex-direction: column;
justify-content: center;
}
.detailacht .nbve input{
    display: inline-block;
    height: 20px;
    line-height: 20px;
    color: #000;
    font-size: 1.2rem;
    width: 100%;
    text-align: center;
    border: none;
    background-color: transparent;
    padding: 0;
}
@media screen and (max-width: 1600px ){
    .butcaut{
        bottom: 110px;
    }
    #formulaire .vehiculedetail .right .listebutton button{
        
    }
    .extarif{
        
    }
    @media screen and (max-width: 1200px){
        .butcaut{
            bottom: 90px;
        }
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                #formulaire .vehiculedetail .right .listebutton button{
                    
                }
                .extarif{
                
            }
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .vehiculedetail .right .listebutton span{ 
    font-weight: normal;
    font-style: normal;
    font-family: 'Poppins';
    color:#000;
    
}
#formulaire .vehiculedetail .right .listebutton .prxgreen{
    color: #51c5a1;
    font-size: 1.4rem;
    font-weight: 600; 
}
#formulaire .vehiculedetail .right .tarifsuite{
    text-align: right;
}
#formulaire .vehiculedetail .right .tarifsuite span{
    color: #cccccc;
    font-weight: 600;
}
.bloclivraisonreprise .tarifsuite{
    text-align: right;
margin-right: 3%;
}
.blocemploye .tarifsuite{
    text-align: right;
margin-right: 3%;
}
.bared{
    color: #c32033;
}
.bared del{
    color: #c32033;
}
#formulaire .vehiculedetail .voirtarif{
    border: none;
    background-color:#51c5a1;
font-weight: bold;
    font-style: normal;
    font-family: 'Poppins';
    font-size: 1.2rem;
    color: #000; 
    cursor: pointer;
    padding: 0;
  /*  position: absolute;
bottom: 5px;
right: 2%; */
z-index: 70;
width: 100%;
height: 45px;
display: flex;
justify-content: center;
align-items: center;
}
.butplusinfo{
    background-color:#fff;
    font-size: 1.2rem;
    font-weight: 600;
    color: #000; 
    cursor: pointer;
    padding: 0 ;
    text-decoration: none;
   /* position: absolute;
    bottom: 50px;
    left: 6%;*/
    width: 95%;
text-align: center;
height: 45px;
display: flex;
align-items: center;
padding-left: 4%;
}
 
#formulaire .voirbloctarif .voirtarif span{
    position: relative;
left: 45px;
} 
#formulaire .voirbloctarif .icone-wrapper{
    margin-right: 15px;
    position: absolute;
    left: -15px;
    height: 40px;
    width: 40px;
    top: -8px;
}
#formulaire .voirbloctarif .iconeG-wrapper{
    margin-right: 15px;
    position: absolute;
    left: -15px;
    height: 40px;
    width: 40px;
    top: -8px;
} 
@media screen and (max-width: 1200px){
    .butplusinfo{
        font-size: 1.2rem;
        bottom: 40px;
    }
    #formulaire .vehiculedetail .voirtarif{
        font-size: 1.2rem;
    }
    @media screen and (max-width: 992px){
        #formulaire .vehiculedetail .voirtarif{
            padding: 8px 0 8px 0;
        }
        .extarif .nbve{
            height: 35px;
        }
        .extarif .nbve input{
            height: 35px;
        }
        .butplusinfo{
            bottom: 30px;
        }
        .butcaut {
            bottom: 60px;
        }
        @media screen and (max-width: 768px){
            
            @media screen and (max-width: 576px){
                
            }
        }
    }
}
#formulaire .voirbloctarif .blockiselect{
    position: absolute;
    right: 0;
    height: 40px;
    width: 75px;
    top: 15px;
    text-align: left;
}
#formulaire .voirbloctarif .blockiselect span{
    color: #336699;
    font-size: .8rem;
}
#formulaire .vehiculedetail .blockiselect .iselect{ 
    margin: auto;
    height: 40px;
    width: 40px;
    mask: url("../img/picto/Picto moteur electrique - bluetxt.svg");
    -webkit-mask-image : url("../img/picto/Picto moteur electrique - bluetxt.svg");
    background: #336699;
    mask-size: cover;
    -webkit-mask-size: cover;
} 

#formulaire .vehiculedetail .blockiselectG{ 
    right: 0;
    width: auto;
    text-align: left;
    display: flex;
    align-items: center;
}
#formulaire .vehiculedetail .blockiselectG span{
    color: #000;
    font-size: 1.2rem;
    line-height: 15px;
    position: relative;
    margin-left: 1rem;
}
#formulaire .vehiculedetail .blockpicto{ 
    right: 0;
    width: auto;
    text-align: left;
    display: flex;
align-items: center;
}
#formulaire .vehiculedetail .blockpicto span{
    color: #000;
    font-size: 1.2rem;
    line-height: 15px;
    position: relative; 
    margin-left: 1rem;
    display: inline-block;
width: calc( 100% - 54px - 1rem);
}
#formulaire .vehiculedetail .blockpicto .akchauffeur{ 
    color: #fc9047;
}
#formulaire .vehiculedetail .blockpicto .icapa{
    height: 55px;
    width: 55px;
    background-image: url("../img/poids.svg"); 
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
}

#formulaire .vehiculedetail .blockpicto .passag{
    height: 55px;
    width: 55px;
    background-image: url("../img/passenger.svg"); 
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
}
#formulaire .vehiculedetail .blockpicto .icine{
    height: 55px;
    width: 55px;
    background-image: url("../img/film.svg"); 
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
}
#formulaire .vehiculedetail .blockpicto .irem{
    height: 55px;
    width: 55px;
    background-image: url("../img/remorque.svg"); 
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
}
#formulaire .vehiculedetail .blockpicto .icomp{
    height: 55px;
    width: 55px;
    background-image: url("../img/comptoire2.svg"); 
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
}
#formulaire .vehiculedetail .blockpicto .isurf{
    height: 55px;
    width: 55px;
    background-image: url("../img/surface.svg");
    display: inline-block;
    background-repeat: no-repeat;
    background-position: center;
}

#formulaire .vehiculedetail .blockiselectG .iselect{
    height: 55px;
    width: 55px;
    mask: url("../img/picto/Picto moteur electrique - bluetxtopt.svg");
    -webkit-mask-image : url("../img/picto/Picto moteur electrique - bluetxtopt.svg");
    background: #7ac2ab;
    mask-size: cover;
    -webkit-mask-size: cover;
    display: inline-block;
}
#formulaire .vehiculedetail .blockiselectG .iselecti{
    height: 55px;
    width: 55px;
    mask: url("../img/picto/Picto moteur electrique - bluetxtinc.svg");
    -webkit-mask-image : url("../img/picto/Picto moteur electrique - bluetxtinc.svg");
    background: #7ac2ab;
    mask-size: cover;
    -webkit-mask-size: cover;
    display: inline-block;
}
#formulaire .voirbloctarif .icon-cover {
mask: url("../img/picto/Picto crea impression pose - blue.svg");
-webkit-mask-image : url("../img/picto/Picto crea impression pose - blue.svg");
} 
#formulaire .voirbloctarif .icon-equi {
    mask: url("../img/picto/Picto fourniture equipement - blue.svg");
    -webkit-mask-image : url("../img/picto/Picto fourniture equipement - blue.svg");
    } 

    #formulaire .voirbloctarif  .icon-loca {
        mask: url("../img/picto/Picto Location - blue.svg");
        -webkit-mask-image : url("../img/picto/Picto Location - blue.svg");
        } 

#formulaire .voirbloctarif .icon-reca {
    mask: url("../img/picto/Picto Recapitulatif - blue.svg");
    -webkit-mask-image : url("../img/picto/Picto Recapitulatif - blue.svg");
}
#formulaire .vehiculedetail .icon-desc {
    mask: url("../img/picto/Picto Description - blue.svg");
    -webkit-mask-image : url("../img/picto/Picto Description - blue.svg");
}
#formulaire .vehiculedetail .icon-phot {
    mask: url("../img/picto/Picto Photo - blue.svg");
    -webkit-mask-image : url("../img/picto/Picto Photo - blue.svg");
}
#formulaire .vehiculedetail .icon-cara {
    mask: url("../img/picto/Picto Caracterisiques - blue.svg");
    -webkit-mask-image : url("../img/picto/Picto Caracterisiques - blue.svg");
}
#formulaire .vehiculedetail .icon-fich {
    mask: url("../img/picto/Picto Fichiers - blue.svg");
    -webkit-mask-image : url("../img/picto/Picto Fichiers - blue.svg");
}
#formulaire .vehiculedetail .icon-faqq {
    mask: url("../img/picto/Picto FAQ - blue.svg");
    -webkit-mask-image : url("../img/picto/Picto FAQ - blue.svg");
}
#formulaire .vehiculedetail .icon-gara {
    mask: url("../img/picto/Picto garantie - blue.svg");
    -webkit-mask-image :url("../img/picto/Picto garantie - blue.svg");
}

#formulaire .vehiculedetail .icondet{
    height: 35px;
    width: 35px;
    display: inline-block;
    background: #000;
    mask-size: cover;
    -webkit-mask-size: cover;
    position: absolute;
    left: 5%; 
}
/*
#formulaire .voirbloctarif .icon {
    margin-right: 15px; 
    left: -20px;
    height: 40px;
    width: 40px;
    top: 10px;
display: inline-block;
background: #000;
mask-size: cover;
-webkit-mask-size: cover;
position: relative;
}*/
#formulaire .voirbloctarif .iconG { 
    background: #beccd3; 
    }
#formulaire .voirbloctarif .iconV { 
    background: #51c5a1; 
    }
#formulaire .voirbloctarif .iconO { 
 background: rgb(232, 108, 66); 
 }
 @media screen and (max-width: 1600px ){
    #formulaire .vehiculedetail .icondet{ height: 28px; width: 28px;}
    #formulaire .vehiculedetail .icon{ height: 28px; width: 28px;}
    
    #formulaire .vehiculedetail .blockpicto span{font-size: 1rem;}
    #formulaire .vehiculedetail .blockiselectG span{font-size: 1rem;}
    .butcaut{ height: 40px;font-size: 1.2rem;}
    .butplusinfo{ height: 40px;font-size: 1.2rem;}
    #formulaire .vehiculedetail .voirtarif{ height: 40px;font-size: 1.2rem;}
    @media screen and (max-width: 1200px){
        #formulaire .vehiculedetail .icondet{ left: 16px;}
        
    .butcaut{ height: 42px;font-size: 1.2rem;}
    .butplusinfo{ height: 42px;font-size: 1.2rem;}
    #formulaire .vehiculedetail .voirtarif{ height: 42px;font-size: 1.2rem;}

        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                #formulaire .vehiculedetail .icondet{ height: 22px; width: 22px;left: 6%;top: -3px;}
                #formulaire .vehiculedetail .icon{ height: 22px; width: 22px;top: 1px;}
                #formulaire .vehiculedetail .blockiselect{
                    right: 0px;
                    height: 38px;
                    width: 38px;
                }
                #formulaire .vehiculedetail .blockiselectG .iselect{
                    height: 25px;
                    width: 25px;
                }
                #formulaire .vehiculedetail .blockiselect .iselect{
                    height: 25px;
                    width: 25px;
                }
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}

.chargplus{
    border: none;
    border-radius: 30px;
    background-color:#51c5a1;
font-weight: normal;
    font-style: normal;
    font-family: 'Poppins';
    color: #fff;
    margin: auto;
    margin-top: 20px;
    margin-bottom:80px;
    cursor: pointer;
    padding: 11px 23px 11px 23px;
}
#formulaire .vehiculedetail .right .voirtarif:hover{    
 /*   box-shadow: -250px 0px 100px -180px #336699 inset;*/
 box-shadow: 2px -1px 16px -4px #d4e0f4 inset;
}
#formulaire .vehiculedetail .description{
    display: inline-block;
    width: 50%;
   /*  height: 450px; */
    position: absolute;
    top: 0;
    left: 50%;
    z-index: 2000;
    transition: all ease .8s;
    background-color: #fff;
    border-bottom-right-radius: 20px;
    
}
#formulaire .vehiculedetail .bloccaution .description{
height: calc( 23vw - 2.8rem);
    overflow: auto;
}
#formulaire .descriptiontarif .bloccaution table{
    width: 80%;
    margin-left: 10%;
    text-align: center;
}
#formulaire .vehiculedetail .description > div{
    padding-bottom: 20px;
}
#formulaire .voirbloctarif .closedescr{
    position: absolute;
    right: 15px;
    top: 10px;
    
    color: #336699;
    cursor: pointer;
}
#formulaire .voirbloctarif h3{
    
}
#formulaire .vehiculedetail .description .showtags{
    cursor: pointer;
    margin-bottom: 5px;
}
#formulaire .vehiculedetail .listags{
    position: absolute;
    top: 0;
    overflow: hidden;
    overflow-y: auto;
    z-index: 7000;
}
#formulaire .vehiculedetail .listags .closedescr-wrapper{
    text-align: right;
    padding-right: 3%;
    padding-top: 5px;
    padding-bottom: 5px;
}
#formulaire .vehiculedetail .listags p{
    cursor: pointer;
}
#formulaire .vehiculedetail .listags .isel{
    color: #51c5a1;
}
#formulaire .vehiculedetail .description h3{
    color: #000;
    font-size: 1.35rem;
}
@media screen and (max-width: 1600px ){
    #formulaire .vehiculedetail .description h3{
        
    }
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .vehiculedetail .description h6{
    color: #000;
    
    font-family: 'Poppins';
    font-weight: 600;
    font-style: normal;
    margin-top: 15px;
}
#formulaire .vehiculedetail .description p{
    color: #444;
    font-size: 1rem;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    margin-top: 5px;
    text-align: left;
}
.txtleft{
    text-align: left;
}
.txtbold{
    font-weight: bold !important;
}
.txtbold .txtname{
    margin-bottom: 0;
}
.nowrap{
    white-space: nowrap;
}
#filtres .blocfiltre .labelclass{
    
    color: #123466;
    font-style: normal;
}
.center p{
    text-align: center !important;
}
@media screen and (max-width: 1600px ){
    #formulaire .vehiculedetail .description h6{
        
    }
    #formulaire .vehiculedetail .description p{
        
        line-height: 13px;
        margin-left: 23px;
        margin-right: 23px;
    }
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                #formulaire .vehiculedetail .description p{
                    
        line-height: 12px;
        margin-left: 10px;
        margin-right: 10px;
                }
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .voirbloctarif .descriptiontarif{
    display: inline-block;
    width: 59.2%; 
    transition: all ease .8s; 
    text-align: center;
    height: calc(80vh - 8.5rem);
    overflow-x: scroll;
    background-color: #fff; 
    top: 8.5rem; 
overflow-y: auto;
overflow-x: hidden;
border-top: 1px solid #51c5a1;
position: relative;
top: -1px;
}
.righttop{
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 9000;
}
#formulaire .voirbloctarif .descriptiontarif .closedescr{
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 9000;
    color: #336699;
    cursor: pointer;
}
#formulaire .voirbloctarif .descriptiontarif h3{
    color: #336699;
    font-size: 1.5rem;
    font-family: 'Poppins';
    font-weight: bold;
    font-style: normal;
}
#formulaire .voirbloctarif .descriptiontarif h3 a{
    text-decoration: none;
    color: #336699;
    border-bottom: 1px solid #336699;
    position: relative;
    top: 0;
    transition: all ease 500ms;
}
#formulaire .voirbloctarif .descriptiontarif h3 a:hover{
    color: #ee662b;
    border-bottom: 1px solid #ee662b;
    padding-bottom: 5px;
    position: relative;
    top: -5px; 
}
@media screen and (max-width: 1600px ){
    #formulaire .voirbloctarif .descriptiontarif h3{
        
    }
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .voirbloctarif button{
    color: #000;
    font-size: 1.35rem;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    border: 1px solid #51c5a1; 
display: inline-block;
margin-top: 10px;
cursor: pointer;
width: 16%;
position: relative;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
}
#formulaire .voirbloctarif .descriptiontarif .recdetail{
    color: #336699;
    font-size: 1.15rem;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    border: none;
    margin-top: 5px;
    display: block;
}
#formulaire .voirbloctarif .descriptiontarif .demreduc{
    color: #336699;
    font-size: .8rem;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    border: none;
    margin-top: 5px;
    display: block;
    
}
.recaptarif .demreduc{
    margin-top: 10px;
}
#formulaire .voirbloctarif .descriptiontarif .location .selelem{
    border: 1px solid #444;
}
#formulaire .voirbloctarif .descriptiontarif .demreduc span{
    color: #336699;
    cursor: pointer;
}
#formulaire .voirbloctarif .descriptiontarif .demreduc span:hover{
    color: #ee662b;
}
.textitalic{
    font-style: italic !important; 
}
#modal_reduc .notvalide{
    border: 1px solid #ee662b !important;
}
#modal_reduc .error{
    display: none;
}
#modal_reduc .error p{
    color: #ee662b;
    margin-top: 0;
}
#modalinfo .error{
    display: none;
}
#modalinfo .error p{
    color: #ee662b;
    margin-top: 0;
}
#modal_reduc #massageenvoye{
    color: #51c5a1;
    font-size: 1.4rem;
}
#massageenvoye_info{
    color: #51c5a1;
    font-size: 1.4rem;
}
.inforemise{
    background-color: #fff;
    margin-top: 0;
    color: #51c5a1;
    font-size: 1.3rem;
    line-height: 2rem;
} 
.location .reductionactive{
    font-size: 1.6rem;
}
#formulaire .voirbloctarif .descriptiontarif .btn-valider{
margin-top: 10px !important;
margin-bottom: 30px;
}
#formulaire .vehiculedetail .bloccaution .description h6{
    margin-top: 0;
    text-align: center;
    color: #000;
}
@media screen and (max-width: 1600px ){
    #formulaire .voirbloctarif .descriptiontarif button{
        
        margin-top: 9px;
    }
    #formulaire .voirbloctarif .descriptiontarif .recdetail{
        
        margin-top: 3px;
    }
    
#formulaire .voirbloctarif .descriptiontarif .demreduc{
    
}
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            #formulaire .voirbloctarif .descriptiontarif button{ 
                margin-top: 2px;
                width: 85%;

            }
            #formulaire .voirbloctarif .descriptiontarif .recdetail{
                margin-top: 2px;
            }
            #formulaire .voirbloctarif .descriptiontarif .demreduc{
                
            }
            @media screen and (max-width: 768px){
                #formulaire .voirbloctarif .descriptiontarif button{ 
                    width: 85% !important;
                }
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .voirbloctarif .descriptiontarif button:hover{
    color: #51c5a1;
}
#formulaire .voirbloctarif .recaptarif{
    display: inline-block;
    width: 40%;
  /*   height: 450px; */
    position: absolute;
    top: 133px;
    left: 59%;
    z-index: 6500;
    transition: all ease .8s;
    background-color: #f1f0f7;
    height: calc(80vh - 134px);
    text-align: center;
    overflow-y: auto;
overflow-x: hidden;
border-top: 1px solid #51c5a1;
}  
#formulaire .voirbloctarif .recaptarif .demreduc{
padding-left: 3rem;
padding-right: 3rem;
font-size: .8rem;
}
#formulaire .voirbloctarif .recaptarif .demreduc > span{
    cursor: pointer;
}
#formulaire .voirbloctarif .recaptarif .btn-valider{
    margin: auto;
    margin-bottom: 25px;
    border-top-left-radius: 0;
border-top-right-radius: 0;
width: 80% !important;
}
.limgsit{
    overflow: hidden;
    border-radius: 20px;
    overflow-y: auto;
}
.limgsit .closedescr-wrapper{
    margin-top: 5px;
    margin-left: 5px;
 }
 .limgsit .closedescr-wrapper .closedescr{
    position: absolute;
right: 5%;
top: 5px;
 }
 .limgsit h3{
     margin-top: 0;
     text-align: center;
 }
.lienimg .listim > div{
    width: 22%;
    margin: 1%;
    display: inline-block;
    cursor: pointer;
    padding-top: 23%;
position: relative;
transition: all ease 300ms;
} 
.lienimg .listim > .mask{
    width: 0;
height: 0;
margin: 0;
}
 .lienimg .listim > div > .image-wrapper{
    position: absolute;
top: 0;
display: block;
width: 100%;
height: 100%;
overflow: hidden;
}
.lienimg .listim > div > .image-wrapper img{
min-width: 100%;
min-height: 100%;
width: auto;
max-width: inherit;
max-height: 120%;
position: relative;
margin-left: 50%;
transform: translate(-50%);
}
.center{
    text-align: center;
}
#formulaire .voirbloctarif .recaptarif .blocrecapel{
    display: flex;
}
#formulaire .voirbloctarif .recaptarif h3{
    color: #000;
    margin-left: 5%;
    font-family: 'Poppins';
    font-weight: 600;
    font-style: normal;
    margin-top: 0;
    text-align: left;
    font-size: 1.3rem;
}
@media screen and (max-width: 1600px ){
    #formulaire .voirbloctarif .recaptarif{
        /*  height: 360px; */
    } 
    
}
#formulaire .voirbloctarif .recaptarif> div{
    margin-bottom: 20px;
}
#formulaire .voirbloctarif .recaptarif p{
    text-align: left;
    color: #000;
    font-weight: 600;
    font-style: normal;
    
    margin-top: 10px;
}
#formulaire .voirbloctarif .recaptarif .recaecovlist p{
    text-align: left;
    padding-left: 10%;
    color: #000;
    font-weight: 600;
    font-style: normal;
    
    margin-top: 10px;
}
#formulaire .voirbloctarif .recaptarif .recaserv{
    display: flex;
flex-direction: column;
justify-content: space-between;
    width: 32%; 
    border-right: 1px solid #000;
margin-right: 1%;
}
#formulaire .voirbloctarif .recaptarif .recaecov{
    width: 68%; 
    display: flex;
flex-direction: column;
justify-content: space-between;
}
#formulaire .voirbloctarif .recaptarif .recaecov p{
    padding-left: 1%;
}
#formulaire .voirbloctarif .recaptarif p span{
    color: #000;
    font-weight: normal;
    font-style: normal;
    
}
#formulaire .voirbloctarif .recaptarif .recaecov .total{
    border-top: 1px solid #000;
    margin-right: 7%;
    text-align: left;
}
#formulaire .voirbloctarif .recaptarif .total{
    text-align: center;
}
#formulaire .voirbloctarif .recaptarif .recaecovlist .total{
    border-top: 1px solid #000;
    margin-left: 7%;
    padding-left: 0%;
    margin-right: 7%;
    text-align: left;
}

#formulaire .voirbloctarif .recaptarif .totalht{
    text-align: center;
    font-size: 1.1rem;
}
#formulaire .voirbloctarif .recaptarif .totalht > span{
    font-size: 1.4rem;
    color: #000;
}
.infoemplacc{
    overflow: hidden;
    border-bottom: 1px solid #000;
    margin-bottom: 5px;
}
.infoemplacc h5{
    position: relative;
    margin-top: 0;
    cursor: pointer;
}
.infoemplacc .blocinfo{
    padding-top: 0;
    margin-top: 15px;
}
.infoemplaccr{
    position: absolute;
    right: 10px;
    top: 0;
}
.infoemplacc2{
    overflow: hidden;
    border-bottom: 1px solid #000;
    margin-bottom: 5px;
}
.infoemplacc2 h5{
    position: relative;
    margin-top: 0;
    cursor: pointer;
}
.infoemplacc2 .blocinfo{
    padding-top: 0;
    margin-top: 15px;
}
.infoemplaccr2{
    position: absolute;
    right: 10px;
    top: 0;
}
.infoemplacc3{
    overflow: hidden;
    border-bottom: 1px solid #000;
    margin-bottom: 5px;
}
.infoemplacc3 h5{
    position: relative;
    margin-top: 0;
    cursor: pointer;
}
.infoemplacc3 .blocinfo{
    padding-top: 0;
    margin-top: 15px;
}
.infoemplaccr3{
    position: absolute;
    right: 10px;
    top: 0;
}
@media screen and (max-width: 1600px ){
    #formulaire .voirbloctarif .recaptarif p span{
        
    }
    #formulaire .voirbloctarif .recaptarif .total{
    }
    @media screen and (max-width: 1370px){
        #formulaire .voirbloctarif .recaecov p span{
            display: block;
        }
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    #formulaire .voirbloctarif .recaptarif p span{
                        display: block;
                    }
                    
                }
            }
        }
    }
}

.hrdes{
    background-color:#000;
width: 90%;
height: 1px;
border: none;
margin-left: 5%;
}
.hrdesg{
    background-color: #51c5a1;
    width: 93%;
    height: 1px;
    border: none;
    margin-left: 2%;
}
#formulaire .divvehiculedetail .location{
    display: inline-block;
    width: 100%;
    transition: all ease .8s;
    overflow: hidden; 
 /*   max-height: calc(80vh - 8.5rem); */
 padding-top: 10px;
}
.mrgtop{
    margin-top: 25px;
}
#formulaire .divvehiculedetail .location .txteq{
    width: 100%;
    height: calc(80vh - 9.5rem);
display: inline-block;
position: relative;
overflow-y: auto;
overflow-x: hidden;
}
#formulaire .divvehiculedetail .location .imgeq{
    width: 50%;
    height: calc(80vh - 9.5rem);
    display: inline-block;
    float: left;
    position: relative;
}
.imgfull1-wrapper{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
    width: 100%;
    height: 100%;
}
.imgfull2-wrapper{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 200;
    width: 100%;
    height: 100%;
}
.imgfull3-wrapper{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 300;
    width: 100%;
    height: 100%;
}
.imgfull4-wrapper{
    position: absolute;
    left: 0;
    top: 0;
    z-index: 400;
    width: 100%;
    height: 100%;
}

.slick-slide div{
    display: flex !important;
    justify-content: center;
}
.slick-slide img{
    max-height: 390px;
}
.vehiculedetail .dispnone .slick-slide img{
    max-height: 20vw;
}
.grandwidth .vehiculedetail .dispnone .slick-slide img{
    max-height: 25vw;
}
@media screen and (max-width: 1600px){
    @media screen and (max-width: 1200px){
        
        @media screen and (max-width: 992px){
            .vehiculedetail .dispnone .slick-slide img{ max-height: 23vw; }
            @media screen and (max-width: 768px){
                .vehiculedetail .dispnone .slick-slide img{ max-height: 25vw; }
                @media screen and (max-width: 576px){
                    .vehiculedetail .dispnone .slick-slide img{ max-height: 27vw; }
                    
                }
            }
        }
    }
}
#formulaire .divvehiculedetail .location > div{
  /*  margin-top: 20px;
    margin-bottom: 15px;*/
}
#formulaire .divvehiculedetail .location .itltext{
    color: #000;
    font-family: 'Poppins';
    font-weight: normal;
    font-size: .75rem;
    font-style: italic;
}
#formulaire .divvehiculedetail .location h5{
    color: #336699;
    font-size: 1.6rem;
    font-family: 'Poppins';
    font-weight: normal;
    font-style: normal;
    margin-top: 25px;
    margin-bottom: 10px; 
}
@media screen and (max-width: 1600px ){
    #formulaire .divvehiculedetail .location h5{
        margin-top: 17px;
    }
    #formulaire .voirbloctarif .recaptarif .recaserv{
        width: 35%;
    }
    #formulaire .voirbloctarif .recaptarif .recaecov{
        width: 65%;
    }
    @media screen and (max-width: 1200px){
        .divvehiculedetail .voirbloctarif{left: 3vw;}
        @media screen and (max-width: 992px){
            #formulaire .divvehiculedetail .location .imgeq{display: none;}
            #formulaire .divvehiculedetail .location .txteq{width: 100%;}
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
#formulaire .divvehiculedetail .location .textelocation{
    color:#000; 
font-family: 'Poppins';
font-weight: normal;
font-style: normal;
margin-top: 5px;
font-size: 1.15rem;
}
#formulaire .divvehiculedetail .location .textelocation span{
    
    font-weight: 500;
}
#formulaire .divvehiculedetail .location label{
    color: #000;
    font-weight: normal;
    font-style: normal;
    font-size: .9rem;
}
#formulaire .divvehiculedetail .location .inpunumb{
    width: 30px;
    margin-left: 10px;
    border: none;
    background-color: #f0f8fc;
    color: #000;
    font-weight: 600;
    font-style: normal;
}
#formulaire .devissend{
    margin-bottom: 30px;
width: 60%;
margin-left: 20%;
background-color: #51c5a1;
border-radius: 18px;
padding: 5px;
}

.bloctotal{
    color: #336699;
    font-weight: 600;
    font-style: normal;
    margin-top: 15px;
margin-bottom: 15px;
position: relative;
font-size: .9rem;
}
.bloctotal span{
    color: #336699;
    font-weight: normal;
    font-style: normal;
}
.detailequip{
    padding-top: 10px;
    padding-bottom: 10px;
    color: #000;
    width: 50%;
    height: 200px;
    position: relative;
    display: flex; 
} 
.detailequip .mage{
    height: 200px;
    width: 47%;
    display: flex;
    align-items: center;
}
.detailequip .mage .img div img{
    cursor: pointer;
}
.detailequip .pamage{
    height: 200px;
    width: 47%;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding-left: 3%;
    padding-right: 3%;
}
.detailequip .pamage .detbot{
    display: flex;
    justify-content: space-between;
}
.detailacht{
    padding-top: 40px;
    padding-bottom: 10px;
    color: #000;
    width: 100%;
    min-height: 35px;
    position: relative;
    display: flex;
    justify-content:  space-evenly;
}
.demiel{
    width: 55%;
}
.txtname{
    padding-left: 2%;
padding-right: 2%;
text-align: left;
font-size: 1rem;
}
.txtachat{
    padding-left: 3%;
padding-right: 3%;
}
.reinitform{
    border: none;
border-radius: 30px;
background-color: #c78cac !important;
height: 45px;
width: 17%;
font-weight: normal;
font-style: normal;
font-family: 'Poppins';
font-size: 1rem;
color: #fff; 
cursor: pointer;
position: absolute;
left: 2%;
top: 0;
}
.detailequip .blocleft{ 
display: flex;
justify-content: space-evenly;
align-items: center;
height: 1.9rem;
-webkit-box-sizing: inherit;
-moz-box-sizing: inherit;
box-sizing: inherit;
width: 40%;
}
.detailequip span{
    color: #000;
    padding-left: 5px;
    font-size: 1.5rem;
    padding-right: 5px;
    cursor: pointer;
    line-height: 1.7rem;
}
.detailequip .nbequ{
    width: 20px;
    text-align: center;
    border: none;
    color: #000;
    font-size: 1.5rem;
}
.detailequip .prix{
    cursor: default;
    font-size: 1.15rem;
border-radius: 15px;
}
.detailequip .textcenter{
    text-align: center;
}

.detailacht .blocleft{ 
    width: auto;
    background-color: #d4e0f4;
padding-top: .6rem;
padding-bottom: .6rem;
border-radius: 15px;
display: flex;
justify-content: space-evenly;
height: 1.7rem;
padding-left: 20px;
padding-right: 20px;
-webkit-box-sizing: inherit;
-moz-box-sizing: inherit;
box-sizing: inherit;
}
.detailacht span{
    color: #000;
    padding-left: 5px;
    font-size: 1.7rem;
    padding-right: 5px;
    cursor: pointer;
    line-height: 1.5rem;
}
.detailacht .nbequ{
    width: 40px;
    text-align: center;
    border: none;
    background-color: #d4e0f4;
    color: #000;
    font-size: 1.5rem;
}
.detailacht .prix{
    cursor: default;
    font-size: 1.15rem;
width: 35%;
background-color: #fff;
border-radius: 15px;
height: 50px;
line-height: 50px;
}
.detailacht .textcenter{
    text-align: center;
    display: inline-block;
    padding: 0;
    width: 20%;
    line-height: 50px;
font-size: 1.5rem;
white-space: nowrap;
}
.detailacht .txtacht .posispeleft .koikes{
    top: 19px;
}
.accordtop{
    color: #336699;
    cursor: pointer;
    margin-bottom: 5px;
    padding-left: 25px;
padding-right: 25px;
text-align: center;
font-size: 1.15rem;
}
.accordbutt{
    color: #000; 
    cursor: pointer;
    padding-left: 5px;
    padding-right: 5px;
text-align: left;
font-size: 1.15rem; 
font-weight: 600;
padding-top: .3rem;
padding-bottom: .3rem;
border-bottom: 1px solid #000;
position: relative;
}
.txteq .accordcov{
    background-color: #fff; 
width: 94%;
position: relative;
margin-bottom: 20px;
margin-left: 3%;
}
.txteq .accordcov::before{
    content: '';
width: 100%;
display: inline-block;
height: 100%;
position: absolute;
left: 100%;
}
@media screen and (max-width: 1600px ){
    .accordtop{  }
    @media screen and (max-width: 1200px){
        .accordtop{  }
        @media screen and (max-width: 992px){
            
.detailacht .textcenter{
    width: 30%;
}
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                            
.detailacht .textcenter{
    font-size: 1.2rem;
    width: 40%;
}
                }
            }
        }
    }
}
.accordtop img{
    transform: rotate(180deg);
} 
.accordbot{
    height: 0;
    overflow: hidden;
    transition: all, ease 300ms;
    display: flex;
flex-wrap: wrap;
}
.onover{
    position: absolute;
    display: none;
    width: 80%;
    max-height: 140px;
    margin: 0;
    left: 10%; 
border-radius: 1px;
padding: 8px;
z-index: 9990;
font-size: 1rem;
line-height: 1.1rem;
overflow: hidden; 
overflow-y: auto;

background-color: #ededed;
color: #000;
}
.onoverse{
    bottom: 20px !important;
}
.koikes{
  /*  border: 1px solid #000;*/
font-family: "Poppins";
border-radius: 18px;
width: 20px;
display: inline-block;
height: 20px;
line-height: 20px;

text-align: center;
font-style: normal;
}
.koikes:hover{
    background-color: #fff;
}
.koikes2{
  border: 1px solid #000; 
font-family: "Poppins";
border-radius: 18px;
width: 20px;
display: inline-block;
height: 20px;
line-height: 20px;

text-align: center;
font-style: normal;
cursor: pointer;
}
.koikesbloc2{
    position: relative;
} 
.koikes2:hover{
    color: #ee662b;
}
.koikes2hover{
    position: absolute;
    display: block;
    bottom: 36px;
    height: 0;
    background-color: #fff;
    width: 80%;
    overflow: hidden; 
    border: 1px solid #ffff;
    border-radius: 10px;
    padding: 0;
}
.koikes2hover h6{
    margin-top: 10px;
    text-align: center;
}
.koikes2hover p{
    margin-bottom: 10px;
    margin-top: 0;
}
.onover .img{
  width: 100%;
  position: relative;
  display: block;
  text-align: center;
  top: 0;
}
.onover .img div img{
    max-width: 100%;
    max-height: auto;
    margin: auto;

}
.onover .img div{
    max-width: 40%;
    max-height: auto;
    margin: auto;
    display: inline-block;
}
.koikes:hover ~ .onover{
    display: block;
}
.onover:hover{
display: block;
}
.heightauto{
    max-height: inherit;
    text-align: left;
}
.blocradio .koikes{
    margin-left: 10px;
}
.bigwidt{
    width: 90%;
left: -5%;
margin-top: 0;
}
.chkbx{display: none;}
  .side-label {
    cursor: pointer; 
    display: inline-flex;
justify-content: space-evenly;
align-items: center;
  }
  
  .side-label::before, .side-label::after {
    content: '';
  }

  .side-label::before {
    display: block;
    width: 16px;
    height: 16px;
    border: 2px solid #000;  
  }
  
  input:focus + .side-label::before {
    border-color: #000;
  }
  
  .side-label::after {
    display: none;
    width: 18px;
    height: 18px;
    margin: 0px;
    background-color: #000;
    -webkit-box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
    -moz-box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
    box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
  }
  
  input:checked + .side-label::before {
    background-color: #000;
  }
  .hflex{
    display: flex;
  }
  .hflex .side-label{
    width: auto;
  }
  .chkbx:checked ~ .blocked {
    display: none;
  }
  
  .chkbx:checked ~ button {
    display: block;
  }
  .btn-valider{
    border: 2px solid #51c5a1 !important; 
background-color:#51c5a1 !important;
height: 30px;
width: 40% !important;
font-weight: normal !important;
font-style: normal !important;
font-family: 'Poppins' !important;
font-size: 1.6rem !important;
color:#000 !important;
cursor: pointer !important;
margin-top: 13px !important;
font-size: 1.15rem !important;
}

@media screen and (max-width: 992px){
    .btn-valider{
    margin-top: 2px !important;
    height: 35px;
    }
}
.btn-valider:hover{
    background-color:#fc9047;
    border: 2px solid #fc9047;
}
.resumbottom{
    position: absolute;
    bottom: 0;
    height: 100px;
    background-color: #f0f8fc;
    width: 100%;
    padding-top: 20px;
}
.resumbottom .rightalign{
    display: block;
    width: 90%;
    text-align: right;
    right: 20px;
    position: relative;
    margin-bottom: 5px;
    font-size: .9rem;
}

.resumbottom .modifselec{
position: absolute;
left: 85%;
top: 12px;
z-index: 6002;
width: 38px;
height: 38px;
background-image:url('../img/modif.png');
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
background-size: contain;
border: none;
background-color:
rgba(0,0,0,0);
}
.resumbottom .eraseselec{
    position: absolute;
    left: 85%;
    top: 40px;
    z-index: 6002;
    width: 38px;
height: 38px;
background-image:url('../img/erase.png');
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
background-size: contain;
border: none;
background-color:
rgba(0,0,0,0);
}
.reinit{
    width: 48px;
height: 54px;
position: absolute;
right: 0;
top: 0;
background-image:url('../img/reinit.png');
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
background-size: contain;
}
.pagenextform{
    width: 78%;
    height: auto;
    background-color:#1c2667;
    position: fixed;
    bottom: 0;
    z-index: 7500;
    padding-top: 10px;
    text-align: left;
    left: 0;
    padding-left: 15%;
    padding-right: 7%;padding-bottom: 15px;
    transition: all ease 200ms;
}
.centerblock2{
    display: inline-block;
text-align: center;
display: flex;
margin-top: 10px;
border-top: 1px solid #fff;
}
.centerblock2 .quart1{
    width: 20%;
    text-align: left;
    position: relative;
}
.centerblock2 .quart1::before{
    content: ' ';
    width: 8px;
border-radius: 8px;
height: 8px;
    background-color: #fff;
    display: inline-block;
    position: absolute;
    top: -4px;
    left: 30px;
    z-index: 777;
}

.centerblock2 .quartf::after{
    content: ' ';
    width: 30px; 
height: 8px;
    background-color: #1c2667;
    display: inline-block;
    position: absolute;
    top: -4px;
    left: 0;
    z-index: 666;
}
.centerblock2 .quart5::after{
    content: ' ';
    width: calc( 100% - 30px); 
height: 8px;
    background-color: #1c2667;
    display: inline-block;
    position: absolute;
    top: -4px;
    left: 30px ;
    z-index: 666;
}
.centerblock2 .quart1 p{
    font-size: 1rem;
    color: #fff;
    margin-top: 15px;
}

.centerblock2 .quart1 p span{  
    font-weight: 700;
}
.centerblock2 .dodge{
    content: ' ';
    width: 16px;
    border-radius: 16px;
    height: 16px;
    background-color: #1c2667;
    border: 1px solid #fff;
    display: inline-block;
    position: absolute;
    top: -9px;
    left: 25px;
    z-index: 888;
}
.centerblock2 .dodge::before{
    content: ' ';
width: 8px;
border-radius: 8px;
height: 8px;
background-color: #51c5a1;
display: inline-block;
position: absolute;
top: 4px;
left: 4px;
z-index: 999;
}
.etape1 .quartf p{
    color: #51c5a1;
}
.etape1 .quartf .dodge{
    display: inline-block;
}
.etape1 .quart2 .dodge, .etape1 .quart3 .dodge,.etape1 .quarte .dodge, .etape1 .quart5 .dodge {
    display: none;
}
.etape2 .quart2 .dodge{
    display: inline-block;
}
.etape2 .quart2 p{
    color: #51c5a1;
}
.etape2 .quartf .dodge, .etape2 .quart3 .dodge, .etape2 .quarte .dodge, .etape2 .quart5 .dodge{
    display: none;
}
.etape3 .quart3 .dodge{
    display: inline-block;
}
.etape3 .quart3 p{
    color: #51c5a1;
}
.etape3 .quartf .dodge, .etape3 .quart2 .dodge, .etape3 .quarte .dodge, .etape3 .quart5 .dodge{
    display: none;
}
.etape4 .quarte .dodge{
    display: inline-block;
}
.etape4 .quarte p{
    color: #51c5a1;
}
.etape4 .quartf .dodge, .etape4 .quart2 .dodge, .etape4 .quart3 .dodge, .etape4 .quart5 .dodge{
    display: none;
}
.etape5 .quart5 .dodge{
    display: inline-block;
}
.etape5 .quart5 p{
    color: #51c5a1;
}
.etape5 .quartf .dodge, .etape5 .quart2 .dodge, .etape5 .quart3 .dodge, .etape5 .quarte .dodge{
    display: none;
}

.centerblock2 .et1{
    width: 20%;
    position: relative;
    top: -25px;
}
.centerblock2 .et2{
    width: 20%;
    position: relative;
    top: -25px;
}
.centerblock2 .et3{
    width: 20%;
    position: relative;
    top: -25px;
}
.centerblock2 .et4{
    width: 20%;
    position: relative;
    top: -25px;
}
.centerblock2 .et5{
    width: 20%;
    position: relative;
    top: -25px;
}
.centerblock2 .et1::after{  
    content: ' ';
    width: 50%;
    background-color: #1c2667;
    height: 10px;
    position: absolute;
    z-index: 200;
    left: 0;
    top: 20px;
}
.centerblock2 .et1::before{
    content:' ';
    background-color: #1c2667;
    background-image: url('../img/picto/Pictove.svg');
    width: 50px;
    height: 50px;
    display: inline-block;
    position: relative;
    z-index: 666;
}
.centerblock2 .et2::before{
    content:' ';
    background-color: #1c2667;
    background-image: url('../img/picto/Pictopers.svg');
    width: 50px;
    height: 50px;
    display: inline-block;
    position: relative;
    z-index: 666;
}
.centerblock2 .et3::before{
    content:' ';
    background-color: #1c2667;
    background-image: url('../img/picto/servicew.svg');
    width: 50px;
    height: 50px;
    display: inline-block;
    position: relative;
    z-index: 666;
    background-size: contain;
}
.centerblock2 .et4::before{
    content:' ';
    background-color: #1c2667;
    background-image: url('../img/picto/Pictolivr.svg');
    width: 50px;
    height: 50px;
    display: inline-block;
    position: relative;
    z-index: 666;
}
.centerblock2 .et5::before{
    content:' ';
    background-color: #1c2667;
    background-image: url('../img/picto/Pictorec.svg');
    width: 50px;
    height: 50px;
    display: inline-block;
    position: relative;
    z-index: 666;
}
.centerblock2 .et5::after{  
    content: ' ';
    width: 50%;
    background-color: #1c2667;
    height: 10px;
    position: absolute;
    z-index: 200;
    right: 0;
    top: 20px;
}
.dispm .etape1 .et1::before{
    background-image: url('../img/picto/Pictoveg.svg');
}
.dispm .etape2 .et2::before{
    background-image: url('../img/picto/Pictopersg.svg');
}
.dispm .etape3 .et3::before{
    background-image: url('../img/picto/service.svg');
}
.dispm .etape4 .et4::before{
    background-image: url('../img/picto/Pictolivrg.svg');
}
.dispm .etape5 .et5::before{
    background-image: url('../img/picto/Pictore.svg');
}

@media screen and (max-width: 768px){
    .pagenextform{ height: 100px; }
}
.boutprec{
    border: none;
background-color: #fff;
height: 30px;
padding-left: 2%;
padding-right: 2%;
font-weight: bold;
font-style: normal;
font-family: 'Poppins';
font-size: 1.1rem;
color: #000;
cursor: pointer;
}
.reinitformbut{ 
    border: none; 
    color: #fff; 
    background-color: #1c2667;
    font-weight: 700;
    cursor: pointer;
}
.boutsuiv{
    border: none;
background-color: #51c5a1;
height: 30px;
padding-left: 2%;
padding-right: 2%;
font-weight: bold;
font-style: normal;
font-family: 'Poppins';
font-size: 1.1rem;
cursor: pointer; 
color: #000;
}
.boutou{
    position: absolute;
left: 22.7%;
font-size: 2.5rem;
top: 20%;
}
.boutet{
    position: absolute;
left: 48.7%;
font-size: 2.5rem;
top: 20%;
}
.seloccneuf{
    padding-top: 50px;
}
.seloccneuf > span{
    padding: 20px;
    color: #000;
    font-size: 1.8rem;
    text-align: center;
    background-color: #fff;
    cursor: pointer;
    display: inline-block;
    width: 80%;
}
.seloccneuf > span:hover{
    background-color: #51c5a1;
}
.remise .boutou{
    left: 23.1%;
    top: 35%;
}
.remise .boutet{
    left: 48.7%;
    top: 35%;
}
.centerblock{
    display: inline-block;text-align: center;
    display: flex;
    align-items: center;
    width: 90%;
    justify-content: space-between;
}
.quint{
    width: 20%;
}
.htcenter{
    color: #fff;
    font-size: 1.1rem;
}
.htcenter b{
    font-size: 1.1rem;
    color: #51c5a1;
}
.ttccenter{
    color: #fff;
    font-size: .9rem;
}
.bloc{
 /*    min-height: 450px; */
    border: 1px solid #fff;
margin: auto;
margin-top: 25px;
margin-bottom: 25px;
position: relative;
display: inline-block;
padding-bottom: 10px;
background-color: #fff;
overflow: hidden;
}
.demi{
    display: inline-block;
    width: 50% !important;
}
.trquart{
    display: inline-block;
    width: 75%;
} 
.trquart table{
    width: 100%;
}
.dispm .centerblock2 .quart1{display: none;}
.dispm .centerblock2 .quartm{display: inline-block;}
.dispm .centerblock2{
    margin-top: 25px;
    height: 15px;
    margin-left: 20px;
margin-right: 20px;
}
.dispm{
    padding-left: 1%;
    padding-right: 1%;
    width: 98%;
    padding-bottom: 5px;
    padding-top: 5px;
    height: 65px;
}
.dispm .centerblock{
    width: 75%;
margin-left: 12%;
}
    .quint{width: auto;}
    .dispm .boutsuiv{ width: 15px; position: absolute;
    right: 5px; top: 30px;z-index: 888; font-size: 0;height: 40px;}
    .dispm .boutsuiv::after{
        content : '>';
        font-size: 1.8rem;
    }
    .dispm .boutprec{ width: 15px;  position: absolute;
left: 5px; top: 30px;z-index: 888; font-size: 0;height: 40px;}
.dispm .boutprec::after{
    content : '<';
    font-size: 1.8rem;
}
.dispm .reinitformbut{font-size: 0;}
.dispm .reinitformbut::after{
    content : '> Réinit';
    font-size: 1rem;
}
.reducrecap{
    position: absolute;
    width: 30px;
height: 40px;
    display: inline-block;
    right: 2%;
    top: -5px;
    font-size: 1.8rem;
    color: #fff;
    cursor: pointer;
}
@media screen and (max-width: 992px){
    .trquart{ width: 90%; }
    .demi{ width: 90% !important; }
}

.centerblock2 .quartm{display: none;}

@media screen and (max-width: 992px){ 
    .pagenextform{
        padding-left: 6%;
        padding-right: 6%;
        width: 88%;
    }
    @media screen and (max-width: 768px){
        .centerblock2 .quart1{display: none;}
        .centerblock2 .quartm{display: inline-block;}
        .centerblock2{
            margin-top: 25px;
            height: 15px;
            margin-left: 20px;
margin-right: 20px;
        }
        .pagenextform{
            padding-left: 1%;
            padding-right: 1%;
            width: 98%;
            padding-bottom: 5px;
            padding-top: 5px;
            height: 75px;
        }
        .centerblock{width: 98%;
            margin-left: 1%;}
            .quint{width: auto;}
        .boutsuiv{ 
            width: 20px;
position: absolute;
right: 5px;
top: 30px;
z-index: 888;
font-size: 0;
height: 40px;
        }
            .boutsuiv::after{
                content : '>';
                font-size: 1.8rem;
            }
        .boutprec{ width: 20px;
            position: absolute;
            left: 5px;
            top: 30px;
            z-index: 888;
            font-size: 0;
            height: 40px;}
        .boutprec::after{
            content : '<';
            font-size: 1.8rem;
        }
        .reinitformbut{font-size: 0;}
        .reinitformbut::after{
            content : '> Réinit';
            font-size: 1rem;}
            
.reducrecap{
    display: none;
}
@media screen and (max-width: 576px){ 
    .boutsuiv{ 
        width: 20px; 
right: 5px;
top: 30px; 
height: 40px;
    }
    .boutprec{ width: 20px; 
        left: 5px;
        top: 30px;  
        height: 40px;}
}
    }
}

#findevis .demi{
    display: inline-block;
    width: inherit;
}
.livraisonreprise{
    padding: 5%;
    padding-bottom: 50px;
    color: #000;
    text-align: left;
    padding-top: 0;
}
.livraisonreprise h2{
    font-size: 1.5rem;
    color: #000;
    margin-bottom: 0;
    line-height: 2.5rem;
    font-weight: 600;
}
.livraisonreprise .txtname{
text-align: center;
font-weight: 700;
}
.livraisonreprise .descriptiontarif .txtname{
font-weight: normal;
}

.livraisonreprise .txtname .onover p{
    margin-top: 0;
    text-align: left;
}
.livraisonreprise .bloc label{
    font-size: .9rem;
}
.livraisonreprise .bloc .hflex label{
    margin-left: 10px;
}
.livraisonreprise .bloc .plivre{
    margin-top: .1rem;
    margin-bottom: .4rem;
}
.dispflexliv{
    display: flex;
}
.livraisonreprise .bloc p{
    margin-left: 3%;
}
.livraisonreprise .bloc .totalht{
    font-size: 1.4rem;
    text-align: right;
    margin-right: 2%;
}
.livraisonreprise .bloc .totalht span{
    color: #51c5a1;
    font-weight: bold;
}
.livraisonreprise .bloc .totalhtp{
    font-size: 1.1rem;
    text-align: right;
    margin-top: 0;
    margin-right: 2%;
}
.livraisonreprise .bloc .totalhtp span{
    color: #cccccc;
    font-weight: bold;
}

.livraisonreprise .bloc .divval{
    border: none;
    background-color: #51c5a1;
    height: 35px;
    font-weight: bold;
    font-style: normal;
    font-family: 'Poppins';
    font-size: 1.1rem;
    cursor: pointer;
    color: #000;
    display: inline-block;
    margin-left: 41%;
    width: 14%;
    text-align: center;
    line-height: 35px;
}
.etapglob{
    
    margin-right: 20px;
}
.minih2{
    margin: 0;
    color: #000;
    font-size: .9rem;
    margin-bottom: 20px;
}
.livraisonreprise input{
    font-family: "Poppins";
    
}
.buttreprlivr{
    background-color: #f4f7f9;
    border: none;
    color: #51c5a1;
    margin-top: 25px;
    font-weight: 700;
    font-size: 1.05rem;
    text-align: left;
}
.addlivraisonreprise{
padding-left: 30px;
padding-right: 30px;
display: inline-block;
color: #000;
background-color: #51c5a1;
font-size: 1.2rem;
height: 30px;
cursor: pointer;
border: none;
font-weight: bold;
position: absolute;
left: 5%;
width: 25%;
}
.addlivraisonreprisel{
    padding-left: 30px;
    padding-right: 30px;
    display: block;
    color: #000;
    background-color: #51c5a1;
    font-size: 1.2rem;
    height: 30px;
    cursor: pointer;
    border: none;
    font-weight: bold;  
    width: 86%;
    margin-top: 5px;
    margin-bottom: 10px;
}
@media screen and (max-width: 768px){
    .addlivraisonreprise{ width: 75%; }
}
.remonreprise{
    width: 25%;
    display: inline-block;
    color: #000;
    background-color: #ed8c8c;
    font-size: 1rem;
height: 30px;
cursor: pointer;
font-weight: 600;
    font-style: italic;
    border: none;
    position: absolute;
    right: 5%;
    bottom: 70px;
}
.livraisonreprisebase{
    color: #000; 
    padding-left: 3%;
padding-right: 3%;
position: absolute;
top: 35px;
left: 5%;
width: 84%;
min-height: 90vh;
}
.livraisonreprisebase p{
    font-size: .9rem;
}
.livraisonreprisebase label{
    font-size: 1rem;
}
.livraisonreprisebase input{
    border: none;
    background-color: #F4F7F9;
    
    color: #336699;
    padding: 5px;
    margin: 10px;
}
.vallivraisonreprisebase{
    display: inline-block;
    border: none;
background-color: #51c5a1;
height: 30px;
padding-left: 5%;
padding-right: 5%;
font-weight: bold;
font-style: normal;
font-family: 'Poppins';
font-size: 1.1rem;
cursor: pointer;
color: #1c2667;
text-align: center;
line-height: 30px;
margin-left: 70%;
}
.textital{
    color: #000;
}
.italpetit{
    color: #000;
    
}
.textcontact a{
    color: #51c5a1;
    cursor: pointer;
    text-decoration: none;
}
.blocemploye{
    border: 1px solid #fff;
margin: auto;
margin-top: 25px;
margin-bottom: 25px;
position: relative;
display: inline-block; 
background-color: #fff;
min-height: 30vh;
width: 100%;
}
.blocemploye .emplnamebloc{
    width: 70%;
}
.blocemploye .emplname{
    display: inline-block;
width: calc(20% - 2px);
    padding-top: 5px;
    padding-bottom: 5px;
    font-size: 1.2rem;
    color: #000;
    text-align: center;
    border: 1px solid #51c5a1;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom: none;
    cursor: pointer;
}
.blocemploye .emplnameblocdes{
    border-top: 1px solid #51c5a1;
    padding-bottom: 15px;
} 
.blocemploye .bloclivflex{
    display: flex;
}
.blocemploye .bloclivflex .demiflex{
width: 50%;
display: inline-block;
}
.blocemploye .bloclivflex .demiflex p{
    margin: 0;
    padding-left: 2rem;
    padding-right: 2rem;
}
.livraisonreprise .trquart{
    min-height: 30vh;
}
.erase{
    background-image: url('../img/erase.png');
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    background-size: contain;
    position: absolute;
    margin-top: 100px;
    width: 50px;
    height: 50px;
    left: 7%;
}
.repfaq{
    overflow: hidden;
    color: #000 !important;
     
    text-align: justify;
    max-height:0; 
    margin-left: 3%;
    margin-right: 3%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.repfaq > ul > li{  }
.blocinfo .repfaq p{
    font-size: .9rem;
  }

.blocemploye .partgauche{
    width: 33%;
    display: inline-block;
    float: left;
    padding-top: 25px;
}
.blocemploye .partgauche #incone{
    width: 100%;
    height: 100px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    margin-top: 10px;
}
.blocemploye .partgauche .hote_hotesse{   
background-image: url('../img/hote.png');
}
.blocemploye .partgauche .mecanicien{   
background-image: url('../img/mecanicien.png');
}
.blocemploye .partgauche .photographe{   
background-image: url('../img/photographe.png');
}
.blocemploye .partgauche .pilote{   
background-image: url('../img/pilote.png');
}
.blocemploye .partgauche .regisseur{   
background-image: url('../img/regisseur.png');
}
.blocemploye .partdroite{
    width: 67%;
    display: inline-block;
    padding-top: 25px;
}
.blocemploye .partdroite .cursor{
    cursor: pointer;
}
.blocemploye .partdroite table{
    
table-layout: fixed;
  width: 100%;
}
.blocemploye .partdroite table .minispace{
    width: 5%;
}
.blocemploye .partdroite .pointer{ 
    cursor: pointer;
}
.blocemploye .partdroite table .tabladress{
    display: none;
}
 
        @media screen and (max-width: 1400px){ 
            @media screen and (max-width: 1200px){ 
                .addlivraisonreprisel{ width: 50%;}
            @media screen and (max-width: 992px){
                .addlivraisonreprisel{ width: 76%;}
                @media screen and (max-width: 768px){
                    .addlivraisonreprisel{ width: 86%;height: auto;}
                    @media screen and (max-width: 576px){
                        
                    }
                }
            }
        } 
    } 
.blocemploye .partdroite .rechadresse{ 
    position: absolute;
top: 10%;
right: 5% !important;
width: 30%;
z-index: 50;
height: 80%;
padding: 5px;
background-color: rgba(255,255,255,1);
border-radius: 5px;
border: 1px solid #336699;
overflow-x: auto;
left: inherit !important;

}
.blocemploye .partdroite .rechadresse .buttclose{ 
    color: red;
    position: absolute;
    top: 5px;
    right: 10px;
    font-weight: bold;
    
    cursor: pointer;
}
.blocemploye .partdroite .rechadresse .recher{
    width: 80%;
    color: #336699;
    background-color: #F4F7F9;
    border: none;
    border-radius: 10px;
    height: 30px;
    padding: 5px;
    margin-right: 2%;
    font-size: .9rem;
}
.blocemploye .partdroite .rechadresse .listrech p{
    margin: 0;
    text-align: left;
    margin-left: 10px;
    margin-top: 5px;
    cursor: pointer;
    font-size: .9rem;
}
.blocemploye .partdroite .listpersonnel .btn{
    display: inline-block;
    font-weight: 200;
    text-align: center;
    padding: 0.8rem 1.4rem;
line-height: .5;
border-radius: 0.25rem;
margin: 0;
cursor: pointer;
font-size: 2rem;
}
.blocemploye .partdroite .listpersonnel p{
    margin: 0;
    min-height: 10px;
}
.blocemploye .partdroite .listpersonnel .prix{
    margin: 0;
    margin-left: 20px;
    font-weight: bold;
}
.blocemploye .hrdes{
    width: 67%;
}
.blocemploye .partdroite th{
    font-size: .9rem;
}
.blocemploye .tddate{
    width: 8%;
}
.blocemploye .tdinput{
    width: 7%;
}
.blocemploye .tdpers{
    width: 10%;
}
.blocemploye .tdvehi{
    width: 20%;
}
.blocemploye .partdroite td p{
    font-size: .9rem;
}
@media screen and (max-width: 1400px){ 
.blocemploye .partgauche{width: 30%;}
.blocemploye .partdroite{width: 70%;}
    @media screen and (max-width: 1200px){ 
        .blocemploye .partgauche{width: 22%;}
        .blocemploye .partdroite{width: 78%;}
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
.blocemploye .butname{
    width: 100%;
    background-color: #fff;
    height: 50px;
    border: none;
    cursor: pointer;
    color: #336699;
    
    font-weight: bold;
    font-style: normal;
}
.blocemploye .nbemploye{
    color: #336699;
    font-weight: 600;
    font-style: normal;
}
.inpunumb{
    width: 30px;
    margin-left: 10px;
    border: none;
    background-color: #ffffff;
    font-size: 1.2rem;
    color: #000;
    font-weight: 600;
    font-style: normal;
}
.selelem{
    width: 30px;
    margin-left: 10px;
    border: none;
    background-color: #ffffff;
    color: #000;
    font-size: 1.2rem;
    font-weight: 600;
    font-style: normal;
    -webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
.seldivelem{
    width: 47px;
display: inline-block;
position: relative;
}
.seldivelem::after{
    position: absolute;
content: "";
background-image: url('../img/accord.png');
background-repeat: no-repeat;
background-position: center;
background-size: contain;
width: 15px;
height: 15px;
right: 0;
top: 5px;
transform: rotate(180deg);
pointer-events:none;
}
.blocemploye textarea{
    background-color: #F4F7F9;
    width: 80%;
    height: 60px;
    border: #F4F7F9;
    
    font-family: 'Poppins';
    color: #336699;
    padding: 5px;
}
.livraisonreprise .blocemploye h4{
    font-weight: 500;
    font-style: normal;
    color: #000;
    font-size: 1rem;
    text-align: left;
    margin-right: .4rem;
}
.blocemploye .addadresse{
    border: none;
    background-color: #fff;
    color: #000;
    padding: 10px;
    font-size: 1.15rem;
    cursor: pointer;
    transition: all ease 200ms;
}
.cursor{
    cursor: pointer;
}
.blocemploye .buttdetdate{
    text-align: left;
    color: #51c5a1;
    font-size: 1.4rem;
    margin-left: 2.2rem;
    cursor: pointer;
}
.blocemploye .buttdetdate span{
    color: #000;
    background-color: #51c5a1;
    border-radius: 50%;
    padding: .1rem .6rem;
margin-left: .4rem;
margin-right: .4rem;
}

.blocemploye .buttdetdate2{
    text-align: left;
    color: #51c5a1;
    font-size: 1.6rem;
    cursor: pointer;
}
.blocemploye .buttdetdate2 span{
    color: #000;
    background-color: #51c5a1;
    border-radius: 50%;
    padding: .1rem .6rem;
margin-left: .4rem;
margin-right: .4rem;
}
.blocemploye .subdiv{
margin: .4rem;
display: flex;
justify-content: space-around;
}

.livraisonreprise .blocemploye .subdiv h4{
    font-size: 1rem;
}
.overemploy{
    font-size: 1rem;
}
.overemploy:hover{
    background-color: #d4e0f4;
}
.blocemploye .titrelieux{    
    font-weight: 500;
    font-style: normal;
    color: #336699;
    
margin-left: 15%;
text-align: left;
}

.blocemploye .reacdet .partlef{
    width: 25%;
    float: left;
}
.blocemploye .reacdet .partrigh{
    width: 75%;
    display: inline-block;
    text-align: left;
}
.blocemploye .imgaccord{
    position: absolute;
    right: 5%;
    top: 25px;
}
.blocemploye .reacdet .partrigh p{
margin-top: 0;
text-align: left;
width: 50%;
display: inline-block;
font-size: .9rem;
font-weight: 600;
font-style: normal;
padding-bottom: 10px;
}
.blocemploye .reacdet table{
    margin: auto;
    margin-bottom: 15px;
    width: 90%;
}
.blocemploye .reacdet .partrigh table{

    width: 100%;
}
.blocemploye .reacdet .partrigh .dixpour{
    width: 15%;
}
.blocemploye .reacdet .partrigh .hupour{
    width: 70%;
}
.blocemploye .reacdet .partrigh .cinqpour{
    width: 1%;
}
.blocemploye .reacdet .partrigh .qatvinpour{
    width: 95%;
    text-align: right;
    font-weight: normal;
}
.blocemploye .reacdet .partrigh .qatvinpour span{
    font-weight: bold;
    font-size: 1.2rem;
}
.blocemploye .reacdet .partrigh .prixfin span{
    font-size: 2rem;
    color: #51c5a1;
}
.blocemploye .reacdet p span{
    
font-weight: normal;
font-style: normal;
}
.blocemploye th{
    padding-left: 3px;
    padding-right: 3px;
}
.blocemploye td{
    padding-left: 3px;
    padding-right: 3px;
}
.blocemploye td p{
    margin: 0;
}
.blocemploye .onover{
    left: inherit;
    right: 4%;
    width: auto;
}
.wraptext{
    white-space: nowrap;
}
.blocemploye .reacdet .partrigh .onover p{
    width: auto;
}
 .inputadresse{
    width: 95%;
    color: #000;
    background-color: #fff;
    border: 1px solid #000;
    height: 25px;
    padding-left: 5px;
    padding-right: 5px;
    display: inline-block;
}
#autocomplete .inputadresse{
   width: 80%;
   font-size: .9rem;
}
.bloclivraisonreprise{
    position: absolute;
    top: 30px;
left: 5%;
width: 90%;z-index: 666;
overflow-y: auto;
padding-bottom: 20px;
}
.bloclivraisonreprise table{
    width: 100%;
}
.bloclivraisonreprise table td{
    text-align: center;
}
.bloclivraisonreprise table input{
    width: 95%;
    height: 30px;
    width: 95%;
color: #000;
background-color: #fff;
border: 1px solid #000;
height: 30px;
padding: 5px 0;
display: inline-block;
margin-top: 0;
margin-bottom: 0;
}
.bloclivraisonreprise > span{
    margin-left: 2%;
    display: inline-block;
}
.inputpays{
    width: 20%;
    color: #336699;
    background-color: #F4F7F9;
    border: none;
    border-radius: 10px;
    height: 30px;
    padding: 5px;
}
.inputville{
    width: 32%;
    color: #336699;
    background-color: #F4F7F9;
    border: none;
    border-radius: 10px;
    height: 30px;
    padding: 5px;
    margin-right: 2%;
}
.inputcp{
    width: 15%;
    color: #336699;
    background-color: #F4F7F9;
    border: none;
    border-radius: 10px;
    height: 30px;
    padding: 5px;
    margin-right: 2%;
}
.inputregion{
    width: 20%;
    color: #336699;
    background-color: #F4F7F9;
    border: none;
    border-radius: 10px;
    height: 30px;
    padding: 5px;
}
#autocomplete{
    width: 55%;
    background-color: #fafafa;
    height: 250px;
    display: inline-block;
    position: relative;
}
.hidiv{
    position: absolute;
width: 100%;
height: auto;
/* z-index: 9000; */
overflow: hidden;
}
#autocomplete > p{
    margin: 2px;
    margin-left: 10px;
    text-align: left;
    cursor: pointer;
    font-size: .9rem;
}
.relative{
    position: relative;
}
.relativediv{
    position: relative;
    height: 50px;
    margin-top: 15px;
}
.bloclivraisonreprise .relativediv{
    height: auto;
    margin-top: 0;
}
.closeautocomplete{
    left: -5px;
position: absolute;
cursor: pointer;
color:red;
font-weight: 800;
}

.livraisonreprise .title{
    position: relative;
    width: 100%;
    height: 50px;
    border-radius: 20px 20px 0px 0;
display: inline-block;
}
.livraisonreprise .title input{
    width: 60%;
height: 25px;
margin-top: 10px;
border: none;
color: #51c5a1;
background-color: #fff; 
text-align: left; 
font-size: 1.6rem;
font-weight: 600;
margin-left: 2%;
}
.livraisonreprise h4{
    font-size: 1.2rem;
    margin-left: 3%;
    margin-right: 3%;
    margin-top: 0.8rem;
}
.livraisonreprise .rechadresse {
    position: absolute;
    top: 10%;
    left: 22%;
    width: 56%;
    z-index: 50;
    height: 80%;
    padding: 5px;
    background-color: rgba(255,255,255,.95);
    border-radius: 5px;
    border: 1px solid #336699;
    overflow-x: auto;
}
.livraisonreprise .rechadresse .buttclose{ 
    color: red;
    position: absolute;
    top: 5px;
    right: 10px;
    font-weight: bold;
    
    cursor: pointer;
}
.livraisonreprise .rechadresse input{
    width: 70%;
    margin-top: 25px;
}
.livraisonreprise .adlab{
    position: relative;
    top: 5px;
}
.eraslivrec{
    position: absolute;
    right: 0%;
top: 5px;
    z-index: 6002;
    width: 48px;
height: 43px;
background-image:url('../img/erase.png');
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
background-size: contain;
border: none;
background-color:
rgba(0,0,0,0);
}
.eraslivrecred{
    position: absolute;
    right: 0%;
top: 5px;
    z-index: 6002;
    width: 48px;
height: 43px;
background-image:url('../img/erase2.png');
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
background-size: contain;
border: none;
background-color:
rgba(0,0,0,0);
}
 .radlivrep{
padding: 5px; 
width: 98%;
display: inline-block;
text-align: center;
color:#808080;
cursor: pointer;
font-family: 'Poppins';
font-style: normal;
margin-left: 1%;
margin-right: 1%; 
font-weight: 600;
font-size: 1.2rem !important;
} 
.buttdate{
    padding: 3px;
    border: none;
border-radius: 40px;
width: 35px;
height: 35px;
display: inline-block;
text-align: center;
cursor: pointer;
font-family: 'Poppins';
font-weight: normal;
font-style: normal;

margin-left: 1%;
margin-right: 1%;
margin-top: 5px;
margin-bottom: 5px;

}
.hove{
    position: absolute;
    display: inline-block;
    width: 60%;
    left: 20%;
    
    margin-top: 22px;
    color: red;
    opacity: 0;
    transition: all ease 500ms;
}
.buttdate:hover .hove{
    opacity: 1;
}
.widthmax{
    width: 60%;margin-left: 20%;
}
.inputime{
    display: inline;
    height: 25px;
    border: 1px solid #000;
    background-color: #fff;
    color: #000;
    font-size: .9rem;
    font-family: 'Poppins';
    text-align: center;
    width: 100%;
}
.react-datepicker-wrapper{
    max-width: 100%;
}
.react-datepicker-popper{
    z-index: 9999;
}
@media screen and (max-width: 1200px){
    .inputime{  }
    @media screen and (max-width: 992px){
        @media screen and (max-width: 768px){
            @media screen and (max-width: 576px){
                
            }
        }
    }
}
.margmin{
    margin: 5px;
}
.fullinput{
    width: 74%;
    color: #000;
    background-color: #F4F7F9;
    border: none;
    height: 30px;
    padding: 5px;
    margin-bottom: 13px;
}
.flexel{
    display: flex;
    justify-content: space-between;
}
.demibloclivrep{
    width: 48%;
}
.fulltexta{
    width: 48%;
    color: #000;
    background-color: #fff;
    border: 1px solid #000;
    height: 120px;
    padding: 5px;
    margin-bottom: 13px;
    margin-top: 13px;
    margin-left: 2%;
    font-family: "Poppins";
    font-size: .9rem;
}
.slick-prev::before{ 
    content: '' !important;
}
.slick-prev{
    left: 10px !important;
    z-index: 1800;
    background-image: url('../img/arrow.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
}
.slick-next::before{ 
    content: '' !important;
}
.slick-next{
    top: 45% !important;
    right: 10px !important;
    z-index: 1800;
    background-image: url('../img/arrow.png') !important;
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    transform: rotate(180deg) !important;
}
.zoomin{
    background-image: url('../img/zoom.png');
    width: 30px;
    height: 30px;
    background-size: contain ;
    background-repeat: no-repeat ;
    background-position: center ;
    position: relative;
left: 88%;
margin-top: 15px;
margin-bottom: 15px;
cursor: pointer;
}
@media screen and (max-width: 1600px ){
    .zoomin{
        width: 18px;
        height: 18px;
    }
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
.photonone{
    display: none;
}
.photodisp{position: fixed;
    width: 100% !important;
    height: 100% !important;
    left: 0;
    top: 0;
    z-index: 9000;
    background-color: rgba(0,0,0,0.6);
}
.photodisp .closeslide{
    position: absolute;
    right: 5%;
    top: 25px;
    color: #fff;
    font-weight: 600;
    z-index: 88888;
    cursor: pointer;
}
.photodisp .modal_bloc_out{
    position: absolute;
    width: 100% !important;
    height: 100%;
    background-color: rgba(0,0,0,0.6);
    margin: 0 !important;
    z-index: 8888;
    display: flex;
    justify-content: center;
    align-items: center;
}
.photodisp .slick-slider{
    z-index: 9200;
margin-top: 5%;
}
.photodisp .slick-slide img{
    max-height: 70vh;
max-width: 90vh;
}
.photodisp .slick-thumb li{
    width: auto;
height: auto;
max-height: 12vh;
margin: 5px;
margin-top: 10px;
}
.photodisp .slick-thumb li img{
    max-height: 12vh;
}/*
.slick-dots{
    bottom: -106px !important;    
    position: unset !important;
}
.slick-next, .slick-prev{
    position: absolute;
}
.dispbloc .slick-dots li{
    width: 150px !important;
height: 100px !important;
}
.dispbloc .slick-dots li a{
    width: 150px !important;
height: 100px !important;
}
.dispbloc .slick-dots li a div{
    width: 150px !important;
height: 100px !important;
} */
.dispbloc .slick-dots li button::before{
    content: '•' !important;
}
.dispbloc .slick-dots, .slick-next, .slick-prev{
    position: relative;
}
.dispbloc .slick-dots{
    position: relative;
    bottom: 0 !important;
}
.modal_bloc img{
    max-height: 550px;
}
.modal_bloc{ 
    height: 100%; 
    left: 0;
    top: 0;
}
.dispnone{ 
    width: 33%;
    display: inline-block;
}
.dispnone .modal_bloc_out{
display: none;
}
.dispbloc .modal_bloc_out{
    position: absolute;
    width: 100% !important;
    height: 100%;
    background-color: rgba(200, 200, 200, 0.1);
    margin: 0 !important;
    z-index: 8888;
    display: flex;
    justify-content: center;
    align-items: center;
}
.dispnone .closeslide{
    display: none;
}
.dispbloc .closeslide{
    position: absolute;
    right: 5%;
    top: 25px;
    color: #fff;
    font-weight: 600;
    z-index: 88888;
    cursor: pointer;
}
.dispbloc{
    position: fixed;
    width: 100% !important;
    height: 100% !important;
    left: 0;
    top: 0; 
    z-index: 9000;
    background-color: rgba(0,0,0,0.6);
}

.dispbloc .zoomin{
    display: none;
}
.dispbloc .slick-slider{
    z-index: 9200;
    margin-top: 2%;
}
.dispbloc .slick-slide img{
    max-height: 65vh;
}
.dispbloc .slick-thumb img{
max-height: 100%;
}

.accordeon{
    overflow: hidden;
    margin-left: 5%;
margin-right: 5%; 
border-bottom: 1px solid rgba(81, 120, 147, .5); 
padding-bottom: 0 !important;
margin-top: 10px;
}
.accord{
    overflow: hidden;
    margin-left: 0;
margin-right: 0; 
border-bottom: 1px solid rgba(81, 120, 147, .5); 
padding-bottom: 0 !important;
margin-top: 10px;
}
.question{
    text-align: left;
    font-weight: 600 !important;
    font-style: normal !important;
    color:#123466 !important;
    
    cursor: pointer;
    min-height: 30px;
    margin-left: 32px;
}
.quesiv{
    text-align: left; 
    font-style: normal !important;
    color: #123466 !important;
    
    cursor: pointer;
    min-height: 30px;
    margin-left: 32px;
}
.questdiv{
    display: inline-block; 
    max-width: 97%;
}
.reponse{
    color: #123466 !important;
     
    text-align: justify;
    max-height:0; 
    margin-left: 3%;
    margin-right: 3%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.reponseacc{
    color: #123466 !important;
     
    text-align: justify;
    max-height:0; 
    margin-left: 3%;
    margin-right: 3%;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.imgaccord{
    width: 18px;
    margin-left: -20px;
    margin-right: 3%;
    transform: rotate(0deg);
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

@media screen and (max-width: 1600px ){
    .quesiv{
        font-size: 1.4rem!important;
        min-height: 18px;
    }
    .question{
        font-size: 1.4rem!important;
        min-height: 18px;
    }
    .reponseacc{
        font-size: 1.4rem!important; 
line-height: 20px !important;
    }
    .reponse{
        font-size: 1.4rem!important; 
line-height: 1.4rem!important;
    }
    .imgaccord{
        width: 15px;
    }
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}

 /* The Modal (background) */
 .modal {
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    z-index: 9999;
  }
  .modalreg {
    display: block; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    z-index: 9999;
  }
.modalreg2{
    display: block; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    z-index: 9000;
}
  
  /* Modal Content/Box */
  .modal-content {
    background-color: #fefefe;
    margin: 10% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 29%; /* Could be more or less, depending on screen size */
    border-radius: 20px;
    z-index: 9999;
position: relative;
  }
  
@media screen and (max-width: 768px){
    .modal-content { width: 80%; }
}
  
  /* The Close Button */
  .close {
    color: #aaa;
    float: right;
    font-weight: normal;
  }
  
  
  .close:hover,
  .close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
  } 
  .typerad{
      text-align: left;
  }
  .typerad > input{
      display: none;
  }
  .typerad > label{
    position: relative;
    margin: 10px 0;
    padding-left: 35px;
    cursor: pointer;
    margin-left: 11%;
    width: 34%;
    display: inline-block;
    color: #000;
  }
  
  .typerad > label::before, .typerad > label::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
  }

  .typerad > label::before {
    display: block;
    width: 16px;
    height: 16px;
    border: 2px solid #51c5a1;  
  }
  
  .typerad > input:focus + .typerad > label::before {
    border-color: #51c5a1;
  }
  
  .typerad > label::after {
    display: none;
    width: 20px;
    height: 20px;
    margin: 0px;
    background-color: #51c5a1;
    -webkit-box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
    -moz-box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
    box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
  }
  .typerad > input:checked +  label::after {
    display: block;
  }
  #registration, #connexion{
    text-align: center; 
  }
  #registration p, #connexion p{
    color: #000;
    width: 60%;
    margin: auto;
    margin-top: 10px;
    margin-bottom: 15px;
  }
  #registration ul, #connexion ul{
      list-style: none;
      color: #ee662b;
  }
  #registration h3, #connexion h3 {
      color: #1c2667;
  }
  #registration input[type=text], #connexion input[type=text], #connexion input[type=password]{
    width: 80%;
    background-color: #f4f7f9;
    border: none;
    height: 35px;
    border-radius: 5px;
    padding-left: 10px;
    padding-right: 10px;
    color: #000;
    margin: auto;
    margin-bottom: 10px;
    box-shadow: none;
  }
  .valider{
    border: none; 
    background-color: #51c5a1;
    height: 45px;
    width: 40%;
    font-weight: normal;
    font-style: normal;
    font-family: 'Poppins';
    font-size: 1.1rem;
    color: #000; 
    cursor: pointer;
  }
  #cnxion, #registr{
      border: none;
      background-color: #fff;
      color: #000;
      margin-top: 10px;
      cursor: pointer;
      
  }

  .usersimg{
    background-image:url('../img/users.png');
    background-repeat: no-repeat;
    background-position: center;
    height: 30px;
width: 30px;
display: inline-block;
  }
  .blocrec{
    border: none !important;
    padding: 0 !important;
    width: 96%;
    margin-left: 2%;
    position: relative;
  }
.blocrecap{
    border: none;
    padding-bottom: 0;
    overflow: hidden;
    color: #000;
}
.disprecbaloc{
    display: flex;
    justify-content: space-between;
    width: 100%;
}
.disprecbaloc div p{
    margin-top: 3px;
} 
.disprecbaloc div:nth-child(3) p{
    text-align: right;
}
.remise{
    position: relative;
}
.remise .blocrecap{
    background-color: #fff;
}
.blocrecap .title{ 
    display: block;
    height: 60px;
    font-weight: 600;
    font-style: normal;
    color: #000;
    line-height: 60px;
    font-size: 1.15rem;
    border: none;
}
.blocrecap .recapprice{
    
    font-weight: 600;
    font-style: normal;
    color: #000;
    margin: 10px;
}
.blocrecap .detail{
    background-color: #7ceebe;
    padding-top: 25px;
    padding-bottom: 25px;
    color: #000;
    font-size: 1rem;
}
.remisebloc .blocrecap .detail{
    background-color: #eeeadf;
}
.remisebloc .closedescr-wrapper{
    position: absolute;
    right: 10px;
}
.remisebloc .closedescr-wrapper:hover{
    cursor: pointer;
}
.remisebloc .btn-valider{
    position: absolute;
    bottom: -40px;
    right: 0;
}
.blocrecap .detail h5{
    margin: 0;
    font-size: 1.6rem;
}
.blocrecap .detail .alignleft{
  width: 25%;
text-align: center;
display: inline-block;
padding-bottom: 25%;
position: relative;
}
.circle{
    position: absolute;
    width: 80%;
    height: 80%;
    margin-left: 10%;
    border-radius: 50%;  
background: #51c5a1;
display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
}
.mincircle{
    position: absolute;
    width: 90%;
    height: 90%;
    border-radius: 50%;  
    border: 1px solid #fff;
    display: flex;
align-items: center;
flex-direction: column;
justify-content: center;
}
.blocrecap .detail .alignleft label{
    position: absolute;
    bottom: 3%;
    left: calc(50% - 15px);
}
.blocrecap .detail .margbot{
    margin-bottom: 20px;
}
.blocrecap .detail .txtreduc{
    font-size: 2rem;
    line-height: 2rem;
    color: #1c2667;
    margin: 0;
    width: calc(100% - 50px);
    margin-left: 20px;
    display: inline-flex;
    align-items: center;
    position: relative;
top: -8px;
}
.blocrecap .detail p{
    font-size: 2rem;
    line-height: 2rem;
    color: #1c2667;
    margin: 0;
    width: calc(100% - 50px);
    margin-left: 20px;
    display: inline-flex;
    align-items: center;
    position: relative;
top: -8px;
}
.blocrecap .detail span{
    color: #000;
    font-size: 1.4rem;
    line-height: 2.6rem;
    margin-left: 10px;
}
.blocrecap .detail p sup{
    position: relative;
top: 4px;
font-size: 3rem;
}
.circlej{
    background: #d4e0f4;
}
.blocrecap .detail .circlej p, .blocrecap .detail .circlej span{
    color: #000;
}
.blocrecap .boutfin{
    display: inline-block;
    margin: auto;
    width: 28%;
    margin-bottom: 20px;
    margin-left: 65%;
    margin-right: 0;
    height: 40px;
    color: #1c2667;
}

@media screen and (max-width: 1600px ){
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            .blocrecap .detail .alignleft{
                width: 40%;
                padding-bottom: 40%;
            }
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
.blocrecap .detail .reductext label {
    display: inline-block;
    width: 30px;
    height: 30px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    position: relative;
    font-weight: lighter;
  }
  .blocrecap .blocredetail .detail .reductext label {
    top: 7px ;
    }
  .blocrecap .detail .reductext label svg {
    display: block;
    position: absolute;
  }
  .blocrecap .detail .reductext label svg > path {
      display: none;
  }
  .blocrecap .detail .reductext label input {
    display: block;
    outline: none;
    border: none;
    padding: 0;
    margin: 0;
    -webkit-appearance: none;
    width: 30px;
    height: 30px;
    border-radius: 5%/5%;
    box-shadow: inset 0 0 0 1.5px #444;
    background: #fff;
    transition: background 0.25s linear, box-shadow 0.25s linear;
  }
  
.blocrecap .detail .grey span{
    color: #aaa;
}
.blocrecap .detail .grey label input{
    box-shadow: inset 0 0 0 1.5px #aaa;
}

  .agencemodl{
    display: flex;
  }
  .agencemodl .btn-valider{
    position: absolute;
    right: 5%;
    bottom: 30px;
    width: 30% !important;
  }
  .agencemodl > div{
    display: inline-block;
    width: 33%;
  }
  .agencemodl > div .btn-valider{
    margin-left: 56%;
  }  
  .agencemodl .btn-grey{
    position: absolute;
    left: 5%;
    bottom: 30px;
    width: 30% ;
    border: 2px solid #e9e9e9 ;
    background-color: #e9e9e9;
    height: 30px; 
    font-weight: normal;
    font-style: normal;
    font-family: 'Poppins'; 
    color: #000 ;
    cursor: pointer ;
    margin-top: 13px ;
    font-size: 1.15rem ;
  }
  .erasevehic{
    position: absolute;
    right: 0%;
    top: 30px;
    z-index: 6002;
    width: 48px;
    height: 43px;
    background-image: url(../img/erase2.png);
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    background-size: contain;
    border: none;
    background-color: rgba(0,0,0,0);
  }
  .agencemodl .imgserv-wrapper{
    padding: 7%;
  }
  .blocrecap .detail .reductext label input + svg {
    width: 33px;
    height: 30px;
    left: 0;
    top: 0;
    color: #51c5a1;
  }
  .blocrecap .detail .reductext label input + svg .tick {
    stroke-dasharray: 20;
    stroke-dashoffset: var(--stroke-dashoffset, 20);
    transition: stroke-dashoffset 0.2s;
  }
  .blocrecap .detail .reductext label input + svg .tick.mask {
    stroke: #51c5a1;
  }
  .blocrecap .detail .reductext label input + svg + svg {
    width: 11px;
    height: 11px;
    fill: none;
    stroke: #6e7bf2;
    stroke-width: 1.25;
    stroke-linecap: round;
    top: -6px;
    right: -10px;
    stroke-dasharray: 4.5px;
    stroke-dashoffset: 13.5px;
    pointer-events: none;
    -webkit-animation: var(--animation, none) 0.2s ease 0.175s;
            animation: var(--animation, none) 0.2s ease 0.175s;
  }
  .blocrecap .detail  label input:checked {
   /* --background: #fff;*/
    border: #444;
  }
  .blocrecap .detail  label input:checked + svg {
    --stroke-dashoffset: 0;
  }
  .blocrecap .detail  label input:checked + svg + svg {
    --animation: check;
  }
  .blocrecap .detail  label:hover input:not(:checked) {
    border: #444;
  }
  
.blocservices label {
    display: inline-block;
    width: 30px;
    height: 30px;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    position: relative;
  }
  .blocservices label svg {
    display: block;
    position: absolute;
  }
  .blocservices label svg > path {
      display: none;
  }
  .blocservices label input {
    display: block;
    outline: none;
    border: none;
    padding: 0;
    margin: 0;
    -webkit-appearance: none;
    width: 30px;
    height: 30px;
    border-radius: 5%/5%;
    box-shadow: inset 0 0 0 1.5px #444;
    background: #fff;
    transition: background 0.25s linear, box-shadow 0.25s linear;
  }
  .blocservices label input + svg {
    width: 33px;
    height: 30px;
    left: 0;
    top: 0;
    color: #51c5a1;
  }
  .blocservices label input + svg .tick {
    stroke-dasharray: 20;
    stroke-dashoffset: var(--stroke-dashoffset, 20);
    transition: stroke-dashoffset 0.2s;
  }
  .blocservices label input + svg .tick.mask {
    stroke: #51c5a1;
  }
  .blocservices label input + svg + svg {
    width: 11px;
    height: 11px;
    fill: none;
    stroke: #6e7bf2;
    stroke-width: 1.25;
    stroke-linecap: round;
    top: -6px;
    right: -10px;
    stroke-dasharray: 4.5px;
    stroke-dashoffset: 13.5px;
    pointer-events: none;
    -webkit-animation: var(--animation, none) 0.2s ease 0.175s;
            animation: var(--animation, none) 0.2s ease 0.175s;
  }
  .blocservices label input:checked {
   /* --background: #fff;*/
    border: #444;
  }
  .blocservices label input:checked + svg {
    --stroke-dashoffset: 0;
  }
  .blocservices label input:checked + svg + svg {
    --animation: check;
  }
  .blocservices label:hover input:not(:checked) {
    border: #444;
  }
  .textserv{ 
    margin: 0;
      margin-left: 0px;
    width: calc(100% - 50px);
    margin-left: 20px;
    display: inline-block;
  }
  .textserv span:nth-child(2){ 
    margin-left: 5px;
  }
  .detservices > p{
    margin-top: 2px;
    margin-bottom: 5px;
  }
  .inputservices{
    display: flex;
    align-items: center;
  }
  .catserv > p {
    margin-top: 2px;
    margin-bottom: 5px;
  }
  @-webkit-keyframes check {
    100% {
      stroke-dashoffset: 4.5px;
    }
  }
  
  @keyframes check {
    100% {
      stroke-dashoffset: 4.5px;
    }
  }
@media screen and (max-width: 768px){
    .blocrecap .boutfin{ width: 60%; bottom: 0;}
    .blocrecap .detail .alignleft{ margin-left: 1%; }
}
.recaglob{
    background-color: #f1f0f7;
    border-top: 1px solid #51c5a1;
    padding-top: 15px;
}
.blocrecap .reacbloc{
    background-color: #f1f0f7;
    min-height: 60px;
    color: #000;
    position: relative;
}
.blocrecap .reacbloc h6{
    font-weight: 500;
    font-style: normal;
    
    height: 60px;
line-height: 60px;
cursor: pointer;
margin-top: 0;
border-bottom: 1px solid #cad6db;
}
.blocrecap .reacbloc .reacdet{
    background-color: #f1f0f7;
    height: auto;
    padding-top: 15px;
    padding-bottom: 15px;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
.blocrecap .reacbloc .reacdet .partlef{
    width: 25%;
    float: left;
}
.blocrecap .reacbloc .reacdet .partrigh{
    width: 75%;
    display: inline-block;
    text-align: left;
}
.blocrecap .reacbloc .imgaccord{
    position: absolute;
    right: 5%;
    top: 25px;
}
.blocrecap .reacbloc .reacdet .partrigh p{
margin-top: 0;
text-align: left;
width: 50%;
display: inline-block;
font-size: .9rem;
font-weight: 600;
font-style: normal;
padding-bottom: 10px;
}
.blocrecap .reacbloc .reacdet table{
    margin: auto;
    margin-bottom: 15px;
    width: 90%;
}
.blocrecap .reacbloc .reacdet .partrigh table{

    width: 100%;
}
.blocrecap .reacbloc .reacdet .partrigh .dixpour{
    width: 15%;
}
.blocrecap .reacbloc .reacdet .partrigh .hupour{
    width: 70%;
}
.blocrecap .reacbloc .reacdet .partrigh .trentpour{
    width: 50%;
}
.blocrecap .reacbloc .reacdet .partrigh .vinpour{
    width: 35%;
}
.blocrecap .reacbloc .reacdet .partrigh .vinpour p{
    width: 100%;
}
.blocrecap .reacbloc .reacdet .partrigh .cinqpour{
    width: 5%;
}
.blocrecap .reacbloc .reacdet .partrigh .qatvinpour{
    width: 95%;
    text-align: right;
    font-weight: normal;
}
.blocrecap .reacbloc .reacdet .partrigh .qatvinpour span{
    font-weight: bold;
    font-size: 1.2rem;
}
.blocrecap .reacbloc .reacdet .partrigh .prixfin span{
    font-size: 2rem;
    color: #51c5a1;
}
.blocrecap .reacbloc .reacdet .partrigh .listpersonnel{
    margin-left: 0;
    width: 92%;
}
.blocrecap .reacbloc .reacdet .partrigh .listpersonnel th, .blocrecap .reacbloc .reacdet .partrigh .listpersonnel td{
    text-align: center;
}

.accordbutt .imgaccord{ 
    position: absolute;
height: 18px;
width: 30px;
right: 1%;
top: 13px;
}

.listpersonnel .btn{
    width: 20px;
height: 20px;
background-color: #51c5a1;
border-radius: 20px;
text-align: center;
line-height: 20px;
}
.listpersonnel .inputime{
    background-color: #ebebeb;
}
.listpersonnel .pointer{
    background-color: #ebebeb; 
height: 25px;
line-height: 25px;
padding-left: 5px;
padding-right: 5px;
}
.listpersonnel .prix{
    background-color: #ebebeb;
    height: 25px;
    line-height: 25px;
    padding-left: 5px;
    padding-right: 5px;
}
.listpersonnel th{
    color: #b2b2b2;
}
.borderempl{
    border-top: 1px solid #000;
    margin-top: 25px;
margin-left: 3%;
width: 94%;
}
.blocrecap .reacbloc .reacdet p span{
    
font-weight: normal;
font-style: normal;
}
.blocrecap .reacbloc th, .blocrecap .reacbloc td{
    font-size: .9rem;
}
.txtremises{
    position: absolute;
    right: 10%;
    top: -30px;
    height: 30px;
    background-color: #51c5a1;
    font-weight: bold;
    border-radius: 15px;
    padding-left: 20px;
    padding-right: 20px;
    line-height: 30px;
}
.spantop{
    display: inline-block;
vertical-align: top;
}
.reacdet .soustot{
    font-weight: 600 !important;
    font-style: normal !important;
    
    text-align: center !important;
}
.reacdet .totgen{
    font-weight: 600 !important;
    font-style: normal !important;
    
    text-align: center !important;
}
.reacdet hr{
    width: 85%;
    border: 1px solid #CAD6DB;
    border-bottom: none;
    margin-bottom: 0;
}
.margrecap{
    margin-bottom: 75px;
}
/*
.chkbx1{display: none;}
  .side-label1 {
    position: relative;
    margin: 10px 0;
    padding-left: 35px;
    cursor: pointer;
    margin-left: 29px;
  }
  
  .side-label1::before, .side-label1::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
  }

  .side-label1::before {
    display: block;
    width: 11px;
    height: 11px;
    border: 2px solid #d4e0f4;  
    border-radius: 8px;
  }
  
  input:focus + .side-label1::before {
    border-color: #d4e0f4;
  }
  
  .side-label1::after {
    display: none;
    width: 15px;
    height: 15px;
    margin: 0px;
    border-radius: 13px;
    background-color: #d4e0f4;
    -webkit-box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
    -moz-box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
    box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
  }
  
  input:checked + .side-label1::after {
    display: block;
  }
  
  .chkbx1:checked ~ .blocked {
    display: none;
  }
  
  .chkbx1:checked ~ button {
    display: block;
  }
  .side-label2 {
    position: relative;
    margin: 10px 0;
    padding-left: 35px;
    cursor: pointer;
    margin-left: 29px;
  }
  
  .side-label2::before, .side-label2::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
  }

  .side-label2::before {
    display: block;
    width: 11px;
    height: 11px;
    border: 2px solid #d4e0f4;  
  }
  
  input:focus + .side-label2::before {
    border-color: #d4e0f4;
  }
  
  .side-label2::after {
    display: none;
    width: 15px;
    height: 15px;
    margin: 0px;
    background-color: #d4e0f4;
    -webkit-box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
    -moz-box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
    box-shadow: 5px 5px 4px -2px rgba(0,0,0,.2);
  }
  
  input:checked + .side-label2::after {
    display: block;
  }*/
  .modal-content2{
    background-color: #fefefe;
    margin: 10% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 50%; /* Could be more or less, depending on screen size */
    border-radius: 20px;
  }
.listvehic{
    width: 10%;
    margin: 1.8%;
    display: inline-block;
    cursor: pointer;
    opacity: .7;
    font-size: .9rem;
}
.listvehic p{
    margin-top: 5px;
}
.selectvehic{
    opacity: 1 !important;
    border: 2px solid #51c5a1;
}
.validmodal{
    border: none;
border-radius: 30px;
background-color: #336699;
height: 45px;
width: 40%;
font-weight: normal;
font-style: normal;
font-family: 'Poppins';

color: #fff;
margin-top: 0;
cursor: pointer;
}
.selvehic{
    margin: 0;
}
.butselec{
    color: #336699;
}
.rdrDayDisabled{
    background-color: #f0f8fc !important;
}
.rdrDay{
    height: 1.8rem !important;
}
.Media{
    display: block;
width: 100%;
margin-bottom: 10px;  
}
.Media a{
    display: block;
width: 100%; 
text-decoration: none;
}
.Media a p{ 
}
.Media a div{
    display: block;
width: 100%;
height: 130px; 
background-image: url('../img/pdf.png');
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.opaclair{
  /*  opacity: .5; */
}
.blocinfo{
    text-align: left;
    background-color: #f4f7f9;
    color: #000;
    box-shadow: inherit;
    border: 1px solid #f4f7f9;
    max-width: 100%;
width: 100%;
padding-top: 1.4rem;
margin-bottom: 0;
}
.livrel{
    display: flex;
    border-top: 1px solid #51c5a1;
    margin-top: 15px;
}
.livrel .blocinfo{
    width: 50%;
    margin: 0;
}
.blocinfo ul{
    margin-top: .5rem;
    display: flex;
    flex-direction: column;
    list-style: none;
}

.blocinfo li{
    font-size: .9rem;
    margin-top: .9rem;
    width: 100%; 
}
.livrel .blocinfo li{
    width: 80%;
}
.blocinfo li::before {
    content: "\2022";  /* Add content: \2022 is the CSS Code/unicode for a bullet */
    color: #51c5a1; /* Change the color */
    font-weight: bold; /* If you want it to be bold */
    display: inline-block; /* Needed to add space between the bullet and the text */
    width: 1em; /* Also needed for space (tweak if needed) */
    margin-left: -1em; /* Also needed for space (tweak if needed) */
  }
.blocinfo > p{
    font-size: .9rem;
    padding-left: 2rem;
    padding-right: 2rem;
    margin-top: 0;
}
.blocinfo li p{
    font-size: .9rem;
}
.recapperso{
        background-color: #f1f0f7;
        color: #000;
        box-shadow: inherit;
        padding-bottom: 0;
        width: 100%;
        table-layout: fixed;
        font-size: .9rem;
        margin: 0;
        padding-left: 2%;
        padding-right: 2%;
        border: none;
} 
.recapperso p{
    font-weight: 600;
    font-size: 1.3rem;
    margin-bottom: 15px;
}
.recapperso th{
    font-size: 1rem;
font-weight: 600;
}
.recapperso table{
  border-collapse: collapse;
  border-bottom: 2px solid #51c5a1;
}
.recapperso td{
    font-size: 1rem;
    padding-top: 10px;
    padding-bottom: 20px;
    border-bottom: 1px solid #000;
}
.recapperso tr{
}

@media screen and (max-width: 992px){
    .blocinfo{ max-width: 90%; width: 90%; }

    .recapperso{ max-width: 90%; width: 90%; }
}
.recapperso table{
width: 100%;
table-layout: fixed;
}
.hrecap{
    width: 75%;
    background-color: #c3d5e0; 
height: 1px;
border: none;
}
.recaper{
    text-align: center;
    width: 100%;
    position: relative;
display: inline-block;
margin: auto;
}
.recaper p{
    font-size: 1rem;
    margin-top: 0;
    text-align: right;
    font-weight: 400;
}
.recaper p span{
    color: #51c5a1;
    font-size: 1.4rem;
    font-weight: 600;
}
.recaper h4{
    font-size: 1.3rem;
}
.recaper table{
width: 100%;
table-layout: fixed; 
border-collapse: collapse;
}

.recaper table .totalht{
    font-size: 1.2rem;
}
.recaper table  .totalht span{
    color: #51c5a1;
    font-weight: bold;
}
@media screen and (max-width: 992px){
    .recaper{ width: 80%;}
}
.recaper table td{
    border-bottom: 1px solid #c3d5e0;
    padding-top: 10px;
    padding-bottom: 10px;
    font-size: .9rem;
}
@media screen and (max-width: 1600px ){
    #formulaire .vehiculedetail{
      /*  height: 360px; */
    }
    #formulaire .vehiculedetail .location{
        /*  height: 360px; */
    }
    #formulaire .vehiculedetail .right{
        /*  height: 360px; */
    }
    #formulaire .vehiculedetail .description{
        /*  height: 360px; */
    }
    .reinit{
        width: 27px;
        height: 27px;
        right: 20px;
        top: 15px;
    }
    .resumbottom{
        height: 60px;
    }
    .resumbottom .modifselec{
        top: 10px; 
width: 32px;
height: 32px;
    }
    .resumbottom .eraseselec{
        top: 37px; 
width: 32px;
height: 32px;
    }
    .resumbottom .rightalign{
        
    }
    .rdrDateRangeWrapper{
        width: 95%;
    }
    .rdrMonth{
        width: 95% !important;
    }
    #formulaire .vehiculedetail .location .textelocation{
        
    }
    #formulaire .vehiculedetail .location .textelocation span{
        
    }
    .btn-annuler,.btn-save{
        height: 36px;
        width: 36%;
        
    }
    .side-label{
        width: 45%;
    }
    .side-label::before{
        width: 16px;
height: 16px;
    }
    .txtname{
        padding-left: 3%;
        padding-right: 3%;
    }
    .detailequip{
        
    }
    .koikes{
        
        width: 17px;
        height: 17px;
        line-height: 15px;
    }
    .detailequip .prix{
        
        right: 5px;
    }
    .detailequip .nbequ{
        width: 20px;       
 /* margin-left: 17px;*/
    }
    .detailequip span{
       /* top: -7px; */
    }
    .rdrMonthAndYearPickers select{
        padding: 5px 5px 5px 5px !important;
        
    }
    .rdrMonthAndYearWrapper{
        height: 45px !important;
    }
    .txtachat{
        
        padding-left: 10%;
    padding-right: 10%;
    }
    @media screen and (max-width: 1200px){
        #formulaire .vehiculedetail .right .listebutton .prxgreen{font-size: 1rem;}
        #formulaire .vehiculedetail .right .tarifsuite{font-size: .9rem;}
        
    .side-label{
        width: 50%;
    }
        @media screen and (max-width: 992px){
            #formulaire .vehiculedetail{
              /*  height: 310px; */
              padding-top: 0;
            }
            #formulaire .vehiculedetail .location{
                /*  height: 310px; */
            }
            #formulaire .vehiculedetail .right{
                /*  height: 310px; */
            }
            #formulaire .vehiculedetail .description{
                /*  height: 310px; */
            }
            .koikes2{
                width: 15px;
                height: 15px;
                line-height: 15px;
            }
            @media screen and (max-width: 768px){
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}



.calendar {
    padding: 0 0; 
}
.calendarblock .btn-valider{
    margin-top: 0;
    height: 25px;
}
.calendar table{
    width: 94%;
margin-left: 3%;
border-collapse: collapse;
}

.calendar .table-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    width: 90%;
margin-left: 5%;
}

.calendar #left-arrow, .calendar #right-arrow {
    display: flex;
    align-items: center;
}
.calendar #left-arrow:hover,.calendar #right-arrow:hover{
    font-weight: 800;
    cursor: pointer;
}
.calendar #month-year {
    text-transform: capitalize; 
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.6rem;
    font-family: "Poppins";
    color: #51c5a1;
}

.calendar .iconify.arrow {
    font-size: 2.5rem;
    
}
.calendar .rdrNextButton i {
    border-color: transparent transparent transparent #51c5a1;
    border-width: 6px 6px 6px 8px;
}
.calendar .rdrPprevButton i {
    border-width: 6px 8px 6px 6px;
    border-color: transparent #51c5a1 transparent transparent ;
}


#formulaire .voirbloctarif .calendar .table-header button{
    margin: 0;
    width: 25px;
    border: none;;
    background-color: #fff;
}

.calendar .table>thead>tr>th,
.calendar .table>thead>tr>td,
.calendar .table>tbody>tr>th,
.calendar .table>tbody>tr>td{
    border:none;
    /* transition: all .1s ease-in; */
    text-align: center;
    margin-top: 1.4rem;
    padding: 3px;
line-height: 1.42857143;
vertical-align: top;    
font-size: .9rem;
}

.calendar .table>tbody>tr>th.select-date.active.start,
.calendar .table>tbody>tr>td.select-date.active.start{
    /*
    border-top-left-radius: 2rem;
    border-bottom-left-radius: 2rem; */
    font-weight: 600;
}

.calendar .table>tbody>tr>th.select-date.active.end,
.calendar .table>tbody>tr>td.select-date.active.end{
/*
    border-top-right-radius: 2rem;
    border-bottom-right-radius: 2rem; */
    font-weight: 600;
}

.calendar .table>tbody>tr>th.empty:hover,
.calendar .table>tbody>tr>td.empty:hover{
    cursor:not-allowed;
    background:initial;
    color:initial;
}

.calendar .table>tbody>tr>th.active,
.calendar .table>tbody>tr>td.active{
    background: #51c5a1;
    color: #666;
}

.calendar .table>tbody>tr>th:hover,
.calendar .table>tbody>tr>td:hover{
    background: #d4e0f4;
    color: #000;
    cursor: pointer;
}

.calendar sup {
    
    color: #c1c1c1;
    font-style: italic;
} 
.calendar .table > thead > tr > th.disable, .calendar .table > thead > tr > td.disable, .calendar .table > tbody > tr > th.disable, .calendar .table > tbody > tr > td.disable{
    color: #e0e0e0; 
}
.calendar .table > tbody > tr > th.disable:hover, .calendar .table > tbody > tr > td.disable:hover{
    background: transparent;
color: #e0e0e0;
cursor: not-allowed;
}
.devisvalid_hide{
    display: none;
}

@media screen and (max-width: 768px){
    .calendar .table > thead > tr > th, .calendar .table > thead > tr > td, .calendar .table > tbody > tr > th, .calendar .table > tbody > tr > td{
        padding: 0;
        
    }
    .calendar sup {  }
}
.bigcal #month-year{
    font-size: 1.4rem;
}
.bigcal .table > thead > tr > th, .calendar .table > thead > tr > td, .calendar .table > tbody > tr > th, .calendar .table > tbody > tr > td{
    font-size: 1.2rem;
    color: #666666;
}

.bigcal .table>tbody>tr>th.select-date.start,
.bigcal .table>tbody>tr>td.select-date.start{ 
    border-top-left-radius: 2rem;
    border-bottom-left-radius: 2rem;
    background: #51c5a1;
    color: #000;
}

.bigcal .table>tbody>tr>th.select-date.end,
.bigcal .table>tbody>tr>td.select-date.end{
    border-top-right-radius: 2rem;
    border-bottom-right-radius: 2rem;
    background: #51c5a1;
    color: #000;
}

.bigcal .table>tbody>tr>th.empty:hover,
.bigcal .table>tbody>tr>td.empty:hover{
    cursor:not-allowed;
    background:initial;
    color:initial;
}

.bigcal .table>tbody>tr>th.active,
.bigcal .table>tbody>tr>td.active{
    background: #54c4a16e;
    color: #000;
}

.bigcal .table>tbody>tr>th:hover,
.bigcal .table>tbody>tr>td:hover{
    background: #d4e0f4;
    color: #000;
    cursor: pointer;
}


#infomodalconf{
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 8888;
    background-color: #444444cc;
    display: block;
    top: 0;
    left: 0;
}
#infomodalconf .buttclose{ 
    color: red;
position: absolute;
top: 5px;
right: 20px;
font-weight: bold;

cursor: pointer;
}
#infomodalconf .infos{
    width: 85%;
    background-color: #fff;
    height: auto;
    margin: auto;
    margin-top: 15vh;
    border-radius: 25px;
    padding: 20px;
    padding-bottom: 40px;
    position: relative;
    overflow-y: auto;
}
#infomodalconf .infos p{
    font-size: 1.4rem;
}
#infomodalconf .boutconf{
    border-radius: 20px;
    background-color: #51c5a1;
    font-size: 1.4rem;
    color: #000;
    cursor: pointer;
    padding: 0;
    text-decoration: none;   
    text-align: center;
    border: none;
    padding: 10px 20px;
}
#infomodalconf .boutann{
    border-radius: 20px;
    background-color: #d4e0f4;
    font-size: 1.4rem;
    color: #000;
    cursor: pointer;
    padding: 0;
    text-decoration: none;   
    text-align: center;
    border: none;
    padding: 10px 20px;
}
#infomodal{
    position: fixed;
    width: 100%;
    height: 100vh;
    z-index: 8888;
    background-color: #444444cc;
    display: none;
    top: 0;
}
#infomodal .buttclose{ 
    color: red;
position: absolute;
top: 5px;
right: 20px;
font-weight: bold;

cursor: pointer;
}
#infomodal .infos{
    width: 85%;
    background-color: #fff;
    height: 85vh;
    margin: auto;
    margin-top: 7vh;
    border-radius: 25px;
    padding: 20px;
    position: relative;
    overflow-y: auto;
}
#infomodal .infos .sepa{
    min-height: 80px;
    width: 100%;
}
#infomodal .infos .image{
    width: 20%;
    display: inline-block; 
    height: 80px;
    float: left;
}
#infomodal .infos .texte{
    width: 79%;
    display: inline-block; 
}
#infomodal .infos img{
    max-height: 80px;
}
#infomodal .infos h4{
    margin: 1rem 0 0 0;
}
#infomodal .infos p{
    margin: 1rem 0 0 0;
}
#infovehicules{
    width: auto !important;
    padding: 15px;
    color: #51c5a1 !important;
    line-height: inherit !important;
    height: auto !important;
    background-color: inherit !important;
}
.msgerror{
    position: absolute;
top: 100px;
width: 60%;
left: 17%;
background-color: #c85c57;
border-radius: 10px;
padding: 3%;
color: #fff;
z-index: 7777;
font-size: 1rem;
}
.msgerror span{
    font-weight: 800;    
    position: absolute;
    right: 6px;
    top: 0px;
    cursor: pointer;
    color: #fff;
font-size: 1rem;
} 
#filtresel2 label{
    position: relative;
}
#filtresel2 .hovertxt{
    position: absolute;
padding: 3px;
background-color: #fafbfc;
border-radius: 2px; 
top: 30px;
z-index: 740;
width: auto;
white-space: nowrap;
display: none !important;
}
#filtresel2 label:hover .hovertxt{
    display: block !important;
}
.infoform{
    text-align: left;
    margin-bottom: 1.4rem;
    font-size: 1.15rem;
    overflow: hidden;
}
@media screen and (max-width: 768px){
    .infoform{ padding-bottom: 0;}
}
.infoform p{
    margin-top: 15px;
    margin-bottom: 15px;
    font-size: 1.15rem;
}
.blocinfoimp{
    border: 3px dashed  #123466;
    margin-left: 10%;
    width: 80%;
    margin-bottom: 20px;
    border-style: solid dashed;
}
.blocinfoimp > p{
    font-size: 1.4rem;
    cursor: pointer;
}
.infoform > p{
    width: 81%;
    line-height: 2rem;
    margin-bottom: 10px;
    font-size: 1.15rem;
}
.infoform ul{
    margin-top: 0;
    margin-bottom: 5px;
    font-size: 1.15rem;
}
.textevi{
    margin-top: 0;
    color: #c85c57;
    font-size: .9rem;
}
.fixedtop{
    position: fixed;
z-index: 8888;
top: 0;
width: 100%;
background-color: #fff;
}
@media screen and (max-width: 768px){
    .fixedtop{
    position: relative;
    }
    .keeplace{ height: 0 !important;}
}
#pages{
    color: #000;
}
#pages .slider img{
    max-height: 650px;
}
.widthvar .slick-arrow{
    width: 35px;
height: 35px;
}
.widthvar img{
    margin-left: 10px;
    height: 50vh;
}
#pages .backolor{
/*  background-color: #f7f8f9; */
  background-color: #f3f6f9;
  padding-bottom: 4rem;
}
#pages .pascolor{
  padding-bottom: 4rem;
}
#pages .minblock12{
    padding-top: 4rem; 
    padding-bottom: 0; 
}
.minblock12 a{
    white-space: nowrap;
}
#pages > .block12{
    padding-top: 5rem; 
    padding-bottom: 0; 
}
.backolor > .block12{
    padding-top: 5rem; 
    padding-bottom: 0; 
}
#pages .block12 .alicenter{
    text-align: center;
} 
#pages .block12 .margbot{
    margin-top: 4rem;
    margin-bottom: 4rem;
}
.pictos{
    padding-top: 4rem; 
}
.pictos .alicenter{
    text-align: center;
} 
#pages > .container{
    display: flex;
}
#pages .container{
    max-width: 100%;
}
@media screen and (max-width: 768px){
    #pages .container{
         display: block;
    }
}
#pages .container .widthvar{
   width: 100%;
}
#pages .bigtitle{
    text-align: center;
}
#pages .bigtitle h3{
    margin-top: 5px;
}
#pages .bigtitle p{
}
#pages .fullheight{
    float: none;
    display: flex;
    height: 100%;
    align-items: center;
}

#pages .fullheight h2{
    margin: 0;
}
#pages .btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    padding: 6px 12px;
    
    line-height: 1.42857143;
    border-radius: 4px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-top: 3rem;
}
#pages .btn.action {
    border: 1px solid transparent;
    border-radius: 30px;
    background-color: #336699;
    font-weight: normal;
    font-style: normal;
    color: #fff;
    cursor: pointer;
    padding: 12px 27px;
    
    box-shadow: -250px 0px 100px -180px #336699 inset;
    transition: all 0.2s ease-in;
}
#pages .btn.action:hover {
    background: #fff;
    color: #336699;
    border: 1px solid #336699;
    box-shadow: none;
}

#pages .picto img{
    max-height: 90px;
}
.slider .slick-slide{
    position: relative;
}
.bockslid .fullheight{
    position: absolute;
    top: 44%; left: 50%; /* à 50%/50% du parent référent */
    transform: translate(-50%, -50%);
    width: 85%;
}
.bockslid .flexheight{
    display: inline-block !important;
    text-align: center;
}
.bockslid h3{
    color: #000;
    line-height: 1.4rem;
   text-shadow: 1px 1px 10px #fff; 
    font-weight: bold;
}
.bockslid a{ 
    border: none;
border-radius: 30px;
background-color: #336699;
font-weight: normal;
font-style: normal;
font-family: 'Poppins';

color: #fff;
margin-top: 40px;
cursor: pointer;
padding: 11px 23px 11px 23px;
} 
.bockslid a:hover{
    text-decoration: none;
    box-shadow: -250px 0px 100px -180px #336699 inset;
}

@media screen and (max-width: 1200px){
    .infoform{ }
    .infoform p{ }
    .accord{ margin-top: 5px;}
    .accord p{ }
    .quesiv{   }
    .reponseacc{   } 
    .blocinfo li{ }
    .repfaq p{ }
    .repfaq > ul > li{ }
    @media screen and (max-width: 992px){
        @media screen and (max-width: 768px){
            .bockslid h3{  }
            .infoform{  }
    .infoform p{  }
    .accord{  margin-top: 5px;}
    .accord p{  }
    .quesiv{   }
    .reponseacc{   } 
    .blocinfo li{  }
    .repfaq p{  }
    .repfaq > ul > li{  }
    .bockslid a{  }
    #pages .btn.action{ margin-bottom: 1.2rem; margin-top: 1.6rem; }
    .pictos h4{ margin-bottom: 1.2rem; margin-top: .5rem; }
            @media screen and (max-width: 576px){
                
            }
        }
    }
}

.react-datepicker {
    
  }
  .react-datepicker__header {
    padding-top: 0.8rem;
  }
  .react-datepicker__month {
    margin: .4rem 1.4rem;
  }
  .react-datepicker__day-name, .react-datepicker__day {
    width: 1.9rem;
    line-height: 1.9rem;
    margin: 0.166rem;
  }
  .react-datepicker__current-month {
    
  }
  .react-datepicker__navigation {
    top: 1.4rem;
    line-height: 1.7rem;
    border: 0.45rem solid transparent;
  }
  .react-datepicker__navigation--previous {
    border-right-color: #ccc;
    left: 1.4rem;
  }
  .react-datepicker__navigation--next {
    border-left-color: #ccc;
    right: 1.4rem;
  }
#footer{
    width: 100%;
    height: 100px;
    background-color: #fff;
    position: relative;
}
.wi50{
    width: 50px;
}
.head{
background-position: bottom center;
background-size: cover;
position: relative;
overflow: hidden;
}
.head .container{
    display: flex;
align-items: center;
min-height: 100px;
}
@media screen and (max-width: 768px){
    .head .container{ display: flex !important; align-items: center; }
}
.head .overlay{
    background-color: transparent;
    opacity: 0.81;
    transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
    height: 100%;
width: 100%;
top: 0;
left: 0;
position: absolute;
}
.head .shape{
overflow: hidden;
position: absolute;
left: 0;
width: 100%;
line-height: 0;
direction: ltr;
bottom: -1px;
}
.head .shape svg{
    width: calc(200% + 1.3px);
height: 470px;
display: block;
position: relative;
left: 50%;
transform: translateX(-50%);
overflow: hidden;
}
.head .shape svg path{
    fill: #ffffff;
}
.head h1{
    color: #fff;
    text-align: center;
    margin-top: 0;
}
.head h2{
    
    color: #fff;
    text-align: center;
    margin-top: 0;
}
.mariages .paddingint{
    padding: 0 5%;
}
.mariages .slider{
    width: 100%;
}
.contact .form-control{
    margin-bottom: 15px;
}

@media screen and (max-width: 768px){
    .head h1{  line-height: 2.6rem;}
    .head h2{line-height: 1.2rem; }
    #pages .bigtitle h3{line-height: 1.3rem; margin-top: 1.4rem;}
}
.btn-danger{
    display: inline-block;
margin-bottom: 0;
font-weight: 400;
text-align: center;
white-space: nowrap;
vertical-align: middle;
-ms-touch-action: manipulation;
touch-action: manipulation;
cursor: pointer;
background-image: none;
border: 1px solid transparent;
    border-top-color: transparent;
    border-right-color: transparent;
    border-bottom-color: transparent;
    border-left-color: transparent;
padding: 6px 12px;
font-size: 14px;
line-height: 1.42857143;
border-radius: 4px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
color: #fff;
background-color: #d9534f;
border-color: #d43f3a;
text-decoration: none;
}
.btn-danger:hover {
    color: #333;
    text-decoration: none;
    background-color: #c9302c;
    border-color: #ac2925;
}
.home{
    height: auto;
}
.home img{
    max-height: 100%;
    width: 100%;
    height: auto;
}
.home .slick-list{
    height: 100%;
}
.home .bockslid{
    height: 100%;
    position: relative;
}
#modalreduc , #modalinfo{
    display: none; /* Hidden by default */
    position: fixed; /* Stay in place */
    z-index: 1; /* Sit on top */
    left: 0;
    top: 0;
    width: 100%; /* Full width */
    height: 100%; /* Full height */
    overflow: auto; /* Enable scroll if needed */
    background-color: rgb(0,0,0); /* Fallback color */
    background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
    z-index: 9999;
  }  
  #modal_reduc, #modal_info{
    background-color: #fefefe;
    margin: 5% auto; /* 15% from the top and centered */
    padding: 20px;
    border: 1px solid #888;
    width: 60%; /* Could be more or less, depending on screen size */
    border-radius: 20px;
  }
#modal_reduc h4, #modal_info h4{
    text-align: center;
}
#modal_reduc h6, #modal_info h6{
    margin-bottom: 10px;
    margin-top: 10px;
}
#modal_reduc .demileft,  #modal_info .demileft{
    display: inline-block;
    width: 47%;
    padding-right: 2%;
} 
#modal_reduc .demiright, #modal_info .demiright{
    display: inline-block;
    width: 47%;
    padding-left: 3%;
} 
#modal_reduc input[type="radio"], #modal_info input[type="radio"]{
    margin-left: 30px;
    margin-right: 10px;
}
#modal_reduc textarea, #modal_info textarea{
    width: 94%;
    background-color: #f4f7f9;
border: none;
border-radius: 5px;
padding-left: 3%;
padding-right: 3%;
color: #314e70;
margin-top: 8px;
margin-bottom: 10px;
box-shadow: none;
}
.infempl{position: absolute; right: 0;}
#modal_reduc input[type="date"], #modal_info input[type="date"]{
    width: 94%;
background-color: #f4f7f9;
border: none;
height: 35px;
border-radius: 5px;
padding-left: 3%;
padding-right: 3%;
color: #314e70;
margin: auto; 
margin-top: 8px;
margin-bottom: 10px;
box-shadow: none;
}
#modal_reduc input[type="time"], #modal_info input[type="time"]{
    width: 94%;
background-color: #f4f7f9;
border: none;
height: 35px;
border-radius: 5px;
padding-left: 3%;
padding-right: 3%;
color: #314e70;
margin: auto; 
margin-top: 8px;
margin-bottom: 10px;
box-shadow: none;
}
#modal_reduc input[type="number"], #modal_info input[type="number"]{
    width: 94%;
background-color: #f4f7f9;
border: none;
height: 35px;
border-radius: 5px;
padding-left: 3%;
padding-right: 3%;
color: #314e70;
margin: auto; 
margin-top: 8px;
margin-bottom: 10px;
box-shadow: none;
}
#modal_reduc input[type="text"], #modal_info input[type="text"]{
    width: 94%;
background-color: #f4f7f9;
border: none;
height: 35px;
border-radius: 5px;
padding-left: 3%;
padding-right: 3%;
color: #314e70;
margin: auto; 
margin-top: 8px;
margin-bottom: 10px;
box-shadow: none;
}
#modal_reduc input[type="submit"], #modal_info input[type="submit"]{
    display: inline-block;
padding: 10px;
border-radius: 10px;
margin: 3px;
cursor: pointer;
border-radius: 5px;
border: 1px solid #a9c1da;
color: #fff;
background-color: #336699;
}
#modal_reduc .elem1, #modal_reduc .elem2, #modal_reduc .elem3, #modal_reduc .elem4, #modal_reduc .elem5, #modal_reduc .elem6, #modal_reduc .elem7, #modal_reduc .elem8{
    display: block;
    height: 0;
    overflow: hidden;
}
.cliquable{
    cursor: pointer;
}
.cliquable::before{
    content: ' ';
    width: 20px;
    height: 13px;
    display: inline-block;
    background-image: url('../img/accord.png');
    background-size: contain;
background-repeat: no-repeat;
background-origin: content-box;
margin-right: 7px;
-moz-transform: scaleY(-1);
    -o-transform: scaleY(-1);
    -webkit-transform: scaleY(-1);
    transform: scaleY(-1);
    filter: FlipV;
    -ms-filter: "FlipV";
    transition: all ease 500ms;
}
.turnelem::before{
    -moz-transform: scaleY(1);
        -o-transform: scaleY(1);
        -webkit-transform: scaleY(1);
        transform: scaleY(1);
}

#beta{
    position: fixed;
    width: 30%;
    top: 20%;
    height: 40vh;
    right: 0;
    z-index: 9900;
    padding: 15px;
    overflow: hidden;
    overflow-y: scroll;
    background-color: #fff;
    border-radius: 10px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    color: #000;
}
#beta div{
    height: auto;
    position: relative;
    padding-bottom: 40px;
}
#beta div h5{
    display: none;
}
#beta div h4{
    text-align: center;
}
#beta div p{
    margin: 1rem 0 0;
}
#beta div .masqbut{
    position: absolute;
right: 5px;
bottom: 5px;
padding: 5px;
border-radius: 5px;
color: #fff;
background-color: #51c5a1;  
text-align: center;
cursor: pointer;
}
#beta .masqx{
    position: absolute;
    right: 20px;
top: 5px;  
color: #aaa; 
cursor: pointer;
}
.hidbeta{
    width: auto !important;
height: auto !important;
}
.hidbeta div{
    padding: 0 !important;
}
.hidbeta p, .hidbeta ul, .hidbeta ul li, .hidbeta .masqx, .hidbeta div .masqbut, .hidbeta div h4{
    display: none;
}
.hidbeta div h5{
    display: block !important;
    writing-mode: vertical-rl;
text-orientation: upright;
position: relative;
margin: 0;
top: 0;
right: 5px;
margin-right: 5px;
cursor: pointer;
}


@media screen and (max-width: 768px){
    #beta{ width: 80%; top: 60%}
    
}


        .skeleton-item {
            background-color: #D8D8D8;
            border-color: #D8D8D8;
            display: inline-block;
            position: relative;
            overflow: hidden;
        
    }
    .skeleton-item::after {
        content: '';
        position: absolute;
        top: -125%;
        left: -100%;
        width: 40px;
        height: 350%;
        opacity: 0;
        transform: rotate(45deg);
        background: rgba(255, 255, 255, 0.20);
        background: linear-gradient(to right, rgba(255, 255, 255, 0.30) 0%, rgba(255, 255, 255, 0) 100%);
        animation: shine;
        animation-duration: 4s;
        animation-iteration-count: infinite;
        animation-timing-function: ease-out;
    }
  
    
    #menuToggle
    {
      display: none;
      position: fixed;
      top: 20px;
      left: 20px;
      
      z-index: 9999;
      
      -webkit-user-select: none;
      user-select: none;
    }
@media screen and (max-width: 768px){
    #menuToggle{ display: block;z-index: 9999;}
}
 

 
 #menuToggle a
 {
   text-decoration: none;
   color: #232323;
   
   transition: color 0.3s ease;
 }
 
 #menuToggle a:hover
 {
   color: tomato;
 }
 
 
 #menuToggle input
 {
   display: block;
   width: 40px;
   height: 32px;
   position: absolute;
   top: -7px;
   left: -5px;
   
   cursor: pointer;
   
   opacity: 0; /* hide this */
   z-index: 2; /* and place it over the hamburger */
   
   -webkit-touch-callout: none;
 }
 
 /*
  * Just a quick hamburger
  */
 #menuToggle span
 {
   display: block;
   width: 33px;
   height: 4px;
   margin-bottom: 5px;
   position: relative;
   
   background: #000;
   border-radius: 3px;
   
   z-index: 1;
   
   transform-origin: 4px 0px;
   
   transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
               background 0.5s cubic-bezier(0.77,0.2,0.05,1.0),
               opacity 0.55s ease;
 }
 
 #menuToggle span:first-child
 {
   transform-origin: 0% 0%;
 }
 
 #menuToggle span:nth-last-child(2)
 {
   transform-origin: 0% 100%;
 }
 
 /* 
  * Transform all the slices of hamburger
  * into a crossmark.
  */
 #menuToggle input:checked ~ span
 {
   opacity: 1;
   transform: rotate(45deg) translate(-10px, -10px);
   background: #232323;
 }
 
 /*
  * But let's hide the middle one.
  */
 #menuToggle input:checked ~ span:nth-last-child(3)
 {
   opacity: 0;
   transform: rotate(0deg) scale(0.2, 0.2);
 }
 
 /*
  * Ohyeah and the last one should go the other direction
  */
 #menuToggle input:checked ~ span:nth-last-child(2)
 {
   transform: rotate(-45deg) translate(-9px, 10px);
 }
  

#validfilter{
    border: 1px solid #51c5a1;
background-color: #51c5a1;
color: #fff;
display: none;
text-align: center;
border-radius: 40px;
font-family: 'Poppins';
font-weight: normal;
font-style: normal;
padding: 12px;
width: 28%;
right: 3%;
top: 10px;
z-index: 9998;
cursor: pointer;
}
@media screen and (min-width: 992px ){
    #validfilter{ display: none !important; }
}
.txtacht{
    padding-left: 18%;
    padding-right: 45%;
    text-align: left !important;
}
.detailequip .margprxrig{
    right: 30px;
}
.txtacht .posispeleft{
    display: block;
    width: 80%;
    padding-top: 0px;
}
.txtacht .posispeleft .koikes{
    position: absolute;
right: 10px;
top: 7px;

}
.txtacht .posispeleft .onover{
    top: 25px;
    white-space: normal;
    font-size: 1.2rem;
}
.posispeleft .onover p{
    margin-top: 0;
}
.recdetail .posispeleft .koikes{
    
}
.recdetail .posispeleft .onover{
    
}

.divreduc{
    border: 3px dashed #123466 ;
    width: calc(70% - 30px);
    margin-left: 15%;
    padding: 15px; 
    border-radius: 30px;
    transition: all ease 300ms;
}
.divreduc .blocredetail{
    overflow: hidden;
}
.Blocreduction .pointer{
    cursor: pointer;
}
.Blocreduction h5{
    margin: 0;
}
.divreduc .detail .side-label1::before {
    border: 2px solid #336699;
}
.divreduc .detail .side-label1::after {
    background-color: #336699;
}
.divreduc .detail .side-label2::before {
    border: 2px solid #336699;
}
.divreduc .detail .side-label2::after {
    background-color: #336699;
}
.divreduc .detail span{
    width: 30%;
    text-align: left;
    display: inline-block;
    font-size: .9rem;
}
.divreduc .detail .margbot{
    margin-bottom: 15px;
}

.divreduc .blocredetail .posispeleft{
    width: auto;
}
.divreduc .blocredetail .posispeleft .onover{
    left: 34%;
    width: 30%;
    color: #336699;
}
.blocrecap .posispeleft{
    width: auto;
}
/*
.blocrecap .koikes{
    border: 1px solid #fff;
}*/
.blocrecap .posispeleft .onover{
    left: 66%;
    width: 30%;
    color: #000;
}
 .blocrecap h3 .posispeleft .onover{
    width: 20vw;
    left: 20%;
    top: 26px;
    overflow-x: auto;
}   
.blocrecap h3 .posispeleft{
    position: relative;
}
/*
.blocredetail h3 .posispeleft .koikes{
    border-radius: 50%;
    border: 1px solid #000;
    padding: 2px;
    line-height: 1.3rem;
    margin-left: 10px;
}
.blocrecap .txtreduc .posispeleft .koikes{
    border-radius: 50%;
    border: 1px solid #000;
    padding: 2px;
    line-height: 1.3rem;
    margin-left: 10px;
} */
.blocrecap .detail .posispeleft{
    position: relative;
}
.blocrecap .txtreduc .posispeleft .onover{
    left: 40px;
width: 600px;
top: 0;
}
.blocrecap .cinqpour .posispeleft .onover{
    left: inherit;
    right: 6.6%;
    top: 10px;
    width: auto;
}
.blocrecap .reacbloc .reacdet .partrigh .cinqpour p{
width: 100%;
padding: 0;
}
@media screen and (max-width: 1600px){ 
    .divreduc{ width: calc(75% - 30px);
        margin-left: 12%; }
    .divreduc .detail span{width: 45%;}
    @media screen and (max-width: 1200px){ 
        .divreduc .detail span{width: 55%;}
        @media screen and (max-width: 992px){ 
            .divreduc{ width: calc(83% - 30px);
                margin-left: 8%; }
            .divreduc .detail span{width: 55%;}
            @media screen and (max-width: 768px){ 
                .divreduc .detail .side-label1,.divreduc .detail .side-label2{margin-left: 0px;}
                .divreduc .detail span{width: 80%;}
                @media screen and (max-width: 576px){ 
                }
            }
        }
    }
}
.txtbarre{
    text-decoration:line-through;
}



@media screen and (max-width: 1200px){ 
    @media screen and (max-width: 992px){ 
        @media screen and (max-width: 768px){ 
            @media screen and (max-width: 576px){ 
            }
        }
    }
}
.container{
 width: 1560px;
}
@media screen and (max-width: 1600px){ 
    .container{
        width: 1300px;
       }
    @media screen and (max-width: 1200px){ 
        .container{
            width: 94%;
           }
        @media screen and (max-width: 992px){ 
            @media screen and (max-width: 768px){ 
                @media screen and (max-width: 576px){ 
                }
            }
        }
    }
}
.container .row{
    max-width: 100%;
    width: 100%;
}
.head .container{
width: 100% !important;
}
.head1 .container{
    background-image: linear-gradient(250deg, #2efea6 0%, #217cf1 94%);
    opacity: .7;
}
.head1 .overlay div{
    background-image: linear-gradient(250deg, #2efea6 0%, #217cf1 94%);
}
.head2 .container{
    background-image: linear-gradient(250deg, #fee72e 0%, #f12121 94%);
    opacity: .7;
}
.head2 .overlay div{
    background-image: linear-gradient(250deg, #fee72e 0%, #f12121 94%);
}
.head3 .container{
    background-image: linear-gradient(250deg, #fe4c2e 0%, #f12184 94%);
    opacity: .7;
}
.head3 .overlay div{
    background-image: linear-gradient(250deg, #fe4c2e 0%, #f12184 94%);
}
.head4 .container{
    background-image: linear-gradient(250deg, #2e93fe 0%, #f12121 94%);
    opacity: .7;
}
.head4 .overlay div{
    background-image: linear-gradient(250deg, #2e93fe 0%, #f12121 94%);
}
.head .overlay div{
    mask-image: url('../img/wave2.png'); 
    -webkit-mask-image : url('../img/wave2.png'); 
    height: calc( 100vw /20);
    position: absolute;
    top: 0;
    opacity: .5;
}
.head .overlay{
    width: 100vw;
    height: calc( 100vw /20);
    position: relative;
}
.head .overlay1{
    width: 160vw;
mask-size: 50% 100%;
-webkit-mask-size:50% 100%;
}
.head .overlay2{  
    width: 160vw;
mask-size: 50% 100%;
-webkit-mask-size:50% 100%;
left: -40vw;
}
.head .overlay3{ 
    width: 100vw;
mask-size: 50% 100%; 
-webkit-mask-size:50% 100%; 
}

.imageblog{
padding-bottom: 56%;
display: flex;
justify-content: center;
overflow: hidden;
position: relative;
}
.imageblog img{
position: absolute;
width: 100%;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
.blockindexblog a{
    text-decoration: none;
}
.blockindexblog a h3{
    margin-top: 0;
    line-height: 1.6rem;
    color: #000;
    font-family: 'Poppins';
    font-size: 1.3rem;
}
.blockindexblog button{
    border: none;
    background-color: #fff;
    color: #51c5a1
}
.blockindexblog:hover button{
    color: #e86c42;
}

.bigpictocontact{
    max-height: 250px;
    max-width: 250px;
}
.pictocontact{
    max-height: 45px;
    max-width: 45px;
}
.react-datepicker__day--selected, .react-datepicker__day--in-selecting-range, .react-datepicker__day--in-range, .react-datepicker__month-text--selected, .react-datepicker__month-text--in-selecting-range, .react-datepicker__month-text--in-range, .react-datepicker__quarter-text--selected, .react-datepicker__quarter-text--in-selecting-range, .react-datepicker__quarter-text--in-range, .react-datepicker__year-text--selected, .react-datepicker__year-text--in-selecting-range, .react-datepicker__year-text--in-range{
    background-color: #51c5a1;
    color: #000;
}
.react-datepicker__day--selected:hover, .react-datepicker__day--in-selecting-range:hover, .react-datepicker__day--in-range:hover, .react-datepicker__month-text--selected:hover, .react-datepicker__month-text--in-selecting-range:hover, .react-datepicker__month-text--in-range:hover, .react-datepicker__quarter-text--selected:hover, .react-datepicker__quarter-text--in-selecting-range:hover, .react-datepicker__quarter-text--in-range:hover, .react-datepicker__year-text--selected:hover, .react-datepicker__year-text--in-selecting-range:hover, .react-datepicker__year-text--in-range:hover{
    background-color: #d4e0f4;
    color: #000;
}
.blockdate{
    width: 94%;
    margin-left: 3%; 
    height: 75px;
    justify-content: space-between;
    align-items: center;
}
.blockdate .typelivr{
    display: flex;
    width: 35%;
    background-color: #eeeadf;
    border-radius: 10px;
    text-align: left;
    overflow: hidden;
    float: left;
    margin-bottom: 27px;
    flex-direction: column;
}
.blockdate .typelivr .blocliv{
    height: 50%;
}
.blockdate .typelivr .type{
    background-color: #51c5a1;
    color: #fff;
    width: 30%;
    display: inline-block;
    font-size: 1.6rem;
    padding: 0 10px;
    text-align: center;
    border-right: 3px solid #fff;
    height: 100%;
    align-items: center;
    vertical-align: middle;
    line-height: 4rem;
}
.blockdate .typelivr .type1{ 
    border-bottom: 3px solid #fff;
    height: calc( 100% - 3px);
    position: relative;
}
.blockdate .typelivr .type1 .posispeleft{ 
    position: absolute;
right: -10px;
bottom: -27px;
}
.blockdate .typelivr .type1 .posispeleft .koikes{
    border: 1px solid #fff;
    background-color: #51c5a1;
    padding: 5px;
}
.blockdate .typelivr .type1 .posispeleft .onover {
    position: absolute;
    width: 150px;
    max-height: 140px;
    margin: 0;
    left: 95%;
    top: 0;
    background-color: #fff;
    border-radius: 10px;
    padding: 8px;
    z-index: 9990;
    overflow: hidden;
      overflow-y: hidden;
    overflow-y: auto; 
    color: #000;
  }
.blockdate .typelivr .det{ 
    color: #51c5a1;
    width: 63%;
    display: inline-block;
    text-align: center;
    position: relative;
top: -6px;
}
.chooseblock .typelivr{
    display: flex;
    width: 60%;
    background-color: #eeeadf;
    border-radius: 10px;
    text-align: left;
    overflow: hidden; 
    margin-bottom: 27px;
    flex-direction: column;
    margin-left: 20%;
    margin-top: 20px;
}
.chooseblock .typelivr .blocliv{
    height: 50%;
}
.chooseblock .typelivr .type{
    background-color: #51c5a1;
    color: #fff;
    width: 30%;
    display: inline-block;
    font-size: 1.6rem;
    padding: 0 10px;
    text-align: center;
    border-right: 3px solid #fff;
    height: 100%;
    align-items: center;
    vertical-align: middle;
    line-height: 4rem;
}
.chooseblock .typelivr .type1{ 
    border-bottom: 3px solid #fff;
    height: calc( 100% - 3px);
    position: relative;
}
.chooseblock .typelivr .type1 .posispeleft{ 
    position: absolute;
right: -10px;
bottom: -27px;
}
.chooseblock .typelivr .type1 .posispeleft .koikes{
    border: 1px solid #fff;
    background-color: #51c5a1;
    padding: 5px;
}
.chooseblock .typelivr .type1 .posispeleft .onover {
    position: absolute;
    width: 150px;
    max-height: 140px;
    margin: 0;
    left: 95%;
    top: 0;
    background-color: #fff;
    border-radius: 10px;
    padding: 8px;
    z-index: 9990;
    overflow: hidden;
      overflow-y: hidden;
    overflow-y: auto; 
    color: #000;
  }
.chooseblock .typelivr .det{ 
    color: #51c5a1;
    width: 63%;
    display: inline-block;
    text-align: center;
    position: relative;
top: -6px;
}
.blockdate .dateure{
    display: flex;
    width: 85%;
    justify-content: space-between;
    align-items: center;
}
.blockdate .dateure .souselem{
    width: 60%;
    display: inline-block;
    overflow: hidden;
    height: 60px;
    border-right: 1px solid #1c2667;
margin-right: 3%;
padding-right: 3%;
display: flex;
align-items: center;
justify-content: space-between;
}
.blockdate .dateure .souselem2{
    width: 39%;
    display: inline-block;
    overflow: hidden;
    height: 60px;
    border-right: 1px solid #1c2667;
margin-right: 3%;
padding-right: 3%;
display: flex;
align-items: center;
justify-content: space-between;
}
.blockdate .remise{
    background-color: #fff; 
    width: 100%;
    display: block;
    float: left;
    height: 60px;
    text-align: center;
    cursor: pointer;
}
.blockdate .remise span{
    font-size: 1rem;
    color: #1c2667;
    line-height: 60px;
}
.blockdate .remise .borderelem {
    background-color: #fff;
    border: 4px solid #51c5a1;
    margin: 9px;
    border-radius: 10px;
    height: calc(100% - 25px);
    display: inline-block;
    width: 86%;
}
.blockdate .remise .borderelem span{
    display: inline-block;
    height: 6rem;
    color: #51c5a1;
    width: 100%;
    font-size: 1.2rem;
    line-height: 6rem;
    cursor: pointer;
}
.blockdate .dateure .souselem .dateun{
    display: inline-block;
    height: 60px;
    color: #1c2667; 
    font-size: 1.2rem;
    line-height: 60px; 
}
.blockdate .dateure .souselem .datede{
    display: inline-block;
    height: 60px;
    color: #1c2667; 
    font-size: 1.2rem; 
    line-height: 60px;
    background-color: #fff;
    padding-left: 4%;
padding-right: 4%;
margin-left: 4%;
margin-right: 4%;
}
.blockdate .dateure .souselem .datebut{
    width: 34%;
    float: right;
    height: 60px;
}
.blockdate .dateure .souselem .datebut > div{
    mask: url("../img/picto-calendrier.png");
    -webkit-mask-image : url("../img/picto-calendrier.png");
    background: #51c5a1;
    mask-size: contain;
    -webkit-mask-size : contain;
    display: inline-block;
    width: 100%;
    height: 100%;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
}
.blockdate .dateure .souselem .dured{
    display: inline-block; 
    color: #1c2667; 
    font-size: 1.2rem; 
}
.blockdate .dateure .souselem2 .dured{
    display: inline-block; 
    color: #1c2667; 
    font-size: 1.2rem; 
}
.blockdate .dateure .souselem2 input{
    border: none;
    color: #1c2667;
    text-align: center;
    width: 100%;
padding: 0;
}
.blockdate .dateure .souselem2 .duren{
    height: 60px;
    color: #1c2667;
    width: 20%;
    font-size: 1.2rem;
    line-height: 100%;
    padding: 0;
    border: none;
    background-color: #fff; 
text-align: center;
display: flex;
position: relative;
display: inline-block;
}
.blockdate .dateure .souselem .duren{
    height: 60px;
    color: #1c2667;
    width: 20%;
    font-size: 1.2rem;
    line-height: 100%;
    padding: 0;
    border: none;
    background-color: #fff; 
text-align: center;
display: flex;
position: relative;
display: inline-block;
}
.blockdate .dateure .souselem .duren input{
    display: inline-block;
    height: 60px;
    line-height: 6rem;
    color: #1c2667;
    font-size: 1.2rem;
    width: 50%;
    text-align: center;
    border: none;
    background-color: transparent;
}
.blockdate .dateure .souselem .durej{
    display: inline-block;
    height: 6rem;
    color: #51c5a1;
    width: 40%;
    font-size: 1.6rem;
    line-height: 6rem;
}
.blockdate .dateure .souselem .borderelem{
    background-color: #fff;
    border: 4px solid #51c5a1;
    margin: 9px;
    border-radius: 10px;
    height: calc(100% - 25px);
    display: flex;
    align-items: center;
}
.blockdate .dateure .souselem .borderelem .datelist{
    display: flex;
    flex-direction: column;
    width: 66%;
}
.blockdate .dateure .souselem .clic{
    cursor: pointer;
    width: 100%;
}
.blockdate .dateure .souselem .clic .datelist{ 
    display: flex;
    justify-content: space-around;
}
.blockdate .dateure > span{
    font-size: 1.6rem;
    color: #51c5a1;
    top: -3rem;
margin-left: 5px;
margin-right: 5px;
}
.blockdate .plus{
    display: inline-block;
    background-color: #eeeadf;
    border-radius: 50%;
    position: relative;
top: 2rem;
float: left;
}
.blockdate .plus span{
    background-color: #fff;
    border: 4px solid #51c5a1;
    color: #51c5a1;
    font-size: 2.6rem;
    margin: 9px;
    border-radius: 50%;
    height: 2rem; 
    display: block;
    line-height: 1.9rem;
    width: 2rem;
}
.blockdate .calendarblock{
    padding: 10px;
    border-radius: 10px;
    background-color: #fff;
    position: absolute;
    z-index: 7777;
    left: 41.8%;
width: 32.8%;
}
.blockdate .calendarblock .closedescr-wrapper{
    position: absolute;
right: 10px;
cursor: pointer;
}

.blockdate .remisebloc{
    padding: 10px;
    border-radius: 10px;
    background-color: #eeeadf;
    position: absolute;
    z-index: 7777;
    left: 10%;
width: 80%;
margin-top: 0;
}
/* 

The following vars come from my theme. 
You'll need to replace with your own color values. 

- "$light"
- "$mid"
- "$dark"

*/
.toggle {
  align-items: center;
  border-radius: 100px;
  display: flex;
  margin-bottom: 16px;
  justify-content: center;
  cursor: pointer;
  font-size: 1.6rem;
}
.toggle:last-of-type {
  margin: 0;
}

.toggle__input {
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  white-space: nowrap;
  width: 1px;
}
.toggle__input:not([disabled]):active + .toggle-track, .toggle__input:not([disabled]):focus + .toggle-track {
  border: 1px solid transparent;
  box-shadow: 0px 0px 0px 2px #51c5a1;
}
.toggle__input:disabled + .toggle-track {
  cursor: not-allowed;
  opacity: 0.7;
}

.toggle-track {
  background: #fff;
  border: 2px solid #51c5a1;
  border-radius: 100px;
  cursor: pointer;
  display: flex;
  height: 30px;
  margin-left: 12px;
  margin-right: 12px;
  position: relative;
  width: 60px;
}

.toggle-indicator {
  align-items: center;
  background: #51c5a1;
  border-radius: 24px;
  bottom: 3px;
  display: flex;
  height: 24px;
  justify-content: center;
  left: 2px;
  outline: solid 2px transparent;
  position: absolute;
  transition: 0.25s;
  width: 24px;
}

.checkMark {
  fill: #fff;
  height: 20px;
  width: 20px;
  opacity: 0;
  transition: opacity 0.25s ease-in-out;
}

.toggle__input:checked + .toggle-track .toggle-indicator {
  background: #51c5a1;
  transform: translateX(30px);
}
.toggle__input:checked + .toggle-track .toggle-indicator .checkMark {
  opacity: 1;
  transition: opacity 0.25s ease-in-out;
}
@media screen and (max-width: 1600px ){
    
@media screen and (max-width: 1200px){
    .blockdate .calendarblock { 
    left: 25%;
    width: 50%;
     }
     .calendar .table>thead>tr>th, .calendar .table>thead>tr>td, .calendar .table>tbody>tr>th, .calendar .table>tbody>tr>td{
    font-size: 1.2rem;
     }
@media screen and (max-width: 992px){
    .blockdate .calendarblock {
        left: 11%;
        width: 75%; 
    }
    .calendar .table>thead>tr>th, .calendar .table>thead>tr>td, .calendar .table>tbody>tr>th, .calendar .table>tbody>tr>td{
   font-size: 2rem;
    }
    @media screen and (max-width: 768px){
        
    .calendar .table>thead>tr>th, .calendar .table>thead>tr>td, .calendar .table>tbody>tr>th, .calendar .table>tbody>tr>td{
        font-size: 1.6rem;
         }
        @media screen and (max-width: 576px){
            
    .calendar .table>thead>tr>th, .calendar .table>thead>tr>td, .calendar .table>tbody>tr>th, .calendar .table>tbody>tr>td{
        font-size: 1.4rem;
         } 

        }
    }
}
}
}
@media screen and (-ms-high-contrast: active) {
  .toggle-track {
    border-radius: 0;
  }
}
.demiright{
    width: 50%;
    display: inline-block;
    height: 100%;
    display: flex;
flex-direction: column;
justify-content: space-between;
}

.tritop{
    height: 20px;
    width: 100%;
    cursor: pointer;
}
.tritop::before{
    content: '^';
    display: inline-block;
    width: 100%;
    color: #1c2667;
    position: relative;
    top: 1px;
} 
.tribot{ 
    height: 20px;
    width: 100%;
    cursor: pointer;
}
.tribot::before{
    content: '^';
    color: #1c2667;
    display: inline-block;
    width: 100%;
    color: #1c2667;
    position: relative;
    top: -1px;
    transform: rotate(180deg);
}

.right .extarif .nbve{
    width: 30px;
}
.right .tritop{  
    width: 30px;
    left: -27px;
    position: relative;
    top:-3px;
}
.right .tribot{   
    height: 13px;
    width: 30px;
    left: -27px;
    position: relative;
    top:-5px;
}
.nbve .demiright{
    width: 1px;
}
.nbve .tritop::before{
    border-width: 0 .35em .7em .35em;
}
.nbve .tribot::before{
    border-width: .7em .35em 0 .35em;
}
.rechguideback{
    position: fixed;
    z-index: 7700;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    background-color: #828384;
}
.rechguide{
padding: 10px;
border-radius: 10px;
background-color: #fff;
position: fixed;
z-index: 7777;
left: 5vw;
top: 5vh;
width: 90vw;
height: 90vh;
margin-top: 0;
} 
.rechguide .demi{
    height: 80vh;
overflow: hidden;
overflow-y: auto;
}
.rechguidetype{
    padding: 10px;
    border-radius: 10px;
    background-color: #fff;
    z-index: 7777;
    left: 5vw;
    top: 5vh;
    width: 90vw;
    height: 90vh;
    margin-top: 0;
    position: relative;
}
.rechguide .closedescr-wrapper{
    position: absolute;
    right: 15px;
    top: 10px;
    cursor: pointer;
    z-index: 9999;
}
.rechguidetype .closedescr-wrapper{
    position: absolute;
    right: 15px;
    top: 10px;
    cursor: pointer;
    z-index: 9999;
}
.rechguide .row{
display: flex;
}
.rechguidetype .row{
    display: flex;
    }
.rechguide .precedent{ 
    padding: 15px;
    color: #51c5a1;
    font-size: 1.6rem;   
    text-align: left;
    cursor: pointer;
    margin: 1.3rem 0 0;
    line-height: 1.8rem;
    position: absolute;
    left: 50%;
    bottom: 20px;
}
.rechguidetype .imageguide{
    display: none;
}
.rechguidetype .demi{
    width: 100% !important;
    height: 90vh;overflow-y: auto;
}
.rechguidetype .precedent{ 
    padding: 15px;
    color: #51c5a1;
    font-size: 1.6rem;   
    text-align: left;
    cursor: pointer;
    margin: 1.3rem 0 0;
    line-height: 1.8rem;
    position: absolute;
    left: 10%;
    bottom: 20px;
}
.rechguide h3{
    font-size: 2.2rem;
    font-weight: bold; 
    text-align: left;
    word-break: normal;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  -o-hyphens: none;
  hyphens: none;
}
.rechguidetype h3{
    font-weight: bold; 
    text-align: left;
    word-break: normal;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  -o-hyphens: none;
  hyphens: none;
}
.rechguidetype .imgrep{
    width: 12%;
    padding-bottom: 16%;
    position: relative;
    margin: 1%;
    float: left;
    border-radius: 15px;
    overflow: hidden;
    cursor: pointer;
}
.rechguidetype2 .imgrep{
    width: 30%;
    padding-bottom: 33%;
}
.rechguidetype .imgrep > div{
    position: absolute;
width: 100%;
height: 100%;
top: 0;
display: flex;
flex-direction: column;
}
.rechguidetype .imgrep div img{
    object-fit: contain;
width: 100%;
height: 100%;
}
.rechguide p{
    background-color: #51c5a1;
    padding: 10px;
    color: #1c2667;
    font-size: 1.6rem;  
    border-radius: 10px;
    text-align: left;
    cursor: pointer;
    margin: 1rem 0 0;
    line-height: 1.8rem;

    word-break: normal;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  -o-hyphens: none;
  hyphens: none;
}
.rechguidetype > .row > .demi > p{
    background-color: #51c5a1; 
    color: #000;
    font-size: 1.15rem;
    text-align: center;
    cursor: pointer;
    margin-top: 10px;
    line-height: 30px;
    width: 40%;
    height: 30px;
    word-break: normal;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  -o-hyphens: none;
  hyphens: none;
  position: absolute;
  right: 0;
  bottom: -35px;
}
#formulaire .rechguidetype > .row > .demi > p{
    background-color: #51c5a1; 
    color: #000;
    font-size: 1.15rem;
    text-align: center;
    cursor: pointer;
    margin-top: 10px;
    line-height: 30px;
    width: 40%;
    height: 30px;
    word-break: normal;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  -o-hyphens: none;
  hyphens: none;
  position: absolute;
  right: 20px;
  bottom: 10px;
}
.modinit > .remise > .remisebloc > .filtre_guide{
    background-color: #d4d4d4;
    margin-right: 20%;
    border: 2px solid #d4d4d4; 
    height: 30px;
    width: 40% !important;
    font-weight: normal !important;
    font-style: normal !important;
    font-family: 'Poppins' !important;
    font-size: 1.6rem !important;
    color: #000 !important;
    cursor: pointer !important;
    font-size: 1.15rem !important;
    position: absolute;
    bottom: -40px;
}
.rechguidetype .imgrep p{
    color: #51c5a1;
    padding-top: 10px; 
    padding-bottom: 10px; 
    font-size: 1.2rem;  
    border-radius: 10px;
    text-align: center;
    margin-top: 0; 
    line-height: 1.1rem;
    width: 100%;
    word-break: normal;
  -webkit-hyphens: none;
  -moz-hyphens: none;
  -ms-hyphens: none;
  -o-hyphens: none;
  hyphens: none;
}
.rechguidetype .precedent{
    display: none;
}
.rechguide .checkbox{
    background-color: #fff;
    color: #51c5a1;
}
.rechguide .checkbox span{    
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 2px solid #51c5a1;
    margin-right: 10px;
}
.rechguide p:hover{
    background-color: #25b377;
}
.rechguide .checkbox:hover{
    background-color: #fff;
    color: #25b377;
}
.rechguide .checkbox:hover span{
    border: 2px solid #25b377;
}
.rechguide .imageguide{
    height: 90vh;
    width: 100%;
    position: relative;
    overflow: hidden;
}
.imageguide .imgbase{
    width: 100%;
    height: 90vh;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 100;
}
.imageguide .imghover{
    width: 100%;
    height: 90vh;
    background-repeat: no-repeat;
    background-size: contain;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 200;
}
.backmodinit{
    position: absolute !important;
    z-index: 7770;
    left: -25%;
    top: 0;
    width: 100vw;
    height: 100%;
    background-color: #828384;
    min-height: 78vh;
}
.grandwidth .backmodinit{ left: 0;}

@media screen and (max-width: 1600px ){
    .backmodinit{ left: -33.3%;}
    .grandwidth .backmodinit{ left: 0;}
    @media screen and (max-width: 1200px){
        @media screen and (max-width: 992px){
            
.rechguidetype .imgrep p{ font-size: 1rem;}
            .backmodinit{ left: 0;}
            @media screen and (max-width: 768px){
                .rechguidetype .imgrep p{ font-size: .9rem;}
                @media screen and (max-width: 576px){
                    
                }
            }
        }
    }
}
.blocemploye .remel{
    cursor: pointer;
    color: #ed8c8c;
    font-size: 2rem;
} 
.listpersonnel .remel{
background-color: #ed8c8c;
color: #000;
font-size: 1.4rem;
}
.modinit{
padding: 5vw;
background-color: #fff;
position: absolute;
z-index: 7888;
left: 5vw;
top: 10vh;
width: 80vw;
min-height: 45vh;
margin-top: 0;
text-align: left;
padding-bottom: 50px;
}
.modinit .buttclose{
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 2rem;
    font-weight: 100;
}
.modinit .retbut{
    cursor: pointer;
    opacity: .5;
    transition: all ease 400ms;
}
.modinit .retbut:hover{
    opacity: 1;
}
.modinit h3{
    font-weight: bold;
    margin-bottom: 1rem;
}
.modinit h3 span{
    font-weight: lighter;
}
.modinit h4{
    margin-bottom: 0;
    font-size: 1.8rem;
}
.modinit .locationbuttt{
    margin-left: 10%;
    border: 1px solid #1c2667;
    border-radius: 10px;
    color: #1c2667;
    padding: 10px;
    display: inline-block;
    height: auto;
    font-size: 1.6rem;
    cursor: pointer;
    position: relative;
    transition: all ease 500ms;
}
.modinit .locationbuttt:hover{
    border: 1px solid #51c5a1;
    color: #51c5a1 !important;
}
.modinit .filtreachatloc{
    align-items: flex-start;
    flex-direction: inherit;
} 
.modinit .calendarblock{
    width: 65%;
}
.modinit .calendisp{
    display: flex;
}
.modinit .calendisp .souselem{ 
    width: 35%;
}
.modinit .calendisp .souselem .dured{ 
    color: #1c2667;
    font-size: 1.4rem;
}
.modinit .calendisp .souselem .duren{
        height: 75px;
        color: #1c2667;
        width: 15%;
        font-size: 1.4rem;
        line-height: 100%;
        padding: 0;
        border: none;
        background-color: #fff;
        text-align: center;
        display: flex;
        position: relative;
        flex-direction: column;
      }
.modinit .calendisp .souselem input{
    height: 60px;
    border: none;
    color: #1c2667;
    text-align: center;
    width: 100%;
    padding: 0;
    font-size: 1.4rem;
  }
.modinit .calendisp .souselem .borderelem{
padding-left: 10%;
width: 80%;
padding-right: 10%;
background-color: #d4e0f4;
padding-top: 5px;
padding-bottom: 5px;
display: flex;
justify-content: space-between;
align-items: center;
}
.modinit .calendisp .souselem .selnbjours{
    text-align: center;
  }

.modinit .rechguideback{
    position: relative;
background-color: #fff;
left: 0;
top: 0;
width: 100%;
height: auto;
  }
.modinit .rechguideback .rechguidetype{
    padding: 0;
    border-radius: 0;
    width: 100%;
    height: auto;
    left: 0;
}
  .modinit .rechguidetype .demi{
    height: auto;
    padding-bottom: 60px;
  }
.filtreachatloc{
position: relative;
width: 94%;
margin-left: 3%;
text-align: left;
display: flex;
}
.blocklocach{
    display: inline-block;
margin-left: 5%;
width: 75%;
height: 58px;
position: absolute;
}
.filtreachatloc .locationbut{ 
    color: #1c2667;
    font-size: 1.8rem;
    text-align: center;
  /*  margin-left: 30px;
    margin-right: 30px;*/
    border-top-left-radius: 10px; 
    border-top-right-radius: 10px; 
    cursor: pointer;
    border: 1px solid #1c2667;
    border-bottom: none;
height: 40px;
display: block;
line-height: 40px;
display: inline-block;
margin-right: 3%;
padding-left: 2%;
padding-right: 2%;
}
.filtreachatloc  .reinitbut{
    color: #51c5a1;
    border: none;
font-size: 1.2rem;
font-weight: 600;
position: absolute;
right: 0;
top: -20px;
}
.detlocach{
    height: 75px;
    width: 20%; 
}
.filtreachatloc .choiagence{
    display: inline-block;
    font-size: 1.8rem;
    background-color: #1c2667;
border-radius: 10px;
text-align: center;
width: 20%;
height: 110px;
}
.filtreachatloc .choiagence label{
    font-size: 1.8rem; 
    color: #fff;
    height: 40px;
display: block;
line-height: 40px;
}
.filtreachatloc .choiagence .agencelist{
    height: 75px;
    background-color: #d4e0f4;
    display: flex;
    justify-content: center;
    align-items: center;
}
.filtreachatloc .choiagence select{
    font-size: 1.2rem;
    padding-left: 5px;  
    background-color: #fff;
    border: none;
color: #1c2667;
padding: 0.7rem;
}
.filtreachatloc .boutreinit{
background-color: #fc9047;
/*position: absolute;
left: 5%;
top: -0.8rem;
padding-top: .8rem;
padding-bottom: .8rem;*/
}
.pac-container{
    z-index: 9999;
    width: auto !important;
}

@media screen and (max-width: 576px){
    .modinit .filtreachatloc{
        flex-direction: column;
            }
    .filtreachatloc .choiagence{
        width: 100%;
    }
    .modinit .filtreachatloc .locationbuttt{
        width: 75%;
    margin-top: 20px;
    }
}
@media screen and (max-width: 1600px ){
    #formulaire .voirbloctarif .descriptiontarif{
        top: -3px;
        height: 66vh;
    }
    #formulaire .voirbloctarif .recaptarif{
        top: 117px; 
    height: 66vh;
    }
    .blocklocach{
        width: 77%;
    margin-left: 3%;
    }
    .blockdate{ 
    width: 96%;
    margin-left: 2%;
    }
    .blockdate .dateure{
        width: 85%;
    }
    .blockdate .dateure .souselem{
        margin-right: 2%;
        padding-right: 2%;
    }
    .blockdate .dateure .souselem .datede{
        padding-left: 2%;
    padding-right: 2%;
    margin-left: 2%;
    margin-right: 2%;
    }
    @media screen and (max-width: 1200px){
        .blockdate .typelivr .det{
            width: 62%;
            top: -2px;
        }
        .blockdate .typelivr .type{
            padding: 9px;
            font-size: 1.4rem;
        }
        .toggle-track{
            height: 25px;
        }
        .toggle-indicator{
            bottom: 1px;
            height: 23px;
        }
        .blockdate .typelivr{}
        .blockdate .remise{}
        .blockdate .dateure{}
        .blockdate .dateure .souselem{height: 100%;}
        .blockdate .dateure .souselem .datede, .blockdate .dateure .souselem .dateun{height: 2.4rem;line-height: 2.4rem;}
        .blockdate .dateure .souselem .borderelem{height: 72%;}
        .blockdate .remise .borderelem{height: 72%;}
        .blockdate .dateure .souselem .datebut{height: 5.4rem;}
        .blockdate .dateure .souselem .duren{height: 100%;}
        .blockdate .dateure .souselem .duren input{height: 100%;}

        #formulaire .voirbloctarif .descriptiontarif{
            top: -1px;
            height: calc(80vh - 1.4rem);
        }
        #formulaire .voirbloctarif .recaptarif{
            top: 112px;
        }
        .blockdate .dateure .souselem2 .dured{font-size: .9rem;}
        #formulaire .voirbloctarif .descriptiontarif{ height: calc(80vh - 10rem);}
        
.modinit .agencemodl h3{ font-size: 1.5rem;}
        @media screen and (max-width: 992px){
            #formulaire .voirbloctarif .recaptarif{
                height: calc(80vh - 125px);
                top: 99px;
            } 
            .blockdate .typelivr .det{
                width: 61%;
            }
            .blockdate{ flex-wrap: wrap; justify-content: space-between;height: auto;}

            .blockdate .typelivr{ margin-bottom: 7px; width: 46%;order: 1;}
            .blockdate .remise{width: 46%;order: 2;}
            .blockdate .dateure{width: 100%;order: 1; justify-content: space-between;}
            .blockdate .dateure .souselem .borderelem{height: 67%;}
            #formulaire .voirbloctarif button{margin-top: 0;}
        #formulaire .voirbloctarif .descriptiontarif{
            height: calc(80vh - 11rem);
        }
        #formulaire .voirbloctarif .descriptiontarif{ height: calc(80vh - 11rem);}
        #formulaire .divvehiculedetail .location{max-height: calc(80vh - 11rem);}
        #formulaire .voirbloctarif .voirtarif span{left: 32px;}
        #formulaire .voirbloctarif .icon{margin-right: 7px;}
        #formulaire .vehiculedetail .left .slick-slide{height: 300px;}
        #formulaire .vehiculedetail .left .slick-slide img{max-width: 300px;}
        
        .filtreachatloc{ flex-direction: column-reverse;}
        .blocklocach{width: 100%;margin-left: 0;}
        .blockdate{flex-wrap: nowrap;
            padding-top: 5px;
            padding-bottom: 5px;}
        #formulaire > div > div:nth-child(2){position: relative;}
        #formulaire .blocinput{position: absolute; bottom: 40px;}
        #formulaire #gestmodal1{ left:26%; bottom: -5px;}
        .filtreachatloc .choiagence{margin-top: 2px;}
        .detlocach{height: auto;}
        .blocemploye .emplnamebloc{width: 100%;}
        .blocemploye .emplname{font-size: 1rem;}
        .detailequip{width: 100%;}
        .blocinfo li{width: 100%;}
        .infempl{position: relative; right: inherit;}
        .slick-next, .slick-prev{display: none !important;}
        .agencemodl{  flex-wrap: wrap; }
        .agencemodl >div:nth-child(1){
            width: 100%;
        }
        .agencemodl >div:nth-child(1) .imgserv-wrapper{
            width: 30%;
            margin-left: 35%;
        }
        .agencemodl>div:nth-child(2){
            width: 50%;
        }
        .agencemodl>div:nth-child(2){
            width: 50%;
        }
        .agencemodl>div:nth-child(3){
            width: 50%;
        }

            @media screen and (max-width: 767px){
                #formulaire .blocinput span{margin-left: 80px;}
                #formulaire #gestmodal1{ left: 3%; bottom: 40px; }
                #gestmodal1 #afffiltre{width: 25px !important; height: 25px !important;}
                .blocinfo{max-width: 100%;width: 100%;}
                .livrel .blocinfo{width: 100%;}
                .livrel{flex-direction: column;}
                .blocemploye table thead{width: 50%;}
                .blocemploye table thead th{width: 50% !important;}

                .blocemploye .emplname{font-size: .9rem;}
                .filtreachatloc{ flex-direction: column;}
                #formulaire .blocinput{position: relative; bottom: 0;}
                .blockdate {    flex-direction: column;}
                .blocklocach{ height: auto;}
                #formulaire .blocinput{ width: 93%; margin-left: 4%;}
                #formulaire .blocinput .inputel{width: 50%;}
                #formulaire .blocinput .inpubut{width: 45%;}
                #formulaire .blocinput{flex-wrap: wrap;height: auto;}
                #formulaire .voirbloctarif button{width: 29%;}
                .remonreprise{width: 50%;}
                    .blockdate .dateure{flex-wrap: wrap;}
                    .blockdate .dateure{width: 100%;}
                    .blockdate .dateure .souselem{width: 100%;}
                    .blockdate .dateure .souselem2{width: 100%; height: 40px;}
                    .blockdate .dateure .souselem2 .duren{height: 35px;}
                    .tritop { height: 12px;}
                    .tribot { height: 12px;}
                    .tribot::before{ top: -3px;}
                .filtreachatloc .boutreinit{
                    margin-left: 0;
                    padding-left: 5px;
                    padding-right: 5px;
                 /*   left: 5px;
                    top: -5rem;*/
                }
                .filtreachatloc .locationbut{
                    margin-right: 10px;
                    margin-left: 10px;
                } 
                #formulaire .voirbloctarif .voirtarif span{left: 25px;}
                #formulaire .voirbloctarif .icon{margin-right: -10px;}
                .divvehiculedetail .voirbloctarif{
                    height: 90vh;
                    width: 83%;
                    left: 2%;
                }
                #formulaire .voirbloctarif .descriptiontarif {
                    height: auto;
                    width: 100%;
                }
                #formulaire .divvehiculedetail .location{
                    max-height:inherit;
                }
                #formulaire .divvehiculedetail .location .txteq{
                    height: auto;
                }
                #formulaire .voirbloctarif .recaptarif{
                    width: 100%;
                    z-index: 7100;
                    height: calc(50vh - 125px);
                    left: 0;
                    top: calc( 55vh );
                }
                .rechguide{
                    width: 85vw;
                }
                .rechguide .imageguide{
                    display: none;
                }
                .rechguide .demi{
                    width: 100% !important;
                }
                .blockdate .typelivr{width: 100%;}
                .blockdate .remise{width: 100%; height: 40px;}
                .blockdate .remise span{line-height: 40px;}
                .right .tribot{top: 6px;}
                #formulaire .vehiculedetail .left .slick-slide{
                    height: 200px;
                }
                .flexel{ display: inline-block;}
                .flexel .fulltexta{width: 93%;}
                .flexel .demibloclivrep{ width: 96%;}
                .flexel .demibloclivrep .side-label{ margin-left: 15px;}
                #formulaire .vehiculedetail .left .slick-slide img{max-width: 200px;}
                #formulaire .vehiculedetail{display: block;}
                #formulaire .vehiculedetail .blockpicto{display: none;}
                #formulaire .vehiculedetail .left{width: 66%; display: inline-block;}
                #formulaire .vehiculedetail .right{width: 100%;padding: 0;}
                .butcaut, .butplusinfo, #formulaire .vehiculedetail .voirtarif{width: 99%;margin-top: 5px;}
                header .logo-container{padding: 0 10px 0;}
                header .logo-container h3{font-size: 1.6rem;}
                .agencemodl{  flex-direction: column;}
        .agencemodl >div{
            width: 100%;
        }.agencemodl>div:nth-child(2){
            width: 100%;
        }
        .agencemodl>div:nth-child(2){
            width: 100%;
        }
        .agencemodl>div:nth-child(3){
            width: 100%;
        }
        .modinit h3{
            font-size: 1rem;
            line-height: 1.2rem;
        }
        .modinit h4{
            font-size: 1.1rem;
        }
        .blocrecap .detail{padding-top: 10px;padding-bottom: 10px;}
                @media screen and (max-width: 576px){   
                    #formulaire .blocinput span{margin-left: 55px;}
                    #formulaire .voirbloctarif button{font-size: .9rem;}              
                    .divvehiculedetail .voirbloctarif{ font-size: .9rem; overflow-y: auto;top: 55px; width: 87%; }
                    #formulaire .voirbloctarif .recaptarif{ position: relative; top: 0; height: auto;}
                    .remonreprise{width: 80%;}
                    .blockdate .remise .borderelem{width: 78%;}
                    header .logo-container h3{font-size: 1rem;} 
                    .vehiculedetail > div{
                        display: inline-block;
                        float: left;
                    }
                    #formulaire .vehiculedetail .left{
                        width: 67%;
                    }
                    #formulaire .vehiculedetail .left ul{
                        margin-top: 1rem;
                    }
                    #formulaire .vehiculedetail .left ul li{
                        margin-bottom: 3px;
                    }
                    #formulaire .vehiculedetail .right > div{
                        width: 100%;
                    }
                    .blockdate .calendarblock{
                        left: 1%; width: 92%;margin-top: 0;
                    }
             
                             .modinit .calendarblock{ width: 100%;}
                             .modinit .calendisp .souselem{ width: 100%;}
                             .modinit .calendisp{ flex-direction: column;}
                             
         .bigcal #month-year{
            font-size: 1.2rem;
         }
         .modinit .calendisp .souselem .dured{ 
    font-size: 1.2rem;
         }
         .blocrecap .detail p{
            font-size: 1rem;
position: relative;
top: -5px;
line-height: 0;
text-align: right;
         }
         .blocrecap .detail span{
            font-size: 1rem;
line-height: 1rem;
top: 0;
text-align: left;
display: inline-block;
width: 47%;
            }
            .blocrecap .detail .posispeleft {
                width: 12%;
            }
            
            .blocrecap .detail .txtreduc{
                margin-left: 14px;
                font-size: 1.6rem;
            }
         .rechguidetype .imgrep{width: 31%;
            padding-bottom: 43%;}
            .remisebloc .btn-valider{
                width: 95% !important;
            }

                }
            }
        }
    }
}
.shareblock{
    display: flex;
    justify-content: center;
    align-items: center;
}
.shareblock2{
    display: flex;
    justify-content: right;
    align-items: center;
}
.iconshare{
    max-width: 35px;
    max-height: 35px;
    margin-left: 5px;
    margin-right: 5px;
}
@media screen and (max-width: 992px){
.sliderhome{
    width: 100% !important;
}
.gjs-lory-frame{
    width: 100% !important;
}
.img-fluid {
    width: 90vw !important;
    height: 100%;
}
.sliderhome .gjs-lory-slides .gjs-lory-slide h2{
    left: 9% !important;
top: 330px !important;
}
.sliderhome .gjs-lory-slides .gjs-lory-slide a{
    max-width: 70% !important;
    top: 390px !important;
    left: 9% !important;
}
    @media screen and (max-width: 767px){
        .sliderhome .gjs-lory-slides .gjs-lory-slide h2{
            left: 3% !important;
            top: 130px !important;
            font-size: 1.45rem !important;
            width: 70vw;
            line-height: 1.4rem;
            text-align: center;
        }
        .sliderhome .gjs-lory-slides .gjs-lory-slide a{
            max-width: 70% !important;
            top: 180px !important;
            left: 1% !important;
            font-size: 0.85rem !important;
            width: 70vw;
            line-height: 1.4rem;
            text-align: center;
        }
        .livraisonreprise .rechadresse{
            left: 9%;
            width: 80%;
        }
        .livraisonreprise .trquart{
            min-height: 60vh;
            padding-bottom: 150px;
        }
        .livraisonreprise .bloc .divval{width: 50%; margin-left: 25%;}
        .livraisonreprise .blocemploye h4{
            font-size: 1.4rem;
        }
        .bloclivraisonreprise table{
            display: flex;
            flex-direction: inherit;
        }
        .bloclivraisonreprise table thead{
            width: 50%;
        }
        .bloclivraisonreprise table tbody{
            width: 47%;
        }
        .bloclivraisonreprise table thead tr{
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            height: 100%;
        }
        .bloclivraisonreprise table tbody tr{
            display: flex;
            flex-direction: column;
        }
        .bloclivraisonreprise table tbody td .radlivrep{
            width: 90%;
        }
        
        .blocemploye table{
            display: flex;
            flex-direction: inherit;
        }
        .blocemploye table thead{
            width: 40%;
        }
        .blocemploye table tbody{
            width: 60%;
        }
       .reacdet .blocemploye table thead{
            width: 100%;
        }
        .blocemploye table thead tr{
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            height: 100%;
        }
        .blocemploye table tbody tr{
            display: flex;
            flex-direction: column;
        }
        .blocemploye .tdvehi{width: 100%;}
        .blocemploye .tdpers{width: 100%;}
        .blocemploye .tddate{width: 100%;}
        .blocemploye .tdinput{width: 100%;}
        .blocemploye .wraptext{width: 100%;}
        .blocemploye .remel::after{
          /*  content: 'Supprimer'; */
        }
        
        .blocemploye .reacdet table{
            display: inline-block;
        }
        .blocemploye .reacdet table thead{
            width: 100%;
display: inline-block;
        }
        .blocemploye .reacdet table thead tr{
            width: 100%;
            flex-direction: inherit;
        }
        .blocemploye .reacdet table tbody{
            width: 100%;
display: inline-block;
        }
        .blocemploye .reacdet table tbody tr{
            width: 100%;
            flex-direction: inherit;
        }
        .blocemploye .reacdet table tbody tr td{
            margin: 0;
        }
        .blocemploye table tbody td .radlivrep{
            width: 90%;
        }
        .blocemploye .reacdet table thead .qatvinpour {
            width: 95%!important;
        }
        .blocemploye .reacdet table thead .cinqpour {
            width: 5%!important;
        }
        .blocemploye th, .blocemploye td{
            max-width: 95%;
        }
        @media screen and (max-width: 576px){ 
            .sliderhome .gjs-lory-slides .gjs-lory-slide h2{
                left: 2% !important;
                top: 90px !important;
                font-size: 1.3rem !important;
                width: 70vw;
                line-height: 1.2rem;
                text-align: center;
            }
            .sliderhome .gjs-lory-slides .gjs-lory-slide a{
                max-width: 70% !important;
                top: 120px !important;
                left: 1% !important;
                font-size: 1rem !important;
                width: 70vw;
                line-height: 1.4rem;
                text-align: center;
            }
        }
    }
}
.uncliquable{
    position: relative;
}
.uncliquable h2{
    position: relative;
    z-index: 777;
}
.uncliquableblock{
    position: absolute;
top: 30px;
left: 0;
width: 100%;
height: 100%;
background-color: #fff6;
z-index: 666;
}

#iwdeh{
    cursor: pointer;
}

.blockdate .coulspé{
    background-color: #fff;
} 
.coulspé .remise .blocrecap{
    background-color: #fff;
}
.coulspé .blocrecap .detail{
    background-color: #fff;
}
.coulspé .inforemise{
    background-color: #fff;
}
.guidespe .rechguideback{
    position: relative;
    background-color: #fff;
}
.guidespe .rechguidetype{
    position: relative;
    top: 0;
} 
.guidespe .rechguidetype .closedescr-wrapper{
    display: none;
}
.opazer{
    opacity: 0;
}

.selnbjours{
    border: 2px solid #51c5a1 !important;
background-color: #51c5a1 !important;
height: 30px;
line-height: 30px;
width: calc(100% - 4px) !important;
font-weight: normal !important;
font-style: normal !important;
font-family: 'Poppins' !important;
font-size: 1.6rem !important;
color: #000 !important;
cursor: pointer !important;
margin-top: 25px !important;
font-size: 1.3rem !important;
}
.selnbjours:hover{
    border: 2px solid #d4e0f4 !important;
}
.erdates{
    border: 2px solid #fff ;
    color: #1c2667 ;
    height: 30px;
    line-height: 30px; 
    font-weight: normal ;
    font-style: normal ;
    font-family: 'Poppins' ;
    font-size: 1.6rem ; 
    cursor: pointer ;
    margin-top: 13px ;
    font-size: 1.3rem ;
    display: inline-block;
    padding-left: 10px;
    padding-right: 10px;
    transition: all ease 500ms;
    opacity: .5;
}
.erdates:hover{
    opacity: 1; 
}

.brdrad{
    border-radius: 50% !important;
}
.closedescr{
    cursor: pointer;
}

.startform h5{
    margin-top: 0;
}
.startform .lisetap{
    display: flex;
    justify-content: space-between;
    position: relative;
    overflow: hidden;
    margin-top: 15px;
}   
.startform .lisetap div{
    position: relative;
    padding: 2px;
    width: 100%;
text-align: center;
border-right: none;
background-color: #eee;
padding-left: 8px;
padding-right: 8px;
}
.startform .lisetap div::before{
    content: '';
    background-color: #eee;
    height: 17px;
    width: 17px;
    display: inline-block;
    position: absolute;
top: 2px;
right: -7px;
transform: rotate(45deg);
border-top: 2px solid #fff;
border-right: 2px solid #fff;
z-index: 600;
}
.startform .lisetap .isgreen{
    background-color: #51c5a1;
}
.startform .lisetap .isgreen::before{
    background-color: #51c5a1;
}

.intforme{
    height: 0 !important;
    overflow: hidden;
}
.intform{
    width: 100% !important;
    margin-left: 0 !important;
    padding: 0 !important;
    min-height: 50px !important;
}
.intform .formulaireliste{
    height: 0 !important;
    min-height: 0 !important;
    overflow: hidden;
    padding: 0 !important;
} 
.intform .formphrase{
    display: none;
}
.intform .bartserv{
    display: block;
height: 0;
overflow: hidden;
min-height: 0;
}
.intform .backmodinit{
    position: relative !important;
left: 0;
padding-bottom: 8vh;
padding-top: 8vh;
min-height: 50vh;
}
.intform .backmodinit .modinit{
    position: relative;
margin-left: 5vw;
left: 0;
top: 0;
}

.intform .chargplus{
    display: none !important;
}
.intform #loadmore{
    display: none !important;
}
.red{
    color: red;
}
@media screen and (max-width: 992px){ 
    .startform .lisetap div{
        padding-right: 10px;
    padding-left: 10px;
    }
    .startform .lisetap div::before{ 
        height: 30px;
    width: 30px;
    top: 5px;
    right: -14px;
    }
    @media screen and (max-width: 682px){ 
        .startform .lisetap div{
            padding-right: 10px;
        padding-left: 10px;
        }
        .startform .lisetap div::before{ 
            height: 30px;
        width: 30px;
        top: 5px;
        right: -14px;
        }
    }
}
#i1gqq::after, #iqgd8::after{
    content: '';
    position: absolute;
    width: 100%;
    padding-top: 100%;
    border-radius: 50%;
    background-color: #51c5a1;
    z-index: -1;
}
.formphrase{
    font-size: 1rem;
    font-weight: bold;
    margin-bottom: 15px;
}

.favorisstar{
position: absolute;
top: 4px;
right: 4px;
height: 20px;
width: 20px;
background-image:url('../img/starn.png');
background-repeat: no-repeat;
background-position: center;
cursor: pointer;
background-size: contain;
z-index: 1000;
cursor: pointer;
}
.goldstar{
    background-image:url('../img/starg.png');
}
.alileft{
    margin-left: 0%;
}
#filtres .blocfiltre .alileft .radioelem{
    margin-left: 7%;
    text-align: left;
}
#filtres .blocfiltre .alileft .radioelem label{
    text-align: left;
    margin-right: 0;
    cursor: pointer;
}
#filtres .blocfiltre .demiflex{
    display: flex;
}
#filtres .blocfiltre .demiflex > div{
    width: 50%;
}
#filtres .blocfiltre .demiflex .demiflexl label{
    width: calc(96% - 4px);
    height: 22px;
    text-align: right;
    display: block;
    padding: 2px;
}
#filtres .blocfiltre .demiflex .demiflexd input{
    width: 98%;
    height: 22px;
}
.roundel{
    display: inline-block;
    width: 20px;
    height: 20px;
    position: absolute;
    border-radius: 50%;
    margin-right: 10px;
    left: -3px;
}
.colordisplay{
    padding-left: 22px;
}