body
{
		background : white;
		margin : 0;
}

/*PAGE PROJET*/
.titre
{
		text-decoration : none ;
		font-family: 'Arial', sans-serif;		
		font-size : 15px;
		position : absolute ;
		top:35px;
		left: 109px;
		margin:0;
		display : inline-block;
		width : 180px;
}

.texte
{
		text-decoration : none ;
		font-family: 'Arial', sans-serif;		
		font-size : 15px;
		position : relative ;
		margin:0;
		display : inline-block;
		width : 180px;
}



/*HAUTEURS DES LIGNES PROJET*/
.height1
{
	height:35vw;
}

.height2
{
	height:45vw;
}

.height3
{
	height:39vw;
}



p
{
		text-decoration : none ;
		font-family: 'Arial', sans-serif;		
		font-size : 15px;
		position : fixed;
		display : inline-block;
		width : 180px;
		color:black;
}


.nav_horizontal
{
		text-decoration : none ;
		font-family: 'Arial', sans-serif;		
		font-size : 15px;
		position : fixed;
		display : inline-block;
		width : 200px;
		/*OUwidth : 160px;
		height : 97% ;*/
		padding-left: 15px;
		color:black;
}



.nav_vertical
{
	display : none;
	height :55px;
}

/*HAUTEUR NAV SMARTPHONE
À ne pas déplacer vers le haut */

.nav_vertical_projets
{
	display : none;
	height :190px;
}

.footer_vertical
{
		display : none ;		
}


.navbar, a
{
	color:black;
	text-decoration : none ;
	font-family: 'Arial', sans-serif;	font-size: 1em; 	

}


.navbar:hover
{
	font-family: 'Arial', sans-serif;	font-size: 1em;
	font-style: italic;
}

.contact
{
		text-decoration : none ;
		font-family: 'Arial', sans-serif;		
		font-size : 15px;
		padding-top: 14px;
		padding-left: 15px;
		color:black;
}


.contact_juliette:hover, .contact_telephone:hover, .contact_mail:hover, .contact_intagram:hover, .contact_retour:hover
{
	font-family: 'Arial', sans-serif;	
	font-style: italic;
}


button {

	color:black;
	text-decoration : none ;
	font-family: 'Arial', sans-serif;	font-size: 1em; 

	line-height : 19px;
	display : inline;
  background: none;
  border: none;
  height : 10px;
  padding: 0;  
  text-decoration : none ;
}


button:hover
{
	font-family: 'Arial', sans-serif;	
	font-size: 1.1em; 
	font-style:italic;
}


.footer{
	font-size : 15px; 
	position : fixed ;
	bottom : 15px; 
	margin : 0
	}


.footervertical
{
display:none;
}

.contact_retour_smartphone
{
	display: none;
}




/* .arbo */
/* { */
	/* text-decoration : none ; */
		/* font-family: 'Yantramanav', sans-serif;		 */
	/* font-size: 10px; */
			/* margin-left : 10px; */
			/* margin-top : 10px; */
/* } */

	/* .galery_*/
/* { */
	/* position : relative; */
	/* top:-0px; */
		/* font-family: 'Yantramanav', sans-serif;		 */
	/* font-size: 20px; */
/* } */

/* .galery_links */
/* { */
	/* text-decoration : none ; */
	/* font-family: 'Yantramanav', sans-serif;	 */
/* margin-left : 0.5vw	; */
		
/* } */
/* .galery_links:hover */
/* { */
	/* text-decoration : underline; */
	/* font-weight: ; */
/* } */

section
{
		margin-left:250px;;
		margin-top:-21px;
		font-family: 'Arial', sans-serif;	
		font-size: 12px;
}


.sectionprojectbg
{
		background-color : white;
}

.projectline
{
	width:100%; 
	overflow : hidden; 
	background-color: ; 
	white-space:nowrap;
	margin-top: 0;
	margin:0;
	display:flex;
}

.projectline:not(:last-child) .projectlink:last-of-type {
flex-grow: 1;
}

.projectlink
{
	display: inline-block;
	overflow : hidden;
	position: relative;
	width : auto;
	margin:0;
	/*height : inherit;*/
	/* width : 100%; */
	/* height : 100%; */
	/* object-fit: cover; */
}

