body {
    background-color: #170535;
}

button {
    font-family: 'Open Sans', "Segoe UI", Verdana, Helvetica, Sans-Serif;
}

#panel {
    background-color: transparent;
    position: absolute;
    top: 20px;
    left: 20px;
    z-index: 999;
}

#panel .panel-content {
    display: none;
}

#panel input {
    display: none;
    margin: 0;
    padding: 0;
}

.panel-row {
    display: flex;
    margin-bottom: 8px;
}

.panel-row > * {
    vertical-align: middle;
}

.panel-row button {
    margin: 0 5px 0 0;
    width: 32px;
    height: 32px;
    font-size: 10px;
    text-align: center;
    background-color: #fff;
    border-radius: 4px;
}

.panel-row button.text-button {
    width: auto;
}


#panel .button-launch {
    background: #fff no-repeat center/50% url('/images/icons/menu_bars.png');
}

#panel .button-azimuth {
    background: #fff no-repeat center/80% url('/images/icons/sun_rotate.png');
}

#panel .button-altitude {
    background: #fff no-repeat center/90% url('/images/icons/sun_up_down.png');
}

#panel .button-haze{
    background: #fff no-repeat center/90% url('/images/icons/haze.png');
}


#panel .button-shadows {
    background: #fff no-repeat center/90% url('/images/icons/man_shadow.png');
}

#panel .button-fly {
    background: #fff no-repeat center/90% url('/images/icons/bid_fly.png');
}

input[type='range'] {
    width: 200px;
}