/**
 * CSS Reset
 * From Blueprint reset.css
 * http://blueprintcss.googlecode.com
 */
html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin:0;padding:0;border:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
body {line-height:1.0;}
table {border-collapse:separate;border-spacing:0;}
caption, th, td {text-align:left;font-weight:normal;}
table, td, th {vertical-align:middle;}
blockquote:before, blockquote:after, q:before, q:after {content:"";}
blockquote, q {quotes:"" "";}
a img {border:none;}

/**
 * Basic Typography
 */
body {
    font-family: "Lucida Grande", Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
    font-size: 12px;
    color: #222;
    background: #fff;
    margin: 2px;
}
pre, code {
    margin: 1.0em 0;
    white-space: pre;
}
pre, code {
    font: 1em 'andale mono', 'lucida console', monospace;
    line-height:1.0;
}
a[href] {
    color: #436976;
    background-color: transparent;
}
h1, h2, h3, h4, h5, h6 {
    color: #003a6b;
    background-color: transparent;
    font: 100% 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
    margin: 0;
    padding-top: 0.3em;
}
h1 {
    font-size: 110%;
    font-weight: bolder;
    margin-bottom: 5px;
    border-bottom: 1px solid #fcb100;
}
h2 {
    font-size: 95%;
    margin-bottom: 0.5em;
    border-bottom: 1px solid #aaa;
}
h3 {
    font-size: 90%;
    margin-bottom: 0.5em;
    text-decoration: underline;
}
h4 {
    font-size: 85%;
    font-weight: bold;
}
h5 {
    font-size: 85%;
    font-weight: bold;
}
h6 {
    font-size: 80%;
    font-weight: bold;
}

/**
 * Map Examples Specific
 */
 
 
         .olControlPanel div { 
          display:block;
          width:  24px;
          height: 24px;
          margin: 2px;
          background-color:red;
        }
        
        #cpanel_xxx {
        position:absolute;
        left: 500px;
        width:  24px;
        height: 22px;
		}
        
        .olControlPanel .olControlMouseDefaultsItemActive { 
          background-color: blue;
          background-image: url("../scripts/openlayers-2.8-svn-patched/theme/default/img/pan_on.png");
          top: 185px;
          left: 5px;
          position:relative;
		  margin: 0px;
        }
        .olControlPanel .olControlMouseDefaultsItemInactive { 
          background-color: orange;
          background-image: url("../scripts/openlayers-2.8-svn-patched/theme/default/img/pan_off.png");
          top: 185px;
          left: 5px;
          position:relative;
		  margin: 0px;
        }
        .olControlPanel .olControlZoomBoxItemInactive { 
          width:  22px;  
          height: 22px;
          background-color: orange;
          background-image: url("../scripts/openlayers-2.8-svn-patched/img/drag-rectangle-off.png");
          top: 190px;
          left: 5px;
          position:relative;
		  margin: 0px;
        }
        .olControlPanel .olControlZoomBoxItemActive { 
          width:  22px;  
          height: 22px;
          background-color: blue;
          background-image: url("../scripts/openlayers-2.8-svn-patched/img/drag-rectangle-on.png");
          top: 190px;
          left: 5px;
          position:relative;
		  margin: 0px;
        }

 
 
 
.smallmap {
/** background-color: #adf2ff;
background-color: #aaaaaa; **/
background-color: #f0f0f0;
 width: 600px; height: 600px; border: solid 1px #ccc; 
 }

.smallmapfit { /* Pour affichage plein cadre*/
/** background-color: #adf2ff;
background-color: #aaaaaa; **/
background-color: #f0f0f0;
 /* width: 100%; height: 100%; border: solid 1px #ccc; */
  width: 800px; height: 600px; border: solid 1px #ccc; 

 }

#tags {
    display: none;
}
#shortdesc {
    margin: 5px;
    font-size: 80%;
}
#docs {
    margin: 5px;
    font-size: 75%;
}
/*** Styles pour marqueurs ***/
.marqueurtitle {
    color: #003a6b;
    background-color: transparent;
    font: 100% 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
    margin: 0;
    padding-top: 0.5em;

	font-size: 95%;
    margin-bottom: 0.5em;
    border-bottom: 1px solid #aaa;
}
.marqueurtheme {

	color: #003a6b;
    background-color: transparent;
    font: 100% 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
    margin: 0;
    padding-top: 0.5em;

	font-size:  85%;
    font-weight: bold;
}

.marqueurtexte {
	color: #003a6b;
    background-color: transparent;
    font: 100% 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
    margin: 0;
    padding-top: 0.5em;

    font-size: 85%;
    font-weight: bold;
}

.marqueurhelp {
	color: #003a6b;
    background-color: transparent;
	font: 100% 'Lucida Grande', Verdana, Geneva, Lucida, Arial, Helvetica, sans-serif;
    margin: 0;
    padding-top: 0.5em;

    font-size: 9px;
    font-weight: bold;
}

#popup_info {
	position: absolute;
	top: 50px;
	left: 300px;
	z-index: 8000;
	width: 200px;
	height: 50px;
	display: none;
	padding: 3px;
	
	background-color: #ddd;

}

#popup_info_granges_frame {
	position: absolute;
	/* display: none; */
	display: block; /* tempo 201207 */
	width: 270px;
	top: 50px;
	left: 80px;
	z-index: 8000;
	padding: 0px; margin: 0px;
	background-color: transparent;
	/** background-color: transparent; **/

}


#popup_info_granges_background {
	position: absolute;
	width: 100%; height: 100%;
	top: auto; bottom: auto; left: auto; right: auto;
	display: block;
	z-index: 8001;
	padding: 3px;

	
	background-color: #ddf;

	/** background-color: transparent; **/
	filter: "alpha(opacity=50)";	/* IE's opacity*/
	opacity: 0.50;				/* CSS2 Compliant browsers understand this */
	-moz-opacity: 0.5;
	KHTMLOpacity: 0.5;
	MozOpacity: 0.5;
	-khtml-opacity: 0.50;
	-ms-filter:"alpha(opacity=50)";
}

#popup_info_granges {
	position: relative;
	display: block;
	z-index: 8002;
	padding: 3px;

	/** background-color: #ddd; **/
	background-color: transparent;

}

	
#content-legend	 {
	text-align:left; 
	width: 490px;
	/* height: 800px; */
	height: 600px;
	overflow: auto;
	margin: 0px;
	margin-left: 5px;
	float: left;
	vertical-align: middle;
	}

#content-legend span {
	padding-left: 4px;
	display: block;
}

