/* //////////////////PC///////////////////////*/

body {
overflow-x: hidden;
font-family: 'Lato', sans-serif;
background:#0e8bd4;
font-size:14px;
height:100vh;
}

#loader{position:fixed;top:0;left:0;width:100%;height:100vh;background: radial-gradient(#030d1a, #000);text-align:center;z-index:99999999999;}
#img-loader{margin-top:50vh;width:50px;height:50px;}

#menu{
height:10vh;
width:100vw;
background: rgba(0,0,0,0.9);
top:0;
position:fixed;
z-index:99999;
}

#menu-responsive{
display:none;
}

#slider-part{background:#fff;position:fixed;bottom:10vh;z-index:99999;opacity:0.75;width:98vw;padding:1vw;height:50px;filter:invert(100%);overflow: hidden;}
.slideshow {width: 100%;height: 100px;overflow: hidden;border: none;margin-left:auto;margin-right:auto;}
.slideshow ul {width: 400%;height: 100px;padding:0; margin:0;list-style: none;}
.slideshow li {float: left;}
.logo-partenaire{margin-left:auto;margin-right:auto;width:125px;height:50px;object-fit:cover;filter:grayscale(100%);}

#pub{position: fixed; height: auto; width: auto; margin-top: 25vh; z-index: 999999; width: 250px;right:-270px;transition:1s;border:solid 10px #fff;box-shadow: 2px 2px 2px 1px rgba(0, 0, 0, 0.8);background:#fff;border-radius:10px 0px 0px 10px;}

.choiceTypeIndex{color:#fff;font-size:50px;cursor:pointer;opacity:0.5;transition:0.5s;font-weight:100;color:#fff;display:inline-block;margin:0 20px;}
.choiceTypeIndex:hover{opacity:1;color:#1c91a7;margin:0 50px;font-size:55px;}

.icone-menu{
font-size:30px;
margin-right:15px;
transition:0.2s;
}

.icone-menu:hover{
opacity:0.8;
}

.title {
font-size: 22px;
text-align: center;
font-weight: 900;
text-transform: uppercase;
color: #ac115b;
}

.bandeau{

background:#232323;
height:80vh;
width:80vw;
margin:5vh 5vw;
margin-left:auto;
margin-right:auto;

}

.text-container{
background:#fff;width:80%;max-width:1000px;margin-left:auto;margin-right:auto;padding-top:13.33vh;font-size:16px;padding-bottom: 20vh;
}

.item-menu{
float:left;
text-align:center;
padding :2vh;
margin:2vh 0;
color:#fff;
font-family: 'Lato', sans-serif;
font-size:12px;
margin-left:10px;
transition:0.2s;
border-radius:10px;
background:#0d0d0d;
cursor:pointer;
text-transform:uppercase;
border-top: solid 0px #ac115b;
}

.item-menu:hover{
background:rgba(0,0,0,0.8);
border-top: solid 5px #ac115b;
border-radius:0;
}

.li-menu{
margin-left:-35px;text-align:left;border-bottom:solid 1px #fff;padding:15px 0;transition:0.5s;min-width:100px;
}

.li-menu:hover{
opacity:0.6;
}


#submenu-services{
display:none;list-style:none;
}

.menu-contact{
position: absolute;
color: #fff;
float: right;
padding: 25px;
font-size: 0.8em;
font-family: 'Lato', sans-serif;
z-index: 999;
right: 0;
text-align: right;
line-height:2em;
}

.element-menu-contact{
padding-right:10px;
}

.btn-noir-et-rouge{
background:#000;color:#fff;width:100px;font-size:1.5em;padding:20px;transition:0.5s; text-decoration: none;
}	

.btn-noir-et-rouge:hover{
background:#d70808;color:#fff;width:100px;font-size:1.5em;padding:10px; text-decoration: none;
}

a{
text-decoration:none;
border:none;
}

a:hover{
text-decoration:none;
border:none;
}

.bloc-societe{
font-size:1.1em;
width:80%;
margin-left:auto;
margin-right:auto;
border-top:solid 2px #fff;
border-bottom:solid 2px #fff;
background:rgba(0,0,0,0);
padding:2% 5%;
max-height: 40vh;
overflow: auto;
}

.box-acciauto{
width:19%;
float:left;
padding:3%;
}

.content-box-acciauto{
width: 49%;
text-align: center;
margin-left: auto;
margin-right: auto;
float: left;
color: #fff;
margin-top: 40vh;
}

.box-text-acciauto{
overflow: auto;
font-size: 1em;
margin-left: auto;
margin-right: auto;
border-top: solid 2px #fff;
border-bottom: solid 2px #fff;
background: rgb(255, 255, 255);
padding: 5%;
text-align: left;
margin-top: 10vh;
height: 80vh;
}

#footer{
width: 100vw;
height: 10vh;
text-align: center;
bottom: 0;
font-size: 12px;
z-index:99999;
position:fixed;
background: rgba(0,0,0,0.9);
color:#fff;
}

