body{
	margin:0;
	padding:0;
	height:100%;
	width:100%;
	background-size: contain;
	background-repeat: no-repeat;
	background : no-border;
	overflow-x: hidden;
	background-color:#2c2c2c;
}

div{
	margin:0;
	padding:0;
}

img{
	margin:0;
	padding:0;
	border:0px;
}

ul{
	margin:0;
	padding:0;
	cursor: pointer;	
}

li{
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
	user-select: none;
}


.body-background{
	position:fixed;
	width:100vw;
	height :100vh;
}

#main-page::-webkit-scrollbar {
  display: none;
}

.hidden{	display:none;}

.keywords{	display: none;}

.noselect{
	-webkit-touch-callout: none; /* iOS Safari */
    -webkit-user-select: none; /* Safari */
    -khtml-user-select: none; /* Konqueror HTML */
    -moz-user-select: none; /* Old versions of Firefox */
    -ms-user-select: none; /* Internet Explorer/Edge */
	user-select: none; /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
}

/* CSS --------------------------------------------------- POUR PETIT ECRANS (TELEPHONES) ------------------------------------------------------------------*/

@media screen and (max-width: 745px) {
	
	
	/***********************************************************/
	
	h1{font-family: calibri ;		font-weight:300;		float :right;		color:#cacaca;		font-size:10vw;		margin-top:0.5vh;}
	h2{ font-family: calibri ;	font-weight:normal;	font-size:6vw;	color:#c55893;	}
	h3{ font-family: calibri;	font-weight:normal;	font-size:5vw; 	color:#c55893; 	margin-top:25px; 	margin-bottom:2vw;  }
	p { font-family: calibri;	font-weight:100;	font-size:4vw;	color:#cacaca;margin-top:0;	margin-bottom:4vw;   text-align:justify;}
	
	.larger{font-weight:300;}
	.imp2{color:#bb88a4;	font-weight:normal;}
	
	.body-background-r{
		position:fixed;
		overflow:hidden;
		z-index:1;
		width:100vw;
		height:110vh;
		background-color:#2c2c2c;
	}
	
	.img-background-r{	width: 100vw;}
	
	#main-page{
		position: fixed;
		z-index:10;
		width:100vw;
		height:auto;
		top:7vh;
		overflow:auto ;

	}
	.title {
		position:fixed;
		top:30vh;
		z-index:16;
		right:0;
		font-family: calibri ;
		width: 100vw;
		height: 7vh;
		font-weight:300;
		color:#cacaca;
		font-size:10vw;
		margin-top:0;
		background-color: rgba( 47, 47, 47, 0.8);
	}
	.title span{
		float: right;
		margin-right: 2vw;
	}
	
	#menu-button{
		position:fixed;
		z-index:15;
		left:3vw;
		height:15vw;
	}
	
	.div-top-r{
		position:fixed;
		width:100vw;
		height:7vh;
		z-index:15;

	}

	.img-top-r{width:100%;}
	
	.img-menu-button{ z-index:10; height: 16vw; }
	
	.div-menu-r{
		position: fixed;
		z-index:15;
		top:7vh;
		width:100vw;
		height:80vh;
		background-color: rgba( 47, 47, 47, 0.8);
	}
	
	.ul-menu-r{
		padding-top:5vw;
		font-family:calibri ;
		font-weight:300;
		font-style: normal;
		font-size:7vw;
		text-align:center;
		list-style-type: none;
		color:#cacaca;
	}
	.ul-menu-r li{
		height:15vw;
	}
	
	.img-portrait{
		width:76vw;
		margin-left:10vw;
		margin-right:10vw;
		margin-bottom:5vw;
		float:left;
	}
	
	
	.mini-galerie{
		z-index:15;
		position:relative;
		width:40vw;
		height:40vw;
		max-height:100%;
		margin:5vw;
		float:left;
		text-align: center;
	}
	
	.img-galerie{ 
		width:100%;
		height:100%;
		object-fit: cover;
	}
	
	.div-galerie-large{
		margin-top:25vh;
		margin-left:5vw;
		margin-right: 5vw;
	}
	
	#div-galerie{
		position:fixed;
		z-index:20;
		width:100vw;
		height: 100vh;
		text-align:center;
		background-color: rgba( 10, 10, 10, 0.8);
	}
	
	#page-galerie{
		position:absolute;
		top:7vh;
		width:100vw;
		min-height: 90vh;
		height: auto;
		z-index:12;
		font-style: normal;
		font-size:4vw;
		color:#cacaca;
		text-align: justify;
		background-color: rgba( 47, 47, 47, 0.7);
	}
	#page-presentation{
		position:absolute;
		top:7vh;
		z-index:12;
		width:90vw;
		min-height: 90vh;
		min-height: 90vh;
		height: auto;
		padding-left:5vw;
		padding-right:5vw;
		text-align: justify;
		text-overflow: clip;
		background-color: rgba( 47, 47, 47, 0.7);
	}
	#page-prestations{
		position:absolute;
		top:7vh;
		z-index:12;
		width:90vw;
		min-height: 90vh;
		height: auto;
		padding-left:5vw;
		padding-right:5vw;
		background-color: rgba( 47, 47, 47, 0.7);
	}

	#page-conseils{
		position:absolute;
		top:7vh;
		z-index:12;
		width:90vw;
		min-height: 90vh;
		height: auto;
		padding-left:5vw;
		padding-right:5vw;
		background-color: rgba( 47, 47, 47, 0.7);
	}

	#page-contact{
		position:absolute;
		padding-top:20vh;
		z-index:12;
		width:90vw;
		min-height: 80vh;
		height: auto;
		padding-left:5vw;
		padding-right:5vw;
		background-color: rgba( 47, 47, 47, 0.7);
	}

	.div-lien{
		height: 10vh;

	}
	.img-lien{
		float:left;
		width:10vh;
		margin-right: 2vw;
	}
	.img-lien img{
		width: 80%;
		margin:10%;

	}
	/*****************Desactivation du menu large***************/
	
	.body-background-l{display:none;}
	.div-menu-l{display:none;}
	.ul-menu-l{display:none;}

}

	

