* {box-sizing: border-box}
	
	html{
			background-repeat: no-repeat;
			background-position: center;
			background-size: cover;
			margin-top: -17px;
			margin-right: 0px;

	}
	body{
		margin: 0 auto;
	}
	
	.wrapper-main{
		width: 100%;
		margin: 0 auto;
	}

	
	/* 	START INDEX CSS */
	
	.navbar ul{
		display: inline-block;
		position: fixed;
		z-index: +1000;
		list-style-type: none;
		background-color: white;
		border: 0px solid;
		padding-top: 5px;
		padding-right: 0px;
		width: 100%;
	}
	.navbar li{
		display: inline-block;
		float: right;
		z-index: +1000;
	}
	.dropdown{
		display: block;
		z-index: +1000;
	}
	.dropdown button{
		text-decoration: none;
		background-color: white;
		color: black;
		z-index: +1000;
		padding: 0px 20px;
		padding-top: 16px;
		padding-bottom: 15px;
		border-radius: 15px;
		border: none;
		cursor: pointer;
		font-size: 17px;
		font-family: "Minion Pro";
	}
	.dropdown a{
		display: block;
		z-index: +1000;
		color: white;
		text-decoration: none;
		padding: 7px 15px;
		font-size: 15px;
		font-family: "Minion Pro";
	}
	.dropdown a:hover{
		text-decoration: underline 0.7px;
	}
	.dropdown .content{
		display: none;
		position: fixed;
		z-index: +1000;
		background-color: rgba(0,0,0,0.65);
		border-radius: none;
		min-width: 70px;
		min-height: 15px;
		border-radius: 0px 0px 20px 20px;
	}
	.dropdown:hover .content{
		display: block;
		position: fixed;
		z-index: +1000;
	}
	#works:hover{
		color: black;
		text-decoration: underline 0.7px;
	}
	.pages{
		padding-top: 16px;
	}
	.pages a{
		text-decoration: none;
		background-color: white;
		color: black;
		padding: 0px 20px;
		padding-bottom: 0px;
		font-size: 17px;
		font-family: "Minion Pro";
	}
	.pages:hover{
		color: ;
		text-decoration: underline 0.7px;
		cursor: pointer;
	}
	#contact{
		padding: 0px 20px;
		margin-right: 30px;
		padding-top: 16px;
		padding-bottom: 0px;
		font-size: 17px;
		font-family: "Minion Pro";
	}
	#contact:hover{
		color: none ;
		text-decoration: underline 0.7px;
		cursor: pointer;
	}
	.container{
		margin-top: -11px;
		padding-bottom: 0px;
	}
	#idofme{
		font-size: 17px;
		font-weight: normal;
		font-family: "Minion Pro";
		text-decoration: none;
		color: black;
		font-size: 22px;
		font-weight: bold;
	}
	#idofme:hover{
		cursor: pointer;
		font-size: 22px;
		font-weight: bold;
	}
	.burger-menu, .burger-menu-button{
		display: none;
	}
	
	/* END INDEX CSS */
	
	
	/* START EXHIBIT CSS */
	
/* ACCEUIL */

	#textAcceuilFR{
		position: absolute;
		padding-top: 15%;
		padding-bottom: 2%;
		margin-left: 9%;
		text-align:left;
		font-size: 17px;
		font-family: "Minion Pro";
		width: 23%;
		text-align: justify;
	}		
	#textAcceuilENG{
		position: absolute;
		padding-top: 15%;
		padding-bottom: 2%;
		margin-left: 37%;
		text-align: left;
		font-size: 17px;
		font-family: "Minion Pro";
		width: 23%;
		text-align: justify;
	}
	#imgAcceuilMobile{
		display: none;
		margin-top: 0px;
		position: fixed;
		float: right;
		padding-top: 20%;
		margin: 0px;
		width: 100%;
		height: 100%;
		opacity: 0.35;
		z-index: -2;
	}
	#imgAcceuil{
		display: block;
		margin-top: 0px;
		position: fixed;
		float: center;
		width: 100%;
		opacity: 0.35;
		z-index: -2;
		transform: translateY(-23%);
	}
	
