body {
  background: #333333 none repeat scroll 0 0;
  font-family:sans-serif;
}
a {
  color:#6F4503;
}
h1 {
  margin:0;
  color:#626262;
  position:relative;
  left:10px;
  top:8px;
  letter-spacing:2px;
  font-size:3em;
}

h2 {
  margin:0;
  color:#FFFFFF;
  position:relative;
  top:15px;
  left:15px;
  letter-spacing:2px;
  font-size:1em;
}

h4.title {
  margin:0;
  position:relative;
  left:5px;
  top:10px;
}



#title {
  position:absolute;
  top:0px;
  width:90%;
  height:80px;
  color:white;
  background:#333333;
}

#add {
  margin:0 auto;
  border:0;
  margin-right:10px;
  background: #626262;
  padding:5px;
}


a.right {
  position:relative;
  top:0px;
  left:0px;
  padding:0px;
  padding-left:0;
  color:#FFFFFF;
  font-size:1em;
  font-weight:bold;
}

a.right:hover {
  color:#000000;

}

input.nametoadd {
  height:18px;
  width:200px;
  border:0;
  position:relative;
  top:7px;
  left:10px;
}

input.add {
  float:right;
  width:80px;
  height:20px;
  border:0;
  margin-top:5px;
  margin-right:10px;
  background: #333333;
  color:#626262;
}

input.add:hover {
  color:#FFFFFF;
  cursor:pointer;
}

label {
  font-size:smaller;
  color:white;
  margin:0;
}

#left {
  color:white;
  min-width:250px;
  position:absolute;
  top:90px;
  overflow:hidden;
}

#add_location {
}

#select {
  margin:0 auto;
  margin-bottom:10px;
  margin-right:10px;
  border:0;
  width:auto;
  height:90px;
  background: #626262;
}

#dyn {
  border:0;
  margin:5px auto; 
}

#select select {
  border:0;
  margin-bottom:10px;
  width:200px;
  position:relative;
  top:15px;
  left:20px;
}

select.countries {
  border:0;
  margin-bottom:10px;
  width:200px;
  position:relative;
  top:16px;
  left:10px;
}

select.countries option {
  background-repeat:no-repeat;
  background-position:left;
  padding-left:20px;
}

#content {
  position: absolute;
  top:90px;
  bottom:0px;
  right:0px;
}

#location-info-title {
  margin-top: 10px;
  margin-left: 10px;
  margin-bottom: 3px;
  color: rgb(51, 51, 51);
  font-size: 1.2em;
  font-weight: bold;
}

#location-info-loading {
  margin:auto;
  margin-top:10px;
  margin-bottom:10px;
  width: 150px;
}


#switcher {
  overflow:auto;
  overflow-y: auto;
  margin:0;
  padding:0;
  background: #626262;
  display: block;
  margin-bottom:60px;
}

#switcher ul {
  background: #626262;
  width:auto;
  display:block;
  overflow:hidden;
  margin:0;
  padding:0;
}

#map {
  background-color:#FFFFFF;
}

#map a.olControlPanNorthItemInactive  {
	             position:absolute;
	            left: 50%;
             	top: 10px;
	             width:28px;
	             height:28px;
	            background:url(img/pan-north.png) no-repeat top center;
	            z-index:1000;
        }
        
#map a.olControlPanNorthItemInactive:hover  {
	            background:url(img/pan-north-hover.png) no-repeat top center;
				text-decoration:none;
        }
        
#map a.olControlPanNorthItemInactive span  {
	             display:none;
        }

#map a.olControlPanNorthItemInactive:hover span  {
	             color:#333333;
	             display:block;
	             position:relative;
	             top:34px;
	             left:-20px;
	             width:100px;        
        }
        
#map a.olControlPanSouthItemInactive {
	position:absolute;
             	left: 50%;
             	bottom: 10px;
	             width:28px;
	             height:28px;
	             background:url(img/pan-south.png) no-repeat;
	             z-index:1000;
	             
 	        }
#map a.olControlPanSouthItemInactive:hover  {
	            background:url(img/pan-south-hover.png) no-repeat top center;
				text-decoration:none;
        }
        
#map a.olControlPanSouthItemInactive span  {
	             display:none;
        }

#map a.olControlPanSouthItemInactive:hover span  {
	             color:#333333;
	             display:block;
	             position:relative;
	             top:-20px;
	             left:-20px;
	             width:100px;        
        }
        
        
#map a.olControlPanWestItemInactive {
	position:absolute;
             	top: 50%;
             	left: 10px;
	             width:28px;
	             height:28px;
	             background:url(img/pan-west.png) no-repeat;
	             z-index:1000;
	             
 	        }
#map a.olControlPanWestItemInactive:hover  {
	            background:url(img/pan-west-hover.png) no-repeat top center;
				text-decoration:none;
        }
        
#map a.olControlPanWestItemInactive span  {
	             display:none;
        }

#map a.olControlPanWestItemInactive:hover span  {
	             color:#333333;
	             display:block;
	             position:relative;
	             top:4px;
	             left:37px;
	             width:100px;        
        }
        
        
#map a.olControlPanEastItemInactive {
	position:absolute;
             	top: 50%;
             	right: 10px;
	             width:28px;
	             height:28px;
	             background:url(img/pan-east.png) no-repeat;
	             z-index:1000;
	             
 	        }
#map a.olControlPanEastItemInactive:hover  {
	            background:url(img/pan-east-hover.png) no-repeat top center;
				text-decoration:none;
        }
        
#map a.olControlPanEastItemInactive span  {
  display:none;
}

#map a.olControlPanEastItemInactive:hover span  {
  color:#333333;
  display:block;
  position:relative;
  top:8px;
  left:-70px;
  width:100px;        
}