.bouton {
width: auto;
height: auto;
background: #ac115b;
color: #fff;
line-height: 15px;
border: 0px;
cursor: pointer;
min-width: 150px;
border-radius: 5px;
transition:0.2s;
padding: 10px;
font-size: 18px;
}

.bouton:hover{
opacity:0.8;
}

input{
width:60%;
padding:1%;
font-size:16px;
border : solid 1px #a5a5a5
}

select{
width:60%;
padding:1%;
font-size:16px;
border:0;
}

textarea{
width:60%;
padding:1%;
font-size:16px;
border : solid 1px #a5a5a5
}

.box-accueil{
width:27%;
text-align:center;
margin-left:auto;
margin-right:auto;
float:left;
color:#fff;
margin: 0 3%;
}

.container-box-accueil{
width:100vw;
overflow:auto;
position:absolute;
margin:40vh 0;
text-align:center;
max-height: 50vh;
z-index:998;
}

.content{
width:100vw;
min-height:90vh;
height:100%;
padding-bottom:10vh;
}

.container-box-societe{
width:100vw;
overflow:auto
;position:absolute;
padding:10vh 0;
margin-top:10vh;
text-align:center;
z-index:999;
}

.box-societe{
width:33%;
text-align:center;
margin-left:auto;
margin-right:auto;
float:left;
color:#fff;
}

.container-contact{
width:100vw;
overflow:auto
;position:absolute;
margin:20vh 0;
text-align:center;

z-index:999;
}

.container-acciauto{
width:100vw;
height:90vh;
position:absolute;
text-align:center;
z-index:999;
}

.bloc-text-acciauto{
width:50%;
height:100%;
text-align:center;
margin-left:auto;
margin-right:auto;
float:left;
color:#232323;
}

#logos-partenaires {

height: auto;
z-index: 9999;
position: fixed;
bottom: 0;
background: #fff;
width: 100vw;

}

.photo-service{
width: 50%;
height: 100%;
max-height: 80vh;
overflow: auto;
float: left;
background: #000;
background-image: none;
background-size: auto auto;
background-size: cover;
}

.description-service {
width: 50%;
height: 100%;
max-height: 80vh;
overflow: auto;
float: left;
color: #fff;
font-size: 1.2em;
}

.container-box-realisation {
overflow: hidden;
width: 50%;
height: 500px;
background-color: #fff;
float:left;
}

.box-realisation {

filter: contrast(100%) opacity(90%);
width: 50vw;
height: 500px;
position: absolute;
transition:0.5s;
}

.box-realisation:hover {

filter: contrast(120%) opacity(0%);
width: 50vw;
height: 500px;
position: absolute;
overflow:hidden;
}

.effet{
height:80vh;
}

.effet2{
height:80vh;
}

.effet3{
height:80vh;
}

.btn{
background:none;
color:#fff;
padding: 10px 15px;
width:auto;
margin-left:auto;
margin-right:auto;
text-align:center;
border:solid 1px #fff;
border-radius:2px;
bottom: 20px;
position: absolute;
}

.cellule-input {
    width: 60%;
    padding: 1%;
    background-color: #F5F5F5;
    border: 1px #B2B2B2 solid;
    border-radius: 3px;
    font-size: 1.2m;
    color: #333333;
}

.cellule-textarea {
    width: 60%;
    padding: 1%;
    background-color: #F5F5F5;
    border: 1px #B2B2B2 solid;
    border-radius: 3px;
    font-size: 1.2m;
    color: #333333;
    resize: none;
}

.cellule-input-erreur {
    width: 60%;
    padding: 1%;
    background-color: #FFEBE8;
    border: 1px #FF0000 solid;
    border-radius: 3px;
    font-size: 1.2m;
    color: #333333;
}

.cellule-textarea-erreur {
    width: 60%;
    padding: 1%;
    background-color: #FFEBE8;
    border: 1px #FF0000 solid;
    border-radius: 3px;
    font-size: 1.2m;
    color: #333333;
}