.projectcaption
{
	display : inline-block;
	position: absolute;
	text-decoration : none ;
	font-family: 'Arial', sans-serif;	
	font-style: normal;
	line-height: 110%;
	/*font-size : 5px;*/
	/* font-weight : 600; */
	color: white;
	white-space: pre-line;
	/* border : 1px solid ; */
	display : inline;
	position : absolute;

/*Titre en haut à gauche 
	padding-left: 10px;
	padding-top:30px;	*/

/*OU Titre projet centré */
  top: 50%;
	left: 50%;
	margin-right: -50%;
	transform: translate(-50%, -50%);
	padding : 20%;
	pointer-events: none;
	z-index: 2;
}



h2
{
	line-height: 120%;
	font-weight: normal;
	display: inline;
	/* border : 1px solid black; */
}


h3
{
		font-size : 1vw;
		line-height: 100%;
		font-weight: normal;
		color : black;	
		display: inline;
		/* border : 1px solid black; */
}

h2
{
		font-size : 20 vw; 
		font-weight : 500;
		line-height: 90%;
		color :;		
		display: inline;
		/* border : 1px solid black; */
}

h3
{
		font-family: 'Arial', sans-serif;	
		line-height: 90%;
		font-weight: bold;
		color :;		
		display: inline;
		/* border : 1px solid black; */

}
.txt
	{
		font-family: 'Arial', sans-serif;	
	line-height: 110%;
	font-size : 1em;
	font-weight : normal;
	}
	

.projectimg
{
	display : inline-block;
	position :  relative ;
	/* max-width: auto;  */
	/* max-height: 100%; */
	overflow: hidden;
	width : 100%;
	height : 100%;
	object-fit: cover;
		background-color :  /*grey*/;	
		z-index: 3;

	
}
.projectimg:hover
{
	/* opacity: 0.5;
	filter: grayscale(1);
	mix-blend-mode: multiply */
	opacity: 0.7;
	filter: grayscale(1);
	mix-blend-mode: exclusion	;
		z-index: 1;
}



.invprojectimg
{
	display : inline-block;
	position :  relative ;
	max-width: 900px; 
	max-height: 100%;
	overflow: hidden;
	background-color :  grey;
	opacity: 0.7;
	mix-blend-mode: hue	;
	
}	


.invprojectimg:hover
{
	opacity: 1;
	mix-blend-mode: normal	;
}
		




/*STYLE PAGE PROJET*/	


.content-orange 
{
	width: 20%;
}

.content-orange a 
{
	display: block;
}

.content-violet 
{
	width: 80%; 
}

.content-violet-vertical 
{
	width: 80%; 
}

.header
{
  padding-left:15px;
  padding-top:15px;
}

#contact
{
  text-decoration: none;
}



/*IMAGES*/

.images {
  width: 100%;
  height: auto;
  display:inline-block;
  vertical-align:top;
}


.retour
{   font-size:15.5px;
    font-family: "Times New Roman", "Times New Roman", Times, serif, "Times New Roman", Icons;
    cursor: pointer;
    padding-left: 15px;
    outline: none;
    font-weight: 400;
    color:black;
    text-decoration: none;
	font-style: normal;
}


.texte-projet
{
	  font-size:15.5px;
    font-family: "Times New Roman", "Times New Roman", Times, serif, "Times New Roman", Icons;
    padding-left: 15px;
    padding-right: 30px;
    outline: none;
    font-weight: 400;
    color:black;
    text-decoration: none;
  

	font-style: normal;
}


.flex-container-projet {
  	display: flex;
  	flex-direction: column;
}


.images-projet-large
{
	width: 100%;
  	height: auto;
  	display:inline-block;
  	vertical-align:top;	
}

.images-projet-30
{
	width: 30%;
  	display:inline-block;
  	vertical-align:top;	
}
.images-projet-35
{
	width: 35%;
  	display:inline-block;
  	vertical-align:top;	
}
.images-projet-40
{
	width: 40%;
  	display:inline-block;
  	vertical-align:top;	
}
.images-projet-45
{
	width: 45%;
  	display:inline-block;
  	vertical-align:top;	
}
.images-projet-50
{
	width: 50%;
  	display:inline-block;
  	vertical-align:top;	
}
.images-projet-55
{
  width: 55%;
    display:inline-block;
    vertical-align:top; 
}
.images-projet-60
{
	width: 60%;
  	display:inline-block;
  	vertical-align:top;	
}

