@viewport
	{
	width: device-width; /* largeur du viewport */
	zoom: 1; 
	}

HTML
  {
	width:100%;
	height:100%;    
	margin: 0px 0px 0px 0px; 
	}

body	{
	margin: 0px 0.9% 0px 0.4%;
	padding:0;
	width:98.8%;
	min-width: 320px;
  text-align : center;
	font-size:15pt;
	line-height:18pt;
  font-family:FTexte,Times New Roman;
	overflow-x:hidden;
  background-image:url(Imagerie/Marbre.jpg);background-size:cover; background-attachment: fixed;
  background-color:white;
  color:black;
	}

H1 { margin-top:0;font-family:F2;font-size:22pts;font-weight:bold;color:white;line-height:1.2em;text-shadow:2px 2px grey;}
H2 { margin-top:4px;font-size:20pt;color:white;line-height:23pt;font-family:F2;text-shadow:2px 2px grey;font-style:italic;}
/* titres simples  */
H3 { font-family:F2; font-size:18pt;line-height:22pt;color:white;text-shadow:2px 2px grey;margin:7px auto;}
H4 { font-family:Times New Roman; font-size:1.2em;color:navy;margin-top:0px; margin-bottom:0px;font-style:italic;}
H5 { font-family:Times New Roman; font-size:12pt;line-height:12pt;color:navy;margin-top:0px; margin-bottom:0px;font-style:italic;}
p { margin-top:0px; margin-bottom:0px;vertical-align:middle; 	}

INPUT {  font-size:17pt;font-weight:bold;text-align:center;padding:4px 7px 4px 7px;	}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: green; text-align:center; font-style:italic;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #008080; text-align:center; font-style:italic;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #008080; text-align:center; font-style:italic;
}
:-moz-placeholder { /* Firefox 18- */
  color: green; text-align:center; font-style:italic;
}


img { border:0px;}
img.ext { width:100%; height:auto;}


.bouton
  {
  filter:alpha(opacity = 100);
  opacity:1;
  height:auto;
  display:inline-block;
  cursor:pointer;
  }
.bouton:hover
  {
  filter:alpha(opacity = 50);
  opacity:0.5;
  }

.bouton:active
  {
  cursor:progress;
  }

.Intercalaire
	{
	width:100%;
	height:10px;
	background-image:linear-gradient(132deg,white,blue,white,red,white);
	}


INPUT[type="submit"]	{	cursor:pointer;font-size:16pt;font-weight:bold;border-radius:5px;	}
BUTTON 	{	cursor:pointer;font-size:16pt;font-weight:bold;border-radius:5px;	}

SELECT {  font-family:Times New Roman; font-size:17pt; font-weight:bold; margin:3px 4px 3px 4px;	}




.Explique:hover { cursor:pointer;	}


.lien { font-family:Times New Roman; font-size:14pt;	}
.select { font-family:Times New Roman; font-size:15pt;	}
TEXTAREA {  font-family:Times New Roman; font-size:18pt;margin-top:2px;margin-bottom:2px;	}

.BlockH700	{	display:block;	}
.Block360	{	display:inline-block;	}
.Block480	{	display:inline-block;	}
.Block640	{	display:inline-block;	}
.Block700	{	display:inline-block;	}


.Cell480	{	display:table-cell;	}
.Cell640	{	display:table-cell;	}
.Cell700	{	display:table-cell;	}
.Cell1400	{	display:table-cell;	}
.Cell1600	{	display:table-cell;	}
.Cell800	{	display:table-cell;	}
.Block800	{	display:inline-block;	}

.Block900	{	display:inline-block;	}
.ColonneDChat  { min-width:250px; }
.Inline800	{	display:inline;	}
.InvertBlock480 { display:none; }
.InvertBlock640	{	display:none;	}
.InvertBlock700 { display:none; }
.InvertBlock800	{	display:none;	}
.InvertCell480 { display:none; }
.Row480		{	display:table-row;	}
.Table480	{	display:table;	}
.TopEntete {  top:150px;  }
.HIframe	{	height:24px;	}
.EspaceHaut	{	height:90px;	}

