@font-face { font-family: 'Nightmare'; src: url('police/Nightmare.ttf');}
@font-face { font-family: 'Philophobia'; src: url('police/Philophobia.ttf');}
@font-face { font-family: 'Stranger'; src: url('police/Stranger.ttf');}
@font-face { font-family: 'CherishingMoments'; src: url('police/CherishingMoments.ttf');}


body{display : flex; flex-direction : column; justify-content: center; align-items : center; margin: 0px; 
background-color: white; background-repeat:no-repeat; background-attachment:fixed; background-size: cover; background-position: center;
position: fixed; overflow: hidden;
background-image:url("image/fd1.jpg");
width: 100%; height: 100vh; 	
background-repeat: no-repeat;
background-size: cover; 
margin: 0px; }
	
body, html{overflow : auto; margin:0; padding:0; overflow: hidden; height:100%; width: 100%;}

.maj{font-style: bold, font-size : 0.7em;}

a{cursor:  pointer;}

.lienDL{color : black; font-family: "Philophobia"; font-size : 2em; text-align: center; margin : 10px;}

nav{ width: 100%; background-color: #BDBDBD; border-bottom: 2px solid white; box-shadow: 1px 1px 12px #555; position: fixed; min-height: 20px}

#navigation{display: flex; list-style-type:none; margin: 0px; padding: 0px;}

#deco{text-decoration: none; color: white; font-size: 1.7em; padding-left: 10px;}

#conteneurLien{color: #878787;font-size: 1.3em; display : flex; flex-direction : column; border: 2px solid white ;border-radius: 10px; box-shadow: 1px 1px 12px white;
padding : 10px;background-image: url("image/blancT.png"); min-width: 260px; overflow: auto; padding: 30px;}

#conteneurVersion{color: black;  max-height : 300px;  max-width : 800px; font-size: 1.3em; display : flex; flex-direction : column; border: 2px solid white ;border-radius: 10px; box-shadow: 1px 1px 12px white;
padding : 10px; background-image: url("image/blancT.png"); min-width: 260px; overflow: auto; padding: 30px; margin-top: 30px;}


.version{text-align: center; display: block; font-size: 1.3em; border-top : 1px solid black; padding-top: 10px}


.salutation{font-family: "Stranger"; font-size: 5em; color: #9a2828; margin: 50px;}

#ks{color: red; text-decoration: line-through;}

a{text-decoration: none; color: black; transition: 0.2s; font-style: italic; margin-bottom: 5px;}

a:hover{color: #d14efa; margin-left: 5px;}

a:active{color: #41d2f9;}

@media all and (orientation: portrait)
{
	.page{background-image:url("image/fd1m.jpg"); min-height: 400px;}
	.salutation{font-size: 2em; color: #9a2828; margin: 35px;}
	.lienDL{font-size : 0.5em; text-align: center; margin : 5px;}
	#conteneurLien{font-size: 1.3em; padding : 10px; max-width: 170px; max-height: 80px}
	a{font-size: 0.5em}
	#conteneurVersion{font-size: 0.6em; padding : 10px; max-width: 170px; max-height: 150px;}
	#deco{font-size: 0.8em}
}

@media (orientation: portrait) and (max-device-width : 420px)
{
	.page{background-image:url("image/fd1m.jpg")}
	.salutation{font-size: 2em; color: #9a2828; margin: 35px;}
	.lienDL{font-size : 0.5em; text-align: center; margin : 5px;}
	#conteneurLien{font-size: 1.3em; padding : 10px; max-width: 170px; max-height: 80px}
	a{font-size: 0.5em}
	#conteneurVersion{font-size: 0.6em; padding : 10px; max-width: 170px; max-height: 150px;}
	#deco{font-size: 0.8em}

}