/****************
 * MISE EN PAGE *
 ****************/
 
html, body  {
margin : 0;
padding: 0;
text-align:center;
height:100%;
background-color:white;
overflow-x:hidden;
overflow-y:auto;
}

body.phom {
overflow-y:hidden;
}

p {
margin:5px 5px 15px
}

div#container {
margin: 0 auto;
height:100%;
position:relative;
}
/* protection contre bug safari : */
@media only screen and (min-height: 1080px) { 
div#container {
	height:1080px;
}
}

div#entete_accueil {
text-align:center;
color: #888;
padding-top:0;
}

div#accueil {
position:relative;
color:#666;
padding:2em 4em;
text-align:left;
}

div#entete {
background-color:#B9CBDF;
font-size:1.6em;
text-align:left;
position:fixed;
top:0px;
z-index:210;
width:100%;
}

body.phom div#entete {
background-color:rgba(50,70,150,0.1);
}

div#entete:hover{
  opacity:1;
}

div#wrapper {
height:100%;
width:100%;
margin:0 auto;
background-color:white;
box-sizing: border-box;
}

body.accueil #wrapper {
width:80%;
margin-bottom:40px;
}

div#visu {
position:relative;
width:100%;
height:100%;
overflow-x:scroll;
overflow-y:hidden;
margin:0 auto;
padding:0;
background-color:#ddd;
}

div#regle {
background-repeat:repeat-x;
display:block;
}
div#phom img{
    position: relative;
    z-index: -1;
}
div#notice {
background-color:#ddd;
width:100%;
margin: 0 auto;
padding:5px;
vertical-align:middle;
z-index:1000;
text-align:left;
position:absolute;
bottom:30px;
left:70px; /*was 10 */
width:460px;
opacity:0.9;
line-height:1.2em;
}
div#notice:hover{
  opacity:1;
}


/*****************
 * Styles divers *
 *****************/

body {font-family: "Trebuchet MS", Trebuchet,verdana,arial;font-size:12px;color:#333;height:100%;}

#visu img {
border:none;
vertical-align:middle;
}

img#echelle {
border:none;
}

#carte img {
border:none;
margin:10px 20px 0 0;
}

a:link, a:visited {color: #1E5B95;text-decoration:none;}

a:hover, a:active {text-decoration:underline}


#liste_ptv a:link, #liste_ptv a:visited {
padding:0;
margin:0 5px;
}

#liste_ptv a:hover,#liste_ptv  a:active {
padding:0;
margin:0 5px;
}

#carte1 a:link, #carte1 a:visited {
display:block;
text-decoration:none;
}

#carte1 a:hover,#carte1  a:active {
display:block;
text-decoration:none;
border:none;
}

a.invisible {
text-decoration:none;
}

div.titre_generic {
color:white;
font-weight:normal;
padding : 5px 25px 0 8px;
float:left;
}
@media only screen and (max-width: 1025px) { 
div.titre_generic {
	display:none;
}
}


div.titre{
color:#1E5B95;
background-color:#EBF3F6;
font-weight:bold;
padding : 5px 25px 0 25px;
margin:0 10px 0 0;
height:35px;
float:left;
}
div.comment {
float:left;
font-size:0.8em;
font-style:italic;
padding:10px 0;
color:white;
}

div.titre span {
font-style:italic;
font-size:0.7em;
font-weight:normal;
}

div#parcs{
color:#1E5B95;
font-weight:bold;
padding : 5px 25px 0 25px;
height:35px;
float:left;
}

div.hfov, div.vfov, div.distobs {
display : inline;
}

div.idplanche {
float:right;
font-size:30px;
font-weight:bold;
text-align:right;
color:white;
padding-right :25px;
}

img.eol {
float:right;
margin: 10px 0 10px 20px;
padding:10px 0;
}


#menu  ul li {
position:relative;
float:left;
margin:20px;
list-style:none;
}



/***********************
 * Gestion survol phom *
 ***********************/

div#filaire {
position:absolute;
z-index:10;
}

img#topLayer {
visibility : visible;
}

div#phom {
position:absolute;
z-index:1;
}

#layers {
position:absolute;
z-index:100;
}

#layers canvas  {position:absolute}


/*****************
 * Panneau Infos *
 *****************/
 
div#racc {
width:5%;
float:left;
}

#racc img {
margin : 0;
}


#racc img:hover {
  cursor:  pointer;
  }



div#avertissement {
text-align:center;
color:#1E5B95;
font-weight:bold;
font-size:1em;
margin-left: 100px;
}

div#help  {
position:absolute;
top:100px;
left:50%;
width:800px;
max-width:800px;
font-size:0.8em;
padding:0;
margin:0;
margin-left:-400px;
background-color:rgb(255,255,255);
background-color:rgba(255,255,255,0.9);
z-index:200;
text-align:leaft;
display:none;
}