#map a.olControlZoomInItemInactive {
  position:absolute;
	            top: 10px;
             	left: 10px;
	             width:28px;
	             height:28px;
	             background:url(img/zoomin.png) no-repeat;
	             z-index:1000;

	       }
	       
#map a.olControlZoomInItemInactive:hover  {
	            background:url(img/zoomin-hover.png) no-repeat top center;
				text-decoration:none;
        }
        
#map a.olControlZoomInItemInactive span  {
	             display:none;
        }

#map a.olControlZoomInItemInactive:hover span  {
	             color:#333333;
	             display:block;
	             position:relative;
	             top:5px;
	             left:35px;
	             width:100px;        
        }
        
#map a.olControlZoomToMaxExtentItemInactive {
	position:absolute;
	            top: 40px;
             	left: 10px;
	             width:28px;
	             height:28px;
	             background:url(img/zoomtoloc.png) no-repeat;
	             z-index:1000;

	       }
	       
#map a.olControlZoomToMaxExtentItemInactive:hover  {
	            background:url(img/zoomtoloc-hover.png) no-repeat top center;
				text-decoration:none;
        }
        
#map a.olControlZoomToMaxExtentItemInactive span  {
	             display:none;
        }

#map a.olControlZoomToMaxExtentItemInactive:hover span  {
	             color:#333333;
	             display:block;
	             position:relative;
	             top:-5px;
	             left:35px;
	             width:100px;        
        }

        
#map a.olControlZoomOutItemInactive {
	position:absolute;
	            top:70px;
             	left: 10px;
	             width:28px;
	             height:28px;
	             background:url(img/zoomout.png) no-repeat;
	             z-index:1000;

	       }
	       
#map a.olControlZoomOutItemInactive:hover  {
	            background:url(img/zoomout-hover.png) no-repeat top center;
				text-decoration:none;
        }
        
#map a.olControlZoomOutItemInactive span  {
	             display:none;
        }

#map a.olControlZoomOutItemInactive:hover span  {
	             color:#333333;
	             display:block;
	             position:relative;
	             top:5px;
	             left:35px;
	             width:100px;        
        }


        
        


div.olControlMousePosition {
  background-color:#626262;
  bottom:50px;
  right:0px;
  margin:10px;
  padding:5px;
  height:17px;
  width:150px;
  color:#FFFFFF;
  text-align:center;
}

div.olOsmTransportPermalink {
  background-color:#626262;
  bottom:85px;
  right:2px;
  margin:10px;
  padding:5px;
  height:17px;
  width:150px;
  color:#FFFFFF;
  text-align:center;
  position:absolute;
  z-index:1000;
}

div.olOsmTransportPermalink a {
  color:#FFFFFF;
}

div.olOsmTransportPermalink a:hover {
  color:#000000;
}

div.olControlAttribution {
  bottom:5px;
  left:10px;
  padding:0;
}

div.olControlAttribution a {
  color:#000000;
  text-decoration:none;
}

div.olControlAttribution a:hover {
  color:#333333;
  text-decoration:underline;
}

.olControlLoadingPanel {
	        background: #626262 url(img/loading.gif) no-repeat top center;
            position: relative;
            width: 195px;
            height: 50px;
            background-position:center;
            background-repeat:no-repeat;
            display: none;
        }
        


       

        

 	        


/* set the size of the definition list <dl> and add the background image */
#imap {width:240px; height:70px; background:url(img/osmtr-logo-png.png) no-repeat; position:relative;margin:0;padding:0;float:left;}


/* place the <dd>s in the correct absolute position */
#imap dd {position:absolute; padding:0; margin:0;}
#imap #pic_buses {left:0px; top:8px; z-index:20;}
#imap #pic_subways {left:62px; top:8px; z-index:20;}
#imap #pic_trains {left:126px; top:8px; z-index:20;}
#imap #pic_bikes {left:188px; top:8px; z-index:20;}

#imap a#buses{display:block; width:52px; height:50px; background:transparent url(img/bus-hover.png) -100px -100px no-repeat; text-decoration:none; z-index:20;}
#imap a#subways{display:block; width:51px; height:51px; background:transparent url(img/sub-hover.png) -100px -100px no-repeat; text-decoration:none; z-index:20;}
#imap a#trains{display:block; width:51px; height:51px; background:transparent url(img/train-hover.png) -100px -100px no-repeat; text-decoration:none; z-index:20;}
#imap a#bikes{display:block; width:52px; height:51px; background:transparent url(img/bike-hover.png) -100px -100px no-repeat; text-decoration:none; z-index:20;}

/* style the span text so that it is not initially displayed */
#imap a span, #imap a:visited span {display:none;}

/* move the link background image to position 0 0 when hovered */
#imap a#buses:hover, #imap a#subways:hover, #imap a#trains:hover, #imap a#bikes:hover {background-position:0 0;}

/* define the common styling for the span text */
#imap a:hover span {position:absolute; width:250px; display:block; font-family:sans-serif; font-size:1em; background:transparent; color:#FFFFFF;padding:5px;}
/* the hack for IE pre IE6 */
* html #imap a:hover span {width:400px; w\idth:388px;}

/* move the span text to a common position at the bottom of the image map */
#imap a#buses:hover span {left:0px; top:52px;}
#imap a#subways:hover span {left:-62px; top:52px;}
#imap a#trains:hover span {left:-126px; top:52px;}
#imap a#bikes:hover span {left:-190px; top:52px;}

/* add the style for the link span text - first line */
#imap a span:first-line {font-weight:bold; font-style:none;}

#ads {margin-top:150px;}