.cellule-valid {
    width: 50%;
    height: 20px;
	margin-left: auto;
	margin-right: auto;
    font-size: 1.2m;
	font-weight: bold;
    color: #090;
}

.cellule-erreur	{
    width: 50%;
    height: 20px;
    margin-left: auto;
    margin-right: auto;
    font-size: 1.2m;
	font-weight: bold;
    color: #FF0000;
}


/* //////////////////MOBILE///////////////////////*/

@media all and (max-device-width: 1024px)
{



body{
background-color:#fff;
color:#232323!important;
}

#menu{
overflow:hidden;
}

#menu-responsive{
display:block;position:fixed;top:12vh;right:3vw;z-index:989999999999999;color:#fff;
}

#pub{
display:none;
}

.menu-contact {
padding: 1%;
padding-top:2.5vh;
}

.box-accueil{
width: 80%;
text-align: center;
margin-left: auto;
margin-right: auto;
float: none;
color: #232323;
margin-top: 10%;
}

.item-menu{
width:94%;
padding:3%;
margin:0;
border-radius:0;
}

.container-box-accueil{
width:100vw;
overflow:auto;
position:relative;
margin:5vh 0;
text-align:center;
max-height:none;
z-index:998;
}

.content{
width:100vw;
height:100%;
overflow:auto;
}

video{
z-index:-9999;
width:auto;
height:89vh;
min-width:100%;
filter:blur(20px);
z-index:-9999;
background:#000;
display:none;
}

#footer{
width: 100vw;
height: 10%;
text-align: center;
bottom: 0;
font-size: 0.7em;
z-index:9000;
position:fixed;
margin-top:10%;
z-index:999999;
}

.container-box-societe{
width:100vw;
overflow:auto;
position:relative;
margin:5vh 0;
text-align:center;
max-height:none;
z-index:999;
}

.box-societe{
width:100%;
text-align:center;
margin-left:auto;
margin-right:auto;
margin-top:10%;
color:#232323;
}

.bloc-societe{
font-size:1.1em;
width:80%;
margin-left:auto;
margin-right:auto;
border-top:solid 2px #fff;
border-bottom:solid 2px #fff;
background:rgba(0,0,0,0);
padding:2% 5%;
max-height: none;
}

.container-contact{
width:100vw;
overflow:auto;
position:relative;
margin:12vh 0;
text-align:center;
max-height:none;
z-index:999;
}

.container-acciauto{
width:100vw;
height:auto;
position:relative;
margin:5vh 0;
text-align:center;
z-index:999;
}

.bloc-text-acciauto{
width:100%;
height:100;
text-align:center;
margin-left:auto;
margin-right:auto;
color:#232323;
}

.box-text-acciauto{
max-height:100%;
overflow:none;
font-size:1em;
width:90%;
margin-left:auto;
margin-right:auto;
border-top:solid 2px #fff;
border-bottom:solid 2px #fff;
background:rgba(255,255,255,0.9);
padding:5%;
text-align:left;
}

.content-box-acciauto {
width: 100%;
text-align: center;
margin-left: auto;
margin-right: auto;
float: none;
color: #232323;
margin-top: 20px;
}

.box-acciauto {
width: 90%;
float: none;
padding: 5%;
}

#logos-partenaires {
height: 150px;
z-index: 9999;
position: relative;
bottom: 0;
background: #fff;
width: 100%;
}

.photo-service{
width: 100%;
margin-top:0vh!important;
height: 250px;
max-height: none;
overflow: auto;
float: none;
background: #000;
background-image: none;
background-size: auto auto;
background-size: cover;
}

.description-service {
width: 100%;
margin-top:0vh!important;
height: auto;
max-height: none;
overflow: auto;
float: none;
color: #fff;
font-size: 1.2em;
}

.force-white-fontawesome{
background:#d0d0d0!important;
-webkit-background-clip: text!important;
-webkit-text-fill-color: transparent!important;
}

.effet {
height: auto;
}

.container-box-realisation {
overflow: hidden;
width: 100%;
height: 500px;
background-color: #fff;
float:none;
}

.box-realisation {
filter: contrast(100%) opacity(100%);
width: 100%;
height: 500px;
position: absolute;
transition:0.5s;
}

.box-realisation:hover {
filter: contrast(120%) opacity(0%);
width: 100%;
height: 600px;
position: absolute;
}


}