#help table#key  {
border: 1px solid #aaa;
background-color:transparent;
border-collapse: collapse;
margin:10px;
float:left;
}

#help table#key th {
font-size:1.1em;
font-weight:bold;
border: 1px solid #aaa;
background-color:rgb(255,255,255);
background-color:rgba(255,255,255,0.7);
}

#help table#info  {
color:#1E5B95;
font-size:1.5em;
text-align:center;
padding:10px;
}

div#infos {
position:absolute;
top:40px;
left:0;
display:none;
text-align:left;
margin:0;
padding:35px 0 5px 50px;
width:100%;
background-color:rgb(255,255,255);
background-color:rgba(255,255,255,0.7);
z-index:200;
}
@media only screen and (min-height: 1250px) { 
	div#infos{
		top:1080px;
		display:block!important;
		background-color:#eee;
		height:100%;
	}
	#b_infos{ display:none; }
}

span.nom {
font-weight:bold;
margin-left:15px;
color:#333;
}
span.data {
font-style:normal;
color:#666;
}

div.titreinfos {
text-align: left;
font-weight:bold;
font-size:1.2em;
letter-spacing:1px;
color:#1E5B95;
padding:3px;
margin:10px 0;
}


div.cadre {
float:left;
border:0px solid #25445e;
margin:10px 8px;
position : relative;
}

div#carte1 {
position:absolute;
top:10px;
right:0	;
width:275px;
height:181px;
visibility:hidden;
text-align:right;
}

div#carte2 {
position:absolute;
top:10px;
right:0;
width:275px;
height:181px;
visibility:visible;
text-align:right;
}

.indications {
text-align:left;
margin:20px 0 0;
padding:5px;
color:#1e5b95;
background-color:#ebf3f6;
}

#menu {
clear:both;
height:50px;

position:relative;
text-align:left
}

.navigation a.cpdp:link, .navigation a.cpdp:visited {
background-color:#CEA46F;
text-decoration:none;
color:white;
padding:5px;
}
.navigation a.cpdp:hover, .navigation a.cpdp:active {
background-color:#916636;
text-decoration:none;
color:white;
padding:5px;
}
.navigation a:link, .navigation a:visited {
background-color:#6f9bce;
text-decoration:none;
color:white;	
}
.navigation a:hover, .navigation a:active {
background-color:#EAF2F5;
text-decoration:none;
color:#1E5B95;
}

.navigation a {
padding:5px;
}


body.phom .navigation a:link, body.phom .navigation a:visited {
padding:15px 10px 5px;
//background-color: #6F9BCE;
background-color:rgba(153,181,212,0.8);
}

body.phom .navigation a:hover, body.phom .navigation a:active {
padding:15px 10px 5px;
background-color:#B9CBDF;
}

#liste_ptv  a:link, #liste_ptv a:visited {
background-color:white;
color:#666;
}

#liste_ptv  li.matin a:hover, #liste_ptv a:active {
background-color:#b9cbdf;
color:#333;
font-weight:bold;
}

#liste_ptv  li.apres-midi a:hover, #liste_ptv a:active {
background-color:#FBBE6C;
color:#333;
font-weight:bold;
}

#liste_ptv  li.nuit a:hover, #liste_ptv a:active {
background-color:#666;
color:white;
font-weight:bold;
}


a.osm {
margin-left:20px;
}

a.osm:link {
color:#333;
background-color:white;
}

a.osm:hover {
color:#999;
background-color:white;
}

.info {font-style:italic; font-size:0.95em;color:#1E5B95;padding-top:15px}
/*********
 * Carte *
 *********/
body.carte, body.methodo {}

body.carte #wrapper {
padding-top:40px;
width:90%;
}

div#entete.carte {margin-bottom:10px}

div#entete logo {
float:left;
text-align:right;
}

div#liste_ptv {
text-align:left;
border:0px solid #dadada;
background-color: white;
float:left;
}

#liste_ptv ul {
font-size:1em;
list-style-type:none;
list-style-position:inside;
padding:0px;
margin:0px;
*margin-left:0;
*height:100%;
display:inline-block;
}

li.matin span.id {
text-align:center;
display:block;
width:20px;
color:white;
background-color:#b9cbdf;
float:left;
}

li.apres-midi span.id {
text-align:center;
display:block;
width:20px;
color:white;
background-color:#FBBE6C;
float:left;
}

li.nuit span.id {
text-align:center;
display:block;
width:20px;
color:white;
background-color:#666;
float:left;
}

li.jour span.id {
text-align:center;
display:block;
width:20px;
color:white;
background-color:#b9cbdf;
float:left;
}

#liste_ptv ul li {

clear:both;
margin:0;
padding:2px 0;
}

#liste_ptv ul li a {
display:block;
width:190px;
*width:240px;
float:left;
padding:0;
}

#liste_ptv li span.situation {
display:none;
color:#666;
width:30px;
float:right;
}