/* END ACCEUIL*/

	
/*WORKS*/	

	.slider{
		position: static;
		float: right;
		padding-top: 8.5%;
		width: 48%;
		overflow: hidden;
		margin-right: 3.7%;
		z-index: -1;
	}
	.slider img{
		width: 100%;
		display: none;
	}
	img.displaySlide{
		display: block;
		animation-name: fade;
		animation-duration: 1.5s;
	}
	.slider button{
		position: absolute;
		margin-left: 1.5%;
		top: 50%;
		transform: translateY(-50%);
		cursor: pointer;
		height: 100%;
		background-color: transparent;
		border: 1px none;
		width: 170px;
	}
	.slides button{
		position: absolute;
		margin-top: 52%;
		margin-left: 9%;
		height: 78%;
		cursor: pointer;
		background-color: transparent;
		border: 1px none;
		width: 100px;
	}
	.previous{
		left: 0;
	}
	.next{
		right: 0;
		margin-right: 3.7%;
	}
	.previousVideo{
		left: 0;
	}
	.nextVideo{
		right: 0;
		float: right;
		margin-right: 12%;
	}
	@keyframes fade {
		from {opacity: .5}
		to {opacity: 1}
	}
	#img1MUR{
		width: 52%;
		margin-left: 25.5%;
	}
	#img0BETH{
		width: 83%;
		margin-left: 8.5%;
	}
	#img1BETH{
		width: 62%;
		margin-left: 20%;
		margin-top: .2%;
	}
	#img0TWW{
		width: 100%;
		margin-top: 5%;
		margin-left: 2%;
	}
	#img1TWW{
		width: 62%;
		margin-left: 20%;
		margin-top: .2%;
	}
	#langage{
		display: none;
	}
	#textProjectFR{
		position: absolute;
		padding-top: 9%;
		padding-bottom: 2%;
		margin-left: 3%;
		text-align:left;
		font-size: 13.7px;
		font-family: "Minion Pro";
		width: 21%;
		text-align: justify;
	}
	#textProjectENG{
		position: absolute;
		padding-top: 9%;
		padding-bottom: 2%;
		margin-left: 26.5%;
		text-align: left;
		font-size: 13.7px;
		font-family: "Minion Pro";
		width: 21%;
		text-align: justify;
	}
	#titleProject{
		position: absolute;
		padding-top: 2%;
		margin: 4.5%;
		margin-left: 8%;
		text-align:left;
		width: 20%;
		font-size: 17px;
	}
/*WORKS*/
	
/*EXHIBITIONS & PUBLICATIONS*/
	.exhibitionTextGeneral{
		position: fixed;
		width: 80%;
		float: right;
		margin-left: 10%;
		margin-top: 3%;
	}
	.img-exhibitions{
		display: flex;
		flex-wrap: wrap;
		flex-direction: line;
		justify-content: flex-start;
		float: left;
		width: 47%;
		padding-top: 7%;
		padding-bottom: 2%;
		margin-left: 4%;
	}
	#imgexhibitions0{
		margin: 1.5%;
		width: 100%;
	}
	#imgexhibitions1{
		margin: 1.5%;
		margin-left: ;
		width: 37.5%;
	}
	#imgexhibitions2{
		margin: 1%;
		margin-left: ;
		width: 28%;
	}
	#titleexhibitions0{
		position: static;
		float: left;
		width: 10%;
		margin-top: 12%;
		margin-left: 57%;
		font-size: 17px;
	}
	#exhibitionstext0{
		position: static;
		float: left;
		width: 50%;
		margin-top: -1%;
		margin-left: 56%;
		font-size: 14px;
	}
	#titleexhibitions1{
		position: static;
		float: left;
		width: 10%;
		margin-top: 1%;
		margin-left: 57%;
		font-size: 17px;
	}
	#exhibitionstext1{
		position: static;
		float: left;
		width: 50%;
		margin-top: -1%;
		margin-left: 56%;
		font-size: 14px;
	}
	#titleexhibitions2{
		position: static;
		float: left;
		width: 10%;
		margin-top: 1%;
		margin-left: 57%;
		font-size: 17px;
	}
	#exhibitionstext2{
		position: static;
		float: left;
		width: 50%;
		margin-top: -1%;
		margin-left: 56%;
		font-size: 14px;
	}
	.date{
		font-weight: bold;
	}
/*END EXHIBITIONS & PUBLICATIONS*/

