@charset "UTF-8";
/* CSS Document */

* { margin: 0; padding: 0;}

/*--------------------

GENERAL

--------------------*/

html {}

body { font-family:Arial, Helvetica, sans-serif; color:#444; font-size:12px;}
	
.clear {clear:both !important;}

hr { border-color: #F9F9F9; margin-bottom: 10px; opacity:0.4; filter:alpha(opacity=40); /* For IE8 and earlier */} 

li {list-style:none;}

/*#search { height:auto; width:100%;}*/

#layerswrapper { width:285px; float:left;}

/*text, links and buttons style*/ 

#layerswrapper a:link, a:visited {color:#444; text-decoration:none;}

#layerswrapper a:hover {text-decoration:underline;}

#layerswrapper p {margin-bottom:5px;}

/*--------------------

LAYERS SELECTION

--------------------*/

#layerswrapper .layer.layers { background-color: #fff; box-shadow: 2px 2px 2px #B7B7B7; -moz-box-shadow:2px 2px 2px #B7B7B7; -webkit-box-shadow:2px 2px 2px #B7B7B7; display: block; min-height: auto; margin: 0; padding: 5px 5px 15px; width: 275px; z-index: 1500; font-size:12px; color:#444; padding-top:5px;}

#layerswrapper .sections.layers { color: #444444; font-size: 12px; border-top:0px solid #e5e5e5; width: auto; min-height:auto; }


#layerswrapper .actionRow { width:auto; height:14px; margin:10px 0px -5px; font-size:11px; clear:both;}
#layerswrapper .selectAllRow { width:auto; height:14px; margin:10px 0px 7px; font-size:11px; clear:both;}

#layerswrapper .actionRow a:link, .actionRow:visited { color:#5389c9;}
#layerswrapper .selectAllRow a:link, .selectAllRow:visited { color:#5389c9;}

#layerswrapper span#viewLegend { float:left;} span#selectall { float:right;} span#deselect { float:right;}

/*--------------------

SELECTION

--------------------*/

	
#layerswrapper .values { margin-top:10px; height:228px; min-height: auto; overflow:auto;}

#layerswrapper .values ul li { width:auto; height:27px; margin-bottom:10px; clear:both; background:#f0f0f0;}

#layerswrapper .values ul li:hover {background:#DCE3ED;}

#layerswrapper .values ul li span.itemName { width:76%; color:#333; padding:6px 5px 7px 10px; display:inline-block; float:left; cursor:pointer; }

#layerswrapper .values li span.eye { width:22px; height:17px; padding:7px 5px 4px; display:inline-block; text-align:center; float:left; border-right:5px solid#fff;}

#layerswrapper ul.range:hover { background :#f8f8f8; } 

#layerswrapper ul.range li { border:none; padding: 10px 10px 0; }

#layerswrapper ul.range li:last-child { border-bottom:1px solid #eee; padding: 10px 0px 10px 10px; }

#layerswrapper ul.range li:hover { background:none; } 

/*--------------------

DISPLAY

--------------------*/
#layerswrapper .legend { max-height: 225px; overflow: auto; }

#layerswrapper .layer.layers .legend { margin-bottom:20px;}

#layerswrapper .legend li { width:auto; height:; color:#333; border-bottom:1px solid #eee; padding: 10px 0px 10px 10px; }
#layerswrapper .legend li:hover {background:#f8f8f8;} 

#layerswrapper .legend li img {height: 20px; width: 20px; margin-bottom: 1px; vertical-align: middle; }

#layerswrapper .legend li span { margin-left:20px;}

/* LEGEND COLORS */

#layerswrapper .legend li img.first { background:#58a6fa;}

#layerswrapper .legend li img.second { background:#e466d4;}

#layerswrapper .legend li img.third { background:#efea5e;}

#layerswrapper .legend li img.fourth { background:#53c35b;}

#layerswrapper .legend li img.fifth { background:#de4848;}

#layerswrapper .legend li img.sixth { background:#ec952f;}

#layerswrapper .legend li img.seventh { background:#26efe8;}


/*--------------------

BOTTOM ROW

--------------------*/

#layerswrapper .bottomRow {  height: 50px;  margin-top: 0;  padding: 0 10px; position: relative; width: auto;}

#layerswrapper .clearlayers {  height: 30px;  display:none; float:right; width:100%; margin-top:10px; }

#layerswrapper .bottomRow a.back { background-color:#E1E1E1; border: 2px solid #EEEEEE; bottom: 20px; box-shadow: 2px 2px 2px #B7B7B7; color: #444444; cursor: pointer; font-size: 12px; padding: 5px; position: absolute; text-transform: uppercase;}

#layerswrapper a.clearLayer { background-color: #548ABF; border: 2px solid #3873AD; box-shadow: 2px 2px 2px #B7B7B7; color: #FFFFFF !important; cursor: pointer; float: right; font-size: 10px; margin-top: 10px; padding: 4px 10px; text-transform: uppercase; }

#layerswrapper a.clearLayer:hover { background-color: #0d2e57; border: 2px solid #0a2649; box-shadow: 2px 2px 2px #B7B7B7; color: #FFFFFF !important; cursor: pointer; float: right; font-size: 10px; margin-top: 10px; padding: 4px 10px; text-transform: uppercase; }


/*--------------------

FORM ELEMENTS

--------------------*/

#layerswrapper select {  background: none repeat scroll 0 0 white; border: 1px solid #DDDDDD; color: #8D9194; height: 28px; padding: 3px; width: 100%; }