.images-projet-65
{
	width: 65%;
  	display:inline-block;
  	vertical-align:top;	
}

.images-projet-70
{
	width: 70%;
  	display:inline-block;
  	vertical-align:top;	
}
.images-projet-75
{
	width: 75%;
  	display:inline-block;
  	vertical-align:top;	
}
.images-projet-80
{
  width: 85%;
    display:inline-block;
    vertical-align:top; 
}
.images-projet-85
{
  width: 85%;
    display:inline-block;
    vertical-align:top; 
}
.images-projet-90
{
  width: 90%;
    display:inline-block;
    vertical-align:top; 
}
.images-projet-95
{
  	width: 95%;
    display:inline-block;
    vertical-align:top; 
}
.images-projet-97
{
    width: 97%;
    display:inline-block;
    vertical-align:top; 
}
.images-projet-smartphone
{
  	width: 100%;
  	display:inline-block;
  	vertical-align:top;
}
.images-projet-large-smartphone
{
	display: none;
}



/*TAILLE SUR PETIT ECRAN----------------------------------------------------------*/
@media screen and (max-width: 900px) {
  .content-orange {
    width: 100%;
    height: auto;
    margin-top: 10px;
    margin-bottom: 10px;
    position: relative;
    float: none;
  }

  .content-violet {
    width:100%;
    margin-left: 0px;}

.header
{
  padding-left:15px;
  padding-top:5px;

}


.content-container 
{
	display: none;
}

.images-projet-smartphone
{
  	width: 100%;
  	display:inline-block;
  	vertical-align:top;
}
.images-projet-large-smartphone
{
	width: 100%;
  	display:inline-block;
  	vertical-align:top;	
}







	
	
	@-moz-keyframes fade-inout {
 45%{ opacity: 1;}
  50%{ opacity: 0;}
}	

@-webkit-keyframes fade-inout {
 45%{ opacity: 1;}
  50%{ opacity: 0;}
}

@keyframes fade-inout {
  45%{ opacity: 1;}
  50%{ opacity: 0;}
}
	


/* width */
::-webkit-scrollbar {
  width: 10px;
  height : 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #1a1a1a;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background:  #595959;
}


/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #8c8c8c;
}


/* scrollbar firefox */
html{
	scrollbar-color: #595959 #1a1a1a;
  scrollbar-width: thin;
}





/*ACCUEIL PROJETS EN MODE SMARTPHONE*/

