@font-face {
    font-family: Circe-Bold;
    src: url('../../fnt/Circe-Bold.woff');
}
@font-face {
    font-family: Circe-Regular;
    src: url('../../fnt/Circe-Regular.woff');
}
@font-face {
    font-family: Circe-Light;
    src: url('../../fnt/Circe-Light.woff');
}
body{
    margin: 0;
    background: #05242E;
}
#container{
    position: relative;
    margin: auto;
    background: #05242E;
    width: 998px;
    height: 700px;
    overflow: hidden;
}

.main-place{
    position: absolute;
    left: 330px;
    top: 0;
    width: 665px;
    height: 700px;
}

.intro, .help{
    position: absolute;
    left: 0;
    top: 0;
    width: 998px;
    height: 700px;
}

.map{
    position: absolute;
    top: 50px;
}

.select {
    width: 360px;
    height: 50px;
    background: #000000;
}
.select span{
    color: #999999;
    font-family: Circe-Bold, sans-serif;
    font-size: 10pt;
}
.station-select{
    margin: 18px 10px 0 17px;
    font-size: 11px;
}
.years-select{
    margin: 18px 10px 0 10px;
    font-size: 11px;
}

.station-elements{
    position: absolute;
    width: 330px;
    height: 275px;
    top: 425px;
    left: 0px;
    font-family: Circe-Regular, sans-serif;
}
.station-elements .name{
    position: absolute;
    left: 0;
    top: 0;
}
.map-description{
    position: absolute;
    width: 330px;
    height: 275px;
    top: 425px;
    left: 0px;
    font-family: Circe-Regular, sans-serif;
}
.station-elements .name, .map-description .name{
    padding: 10px 5%;
    width: 90%;
    height: 30px;
    background: #000000;
    color: #E55739;
    font-size: 16px;
    text-align: center;
    letter-spacing: 2px;
    line-height: 30px;
    text-transform: uppercase;
}
.map-description .name span{
    font-size: 12px;
}

.style-info .name{
    text-transform: uppercase;
}
.style-info{
    position: absolute;
    width: 668px;
    height: 50px;
    left: 330px;
    top: 425px;
    overflow: hidden;
}

.map-popup{
    position: absolute;
    left: 0;
    top: 0;
    width: auto;
    height: 19px;
    opacity: 0;
}
.map-popup .left{
    float: left;
    width: 10px;
    height: 21px;
    background: url(../../img/map-popup-left.png);
    background-repeat: no-repeat;
}
.map-popup .center{
    padding: 2px;
    float: left;
    width: auto;
    height: 15px;
    color: white;
    background: #071515;
    font-family: Circe-Regular, sans-serif;
    font-size: 11px;
}
.map-popup .right{
    float: left;
    width: 10px;
    height: 21px;
    background: url(../../img/map-popup-right.png);
    background-size: 5px 19px;
    background-repeat: no-repeat;
}

.pointer{
    cursor: pointer;
    user-select: none;
}

.uppercase{
    text-transform: uppercase;
}

#choice {
    cursor: pointer;
}