/*VERT : var(--vert)*/
/*BLEU : #00F4FF*/
/*FOND : #001913*/

:root {
    --vert: #AEFF00;
    --bleu-electric: #00F4FF;
    --fond: #001913;
}
    /*background-color: var(--bleu-electric);*/

html {	height: 100%}
body {	position: absolute;background-color: var(--fond);
		margin:0;/*overflow-x: hidden;*/ height: 100%;width: 100%;
		min-width: 200px;min-height:100px;
		font-family: 'Roboto', sans-serif;
		font-size: 1em; color:var(--vert);

	}

body p{color: white;}

a{text-decoration: none;text-decoration: underline;
    text-underline-position: under; color:var(--vert);}

#language-changer {position: absolute; left: 20px; top:20px;}
#language-changer span:selected {
	text-decoration: underline;
}

#mentions_legales p{margin-left: 20%;margin-right: 20%; }

#container-header{width: 100%;position: relative;overflow: hidden;}

header { width: 100%;height: 500px; margin-top: 20px;
		display: flex; justify-content: center;
		align-items: center;height: 300px;
	display: -webkit-flex; /* Safari */
    -webkit-justify-content: center; /* Safari 6.1+ */
-webkit-align-items: center; /* Safari 7.0+ */}

header img {position: absolute;height:300px;}

@-webkit-keyframes rotating {
    from{
        -webkit-transform: rotate(0deg);
    }
    to{
        -webkit-transform: rotate(360deg);
    }
}


#circle-profile-picture {
	-webkit-animation: rotating 60s linear infinite;
	}
#dart-profile {display: none;}
#profile-picture {border-radius: 800px;height: 150px;border: #65bdd5 2.1px solid;}

#call-me-now {display: none;}


#presentation {padding-left: 50%; margin-left: -250px;}
#presentation h1{font-size: 1.75em; letter-spacing: 0.15em; 
					margin-bottom: 0.2em;}
#presentation h2{font-size: 1.45em;letter-spacing: 0.1em;
					margin-top: 0.2em;}

article {margin-bottom: 50px;}
article p{color: white;}
article h3{margin-left: 20%;font-size: 1.25em;margin-top: 60px;	}
article .blue-dart{width: 108px;position: absolute;margin-top: -15px;
    margin-left: 20%;border-top-style: solid;border-top-width: 2px;border-top-color: var(--bleu-electric);}
.container-fullwidth{
    width: 100%;
    display: flex;
    justify-content: right;
    display: -webkit-flex; /* Safari */
    -webkit-justify-content: center; /* Safari 6.1+ */
    /* justify-content: center; */
    /* margin: auto; */
    }
.swiper-container {
    display: flex;
    justify-content: center;
    width: 100%;
    display: -webkit-flex; /* Safari */
    -webkit-justify-content: center; /* Safari 6.1+ */
    -webkit-align-items: center; /* Safari 7.0+ */
    }
.swiper-slide {width: 300px !important;cursor: pointer;/* margin: 0 25px; */}
.swiper-slide .image {width: 300px;height: 200px;background-repeat: no-repeat;
    background-size: cover;
    background-position: center;transition: all 0.3s;}
.swiper-slide .image:hover {
    /*background-size: 100%;*/
}


.swiper-slide .label { color: white;margin-top: 10px; margin-left: 10px;letter-spacing: 0.5px;font-size: 1.2em;}

.swiper-button-prev img{transform: rotate(180deg);}

.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity: 0.5;cursor:auto;/* pointer-events:none; */transition: 500ms}

.swiper-button-next, .swiper-container-rtl .swiper-button-prev {
	width: 50px;
	background-color: #001913b8;
	display: flex;
	align-items: center;
	display: -webkit-flex; /* Safari */
	-webkit-align-items: center; /* Safari 7.0+ */
	right: 0px;
	padding: 0em;
	border-radius: 15px 0 0 15px;
	/* border: solid 2px; */
	border-right: unset;
}
.swiper-button-prev {
	width: 50px;
	background-color: var(--fond);
	display: flex;
	align-items: center;
	display: -webkit-flex; /* Safari */
	-webkit-align-items: center; /* Safari 7.0+ */
	left: 0px;
	/* padding: 10px 22px; */
	border-radius: 0 15px 15px 0;
	/* border: solid 2px; */
	border-left: unset;
}

.swiper-gradient-next{
	position: absolute;width: 167px;height: 90%;z-index: 10;right: 0;cursor: pointer;
    background: -moz-linear-gradient(right, rgb(0, 25, 19) 0%,rgb(0, 25, 19) 49%,rgba(0, 25, 19, 0) 100%);
    background: -webkit-linear-gradient(right, rgb(0, 25, 19) 0%,rgb(0, 25, 19) 49%,rgba(0, 25, 19, 0) 100%);
    background: linear-gradient(to left, rgb(0, 25, 19) 0%,rgb(0, 25, 19) 49%,rgba(0, 25, 19, 0) 100%);}


#contact-container{
	padding-left: 20%;width: 100%; max-width:800px;max-width: 60%;
}