@media screen and (orientation: portrait) {


h2
{
	font-size : 13px;
	line-height: 1s20%;
	font-weight: normal;
	text-align: center;
	/* border : 1px solid black; */
}

h2
{
		/* font-size : 20 vw; */
		font-weight : 500;
		line-height: 90%;
		color :;		
		text-align: center;
		/* border : 1px solid black; */
}

.height1 .height2 .height3 .height4
{
	height:unset;
	width: 100vw;
}

	.nav_horizontal
{
		display : none ;		
}



.nav_vertical
{
		text-decoration : none ;
		font-family: 'Arial', sans-serif;		
		font-size: min(15px); 		
		line-height : 2px;
		position : sticky;
		/* height : 50vh; */
		/* height : 7vh; */
		/* min-height :20vw; */
		top : 0;
		left : 0;
		/* backdrop-filter: contrast(80%) brightness(300%) blur(30px) grayscale(100%); */
		overflow : hidden;
		z-index : 7;
		background : rgba(255,255,255,1);		/* border : 1px solid black; */
		margin-left : 0;
		width : 100% ;
		display : block ;
		padding-left : 20px;
		padding-bottom : 1px;	
}


.nav_vertical_projets
{
		text-decoration : none ;
		font-family: 'Arial', sans-serif;		
		font-size: 15px; 		
		line-height : 2px;
		/* height : 50vh; */
		/* height : 7vh; */
		/* min-height :20vw; */
		top : 0;
		left : 0;
		/* backdrop-filter: contrast(80%) brightness(300%) blur(30px) grayscale(100%); */
		overflow : hidden;
		z-index : 7;
		background : rgba(255,255,255,1);		/* border : 1px solid black; */
		margin-left : 0;
		width : 75% ;
		display : block ;
		padding-left : 20px;
		padding-bottom : 1px;	
}

.vertical_subtitle
{
	font-size : min(12px, 10vw);
}


.footer_vertical
{
		display : block ;
		position : fixed;
		/* height : 10vw; */
		padding : 1vw 0vw;
		bottom : 0;
		left : 0;
		z-index : 7;
		background : rgba(255,255,255,1);		/* border : 1px solid black; */
		font-family: 'Arial', sans-serif;		
		width : 100%;
		text-align : center;
		overflow-x: scroll;
		overflow-y: hidden;
		white-space: nowrap;
}


.navbar
{
	color:black;
	text-decoration : none ;
	font-family: 'Arial', sans-serif;	font-size: min(30px, 6vw); 
	display : inline;
	line-height :130%;
	margin : 0 0.5vw;
	/* border : 1px solid blue; */
}


.contact
{
		text-decoration : none ;
		font-family: 'Arial', sans-serif;		
		font-size : 30px;
		padding-top: 14px;
		padding-left: 15px;
		color:black;
}

.apropos
{
	color:black;
	text-decoration : none ;
	font-family: 'Arial', sans-serif;	font-size: min(30px, 6vw); 
	display : inline;
	line-height :130%;
	margin : 0 0.5vw;

	/* border : 1px solid blue; */
}

.navbar_smartphone
{
	color:black;
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: 30px; 
	display : inline;
	position: relative;
	top: 30px;
	/* border : 1px solid blue; */
}

.titre_smartphone
{
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: 15px; 
	display : inline;
	position: relative;
	top: 15px;
/*top: 42px;*/
	left:1px;
	line-height: 15px;
	/* border : 1px solid blue; */
}

.titre_smartphone:hover
{
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: 15px; 
	font-style:italic;
}


.navbar_smartphone
{
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: 15px; 
	display : inline;
	position: relative;
	top: 29px; 
	left:3px;
}

/*.navbar_smartphone:hover
{
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: 15px; 
	font-style:italic;
}

*/
.texte_smartphone
{
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: 15px; 
	display : inline;
	position: relative;
	top: 15px;
/*top: 42px;*/
	left:1px;
	line-height: 17.5px;
	/* border : 1px solid blue; */
}


.footer_smartphone
{
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: min(28px, 6vw); 
	display : inline;
	position: relative;
}


.footer_smartphone:hover
{
	color:black;
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: min(28px, 6vw); 
	font-style: italic;
	display : inline;
	position: relative;
}


.copyright_smartphone
{
	text-decoration :none ;
	font-family: 'Arial', sans-serif;	font-size: 15px; 
	display : inline;
	position: relative;
	top: 35px;
	line-height: 17px;
	/* border : 1px solid blue; */
}




body
{
	padding : 0;
	width : 100%;
	overflow-x : hidden;
}

section
{
		/* position : absolute ; */
		overflow : hidden;
		width : 100%;
		/* top : 0; */
		/* left : 0; */
		/* margin-top: 7vh;	 */
		font-size: 19px;
		width : 100%;
		/* overflow : hidden; */
		transform-origin: top left;
		transform:scaleX(1) scaleY(1);
		margin: 0;		
}


.projectline
{
	width:100%; 
	overflow : hidden; 
	background-color: ; 
	white-space:nowrap;
	margin-top: 0vw;
	margin:0;
	display:flex;
	height: 50vw;
}


 .projectline:not(:last-child) .projectlink:last-of-type {
flex-grow: 1;
}


.projectlink
{
	display: inline-block;
	overflow : hidden;
	position: relative;
	width : auto;

	height : inherit;
	/*margin-top: -0.25vw;
	margin-left : -0.25vw;*/
	/* border : 1px solid blue; */
	
}


.txt
{
	width : 100vw;
	margin-left : 20px;
	width : 80vw;
	/* margin-bottom : 50px; */
}


.brnav
{
	display:none;
}


.language{
	display : none;
}


.footer{
	display:none;
}


.footer_vertical
{
	height:7vh;
}

.projectcaption
{
	font-size : 40px;
}