/* ================================================================================
   STYLE GENERAL
   ================================================================================ */

* {box-sizing: border-box;}

body {font-family:Arial, Helvetica, sans-serif;text-align:left;background-color:#DDDDDD;padding:0;margin:0;overflow-y:scroll}

a:link {color:#000000;text-decoration:none;}
a:visited {color:#000000;text-decoration:none;}
a:hover {cursor:pointer;color:#000000;text-decoration:underline;}
a:active {color:#000000;text-decoration:none;}
a.bouton {display:block;float:left;border:1px #888888 solid;padding:5px 10px;margin:2px;background-color:#DDDDDD;font-size:1.2em;}
   
pre {white-space:pre-wrap;}
li {list-style-type:none}
input {box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing: border-box;}
/*marche pas
input:-moz-read-only {cursor:not-allowed;}
input:read-only {cursor:not-allowed;}*/

div.texte {margin:0;padding-left:20px;padding-right:20px;}

@media not screen and (max-width: 800px) {
	body {background-color:#DDDDDD;}
	div.titre1 {margin:5px 0 5px 0;padding:2px 10px;font-size:1.2em;background-color:#EEEEEE;border:1px #000000 solid;font-weight:bold;}
	h1.titre {margin:5px 0 5px 0;padding:2px 10px;font-size:1.2em;background-color:#EEEEEE;border:1px #000000 solid;}
	h2.titre {margin:15px 0 0px 0;padding:2px 10px;font-size:1.2em;}
}

@media screen and (max-width: 800px) {
	body {background-color:#DDDDDD;font-size:20px;}
	div.titre1 {text-align:center;padding:5px 0;background-color:#D0D0D0;border-top:1px solid #555555;border-bottom:1px solid #555555;margin:0;font-size:1em;font-weight:bold;}
	h1 {text-align:center;padding:5px 0;background-color:#D0D0D0;border-top:1px solid #555555;border-bottom:1px solid #555555;margin:0;font-size:1em;}
	h2 {margin:15px 0 0px 0;padding:2px 10px;}
	.no-mobile {display:none !important;}
}

.bl-vr { float: left; width : 15px; height: 15px; margin: 2px 5px 2px 2px; background-image: url('../img/bulle-verte.png' ); background-size: 15px 15px; background-repeat: no-repeat; }
.bl-rg { float: left; width : 15px; height: 15px; margin: 2px 5px 2px 2px; background-image: url('../img/bulle-rouge.png' ); background-size: 15px 15px; background-repeat: no-repeat; }
.bl-or { float: left; width : 15px; height: 15px; margin: 2px 5px 2px 2px; background-image: url('../img/bulle-orange.png'); background-size: 15px 15px; background-repeat: no-repeat; }
.bl-bl { float: left; width : 15px; height: 15px; margin: 2px 5px 2px 2px; background-image: url('../img/bulle-bleue.png' ); background-size: 15px 15px; background-repeat: no-repeat; }


/* ================================================================================
   MISE EN PAGE
   ================================================================================ */

@media not screen and (max-width: 800px) {
	div#main {width:792px;margin:0 auto 0 auto;background-color:#DDDDDD;}

	div#header {margin:10px 0;background-color:#DDDDDD;width:100%;padding:0;text-align:left;}
	div#header-notice {background-color:#DDDDDD;float:right;width:180px;padding:10px 0 10px 0;}
	div#header-notice>a {display:block;color:#000088;background-color:#DDDDDD;font-weight:normal;border-width:1px;border-style:solid;border-color:#000088;padding:2px 5px;text-align:left;font-size:120%;
	background-image: url('../img/pdf-22px.png');background-repeat: no-repeat;background-position:2px 0px;padding-left:20px;}
	div#header-notice>a:nth-child(1){border-bottom:0px;}
	div#header-notice>a:nth-child(2) {border-top:0px;font-weight:normal;} /*color:#FF0000;font-weight:normal;}*/
	div#header-end {clear:both;}
	
	#tabstoogler {display:none;}
	#tabs ul {padding:0;margin:0;list-style:none;}
	#tabs ul li.nor {padding:0 10px 0 10px;border-radius:5px 5px 0 0;background-color:#FFFFFF;display:inline-block;position:relative;bottom:-1px;border-left:1px #000000 solid;border-right:1px #000000 solid;border-top:1px #000000 solid;border-bottom:1px #000000 solid;z-index:10;}
	#tabs ul li.cur {padding:0 10px 0 10px;border-radius:5px 5px 0 0;background-color:#FFFFFF;display:inline-block;position:relative;bottom:-1px;border-left:1px #000000 solid;border-right:1px #000000 solid;border-top:1px #000000 solid;border-bottom:1px #FFFFFF solid;z-index:10;}

	div#content {clear:both;padding:5px;background-color:#FFFFFF;width:780px;border:1px #000000 solid;text-align:left;}

	div#footer {background-color:#DDDDDD;width:100%;font-size:0.6em;padding:2px 0 2px 0;text-align:center;}

	div#user {display:block;color:#888888;border:1px solid #888888;margin-top:5px;padding:2px 5px;text-align:center;font-size:80%;}
}

/*@media screen and (max-width: 800px) {
	div#main {width:100%;}

	div#header {width:86%;float:left;}
	div#header>img {width:100%;}
	div#header-notice {display:none;}
	div#header-end {display:none;}

	#tabs{float:left;width:14%;text-align:center;}
	#tabs img {width:70%;margin:10px auto;}
	#tabs:hover ul {display:block;}
	#tabs ul {font-size:1.2em;background-color:#FFF;position:absolute;display:none;padding:0;margin:-10px 0 0 0;right:0;border: 1px solid #444;width:200px;z-index:99;}
	#tabs ul li {text-align:center; width:100%;padding: 10px 0;}
	#tabs ul li.cur {font-weight:bold;}
	#tabs ul li a {display:block;width:100%}
	#tabs ul li a:hover {text-decoration:none;}
	#tabs ul li:hover {background-color:#EEE;}

	div#content {clear:both;}

	div#footer {background-color:#DDDDDD;width:100%;font-size:0.6em;padding:2px 0 2px 0;margin-top:10px;text-align:center;border-top: 1px solid #444;}

	div#user {display:block;color:#888888;border:1px solid #888888;margin-top:5px;padding:2px 5px;text-align:center;font-size:80%;}
}*/

@media screen and (max-width: 800px) {
	div#main {width:100%;}

	div#header {width:86%;float:left;padding:0;margin:0;line-height:0;}
	div#header>img {width:100%;margin:0;padding:0;}
	div#header-notice {display:none;}
	div#header-end {display:none;}

	#tabstoogler{float:left;width:14%;text-align:center;}
	#tabstoogler img {width:70%;margin:10px auto;}
	#tabs {clear:both;display:none;border-left: 5px solid #444; border-right: 5px solid #444; }
	#tabs ul {font-size:1.2em;display:block;padding:0;margin:0;width:100%;}
	#tabs ul li {text-align:left; width:100%;padding: 10px 5px;}
	#tabs ul li.cur {font-weight:bold;}
	#tabs ul li a {display:block;width:100%}
	#tabs ul li a:hover {text-decoration:none;}
	#tabs ul li:hover {background-color:#EEE;}

	div#content {clear:both;}

	div#footer {background-color:#DDDDDD;width:100%;font-size:0.6em;padding:2px 0 2px 0;margin-top:10px;text-align:center;border-top: 1px solid #444;}

	div#user {display:block;color:#888888;border:1px solid #888888;margin-top:5px;padding:2px 5px;text-align:center;font-size:80%;}
}

/* ================================================================================
   MENU VENTES
   ================================================================================ */
   
@media not screen and (max-width: 800px) {
	#pagemenutoogler {cursor:pointer;}
	#pagemenu  {display:none;}	
	#pagemenu  > div {position:relative;margin:0px;padding:0px;height:0px;width:0px;top:-2px;} 
	#pagemenu  > div > div {border:1px solid #B0B0B0;background-color:#EEEEEE;width:350px;}
	#pagemenu  > div > div > div {margin:0px;padding:2px;font-weight:bold;} 
	#pagemenu  > div > div > div > a {margin-left:20px;display:block;text-decoration:none;font-weight:normal;} 
	#pagemenu  > div > div > div > a:hover {background-color:#D9D9D9;}
}

@media screen and (max-width: 800px) {
	#pagemenutoogler {cursor:pointer;}
	#pagemenu {display:none;width:100%;border-left: 5px solid #444; border-right: 5px solid #444;}
	#pagemenu > div {margin:0px;padding:0px;text-align:left;} 
	#pagemenu > div > div {background-color:#EEEEEE;}
	#pagemenu > div > div > div {margin:0px;padding:2px;font-weight:bold;} 
	#pagemenu > div > div > div > a {margin-left:20px;display:block;text-decoration:none;font-weight:normal;} 
	#pagemenu > div > div > div > a:hover {background-color:#D9D9D9;}
}

/* ================================================================================
   STYLES DE LISTE MENU
   ================================================================================ */

@media not screen and (max-width: 800px) {
	ul.listmenu {margin:5px 0;}
	ul.listmenu > li {padding:5px;cursor: pointer;list-style-image:url(../img/fleche10px.png);margin-left:30px;clear:both;}
	ul.listmenu > li:hover {}
	ul.listmenu .item {font-weight:bold;float:left;}
	ul.listmenu .item:hover {text-decoration:underline;}
	ul.listmenu .info {float:left;}
	ul.listmenu .info:before {margin-left:3px;content: "("}
	ul.listmenu .info:after {content: ")"}
}

@media screen and (max-width: 800px) {
	ul.listmenu {margin:0;padding:0;}
	ul.listmenu > li:nth-of-type(1) {border-top:1px solid #555555;}
	ul.listmenu > li {margin:0;overflow: hidden;padding:5px;border-bottom:1px solid #555555;cursor: pointer;background-color:#FFFFFF;clear:both;}
	ul.listmenu > li:hover {background-color:#DDDDDD;}
	ul.listmenu .item {font-weight:bold;}
	ul.listmenu .info {margin-left:5%;font-size:0.8em;}
}

/* ================================================================================
   STYLES DE LISTE ENUMERATION
   ================================================================================ */

@media not screen and (max-width: 800px) {
	ul.listenum {margin:5px 0;}
	ul.listenum > li {padding:5px;cursor: pointer;list-style-image:url(img/fleche10px.png);margin-left:30px;}
	ul.listenum > li:hover {text-decoration:underline;}
	ul.listenum .item {font-weight:bold;float:left;}
	ul.listenum .info {float:left;}
	ul.listenum .info:before {margin-left:3px;content: "("}
	ul.listenum .info:after {content: ")"}
}

@media screen and (max-width: 800px) {
	ul.listenum {margin:5px 0;}
	ul.listenum > li {padding:5px;cursor: pointer;list-style-image:url(img/fleche10px.png);margin-left:30px;}
	ul.listenum > li:hover {text-decoration:underline;}
	ul.listenum .item {font-weight:bold;float:left;}
	ul.listenum .info {float:left;}
	ul.listenum .info:before {margin-left:3px;content: "("}
	ul.listenum .info:after {content: ")"}
}

/* ================================================================================
   PETITS CADRES
   ================================================================================ */
@media not screen and (max-width: 800px) {
	div.pticadre {margin:15px 0px 0px 8px;width:361px;padding:8px;border:1px solid #BBBBBB;float:left;background-color:#F5F5F5;} 
	div.pticadre > h1 {margin:-20px 0px 10px 10px;padding:0 20px;font-size:1.2em;float:left;background-color:#DDDDDD;border:1px solid #BBBBBB;}
	div.pticadre > .tip {font-style:italic;clear:both;padding:3px;font-size:0.8em;border-style:solid;border-width:1px;border-color:#DDDDDD;}
}

@media screen and (max-width: 800px) {
	div.pticadre {padding:5px 0;} 
	div.pticadre > .tip {font-style:italic;padding:3px;font-size:0.8em;}
}

/* ================================================================================
   TABLEAUX
   ================================================================================ */
table.tableau {border-spacing:0px;border-collapse:collapse;}
table.tableau > tbody > tr > td {border:1px solid #888888;padding:3px;}
table.tcd {font-size:0.8em;border-spacing:0px;border-collapse:collapse;}
table.tcd > thead > tr > th {height:100px;white-space:nowrap;}
table.tcd > thead > tr > th > div {-webkit-transform:translate(36px, 36px) rotate(315deg);-ms-transform:translate(36px, 36px) rotate(315deg);transform:translate(36px, 36px) rotate(315deg);width:25px;height:25px;}
table.tcd > thead > tr > th > div > div {float:left;border-bottom:1px solid #888888;padding:3px;width:135px;height:15px;}
table.tcd > tbody > tr > td:first-of-type {width:200px;font-size:1em;font-weight:bold;}
table.tcd > tbody > tr > td {border:1px solid #888888;padding:1px;width:45px;font-size:0.8em;}

@media not screen and (max-width: 800px) {
}

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

/* ================================================================================
   FORMULAIRE STD
   ================================================================================ */ 
p.login-error {color:#FF0000;}

/*a garder ??*/
div.form-bt {background-color:#DDDDDD;display:inline-block;border:1px #888888 solid;margin:10px 10px 10px 0px;padding:2px;width:150px;text-align:center;vertical-align:middle;cursor:pointer;}

@media not screen and (max-width: 800px) {
	form.std div.field {clear:both;margin:5px 0;overflow:hidden;}
	form.std div.field div.descr {font-weight:bold;float:left;width:150px;text-align:right;padding-right:8px;}
	form.std div.field div.value {float:left;width:175px}
	form.std div.field div.value input {width:100%;box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing: border-box;}
	form.std div.field div.help {clear:both;margin-left:50%;font-size:0.8em;}
	form.std div.butons {clear:both;text-align:center;margin:15px 0 0 0;}
	form.std div.butons input {background-color:#DDDDDD;border:1px #888888 solid;padding:2px;width:150px;height:30px;}
	form.std div.butons div {cursor:pointer;display:inline-block;background-color:#DDDDDD;border:1px #888888 solid;padding:2px;width:120px;font-size:1.0em;}
}

@media screen and (max-width: 800px) {
	form.std div.field {padding:3px 0;}
	form.std div.field div.descr {font-weight:bold;padding-left:5px;font-size:0.8em;}
	form.std div.field div.value {padding:2px 5px;}
	form.std div.field div.value input {width:100%;font-size:1.2em;}
	form.std div.field div.value select {font-size:1.2em;width:100%;}
	form.std div.field div.help {margin-left:30px;font-size:0.8em;}
	form.std div.butons {clear:both;text-align:center;overflow: hidden;margin:0;position: relative;}
	form.std div.butons input {background-color:#DDDDDD;border:1px #888888 solid;padding:2px;width:45%;margin:0 auto;font-size:1em;}
	form.std div.butons div {position:relative;display:inline-block;background-color:#DDDDDD;border:1px #888888 solid;padding:2px;margin:10px 1%;font-size:1.0em;}
	form.std div.butons div.b2 {width:42%;}
	form.std div.butons div.b3 {width:28%;}
}

/* ================================================================================
   PAGE VNT... 
   ================================================================================ */
div.vntlistarteditable {cursor:pointer;}
div.vntlistartline{display:block;white-space:nowrap;height:20px;}
div.vntlistartetiq {background-color:#FFFFFF;margin:2px auto 2px auto;border:1px #999999 solid;padding:0px;text-align:left;width:148px;height:40px;}
div.vntlistartetiq > div {float:left;margin:0px;padding:0px 3px;width:68px;height:20px;white-space:nowrap;overflow:hidden;}

div.vntarteditbg{display:none;position:fixed;top:0%;left:0%;width:100%;height:100%;background-color:black;z-index:1001;-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);}

@media not screen and (max-width: 800px) {
	div.vntarteditfg {display:none;position:fixed;left:50%;top:100px;margin-left:-200px;width:400px;/*height:230px;*/ padding:10px;/*border:16px solid orange;*/ background-color:white;z-index:1002;}
}

@media screen and (max-width: 800px) {
	div.vntlistart {font-size:16px;}
	div.vntarteditfg {overflow-y:scroll;display:none;position:fixed;top:0;left:0;bottom:0;right:0;padding:10px 0;background-color:white;z-index:1002;}
}


@media not screen and (max-width: 420px) {
	div.vntlistart {background-color:#FAFAFA;margin:2px;border:1px #000000 solid;padding:3px;text-align:left;/*font-weight:bold;*/ width:183px;/**/ /*height:130px;*/ float:left;overflow:hidden;}
/*	div.vntarteditbt {float:left;border:1px #888888 solid;padding:2px;width:80px;height:20px;text-align:center;margin:0px 3px;background-color:#DDDDDD;cursor:pointer;}*/
}

@media screen and (max-width: 420px) {
	div.vntlistart {background-color:#FAFAFA;text-align:left;padding:5px;margin:-1px 0px 0px 0px;border:1px #000000 solid;overflow:hidden;}
	/*div.vntlistart {width:100%;}*/
/*	div.vntarteditbt {float:left;border:1px #888888 solid;padding:2px;width:80px;height:20px;text-align:center;margin:0px 3px;background-color:#DDDDDD;cursor:pointer;}*/
}

/* ================================================================================
   PAGE TERM
   ================================================================================ */
.term-editline-table{display:table;width:100%;border:1px solid #666666;/*border-spacing:5px;cellspacing:poor IE support for this*/}
.term-editline-table-row{display:table-row;width:auto;clear:both;}
.term-editline-table-col1{float:left;/*fix for buggy browsers*/ display:table-column;width:80px;margin:2px;}
.term-editline-table-col2{float:left;/*fix for buggy browsers*/ display:table-column;/*width:100%;*/ margin:2px;}
div.termeditbg{display:none;position:fixed;top:0%;left:0%;width:100%;height:100%;background-color:black;z-index:1001;-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);}
div.termeditfg {display:none;position:fixed;left:50%;top:100px;margin-left:-350px;width:700px;height:280px;padding:10px;/*border:16px solid orange;*/ background-color:white;z-index:1002;}
div.termeditbt {float:left;border:1px #888888 solid;padding:2px;width:100px;height:25;text-align:center;margin:5px 3px;background-color:#DDDDDD;cursor:pointer;}
div.vntfunc {border:1px #888888 solid;padding:10px;width:250px;text-align:center;margin:10px auto 10px 20px;background-color:#DDDDDD;cursor:pointer;font-size:1.2em;}

@media not screen and (max-width: 800px) {
}

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

/* ================================================================================
   TABLEAU D'ACCES
   ================================================================================ */
/* config des lignes */
.vnt-access-lin1, .vnt-access-lin2 {clear:both;}
.vnt-access-lin1>div {border-top:1px #FF0000 solid;border-bottom:1px #FF0000 solid;font-weight:bold;height:20px;}
.vnt-access-lin2>div {border-bottom:1px #FF0000 solid;height:20px;}
/* config des colonnes */
.vnt-access-col1 {border-right:1px #FF0000 solid;border-left:1px #FF0000 solid;float:left;width:200px;}
.vnt-access-col2 {border-right:1px #FF0000 solid;float:left;width:50px;}

@media not screen and (max-width: 800px) {
}

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

/* ================================================================================
   MAP LEAFLET
   ================================================================================ */

.leaflet-control-layers-toggle {
	background-image: url('../img/layers.png');
	}
	
.leaflet-draw-toolbar a {
	background-image: url('../img/spritesheet.png');
}

.leaflet-retina .leaflet-draw-toolbar a {
	background-image: url('../img/spritesheet-2x.png');
}