body{
	background-color: black;
	width: 100vw;
	height: 100vh;
	overflow: hidden;
	cursor: pointer;
}

a{
	text-decoration: none;
	color: white;
}

a:hover{
	color: gray;
}

h1, h2, h3{
	font-family: "FT88-Regular";
	font-size: 1vw;
	text-transform: uppercase;
}

h2, h3{
	color: #FFF;
}

#page{
	width: 50vw;
	height: 88vh;
	margin: 4vh auto 0;
	position: relative;
	z-index: 2;
	border: 1px solid white;
}


#dossier-nectarium{
	width: 10%;
	position: fixed;
	top: 7%;
	left: 25%;
}

#dossier-pimpmyroom{
	width: 10%;
	position: fixed;
	top: 7%;
	left: 35%;
}

#dossier-nectarium:hover #openPopup1{
	border: 1px dashed #FFCF14;
	padding: .5vw;
}

#dossier-pimpmyroom:hover #openPopup2{
	border: 1px dashed #FFCBF8;
	padding: .5vw;
}

#image-conteneur{
	width: 35%;
	margin: auto;
}

img{
	width: 100%;
}

/*IMAGE BACKGROUND*/
#background-image{
	width: 100vw;
	height: 100vh;
	position: fixed;
	top: 0;
    z-index: 1;
}

#nectarium-image{
	width: 100%;
	height: 100%;
	background-image: url("../img/nectarium.png");
	background-size: 100%;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 0.4s ease-in-out;
}

#pimpmyroom-image{
	width: 100%;
	height: 100%;
	background-image: url("../img/pimpmyroom.png");
	background-size: 100%;
	background-position: center;
	background-repeat: no-repeat;
	opacity: 0;
	transition: opacity 0.4s ease-in-out;
}

/*POP UP*/
#popup1, #popup2{
    display: none; /* Caché par défaut */
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.6);
    justify-content: center;
    align-items: center;
    z-index: 99;
}

button{
	appareance: none;
	font-family: "FT88-Regular";
	text-transform: uppercase;
}

#bouton-conteneur{
	margin-top: 1.5vh;
	display: flex;
    justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement */
}

#openPopup1, #openPopup2{
	background-color: transparent;
	cursor: pointer;
	padding: .5vw;
	justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement */
    font-size: 1vw;
}

#openPopup1{
	border: none;
	color: #FFCF14;
}

#openPopup2{
	border: none;
	color: #FFCBF8;
}

#popup-content{
    width: 65%;
    position: relative;
}

footer{
	width: 50vw;
	height: 2vh;
	margin: 1.2vh auto 0;
	position: relative;
	bottom: 0;
	z-index: 2;
}

.footer-info{
	width: 100%;
	display: inline-flex;
	justify-content: space-between;
}