html, body {
	margin: 0%;
	padding: 0%;
}

body{
	background-image: url("../Images/Background_page.jpg");
	background-size: 100%;
	background-repeat: no-repeat;
	background-attachment: fixed;
}

p{
	margin: 0%;
}

/* Header */

header{
	text-align:center;
	position: fixed;
	width: 100%;
	background: white;
	height: 50px;
	opacity: 0.95;
	box-shadow: 0px 3px 25px  black;
	z-index: 900;
}

#logo{
	vertical-align:middle;
	display: inline;
	margin: 0% 4% 0% 4%;
	height:100%;
	z-index: 920;
}

header a{
	display: inline;
	padding: 0% 3% 0% 2%;	/* Responsive ici */
	z-index: 920;
	font-family: PolicePerso;
	font-size: 15px;
	text-decoration: none;
	color: black;
}

@media only screen and (min-width:1050px){
.full:hover{
	width:10%;
	-webkit-transition: all 0.4s ease;
	-webkit-transform:scale(1.25); /* Safari and Chrome */
	font-size: 120%;
}
}
	/* Menu */

.menuderoulant p{
	font-family: PolicePerso;
	font-size: 15px;
	margin-left: 40%;		/* Responsive ici */
}

.menu {
	color: black;
	border: none;
	cursor: pointer;
	padding:0px;
}

.menuderoulant {
	position: relative;
	display: inline-block;
}

.sousmenu {
	position: absolute;
	display: none;
	background-color: white;
	width: 90px;
	left:28%;				/* Responsive ici */
	top:108%;
}

.sousmenu a{
	font-family: PolicePerso;
	font-size: 15px;
	padding:5px 0px 0px 0px;
	color: black;
	text-decoration: none;
	display: block;
}

.sousmenu a:hover{
	color: blue;
}

.menuderoulant:hover .sousmenu {
	display: inline-block;
}

	/* Fin menu */
	/* Fin header */

.txt{
	margin: 15% 8% 15% 55%;
	font-family: PolicePerso;
	width:25%;
	text-align: center;
}

#image_gd{
	width: 100%;
	height: 100%;	
	float: left;
}

.imgs{
	width: 100%;
	height: 100%;
	float: left;
}

#cliquez{
	position: absolute;
	transition: 0.5s ease;
	width: auto;
    height: auto;
	opacity: 1;
	display:none;
	left:0;
}

#container{
	width: 100%;
}

#overlay:hover #cliquez{
	display:inline;
}

#cliquez2{
	position: absolute;
	transition: 0.5s ease;
	width: auto;
    height: auto;
	opacity: 1;
	display:none;
	right:0;
}

#container2{
	width: 100%;
}

#overlay2:hover #cliquez2{
	display:inline;
}

#Iris p.txt {
	margin:16% 0% 15% 25%;
	float:left;
	font-size: 20px;
}

#parfum1{
	height: 100%;
	float:left;
}

#Myrtilli p.txt {
	margin:10% 0% 0% 15%;
	float:left;
	font-size: 20px;
}

#parfum2{
	float: right;
	display:inline-block;
	margin-bottom: 5%;
}

	/* Footer */
footer{text-align: center; height: 30px; width: 100%; background: white;}
#footer_img{height:100%;}
#logoDF{height:100%; float:left;}
#logoIUT{height:100%; float:right;}
	/* Fin footer */

	/* Slider */
* {box-sizing:border-box}

/* Slideshow container */
.slideshow-container {max-width: 1000px; margin: auto;}

/* Hide images by default */
.mySlides {display: none;}
#first{display: inline;}

/* On hover : black background */
.prev:hover, .next:hover {background-color: rgba(0,0,0,0.8);}

/* Dots */
.dot {cursor: pointer; height: 20px; width: 20px; margin: 0 2px; background-color: #464646;
border-radius: 50%; display: inline-block; transition: background-color 0.6s ease;}
.active, .dot:hover {background-color: black;}
	/* Fin slider */

	/* Polices */
@font-face {font-family: "PolicePerso"; src: url('../Polices/MontserratLight.TTF');}
	/* Fin polices */
	
	/* Fading animation */
.fade {-webkit-animation-name: fade; -webkit-animation-duration: 1.5s; animation-name: fade; animation-duration: 1.5s;}
@-webkit-keyframes fade {from {opacity: .4} to {opacity: 1}}
@keyframes fade {from {opacity: .4} to {opacity: 1} }
	/* Fin fading animation */
	
/* Fading animation */
.fondu {-webkit-animation-name: fondu; -webkit-animation-duration: 1s; animation-name: fondu; animation-duration: 1s;}
@-webkit-keyframes fondu {from {opacity: 0} to {opacity: 1}}
@keyframes fondu {from {opacity: 0} to {opacity: 1} }
/* Fin fading animation */

	/* Scrollbar */
::-webkit-scrollbar {width: 10px;}
::-webkit-scrollbar-track {background: #ffffff;}
::-webkit-scrollbar-thumb {background: #3F3F3F; border-radius: 10px;}
::-webkit-scrollbar-thumb:hover {background: #6B6B6B;}
	/* Fin scrollbar */

	/* Résolution site */
@media only screen and (max-width:1049px){
body{background-image: url("../Images/Background_page_2.jpg");}
.txt{margin: 15% 8% 15% 55%; font-family: PolicePerso; text-align: center;}
#logo{vertical-align:middle; margin: 0% 4% 0% 4%; height:100%; z-index: 920;}
#responsive{display:none;}
header{text-align:center; position: fixed; width: 100%; background: white; height: 50px; opacity: 0.95; box-shadow: 0px 3px 25px  black; z-index: 900;}
header:hover  #responsive {display:inline-block; padding: 0% 6% 0% 6%; margin: 1% 1% 0% 1%; vertical-align:middle;}
header:hover #logo{display:none;}
a{font-family: PolicePerso; font-size: 15px; text-decoration: none; padding: 0px 5px 0px 5px; color: black;}
#Iris p.txt{margin:10% 0% 0% 10%; float:left;}
#Myrtilli p.txt{margin:0% 10% 5% 5%; float:right;}
#parfum2{width:75%;}
#overlay2:hover #cliquez2{display:none;}
}
	/* Fin résolution site */