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
	{
		  border: 0px;
		  margin: 0;
		  background-color: none;

	}

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;
	}

/* "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
*/

#viewerVideo
	{
		position: absolute;
		/* 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 */
		height: auto;
		width: 88%;
		left: 5.50%; /*  si width=88% alors left=(100-88) : 2 = 6% - border: 1.0vh : 2 = 5.5%  */
		border: 0.5vh solid rgba(5, 5, 5, 0.8);
		background-color: none;
		/* fin du centrage horizontal dans la fenêtre */
	}

#viewerMeteo
	{
		position: absolute;
		/* 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 */
		height: auto;
		width: 88%;
		left: 5.50%; /*  si width=88% alors left=(100-88) : 2 = 6% - border: 1.0vh : 2 = 5.5%  */
		background-color: rgba(5, 5, 5, .0.2);  
		/* fin du centrage horizontal dans la fenêtre */
	}

#MeteoSemaine
	{
		position: absolute;
		/* 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 */
		height: auto;
		width: auto;
		left: 0.00%;
		right: 0.00%;  /*  si width=88% alors left=(100-88) : 2 = 6% - border: 1.0vh : 2 = 5.5%  */
		background-color: none;  
		/* fin du centrage horizontal dans la fenêtre */
	}

#viewerAstrologie
	{
		position: absolute;
		/* 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 */
		top: 3%;
		height: 83%;
		width: 100%;
		left: 0.00%; /*  si width=88% alors left=(100-88) : 2 = 6% - border: 1.0vh : 2 = 5.5%  */
		background-color: none;  
		/* fin du centrage horizontal dans la fenêtre */
	}

.texte-AstroMeteo
	{
		position: absolute;
		text-decoration: none;
		text-align: center;
		right: 8%;
		left: 8%;
		bottom: 5.0%;
		color: white;
		border-radius: 30.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;
	}

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

#icontactileMosaic
	{
		position: absolute;
		bottom: 4%;
		left: 25.0%;
		width: 6%;
		height: auto;
		opacity: 0.9;
	}

.CPTvideos
	{
		position: absolute;
		bottom: 3.5%;
		left: 16.5%;
		width: 2%;
		height: auto;
		font-weight: bold;
		color: white;
		opacity: 0.9;
		text-align: center;
		border-radius: 20.5%;
	}

.texte-video
	{
		position: absolute;
		text-decoration: none;
		text-align: center;
		right: 13%;
		left: 13%;
		bottom: 10.0%;
		color: white;
		border-radius: 38.5%;
		background-color: rgba(5, 5, 5, .3);
	}

