html, body {
    height: 100%;
    width: 100%;
}

#header {
    height: 78px;
}

#map {
    color: #000;
    height: 100%;
    width: 100%;
}

#map-header {
    background: url(/asiakaspalvelu/hairiokartta/assets/img/map-header_bg.png) no-repeat;
    margin-left: -430px;

    position: absolute;
    left: 50%;
    top: 91px;
    z-index: 11;

    height: 41px;
    width: 860px;
}
#map-header .switch.mobile {
	cursor: pointer;
    display: block;
    float: left;
    margin-left: 0;
    width: 207px;
    height: 41px;
}
#map-header .switch.fixed {
	cursor: pointer;
    display: block;
    float: left;
    margin-left: 3px;
    width: 177px;
    height: 41px;
}
#map-header .bulletins {
    display: block;
    float: left;
    margin-left: 3px;
    width: 117px;
    height: 41px;
}
#map-header #map-header-search{
margin:7px 0 0 0;
position:relative;
left:7px;
float: left;
}


#map-search-box {
  background: url("../img/map-header_search_box.png") no-repeat scroll center bottom transparent;
  color: #000000;
left: 50%;
margin-left: 86px;
position: absolute;
top: 28px;
padding-left: 6px;
width: 142px;
z-index: 10;
}
#map-search-help {
background: url(../img/map-header_search_help_hairiokartta.png) no-repeat;
margin-left: 0;
position: absolute;
left: 516px;
top: 28px;
z-index: 10;
height: 81px;
width: 149px;
}

#map-header #search-text{
background:url(../img/map-header_input_bg.png) no-repeat;
border:0;
float: left;
margin:3px 4px 0 0;
padding: 5px 0 0 3px;
width:148px;
}
#map-header #search-bt{
background:url(../img/map-header_bt_hae.png) no-repeat;
border:0;
float: left;
margin-top: 2px;
height:21px;
width:54px;
}

#map-header-list {
    display: block;
    float: right;
    margin: 15px 15px 0 0;
    width: 100px;
    height: 20px;
}

#map-loading {
    background: #036cae url(/asiakaspalvelu/hairiokartta/assets/img/map-loading.gif) center no-repeat;
    padding: 25px;

    position: absolute;
    left: 50%;
    top: 250px;
    z-index: 11;

    height: 32px;
    width: 32px;
}

#map-loading-error {
    background: #036cae;
    display: none;
    padding: 25px;

    position: absolute;
    left: 40%;
    top: 250px;
    z-index: 11;
}

#map-list {
    background-color: #036cae;
    display: none;
    margin-left: 186px;
    padding: 10px 15px 10px 15px;

    position: absolute;
    bottom: 60px;
    left: 50%;
    z-index: 10;

    width: 204px;
}
#map-list a {
    color: #fff;
}
#map-list ul {
    margin: 0;
    padding: 0;
}
#map-list #map-list-content li {
    border-bottom: 1px solid #97e8ff;
    list-style-type: none;
    margin: 0;
    padding: 10px 0 10px 0;
}
#map-list #map-list-content li span {
    color: #97e8ff;
    display: block;
}
#map-list #map-list-content li.last {
    border-bottom: none;
}
#map-list .simplePagerNav {
    display: block;
    margin: 0 auto;
    padding: 5px;
}
#map-list .simplePagerNav li {
    float: left;
    list-style-type: none;
}
#map-list .simplePagerNav a {
    display: block;
    float: left;
    padding: 6px;
}
#map-list-close {
    float: right;
}

#map-info {
    background-color: #036cae;
    display: none;
    margin-left: 99px;
    padding: 12px;

    position: absolute;
    left: 50%;
    top: 130px;
    z-index: 20;

    width: 300px;
}
#map-info a {
    color: #fff;
    text-decoration: underline;
}
#map-info a:hover {
    color: #1EA3ED;
}
#map-info h3 {
    background: url(/asiakaspalvelu/hairiokartta/assets/img/map-info_toimintaohjeet.gif) no-repeat;
    margin: 10px 0 10px 0;
    padding: 0;
    text-indent: -9999px;

    height: 19px;
    width: 254px;
}
#map-info ol {
    margin: 0;
    padding: 0 0 0 15px;
}
#map-info-close {
    float: right;
    margin: 0;
}

#map-footer {
    background: url(/asiakaspalvelu/hairiokartta/assets/img/map-footer.png) no-repeat;
    margin-left: -430px;

    position: absolute;
    bottom: 15px;
    left: 50%;
    z-index: 11;

    height: 54px;
    width: 860px;
}
#map-footer-list {
    display: block;
    float: left;

    position: relative;
    left: 675px;
    top: 14px;
    z-index: 11;

    height: 19px;
    width: 170px;
}

#footer {
    margin: 0 auto;
    width: 852px;
}