/*#f9f9ff : gris clair*/
/*##8a00ff : violet*/


html{
  scroll-behavior: smooth;
}

body {
  font-family: Georgia;
  background: black	;
  font-size:13px;
  background-image: url('images/fond.jpg');
  background-repeat:no-repeat;
  background-size:cover;
  background-attachment:fixed;
  
}
  
  ::-webkit-scrollbar {
		  width: 7px;
}
	
::-webkit-scrollbar-track {
		  background-color: #f9f9ff;
}
		  
::-webkit-scrollbar-thumb {
		  background-color: black; 
}
		  
::-webkit-scrollbar-button {
		  background-color: #7c2929;
}

.background-image{
	width:100vw;
	height:100vh;
	margin-top:0px;
}



.contenu-all{
	width:100%;
	overflow-x:hidden;
}


img{
	width:100%;
	margin:0px;	
}


#scroll_to_top {
  position: fixed;
  transition: 1s;
  width: 28px;
  height: 25px;
  bottom: 40px;
  right: 30px;
  cursor:pointer;

}
#scroll_to_top img {
  width: 35px;
  cursor:pointer;

}

#scroll_to_top img:hover {
width: 45px; 
transition:0.5s;
cursor:pointer;

}


#cv {
  position: fixed;
  width: 30px;
  height: 25px;
  top: 30px;
  right:30px;
  cursor:pointer;
  
}

#cv img {
  position: fixed;
  width: 40px;
  height: 30px;
  top: 20px;
  cursor:pointer;

}

#cv:hover {
width: 50px; 
transition:0.4s;
cursor:pointer;

}


.conteneur-contact{
	position:fixed;
	background-color:black;
	width:100%;
	height:5vh;
	margin-top:95vh;
	z-index:1;
}

.contact{
	background-color:black;
	width:23vw;
	padding:6px;
	font-size:13px;	
	display:inline-block;
	height:2vh;
	font-size:11.4px;
	text-align:center;
	color:#f9f9ff;
}


.debut{
	background-color:black;
	height:600px;
	width:100%;
	margin:0px;
	z-index:3;
	position:relative;
}



.hello{
	border-radius: 2px 2px 2px 2px;
	padding-right:40px;
	padding-left:28px;
	padding-top:20px;
	padding-bottom:30px;
	height:180px;
	margin-bottom:50px;
	margin-left:400px;
	margin-right:400px;
	font-size:14px;
	line-height:16px;
	color:black;
}

.intro{
	margin-right: 1vw;
	margin-bottom: 0vw;
	margin-top:5vh;
	margin-left: 1vw;
	height:20px;
	display:block;
	color:#8a00ff;
	font-size: 16px;
	line-height:23px;
	letter-spacing:0.2px;
}


.titre{
	margin-right: 1vw;
	margin-bottom: 0vw;
	margin-top: 1vw;
	margin-left: 1vw;
	height:50px;
	display:block;
	color:black;
	font-size: 20px;
	line-height:20px;
	background-color:#f9f9ff;
	letter-spacing:4px;
}

.soustitre{
	height:50px;
	display:block;
	color:black;
	font-size: 12px;
	line-height:20px;
	background-color:#f9f9ff;
	letter-spacing:4px;
}


.description{
	padding:15px;	
	letter-spacing:0.2px;
	font-style:italic;
}


.legende{
	padding:15px;
	font-style:italic;
	color:black;
	background-color:#f9f9ff;
	letter-spacing:0.2px;
}


.sono{
	border-radius: 2px;
	padding:0px;
	background-color:#f9f9ff;
	height:820px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:600px;
	margin-right:100px;
	overflow-y:scroll;
}


.citizen{
	border-radius: 2px;
	background: #f9f9ff;
	height:590px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:200px;
	margin-right:390px;
	overflow-y:scroll;
}


.rapport{
	border-radius: 2px;
	background: #f9f9ff;
	height:500px;
	margin-top:100px;
	margin-left:400px;
	margin-right:100px;
	overflow-y:scroll;
}

.mp2{
	border-radius: 2px;
	background-color:#f9f9ff;
	height:680px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:690px;
	overflow-y:scroll;
}


.lazy{
	border-radius: 2px;
	background: #f9f9ff;
	height:590px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:350px;
	margin-right:350px;
	overflow-y:scroll;
}


.mp1{
	border-radius: 2px;
	background: #f9f9ff;
	height:430px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}




.atlas{
	border-radius: 2px;
	background: #f9f9ff;
	height:600px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:250px;
	margin-right:100px;
	overflow-y:scroll;
}


.jmf{
	border-radius: 2px;
	background: #f9f9ff;
	height:590px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:500px;
	margin-right:270px;
	overflow-y:scroll;
}


.lovners{
	border-radius: 2px;
	background: #f9f9ff;
	height:590px;
	margin-top:100px;
	margin-left:350px;
	margin-right:150px;
	overflow-y:scroll;
}