/*BIO & CONTACT*/

		#textBioFR{
			position: absolute;
			padding-top: 12%;
			padding-bottom: 2%;
			margin-left: 27%;
			text-align: center;
			font-size: 16px;
			font-family: "Minion Pro";
			font-weight: bold;
			width: 300px;
		}
		#textBioENG{
			position: absolute;
			padding-top: 12%;
			padding-bottom: 2%;
			margin-left: 52%;
			text-align: center;
			font-size: 16px;
			font-family: "Minion Pro";
			font-weight: bold;
			width: 300px;
		}		
		#titleContact{
			position: absolute;
			text-align: left;
			padding-top: 0px;
			margin-left: 0px;
			font-size: 20px;
		}
		#links{
			margin: 0px;
		}
		#link{
			text-align: center;
			position: absolute;
			z-index: -1;
			margin: 0px;
			margin-top: 28%;
			width: 270px;
			margin-left: 40%;
			font-size: 22px;
			font-weight: bold;
			text-decoration: none;
			color: black;
		}
		#link:hover{
			text-decoration: underline 1px;
		}
		#link2{
			text-align: center;
			position: absolute;
			z-index: -1;
			margin: 0px;
			margin-top: 33%;
			width: 150px;
			margin-left: 44%;
			font-size: 22px;
			font-weight: bold;
			text-decoration: none;
			color: black;
		}
		#link2:hover{
			text-decoration: underline 1px;
		}
		#imgContact{
			display: none; 
			margin-top: 0px;
			position: fixed;
			float: right;
			padding-top: 15%;
			margin: 0px;
			height: 100%;
			opacity: 0.5;
			z-index: -2;
		}
		#imgContact2{
			display: block;
			margin-top: 0px;
			position: fixed;
			float: center;
			width: 100%;
			opacity: 0.4;
			z-index: -2;
		}
			
/*END BIO & CONTACT*/

/*VIDEO*/
	
	.computerVideo{
		position: relative;
		display: block;
		float: center;
		width: 100%;
		margin-right: 0%;
		margin-top: 10%;
		z-index: 5;
		pointer-events: ;
	}
	#titleProjectvideo{
		position: absolute;
		margin-top: 11%;
		margin-left: 8%;
		text-align:left;
		font-size: 17px;
		font-family: "Minion Pro";
		width: 50%;
		text-align: justify;
		z-index: -1;
	}
	#textProjectFRvideo{
		position: absolute;
		margin-top: 14.5%;
		margin-left: 4%;
		text-align:left;
		font-size: 13.7px;
		font-family: "Minion Pro";
		width: 20.5%;
		text-align: justify;
		z-index: -1;
	}
	#textProjectENGvideo{
		position: absolute;
		margin-top: 14.5%;
		margin-left: 26.8%;
		text-align:left;
		font-size: 13.7px;
		font-family: "Minion Pro";
		width: 20.5%;
		text-align: justify;
		z-index: -1;
	}
	#img1VIDPRINT{
		width: 52%;
		margin-left: 25.5%;
		margin-top: 10%;
		margin-bottom: 5%;
	}
/*END VIDEO*/


	/* END EXHIBIT CSS */

