#map-main-block {
    position : relative;
    width    : 1200px;
    margin   : 0 auto;
    height   : 649px;
}

#map-active, #map-not-active {
    position   : absolute;
    width      : 1200px;
    height     : 649px;
    left       : 0;
    top        : 0;
    background : url(/media/images/maps/mapkz.png) no-repeat;
    background-size: 1200px;
}

#map-not-active {
    background-position : -949px 0 !important;
    display             : none;
}

.map-label {
    position    : absolute;
    line-height : 18px;
    text-align  : center;
    /*text-shadow: 0 2px 4px #000;*/

    color: #2f365a;
    font-size: 14px;
    font-weight: 800;
}

#kostanay-label {
    left: 460px;
    width: 85px;
    top: 134px;
}

#sko-label {
    left: 611px;
    width: 105px;
    top: 27px;
}

#akmola-label {
    left: 645px;
    width: 126px;
    top: 147px;
}

#pavlodar-label {
    left: 840px;
    width: 98px;
    top: 133px;
}

#vko-label {
    right: 69px;
    width: 160px;
    top: 271px;
}

#almaty-label {
    left: 869px;
    width: 129px;
    top: 466px;
}

#zhambyl-label {
    left: 720px;
    width: 95px;
    top: 490px;
}

#yko-label {
    left: 604px;
    width: 90px;
    top: 570px;
}

#karaganda-label {
    left: 647px;
    width: 200px;
    top: 308px;
}

#kyzylorda-label {
    left: 426px;
    width: 132px;
    top: 435px;
}

#aktobe-label {
    left: 296px;
    width: 128px;
    top: 287px;
}

#zko-label {
    left: 83px;
    width: 135px;
    top: 223px;
}

#atyrau-label {
    left: 102px;
    width: 138px;
    top: 329px;
}

#mangistau-label {
    left: 152px;
    width: 102px;
    top: 474px;
}

#is-map {
    display  : block;
    position : absolute;
    left     : 0;
    top      : 0;
}

#area {
    z-index : 10;
}

.hover-area {
    position : absolute;
}

#kostanay-hover {
    width      : 176px;
    height     : 230px;
    left       : 325px;
    top        : 24px;
    background : url(../theme/areas/kostanay-hover.png) no-repeat;
    display    : none;
}

#aqtobe-hover {
    width      : 241px;
    height     : 215px;
    left       : 172px;
    top        : 131px;
    background : url(../theme/areas/aqtobe-hover.png) no-repeat;
    display    : none;
}

#pavlodar-hover {
    width      : 136px;
    height     : 160px;
    left       : 607px;
    top        : 20px;
    background : url(../theme/areas/pavlodar-hover.png) no-repeat;
    display    : none;
}

#vko-hover {
    width      : 236px;
    height     : 202px;
    left       : 705px;
    top        : 106px;
    background : url(../theme/areas/vko-hover.png) no-repeat;
    display    : none;
}

#almaty-hover {
    width      : 222px;
    height     : 168px;
    left       : 642px;
    top        : 266px;
    background : url(../theme/areas/almaty-hover.png) no-repeat;
    display    : none;
}

#karagandy-hover {
    width      : 355px;
    height     : 192px;
    left       : 376px;
    top        : 143px;
    background : url(../theme/areas/karagandy-hover.png) no-repeat;
    display    : none;
}

#akmola-hover {
    width      : 189px;
    height     : 126px;
    left       : 439px;
    top        : 59px;
    background : url(../theme/areas/akmola-hover.png) no-repeat;
    display    : none;
}

#sko-hover {
    width      : 170px;
    height     : 109px;
    left       : 455px;
    top        : 0px;
    background : url(../theme/areas/sko-hover.png) no-repeat;
    display    : none;
}

#zko-hover {
    width      : 200px;
    height     : 120px;
    left       : 0px;
    top        : 93px;
    background : url(../theme/areas/zko-hover.png) no-repeat;
    display    : none;
}

#atiray-hover {
    width      : 212px;
    height     : 126px;
    left       : 7px;
    top        : 188px;
    background : url(../theme/areas/atiray-hover.png) no-repeat;
    display    : none;
}

#mangistay-hover {
    width      : 167px;
    height     : 184px;
    left       : 55px;
    top        : 294px;
    background : url(../theme/areas/mangistay-hover.png) no-repeat;
    display    : none;
}

#kizilorda-hover {
    width      : 236px;
    height     : 206px;
    left       : 266px;
    top        : 261px;
    background : url(../theme/areas/kizilorda-hover.png) no-repeat;
    display    : none;
}

#jambyl-hover {
    width      : 168px;
    height     : 137px;
    left       : 532px;
    top        : 328px;
    background : url(../theme/areas/jambyl-hover.png) no-repeat;
    display    : none;
}

#yuko-hover {
    width      : 132px;
    height     : 189px;
    left       : 448px;
    top        : 335px;
    background : url(../theme/areas/yuko-hover.png) no-repeat;
    display    : none;
}

.interactive-map {
    padding-bottom: 50px;
}

.locate-map .area {
    display: none;
    position: absolute;
    height: 671px;
    width: 100%;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.col{
    display: inline-block;
    width: 300px;
    /*border: 1px solid black;*/
    min-height: 250px;
    color: #2f365a;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}

.col li{
    list-style: none;
}

.col ul li{
    min-height: 50px;
    margin-bottom: 40px;
    line-height: 50px;

}

.city{
    padding-left: 60px;
    background: url("/media/images/2016/map/city.png") no-repeat;
}

.selo{
    padding-left: 60px;
    background: url("/media/images/2016/map/selo.png") no-repeat;
}

.nature{
    padding-left: 60px;
    background: url("/media/images/2016/map/nature.png") no-repeat;
}

.monument{
    padding-left: 60px;
    background: url("/media/images/2016/map/monument.png") no-repeat;
}

.museum{
    padding-left: 60px;
    background: url("/media/images/2016/map/museum.png") no-repeat;
}

.culture{
    padding-left: 60px;
    background: url("/media/images/2016/map/culture.png") no-repeat;
}

.mavzolei{
    padding-left: 60px;
    background: url("/media/images/2016/map/mavzolei.png") no-repeat;
}

.pamyatnik{
    padding-left: 60px;
    background: url("/media/images/2016/map/pamyatnik.png") no-repeat;
}

.artefact{
    padding-left: 60px;
    background: url("/media/images/2016/map/artefact.png") no-repeat;
}

.mechet{
    padding-left: 60px;
    background: url("/media/images/2016/map/mechet.png") no-repeat;
}

.sobor{
    padding-left: 60px;
    background: url("/media/images/2016/map/sobor.png") no-repeat;
}