#liste_ptv ul p {font-weight:bold;}
#liste_ptv ul a {font-weight:normal;}


div#carte {
float:left;
margin-bottom:20px;
}

div#infos2 {
width:905px;
height:50px;
}

ul.legende {list-style-type:square;list-style-position:outside;margin:0;margin-left:-35px}
ul.legende li {float:left;margin:0 10px}

li.jour span#id {color:#00734c}
li.nuit span#id {color:#eb5516}


#situation {
width:50px;
float:right;
}
#situation li {
font-style:italic;
color:#666;
}

.carte #infos {
width:905px;
padding:5px;
}

/*********
 * Intro *
 *********/

body.accueil {
text-align:left;
}

body.accueil  .bandeau {
margin:0;
}

body.accueil  .logos {
margin:10px 0 20px;
}

body.accueil #content {
position:relative;
margin-bottom:30px;
}
body.accueil  .echelle {
padding:1em;
display:block;
margin : 10px auto;
}

.titre1 {
margin-bottom:1em;
font-size:1.2em;
color:#B9CBDF;
font-weight:bold;
text-align:center;
}

.titre2 {
margin-top:1em;
font-size:1em;
color:#013476;
font-weight:bold;
text-align:left;
}



/*********
 * Metodo *
 *********/

body.methodo #wrapper {
padding-top:40px;
width:90%;
}
 
body.methodo, body.accueil {
text-align:justify;
}
 

 
body.methodo #colonne1, body.accueil #colonne1 {
width:46%;
float:left;
padding:10px;
}

body.methodo #colonne2, body.accueil #colonne2 {
width:46%;
float:left;
padding:10px;
}
 
body.methodo table {
border-collapse:collapse;
width:100%;
text-align:left;
clear:both;
font-size:0.96em;
color:#333;
margin-bottom:5px;
}

table td {
padding:3px;
font-size :1em;
}

tr.couleur td  {background-color:#EBF3F6}

table td.col1 {font-weight:bold;width:30%;text-align:right}



table.commandes th {
font-weight:bold;
font-size:12px;
color:#013476;
padding-right:5px;
}

table.commandes td {
padding:0 20px;
margin:0;
}

body.methodo p {margin:10px}

body.methodo .titre2 {
color:#1E5B95;
margin:15px 0;
font-size:1.4em;
}

body.methodo .titre3 {
font-size:1.2em;
margin:10px 0;
color:#1E5B95;
font-weight:bold;
font-style:italic;
text-decoration:underline;
}

body.methodo .titre4 {
font-size:1em;
margin:5px;
color:#1E5B95;
font-weight:normal;
text-decoration:underline;
}

body.methodo .intertitre {
color:#333;
margin:15px 0 5px;
font-size:1em;
font-weight:bold;
}

img.logos {margin : 15px 0 20px}

div.navigation {
text-align:left;
margin: 4px;
font-size:11px;
z-index:201;
}

div.navigation p {
text-align:left;
}


body.phom .navigation {
clear:both;
position:absolute;
top:40px;

}


img.miniature {
float:left;
margin:0px 10px 10px 0;
}

.barre {
text-decoration:line-through;
}
/* Style du message no HTML5 */
#no_html5{
	position:absolute;
	top:150px;
	width:400px;
	z-index:9999;
	background-color:#EBF3F6;
	color:#e88;
	left:50%;
	margin-left:-200px;
	padding:20px;
	font-size:14px;
}
#no_html5 a{
	color:#e88;
	text-decoration:underline;
}
#no_html5_close{
	cursor:pointer;
}


/* safari/chrome */
body.phom .navigation a {
display: inline-block;
height: 20px;
vertical-align: top;
padding:8px 10px!important; 
}

/* IE */
body.phom .navigation a img{
border:0;
}

/* azimut */
#azimut{
  background-color: rgb(111, 155, 206);
  width: 58px;
  height: 100%;
  float: left;
  position: absolute;
  top: 0;
  left: -58px;
  color:#fff;
  padding:20px 15px;
  font-size:18px;
  text-align:center;
  box-sizing:border-box;
}
.titre_azimut{
	font-size:12px;
	font-weight:normal;
	margin-left:-2px;
	margin-top:-10px;
	padding-bottom:5px;
}



/* cones de visions */
#minimap{
	display:none;
	position:absolute;
	right:20px;
	bottom:30px;
	border:1px solid #666;
	background-color:#fff;
	z-index:999;
	background-repeat:no-repeat;
}

@media only screen and (min-height: 900px) { 
	#minimap{
		bottom:30px;
	}
}
 .load {
 background:url('images/loader.gif') no-repeat center;
 }

img#b_var_prec {visibility:hidden}
img#b_var_suiv {visibility:hidden}


.macrozone {margin-left : 10px}

.avertissement-adb {margin:100px 0 0 100px;font-weight:bold;color:red}