.dune{
	border-radius: 2px;
	background: #f9f9ff;
	height:590px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:350px;
	margin-right:300px;
	overflow-y:scroll;
}


.alhena{
	border-radius: 2px;
	background: #f9f9ff;
	height:590px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:490px;
	overflow-y:scroll;
}


.cyanotypie{
	border-radius: 2px;
	background: #f9f9ff;
	height:630px;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:130px;
	margin-right:660px;
	overflow-y:scroll;
}

.packshot{
	border-radius: 2px;
	background: #f9f9ff;
	height:590px;
	margin-top:100px;
	margin-bottom:150px;
	margin-left:260px;
	margin-right:400px;
	overflow-y:scroll;
}


@media screen and (max-width: 1000px) {



.sono{
	border-radius: 2px;
	padding:0px;
	background-color:#f9f9ff;
	height:75vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}


.citizen{
	border-radius: 2px;
	background: #f9f9ff;
	height:65vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}


.rapport{
	border-radius: 2px;
	background: #f9f9ff;
	height:57vh;
	margin-top:100px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}

.mp2{
	border-radius: 2px;
	background-color:#f9f9ff;
	height:64vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}


.atlas{
	border-radius: 2px;
	background: #f9f9ff;
	height:70vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}


.lazy{
	border-radius: 2px;
	background: #f9f9ff;
	height:65vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}

.jmf{
	border-radius: 2px;
	background: #f9f9ff;
	height:65vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}

.alhena{
	border-radius: 2px;
	background: #f9f9ff;
	height:68vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}

.lovners{
	border-radius: 2px;
	background: #f9f9ff;
	height:40vh;
	margin-top:100px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}

.cyanotypie{
	border-radius: 2px;
	background: #f9f9ff;
	height:73vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}


.dune{
	border-radius: 2px;
	background: #f9f9ff;
	height:68vh;
	margin-top:100px;
	margin-bottom:50px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}



.packshot{
	border-radius: 2px;
	background: #f9f9ff;
	height:42vh;
	margin-top:100px;
	margin-bottom:150px;
	margin-left:100px;
	margin-right:100px;
	overflow-y:scroll;
}




.entete{
	margin-right: 1vw;
	margin-bottom: 0vw;
	margin-top: 1vw;
	margin-left: 1vw;
	height:55px;
	display:block;
	color:black;
	font-size: 15px;
	line-height:20px;
	background-color:#f9f9ff;
	letter-spacing:4px;
}


.description{
	padding:10px;	
	letter-spacing:0.2px;
	font-style:italic;
	font-size:15px;

}


.legende{
	padding:15px;
	font-style:italic;
	color:black;
	background-color:#f9f9ff;
	letter-spacing:0.2px;
	font-size:15px;
}


.titre{
	margin-right: 1vw;
	margin-bottom: 0vw;
	margin-top: 1vw;
	margin-left: 1vw;
	height:56px;
	display:block;
	color:black;
	font-size: 22px;
	line-height:23px;
	background-color:#f9f9ff;
	letter-spacing:4px;
}

.soustitre{
	height:50px;
	display:block;
	color:black;
	font-size: 16px;
	line-height:23px;
	background-color:#f9f9ff;
	letter-spacing:4px;
}



#cv {
  position: fixed;
  width: 30px;
  height: 25px;
  top: 30vh;
  right:6vw;
}

#cv img {
  position: fixed;
  width: 45px;
  height: 35px;
  top: 4vh;
}

#cv:hover {
width: 50px; 
transition:0.4s;
}


#scroll_to_top {
  position: fixed;
  transition: 1s;
  width: 28px;
  height: 28px;
  bottom: 4vh;
  right: 6vw;
}
#scroll_to_top img {
  width: 40px;
}

#scroll_to_top img:hover {
width: 45px; 
transition:0.5s;
}


.conteneur-contact{
	display:none;
}

.contact{
	display:none;
}

.debut{
	background-color:black;
	height:55vh;
	width:100vw;
	z-index:1;
	position:relative;
}

.hello{
	border-radius: 2px 2px 2px 2px;
	padding-right:20vw;
	padding-left:20vw;
	padding-top:20px;
	padding-bottom:30px;
	height:30vh;
	margin-bottom:50px;
	margin-left:4vw;
	margin-right:4vw;
	font-size:27px;
	line-height:20px;
	color:black;
}

.intro{
	margin-right: 1vw;
	margin-left: 1vw;
	height:20vh;
	display:block;
	color:#8a00ff;
	font-size: 27px;
	line-height:33px;
	letter-spacing:0.2px;
}



.contenu-all{
	width:100%;
	
}


.background-image{
	width:100vw;
	height:100vh;
	margin-top:0px;

}


body {
  font-family: Georgia;
  background: black	;
  font-size:13px;
  background-image: url('images/fond.jpg');
  background-repeat:no-repeat;
  background-size:cover;
  background-attachment:fixed;
  
  
}






}