#contact-container #social-contact a{
	text-decoration: none;
	font-size: 2em;
	margin: 0 30px;
}
#social-contact{
    display: flex;
    justify-content: center;
    display: -webkit-flex; /* Safari */
    -webkit-justify-content: center; /* Safari 6.1+ */
    margin-top: 3em;
}

#contact-container hr {
	border-style: unset;
	border-top-style: solid;border-top-width: 2px;border-top-color: var(--bleu-electric);margin-left: -20px;
}

#contact-container .contact-info{
	font-size: 1.1em;font-weight: bold;margin: 20px 0;letter-spacing: 1px;
}

footer {
	/* padding-left: 20%; */
	width: 100%;
	max-width:800px;
	max-width: 60%;
	margin-top: 40px;
	margin-bottom: 40px;
	display: flex;
	flex-wrap: wrap;
	/* display: -webkit-flex; */
	margin-left: 20%;
	justify-content: center;
	padding-bottom: 3em;
	}
footer span {font-weight: bold;margin-right: 50px;margin-bottom: 15px;opacity: .8}

/*WORK-----------------------------*/

#black-screen{cursor: pointer;background-color: black;opacity: .8;position: fixed;top: 0;width: 100%;height: 100%;z-index: 5}
#work-container{left:0px;justify-content: center;top: 0;z-index: 10;width: 100%;position: absolute;display: flex;display: -webkit-flex;}
#outside-work-background{width: 100%;height: 100%;cursor: pointer;position: absolute;z-index: -1;}

#head-body{width:100%;max-width:1000px;}
#head-work{
    position: sticky;
    top: 0;
    /* width: calc(100% - 100px); */
    width: 101%;
    display: flex;
    justify-content: center;
    display: -webkit-flex; /* Safari */
    -webkit-justify-content: center;
    height: 4em;
    background-color: var(--fond);
    border-bottom: solid 0.5em var(--fond);
    box-shadow: 0px 0px 13px 0em var(--fond);
    }

#work{width: calc(100% - 64px);margin: auto;background-color: var(--fond);border: solid 2px var(--vert);padding: 30px;margin-top: 20px;margin-bottom: 33px;padding-top: 2em;}
#work h3{font-size: 1.5em;letter-spacing: 1px;position: absolute;margin: 0;margin-top: 20px;}
#work #date{display: none;}
.green-dart{width: 300px;position: absolute;top: 64px;
		    border-top-style: solid;border-top-width: 1.5px;border-top-color: var(--vert);}
#backArrow{cursor: pointer ;font-size: 2.4em !important;position: absolute;top: -7px;padding: 20px;left: -23px;}
#shareMessage{font-size: 0.8em;}

#text-work,.text-work{
    display: flex;
    align-items: center;
    display: -webkit-flex; /* Safari */
    -webkit-align-items: center; /* Safari 7.0+ */
    text-align: left;
    font-size: 1.2em;
    font-weight: bold;
    letter-spacing: 0.5px;
    margin: 10px 33px;
    color: white;
    flex-wrap: wrap;
    }

#work .full-screen-picture, #work .side-picture{ margin: 10px 2px; }
.full-screen-picture{width: 100%;}
.side-picture{width: 48%;float:right;}


/*Docapost*/
.docacenter p{text-align: center;width: 100%;}
#work h2{font-size: 5em;letter-spacing: 1px;margin: 0;margin-top: 400px;text-align: center;}

.invisible-footer{opacity: 0};
.invisible-footer:hover{opacity: 1};


/*MOBILE-------------------------------*/

@media (max-width: 560px) {

	header {width: 75%;margin-left: 25%;padding-bottom: 20px;}
	#presentation{margin-left: 33%;padding-left: 0;width: 63%;font-size: 0.75em;margin-top: -15px;}

	#dart-profile{transform: rotate(-7deg);}

	#call-me-now {margin-left:11%;display: inline-block;}
	#call-me-now img {width:20%;position: absolute;max-width:90px; }
	#call-me-now #circle-phone{}
	#call-me-now #phone-in-circle{}

	.swiper-button-next, .swiper-button-prev{display: none;}

	.swiper-container {   width: 95%;}
	.swiper-slide .image {width: 200px;height: 150px;}
	.swiper-slide { width: 250px !important;}
	.swiper-slide .label {opacity: 1;font-weight: bold;letter-spacing: 0.5px;}

/*BOOK - - - - - - - - - - - - */

	#work{border:none;padding-top: 1px;margin-top: 0;}




}

@media (max-width: 600px) {
    #presentation{padding: 20px;margin-left: 0;}
}

@media (max-width: 400px) {
    #call-me-now {margin-left: 10%;text-decoration: none;display: inline-block;}
    #dart-profile {transform: rotate(-10deg) scale(0.8);}
    #phone-in-circle{margin-left: -51%;}



}

#social-contact img {
    height: 30px;
}

.swiper-button-next img, .swiper-button-prev img {
    height: 66%;
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    
    

    height80%: ;
}

.swiper-button-next:hover, .swiper-button-prev:hover {transform: scale(1.2);}

.swiper-button-prev.swiper-button-disabled {
    opacity: 0;
    pointer-events: none;
}