.Entete	{	display:inline-block;	}
.F300	{	width:300px;	}
.F400	{	width:400px;	}
.F500	{	width:500px;	}
.Texte	{	display:inline-block;	}
.ColCell	{	display:table-cell;	}




@media screen and (max-width: 1400px)
	{
	.Cell1400	{	display:none;	}
	}

@media screen and (max-width: 1600px)
	{
	.Cell1600	{	display:none;	}
	}



@media all and (max-width: 900px)
	{
	.Block900	{	display:none;	}
  .ColonneDChat  { min-width:190px; }
	}

@media all and (max-width: 800px)
	{
  Body  {   background-image:url(); }
	.Block800	{	display:none;	}
  .InvertBlock800	{	display:inline-block;	}
	.Cell800	{	display:none;	}
  .ColonneDChat  { min-width:160px; }
	.Inline800	{	display:none;	}
  .TopEntete {  top:120px;  }
	}


@media all and (max-width: 700px)
	{
	.Cell700	{	display:none;	}
	.Block700	{	display:none;	}
	.HIframe	{	height:44px;	}
	.F300		{	width:280px;	}
	.F400		{	width:300px;	}
	.F500		{	width:350px;	}
	.EspaceHaut	{	height:100px;	}
  .InvertBlock700 { display:inline-block; }
  .TopEntete {  top:90px;  }
	} 


@media screen and (max-width: 640px)
	{
	.Block640	{	display:none;	}

	.Cell640	{	display:none;	}
	.InvertBlock640	{	display:inline-block;	}
  }



@media all and (max-width: 480px)
	{

	.Block480		{	display:none;	}

  .InvertBlock480 { display:inline-block; }
	.InvertCell480	{	display:table-cell;	}

	.Table480	{	display:none;	}
	.Row480		{	display:none;	}
	.Cell480	{	display:none;	}
	.Entete		{	display:none;	}
	.F300		{	width:250px;	}
	.F400		{	width:200px;	}
	.F500		{	width:300px;	}
	.Texte		{	display:none;	}
	.ColCell	{	display:table-row;	}
	.EspaceHaut	{	height:110px;	}
  .TopEntete {  top:50px;  }

	} 

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

	.EspaceHaut	{	height:120px;	}
	.Block360		{	display:none;	}
	}

@media screen and (max-height: 700px)
	{
	.BlockH700		{	display:none;	}
	}






.Ombre
  {
  -moz-box-shadow: 1px 4px 12px #202020; 
  -webkit-box-shadow: 1px 4px 12px #202020; 
  box-shadow: 1px 4px 12px #202020;  
  }



/* Texte défilant */


.defile {
	display:block;
	-webkit-animation:linear marqueelike 12s infinite ;
	animation:linear marqueelike 12s infinite ;
	margin-left:-100%;
	padding-top:3px;
	text-align:left;
	white-space: nowrap;

}

.defile:hover { -webkit-animation-play-state: paused; animation-play-state: paused }

.defile:after
	{
	content:attr(data-text);
	position:absolute;
	white-space:nowrap;
	padding-left:0px;
	}

@-webkit-keyframes marqueelike {	0%, 100% {margin-left:0;}	99.99% {margin-left:-100%;}	}

@keyframes marqueelike
	{
	0%, 100% {margin-left:0;}
	99.9999% {margin-left:-100%;}
	}

.Clignote
  {
  animation-duration: 2s;
  animation-name: cligne;
  animation-iteration-count:infinite;
  -webkit-animation-duration: 2s;
  -webkit-animation-name: cligne;
  -webkit-animation-iteration-count:infinite;
  }
@keyframes cligne
	{
	0% {  color:red;   }
	50% {  color:white;    }   
	100% {  color:red;   }
  }
@-webkit-keyframes cligne
  {
  0%, 50% {  color:red;    }   
  50%, 100% {  color:yellow;   }
   }




@font-face
	{
	font-family: 'F1';
	font-style: normal;
	font-weight: 800;
	src: local('F1 Regular'), local('F1-Regular'), url(F1.woff) format('woff');
  }


@font-face

	{
	font-family: 'F2';
	font-style: normal;
	font-weight: 400;
	src: local('F2 Regular'), local('F2-Regular'), url(F2.woff) format('woff');
  }