/* TYPICAL BREAKPOINT <600px, 601px, 768px, 992px, 1200px + portrait and landscape mode*/

	/* START MOBILE VERSION */
	
	@media (max-width: 600px) {
		*{
			margin: px;
			padding: px;
		}
		
	/* START INDEX MOBILE */
	
		.navbar li{
			display: none;
			z-index: +1000;

		}
		.container{
			width: 80%;
			display: flex;
			margin: 0px;
			padding: 0px;
			margin-left: 20px;
			margin-top: 7px;
			z-index: +1000;
		}
		.navbar ul{
			display: flex;
			margin-top: 6px;
			padding: 0px;
			z-index: +1000;
		}
		#idofme{
			font-size: 22px;
			font-weight: bold;
			z-index: +1000;
		}
		.burger-menu-button{
			display: block;
			margin-top: 24px;
			z-index: +1000;
		}
		.material-symbols-outlined {
			font-size: 37px !important;
			z-index: +1000;
		}

		.burger-menu{
			display: none;
			position: fixed;
			width: 100%;
			height: calc(100% - 60px);
			z-index: 2;
			background-color: white;
			margin-top: 80px;
			z-index: +1000;
		}
		.burger-menu ul{
			margin: 0px;
			padding: 0px;
			width: 100%;
			height: 100%;
			margin-top: 10px;
			display: flex;
			flex-wrap: wrap;
			align-content: flex-start;	
			z-index: +1000;
		}
		.burger-menu ul li{
			flex-basis: 100%;
		}
		.burger-menu ul li a{
			display: block;
			height: 100%;
			font-size: 18px;
			padding: 30px 0;
			flex-basis: 100%;
			text-align:center;
			z-index: +1000;
		}
		.dropdown{
			display: block;
			height: 100%;
			width: 100%;
			padding: 0px;
			flex-basis: 100%;
			text-align:center;
			z-index: +1000;
		}
		.dropdown button{
			display: block;
			height: 100%;
			width: 100%;
			font-size: 18px;
			padding: 30px 0;
			flex-basis: 100%;
			text-align:center;
			border-radius: 0px;
		}
		.dropdown .content{
			display: none;
			position: fixed;
			background-color: #7A7A7A;
			min-width: 100%;
			min-height: 100%;
			z-index: +1000;
		}
		.wrapper-main{
			width: 90%;
		}
		.navbar ul{
			width: 100%;
			float: right;
			padding-left: 0px;
		}
		
	/* END INDEX MOBILE */
	
	/* ACCEUIL */


		#textAcceuilFR{
			position: absolute;
			padding-top: 40%;
			padding-bottom: 2%;
			margin-left: 0%;
			text-align:left;
			font-size: 16px;
			font-family: "Minion Pro";
			font-weight: lighter;
			width: 90%;
			text-align: center;
		}		
		#textAcceuilENG{
			display: none;
			position: absolute;
			padding-top: 65%;
			padding-bottom: 2%;
			margin-left: 0%;
			text-align: left;
			font-size: 18px;
			font-family: "Minion Pro";
			width: 90%;
			text-align: justify;
		}
		#imgAcceuilMobile{
			display: block;
			margin-top: 0px;
			position: fixed;
			float: right;
			padding-top: 20%;
			margin: 0px;
			width: 100%;
			height: 112%;
			opacity: 0.35;
			z-index: -2;
		}
		#imgAcceuil{
			display: none;
			margin-top: 0px;
			position: fixed;
			float: center;
			width: 100%;
			opacity: 0.4;
			z-index: -2;
		}


		
	/* END ACCEUIL*/	
	
	/* START WORKS MOBILE */
	
		#titleProject{
			position: static;
			padding: 0px;
			margin: 0px;
			margin-bottom: 15px;
			padding-top: 90px;
			margin-left: 40px;
			text-align:left;
			width: 200px;
			font-size: 17px;
		}
		#langage{
			display: inline;
			font-weight: bold;
		}
		#textProjectFR{
			position: static;
			padding-top: 10px;
			margin: 0px;
			font-size: 13.7px;
			font-family: "Minion Pro";
			width: 100%;
			text-align: justify;
		}
		#textProjectENG{
			position: static;
			margin: 0px;
			padding-top: 30px;
			font-size: 13.7px;
			font-family: "Minion Pro";
			width: 100%;
			text-align: justify;
		}
		.slider{
			position: static;
			width: 100%;
			height: 450px;
			overflow: hidden;
			margin: 0px;
			margin-top: 30px;
			margin-bottom: 30px;
			padding: 0px;
			z-index: -1;
		}
		.slider img{
			width: 100%;
			display: none;
		}
		img.displaySlide{
			display: block;
			animation-name: fade;
			animation-duration: 1.5s;
		}
		.slider button{
			position: static;
			transform: translateY(-50%);
			margin-top: -220px;
			cursor: pointer;
			height: 200%;
			margin-left: 0%;
			background-color: transparent;
			border: 1px none;
			width: 35%;
		}
		.slides button{
			position: relative;
			transform: translateY(-50%);
			margin-left: 0%;
			cursor: pointer;
			height: 1000px;
			background-color: transparent;
			border: 1px none;
			width: 35%;
		}
		.previous{
			left: 0;
		}
		.next{
			right: 0;
			float: right;
			margin-right: 0%;
		}
		.previousVideo{
			left: 0;
		}
		.nextVideo{
			right: 0;
			float: right;
			margin-right: 0%;
		}
		@keyframes fade {
			from {opacity: .5}
			to {opacity: 1}
		}
		#img1MUR{
			width: 90%;
			margin-left: 5%;
		}
		#img0BETH{
			width: 100%;
			margin-left: 0px;
			margin-top: 60px;
		}
		#img1BETH{
			width: 100%;
			margin-left: 0px;
			margin-top: 10px;
		}
		#img0TWW{
			width: 102%;
			margin-left: -0.5%;
			margin-top: 115px;
		}
		#img1TWW{
			width: 100%;
			margin-left: 0px;
			margin-top: 10px;
		}

	/* END WORKS MOBILE */
	
	/*EXHIBITIONS & PUBLICATIONS*/
	
		.exhibitionTextGeneral{
			position: static;
			width: 100%;
			float: center;
			text-align: justify;
			margin-left: 10%;
			margin-top: 3%;
		}
		.img-exhibitions{
			display: static;
			float: center;
			width: 100%;
			padding-top: 40px;
			padding-bottom: 30px;
			margin: 0px;
		}
		#imgexhibitions0{
			position: static;
			margin: 0px;
			margin-bottom: 14px;
			width: 100%;
		}
		#imgexhibitions1{
			position: static;
			margin: 0px;
			margin-bottom: 14px;
			width: 100%;
		}
		#titleexhibitions0{
			position: static;
			float: right;
			width: 95%;
			margin: 0px;
			padding-top: 90px;
			font-size: 20px;
			padding-bottom: 10px;
		}
		#exhibitionstext0{
			position: static;
			float: right;
			width: 100%;
			margin: 0px;
			font-size: 13px;
			padding-bottom: 25px;
		}
		#titleexhibitions1{
			position: static;
			float: right;
			width: 95%;
			margin : 0px;
			font-size: 20px;
			padding-bottom: 10px;
		}
		#exhibitionstext1{
			position: static;
			float: right;
			width: 100%;
			margin: 0px;
			font-size: 13px;
			padding-bottom: 25px;
		}
		#titleexhibitions2{
			position: static;
			float: right;
			width: 95%;
			margin: 0px;
			font-size: 20px;
			padding-bottom: 10px;
		}
		#exhibitionstext2{
			position: static;
			float: right;
			width: 100%;
			margin: 0px;
			font-size: 13px;
			padding-bottom: 25px;
		}
		.date{
			font-weight: bold;
		}
	/*END EXHIBITIONS & PUBLICATIONS*/
	
	/*BIO & CONTACT*/

		#titleContact{
			position: absolute;
			text-align: left;
			padding-top: 0px;
			margin-left: 0px;
			font-size: 20px;
		}
		#textBioFR{
			display: none;
			position: absolute;
			padding-top: 14%;
			padding-bottom: 2%;
			margin-left: 27%;
			text-align: center;
			font-size: 16px;
			font-family: "Minion Pro";
			font-weight: thin;
			width: 21%;
		}
		#textBioENG{
			position: absolute;
			padding-top: 40%;
			padding-bottom: 2%;
			margin-left: 0%;
			text-align: center;
			font-size: 16px;
			font-family: "Minion Pro";
			font-weight: lighter;
			width: 100%;
		}
		#links{
			margin: 0px;
		}
		#link{
			text-align: center;
			position: fixed;
			z-index: -1;
			margin: 0px;
			margin-top: 100%;
			width: 100%;
			font-size: 16px;
			font-weight: lighter;
			text-decoration: none;
			color: black;
		}
		#link:hover{
			text-decoration: underline 1px;
		}
		#link2{
			text-align: center;
			position: fixed;
			z-index: -1;
			margin: 0px;
			margin-top: 110%;
			width: 100%;
			margin-left: 0px;
			font-size: 16px;
			font-weight: lighter;
			text-decoration: none;
			color: black;
		}
		#link2:hover{
			text-decoration: underline 1px;
		}
		#imgContact{
			display: block;
			margin-top: 0px;
			position: fixed;
			float: right;
			padding-top: 15%;
			margin: 0px;
			height: 110%;
			opacity: 0.4;
			z-index: -2;
		}
		#imgContact2{
			display: none;
			margin-top: 0px;
			position: fixed;
			float: center;
			width: 100%;
			opacity: 0.4;
			z-index: -2;
		}
			
	/*BIO & END CONTACT*/
	
	/*VIDEO*/ 
		.mobileVideo{
			position: absolute;
			display: block;
			margin-top: 25%;
			float: center;
			z-index: 6;
		}
		.material-symbols-outlined {
			font-size: 37px !important;
			position: absolute;
		}
		#videoLink{
			text-decoration: none;
			color: black;
		}
		.computerVideo{
			display: none;
		}
		#titleProjectvideo{
			position: static;
			padding: 0px;
			margin: 0px;
			margin-bottom: 15px;
			padding-top: 45%;
			margin-left: 40px;
			text-align:left;
			width: 250px;
			font-size: 17px;
		}
		#textProjectFRvideo{
			position: static;
			padding-top: 10px;
			margin: 0px;
			font-size: 13.7px;
			font-family: "Minion Pro";
			width: 100%;
			text-align: justify;
		}
		#textProjectENGvideo{
			position: static;
			margin: 0px;
			padding-top: 30px;
			font-size: 13.7px;
			font-family: "Minion Pro";
			width: 100%;
			text-align: justify;
		}
		#img1VIDPRINT{
			margin: 0px;
			width: 85%;
			margin-left: 8%;
			height: 100%;
			margin-bottom: 50%;
			
		}
	/*END VIDEO*/
		
	}
		
	

		
		
	
	
	/* END MOBILE VERSION */