/*CSS -------------------------------------------------  POUR GRAND ECRANS (TABLETTES ET PC) ------------------------------------------------------------ */

@media only screen and (min-width: 746px){
	
	
	h1{font-family: Calibri; font-weight:normal;font-size:30px;color:#c55893;}
	h2{font-family: Calibri; font-weight:normal; font-size:26px; color:#c55893;}
	p{	margin-top:0;	margin-bottom:3vh; font-family: Calibri; font-weight:lighter; font-size:24px; text-align:justify;}
	.imp2{ font-family: Calibri; font-weight:lighter; font-size:24px;color:#bb88a4;}

	.body-background-l{
		position:fixed;
		overflow:hidden;
		z-index:1;
		width:100vw;
		height:100vh;
		background-color:#2f2f2f;
	}
	
	.img-background-l{ height: 100vh;}
	.title {
		z-index: 20;
		top:30vh;
		position:fixed;
		font-family: Calibri Light;
		width: 100vw;
		height: 10vh;
		color:#cacaca;
		font-size:6.5vh;
	}
	.title span{
		float: left;
		margin-left: 80vw;
	}

	#main-page{
		position: absolute;
		z-index:10;
		width:100vw;
		height:auto;
		min-height: 100vh;
		top:0;
		background-color: rgba( 47, 47, 47, 0.7);
		overflow-x: hidden;
	}

	
	.div-menu-l{
		position:fixed;
		z-index:15;
		top:45vh;
		right:0;
		margin-right:5vw;
	}
	
	.ul-menu-l{
		z-index: 15;
		position: fixed;
		left: 80vw;
		top: 45vh;
		background-color: rgba( 47, 47, 47, 0.7);
		padding-right: 5vw;
		margin-right: 5vw;
	}
	
	.ul-menu-l li{

		margin:0;
		padding:0;
		font-family:Calibri Light;
		font-style: normal;
		font-size:3.5vh;
		color:#cacaca;
		list-style-type: none;
		text-align:right;
		height:4.5vh;
	}

	li:hover{	color:#963168;	}

	.img-portrait{
		max-height:40vh;
		max-width:55vw;
		margin-right:1vw;
		float:left;
	}
	
	#page-galerie{
		position:relative;
		margin-top:10vh;
		width:60vw;
		margin-left:5vw;
		font-family:Calibri Light;
		font-style: normal;
		font-size:2vh;
		color:#cacaca;
	}
	.mini-galerie{
		position:relative;
		width:15vw;
		height:15vw;
		background-size: cover;
		margin:2vw;
		float:left;
		text-align: center;

	}
	#div-galerie{
		position:fixed;
		display:none;
		z-index:20;
		height:100vh;
		width:100vw;
		text-align:center;
		overflow:auto;
		background-color: rgba( 10, 10, 10, 0.8);
	}
	.div-galerie-large{
		width:60vw;
		height:80vh;
		margin-left:10vw;
		margin-top:10vh;
	}
	.img-galerie{ 
	width:100%;
	height:100%;
	object-fit: cover;
	}

	#page-presentation{
		margin-top:10vh;
		width:55vw;
		margin-left:5vw;
		font-family:Calibri Light;
		font-style: normal;
		font-size:2.5vh;
		color:#cacaca;
	}
	#page-prestations{
		margin-top:10vh;
		width:55vw;
		margin-left:5vw;
		font-family:Calibri Light;
		font-style: normal;
		font-size:2.5vh;
		color:#cacaca;
	}

	#page-conseils{
		margin-top:10vh;
		width:55vw;
		margin-left:5vw;
		font-family:Calibri Light;
		font-style: normal;
		font-size:2.5vh;
		color:#cacaca;
	}

	#page-contact{
		margin-top:30vh;
		width:55vw;
		margin-left:12vw;
		font-family:Calibri Light;
		font-style: normal;
		font-size:2.5vh;
		color:#cacaca;
	}	
	
	.div-lien{
		height: 10vh;

	}
	.img-lien{
		float:left;
		width:10vh;
		margin-right: 2vw;
	}
	.img-lien img{
		width: 80%;
		margin:10%;

	}

	/*****************Desactivation du menu responsive***************/
	
	#menu-button{	display:none;}
	.body-background-r{display:none;}
	.ul-menu-r{ display:none;}
	.img-top-r{display:none;}
	.div-menu-r{display:none;}
	/***********************************************************/
	
}