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

HTML	{
    	font-size: 100%;
    	height:100%;
      min-width:310px;
    	overflow-x:hidden;
    	}

body	{
	margin: 0px 0px 0px 0px;
	padding:0px;
	min-width: 310px;
	font-size:11pt;
	font-family:Arial,Helvetica;
	line-height:1em;
	height:100%
	overflow-x:hidden;

	}
.bouton
  {
  filter:alpha(opacity = 100);
  opacity:1;
  }
.bouton:hover
  {
  filter:alpha(opacity = 50);
  opacity:0.5;
  }




H1 { font-family:Times; font-size:28pt;font-weight:lighter;color:green;   font-style:italic;}
H2 { font-family:Times; font-size:1.5em;	color:blue;  font-style:italic;}
H3 { font-family:Verdana; font-size:1.25em;	color:navy;  margin-top:0px; margin-bottom:0px; font-style:italic;}




::-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 { border:0px; width:100%; height:auto;}


INPUT[type="submit"]	{	  cursor:pointer;font-size:13pt;    	}
input::placeholder {      color: #AAAAAA;        opacity: 1;    }

SELECT {  font-family:Arial; font-size:1em; font-weight:bold; margin:3px 4px 3px 4px;	}
p { margin-top:0px; margin-bottom:0px;  font-family:Arial; font-size:11pt;vertical-align:middle; 	}
H4 { font-family:Verdana; font-size:12pt;color:navy;margin-top:0px; margin-bottom:0px;font-style:italic;}


.Explique:hover { cursor:pointer;	}
// Block = n'apparait plus quand la condition est inf�rieure
// InvertBlock = apparait quand la condition est inf�rieure

TEXTAREA {  font-family:Arial; font-size:16pt;margin-top:2px;margin-bottom:2px;	}
TEXTAREA::placeholder {      color: #AAAAAA;        opacity: 1;    }

.Block { display:inline-block; }
.Block480 { display:inline-block; }
.Block { display:inline-block; }
.Block640 { display:inline-block; }
.Block700 { display:inline-block; }
.Block800 { display:inline-block; }
.Block900 { display:inline-block; }
.Block990 { display:inline-block; }

.NoBlock450 { display:inline; }


.InvertBlock480 { display:none; }
.InvertBlock640 { display:none; }
.InvertBlock700 {  display:none; }
.InvertBlock800 {  display:none; }
.InvertBlock900 { display:none; }
.InvertBlock1000 {  display:none; }

.Main { margin-top:30px;width:99%;max-width:1200px; }
.Table480	{	display:table;	}
.TableauPostes  { width:25%; max-width:230px; } //  postes internes
.TableauTextes  { width:60%; } //  postes internes
.Row480		{	display:table-row;	}
.Cell480	{	display:table-cell;	}
.Cell640	{	display:table-cell;	}
.Cell800	{	display:table-cell;	}
.Cell900	{	display:table-cell;	}
.Cell1000	{	display:table-cell;	}
.CellInv640	{	display:none;	}
.InvertCell900  { display:none; }
.InvertCel1000  { display:none; }
.BlockBabil	{	display:inline-block;	}

.HIframe	{	height:30px;	}

.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: 1200px)
	{
//  .Main   { max-width:800px;  }
  }

@media screen and (max-width: 1000px)
	{
	.Cell1000 {	display:none;	}
  .InvertBlock1000 {  display:inline-block; }
  .InvertCel1000  { display:table-cell; }
	}

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

@media screen and (max-width: 900px)
	{
	.Block900	{	display:none;	}
	.Cell900	{	display:none;	}
  .InvertBlock900 { display:inline-block; }
  .InvertCell900  { display:table-cell; }
	}


@media screen and (max-width: 800px)
	{
  .Block800 { display:none; }
	.Cell800	{	display:none;	}
  .InvertBlock800 {  display:inline-block; }
  .TableauPostes  { width:100%; max-width:100%; } //  postes internes
  .TableauTextes  { width:100%;  } //  postes internes
	}

@media screen and (max-width: 700px)
	{
  .Block700 { display:none; }
  .InvertBlock700 {  display:inline-block; }
  }


@media screen and (max-width: 640px)
	{
  .Block640 { display:none; }
  .InvertBlock640 { display:inline-block; }
	.Table480	{	display:table;	}
	.Row480		{	display:table-row;	}
	.Cell480	{	display:table-cell;	}
	.Cell640	{	display:none;	}

	.CellInv640	{	display:table-cell;	}
//	.HIframe	{	height:56px;	}
//  .Main { margin-top:57px;  }
	.F300		{	width:280px;	}
	.F400		{	width:300px;	}
	.F500		{	width:350px;	}


	} 



@media screen and (max-width: 480px)
	{
	H1 { font-family:Times; font-size:18pt;	color:blue;  margin-top:3px; margin-bottom:0px; font-style:italic;}
	H2 { font-family:Times; font-size:14pt;	color:blue;  font-style:italic;}
	H4 { font-family:Arial; font-size:11pt;color:navy;margin-top:0px; margin-bottom:0px;font-style:italic;}

  .Block480 { display:none; }
  .InvertBlock480 { display:inline-block; }
	.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;	}

	} 

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

  }

@media screen and (max-width: 280px)
	{
	.BlockBabil	{	display:none;	}
  }
/* Texte d�filant */


.defile {
	display:block;
	-webkit-animation:linear marqueelike 12s infinite ;
//	-moz-animation:linear marqueelike 20s infinite ;
//	-o-animation:linear marqueelike 20s infinite ;
//	-ms-animation:linear marqueelike 10s infinite ;
	animation:linear marqueelike 12s infinite ;
	margin-left:-100%;
	padding-top:3px;
	text-align:left;
	white-space: nowrap;
//	height:20px;
}

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


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



.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:orange;   }
	50% {  color:white;    }   
	100% {  color:orange;   }
  }
@-webkit-keyframes cligne
  {
	0% {  color:red;   }
	50% {  color:yellow;    }   
	100% {  color:red;   }
   }


@font-face {
    font-family: 'F7';
    src:url('F7.ttf') format('truetype'),
    font-weight: normal;
    font-style: normal;
    }