﻿#layout {
    min-height: 100%;
}

div#footer .grad {display: block;}
div#content {padding-bottom: 280px; min-height: 500px;}
body {color: #ffffff;}

#map {height: 432px; left: 75%; margin: 0 0 0 -195px; position: fixed; top: 172px; width: 432px; z-index: 5;}
#map div.moscow {background: url("map.png") no-repeat; height: 432px; position: absolute; width: 432px;}
#map div.moscow div.inner {background: url("map-inner.jpg") no-repeat; height: 312px; margin: 60px 0 0 69px; position: absolute; width: 295px;}
#map div.others {background: url("map-others.png") no-repeat; height: 360px; position: absolute; width: 391px; left: 10px; top: 25px;}
#map div.others div.inner {background: url("map-others-inner.png") no-repeat; height: 360px; /*margin: 60px 0 0 69px; */position: absolute; width: 391px;}
#map div.moscow div.station {width: 21px; height: 40px; position: absolute;}

#map div.moscow div.station div.small {width: 17px; height: 30px; position: absolute; left: 2px; top: 10px;}

#map div.station div.small,
#map div.hover div.small {display: block;}

#map div.selected div.small,
#map div.hover div.small {display: none;}

#map div.station div.big,
#map div.hover div.big {display: none;}

#map div.selected div.big,
#map div.hover div.big {display: block;}

#map div.moscow div.station div.small span {position: absolute; width: 9px; height: 9px; top: 3px; left: 4px;}
#map div.moscow div.station div img {position: absolute; z-index: 1;}
#map div.moscow div.station div.big span.wide {width: 15px; height: 12px; left: 3px; top: 5px; position: absolute;}
#map div.moscow div.station div.big span.tall {width: 12px; height: 16px; left: 5px; top: 3px; position: absolute;}

#map div.others div.station {width: 10px; height: 10px; position: absolute;}
#map div.others div.station div.small {width: 6px; height: 6px; position: absolute; left: 2px; top: 2px; background: url(station-other-black.png) no-repeat 0 0;}
#map div.others div.station div.big {width: 10px; height: 10px; position: absolute; left: 0; top: 0; background: url(station-other-white-selected.png) no-repeat 0 0;}
/*#map div.others div.white div.small {width: 6px; height: 6px; position: absolute; left: 2px; top: 2px; background: url(station-other-white.png) no-repeat 0 0;}
#map div.others div.white div.big {width: 10px; height: 10px; position: absolute; left: 0; top: 0; background: url(station-other-white-selected.png) no-repeat 0 0;}*/

div.stations {width: 20em; position: relative; left: 50%; margin-left: -198px; font-size: 0.75em; color: #000; top: 188px; z-index: 3; line-height: 1.6;}
div.stations h3 {font-family: arial; font-size: 1.1em; font-weight: bold; color: #155e09; font-family: Arial, sans-serif;}

div.stations span.hover {color: #fff;}

div.stations div.moscow div,
div.stations div.others div {/*margin-bottom: 1.8em;*/ /*cursor: pointer;*/ clear: both;}
div.stations div.moscow p span.arrow,
div.stations div.others h3 span.arrow {position: absolute; left: 100%; width: 32px; height: 12px; top: 0.8em; margin: -6px 0 0 5px; background: url(map-arrow.png) no-repeat 0 0; visibility: hidden; display: block;}
div.stations div.others h3 span.arrow {margin: -5px 0 0 5px;}
div.stations div.moscow div.selected span.arrow,
div.stations div.others div.selected h3 span.arrow {visibility: visible;}
div.stations p {margin-bottom: 0.2em;}
div.stations div.moscow p,
div.stations div.others h3 {position: relative;}
div.stations p.map_link {margin-bottom: 2em; height: 1.4em;}
div.stations p.map_link a {font-family: Arial, sans-serif; font-style: italic; padding-left: 16px; color: #000; position: relative; height: 1.4em; display: block; float: left;}
div.stations p.map_link ins {background: url(map-link-icon.png) no-repeat 0 0; position: absolute; left: 0; top: 50%; margin-top: -0.2em; width: 10px; height: 9px;}
div.stations p.switcher {font-size: 1.9em; font-family: Arial, sans-serif; margin-bottom: 1.2em; white-space: nowrap;}
div.stations p.switcher span.selected {color: #c2ecba; background: #000;}
div.stations p.switcher span {margin-right: 1.5em; padding: 0 0.15em;}
div.stations p.switcher span.hover {color: #fff;}

div.stations div.moscow p span,
div.stations div.others h3 span {color: #fff;}

div.stations div.moscow p span.pseudo_link,
div.stations div.others h3 span.pseudo_link {color: #000;}

div.stations div.moscow p span.hover,
div.stations div.others h3 span.hover {color: #fff !important;}

/*div.stations div.others p {display: none;}
div.stations div.others div.selected p {display: block;}
div.stations div.others div {margin-bottom: 3em;}
div.stations div.others div.selected {margin: 0;}*/

/*html, body {width: 100%; height: 100%; overflow: hidden; position: relative;}
div#layout {width: 100%; height: 100%; position: relative;}
div#cover {position: relative; width: 100%; height: 100%; overflow: auto;}
div#content {min-height: 1000px;}
div.stations p.map_link a {height: 1em; display: block;}*/