/* GENERAL */

body{
	margin: 0;
	overflow: hidden;
	font-family: CircularSpotifyTextBold;
	letter-spacing: -1px;
}

body {
            animation: fadeInAnimation ease 0.5s;
            animation-iteration-count: 1;
            animation-fill-mode: forwards;
        }


        @keyframes fadeInAnimation {
            0% {
                opacity: 0;
            }

            100% {
                opacity: 1;
            }
        }


@font-face {
    font-family: CircularSpotifyTextBold;
    src: url("fonts/CircularSpotifyTextBold.otf") format("opentype");
}






/* PAGE MENU */

.menu{
	/*background-color: blue;*/
	color: black;
	list-style: none;
    position: absolute;
    top: 40%;
    left: 55%;
    transform: translate(-50%, -50%);
    width: 40vw;
    display: flex;
    font-size: 1em;
   
   
}


.menu li{
	text-align: center;
}

li:hover{
	cursor: crosshair;
	color: black;
	/*text-decoration: underline;*/
}

.lea{
	font-size: 1em;
	color: black;
	margin-right: 10vw;
	margin-top: 15%;
	
}

.projets{
	position: relative;
	margin-top: 10%;
}




/* PAGE PROJET */



.project{
	position: absolute;
	color: white;
	mix-blend-mode: exclusion;
}



.back{
	font-size: 1em;
	margin-left: 92vw;
	margin-top: 5.5vh;
}

.normal{
	color: black;
}


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


article video{
	position: absolute;
	object-fit: cover;
	width: 62vw;
	z-index: -10;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
}

.blackmilan video{
	width: 700px;
}

.sliderj::-webkit-scrollbar {
  display: none;
}

.sliderc::-webkit-scrollbar {
  display: none;
}

.sliderj{
	width: 100%;
	height: 85vh;
	position: absolute;
    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);
 	margin-left: 4vw;
    overflow-x: scroll;
	display: flex;
}

.sliderj img video{
	width: 50%;
	margin-top: 4vh;
	object-fit: contain;
	margin-left: auto;
}

.sliderc{
	width: 100%;
	height: 80vh;
	position: absolute;
    top: 50%;
    left: 50%;

    transform: translate(-50%, -50%);
 	margin-left: 4vw;
    overflow-x: scroll;
	display: flex;
}

.sliderc img video{
	width: 50%;
	margin-top: 4vh;
	object-fit: contain;
	margin-left: auto;
}


.slide{
	margin-right: 4vw;

}







/* PAGE CONTACT/INFOS/ABOUT */

.contactpage{
	display: flex;
    color: black;
    list-style: none;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 1em;
    gap: 10vw;
}

.bloc-image img{
	width: 300px;
}

.bloc-texte p{
	margin-bottom: 4vh;
}

.bloc-texte{
	margin-top: -2vh;
}

.contact{
	display: flex;
	gap: 2px;
}

.icon{
	width: 30px;
}

.texte{
	width: 280px;
}

.infos{
	font-size: 1em;
}

.awards{
	width: 350px;
}