html
	{
		border: 0px;
		background-color: none;
		width: 100%;
		height: 100%;
		font-family: tha, helvetica, Arial, Verdana, sans-serif;
		font-size: 4vh; /* les dimensions des éléments bénéficiant des unités vw (width), vh (height), vmin et vmax */
		color: white;
	}

body
	{
		  margin: 0

	}

mark
	{
		background-color: white;
		color: red;
	}

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

a:visited
	{
		text-decoration: none;
		color: #F5F6CE;
		background-color: #700000;
	}

a:hover, a:focus, a:active
	{
		text-decoration: none;
		color: none;
		background: none;
	}

@font-face
	{
		font-family: 'tha';
		src:	url("./fonts/scrpt12n.eot?"), /* pour IE */
			url("./fonts/scrpt12n.woff"), /* pour Firefox, Chrome*/
			url("./fonts/scrpt12n.ttf"), /* pour Safari et Opéra*/
			url("./fonts/scrpt12n.svg"); /* pour iPhone, iPad */
		font-weight: normal;
	}

/* Début du code pour les photos en backround */

/* "viewport"     c'est la partie visible de l'écran */
/* a inclure entre les balises head : <meta name="viewport" content="width=device-width" /> */
/* "max-width"    c'est la taille maximum de la fenêtre */
/* "device-width" c'est la largeur de l'écran du terminal, Intéressant pour les smartphones..*/
/*
	android en portrait 480px
	Android 1, 2 et 3 : 800px
	Android 4 : 980px
	Opera mini : 850px
	Opera mobile : 980px
	Safari mobile : 980px
	Internet Explorer mobile : 1024px

	écran 2k 1920px
	écran 4k 3840px
*/

/* type écran 4K */
 @media screen and (max-device-width: 3840px)
	{
		body
			{
				background-image:	url("./imgs/download-01.gif"),
							url("./imgs/download-00.png");
				background-color: none;
				background-attachment: fixed;
				background-position: center;
				background-repeat: no-repeat;
				background-size: 20%;
				font-size:100%;
			}
	}

/* type écran 2K */
 @media screen and (max-device-width: 1920px)
	{
		body
			{
				background-image:	url("./imgs/download-01.gif"),
							url("./imgs/download-00.png");
				background-color: none;
				background-attachment: fixed;
				background-position: center;
				background-repeat: no-repeat;
				background-size: 20%;
				font-size:100%;
			}
	}

/* 980px type android en portrait */
@media screen and (max-device-width: 980px) 
	{
		body
			{
				background-image:	url("./imgs/download-01.gif"),
							url("./imgs/download-00.png");
				background-color: none;
				background-attachment: fixed;
				background-position: center;
				background-repeat: no-repeat;
				background-size: 50%;
				font-size:100%;
			}
	}
	
/* 480px type android en portrait */
@media screen and (max-device-width: 480px) 
	{
		body
			{
				background-image:	url("./imgs/download-01.gif"),
							url("./imgs/download-00.png");
				background-color: none;
				background-attachment: fixed;
				background-position: center;
				background-repeat: no-repeat;
				background-size: 50%;
				font-size:100%;
			}
	}
/* Fin du code pour les photos en backround */


#viewer
	{
		position: fixed;
		/* début de centrage verticalement dans la fenêtre */
		margin-top: 50vh; /* poussé de la moitié de hauteur de viewport */
		transform: translateY(-50%); /* tiré de la moitié de sa propre hauteur */
		top: -0%;
		/* fin de centrage verticalement dans la fenêtre */
		
		/* début de centrage horizontal dans la fenêtre */
		min-height: 90%;
		min-width: 98%;
		border: 0.8vh solid rgba(150, 150, 150, .5);
		left: .5%; /*  si width=98% alors left=(100-98) : 2 = 1% - border: 1.0vh : 2 = 1.5%  */
		width: auto;
		height: auto;
		/* fin du centrage horizontal dans la fenêtre */
		z-index: -10;
		display: true;
	}

#icontactile360
	{
		position: absolute;
		bottom: 1%;
		right: 1%;
		width: 4%;
		height: auto;
		opacity: 0.65;
	}

#icon360
	{
		position: absolute;
		bottom: 7.0%;
		left: 0.5%;
		width: 9%;
		height: auto;
	}

.texte-360
	{
		position: absolute;
		text-decoration: none;
		text-align: center;
		right:6%;
		left:20%;
		bottom: 5.0%;
		color: white;
		border-radius: 20.5%;
		background-color: rgba(5, 5, 5, .3);
	}

#iconshover img:hover
	{
		width:10%;
		height:auto;
		opacity: 1;
	}

#iconshoverCMD img:hover
	{
		width: 3.5%;
		height: auto;
	}

#icontactileGx10
	{
		position: absolute;
		bottom: 4%;
		left: 0.0%;
		width: 4%;
		height: auto;
		opacity: 0.75;
	}

#icontactileG
	{
		position: absolute;
		bottom: 4%;
		left: 4.0%;
		width: 4%;
		height: auto;
		opacity: 0.75;
	}
	
.PlayPauseThA
	{
		position: absolute;
		bottom: 4%;
		left: 8%;
		width: 4%;
		height: auto;
		opacity: 0.75;
	}

#icontactileD
	{
		position: absolute;
		bottom: 4%;
		left: 12.0%;
		width: 4%;
		height: auto;
		opacity: 0.75;
	}

#icontactileDx10
	{
		position: absolute;
		bottom: 4%;
		left: 16.0%;
		width: 4%;
		height: auto;
		opacity: 0.75;
	}

.CPTphotos
	{
		position: absolute;
		bottom: 3.5%;
		left: 21.0%;
		width: 2%;
		height: auto;
		font-weight: bold;
		color: white;
		opacity: 0.9;
		text-align: center;
		border-radius: 20.5%;
		background-color: rgba(5, 5, 5, .3); 
	}