/**
 * @file
 * Contains layers related ui elements descriptions.
 */

.ui-layer {
    display: flex;
    align-items: center;

    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;

    padding: 10px;

    cursor: pointer;

    -webkit-transition: all 150ms;
    -moz-transition: all 150ms;
    -ms-transition: all 150ms;
    -o-transition: all 150ms;
    transition: all 150ms;

    -webkit-box-shadow: inset 0 0 0 #4ea3d8;
    -moz-box-shadow: inset 0 0 0 #4ea3d8;
    box-shadow: inset 0 0 0 #4ea3d8;

    text-shadow: 0 2px 1px rgb(21, 45, 68);

    color: white;
}

.ui-layer .view-controls {
    display: table;
    width: 45px;

    font-size: 70%;
}

.ui-layer .view-controls > * {
    display: inline-block;
    padding: 5px;
}

.ui-layer.active {
    background-color: #4b5865;

    -webkit-box-shadow: inset 5px 0px 0px #4ea3d8;
    -moz-box-shadow: inset 5px 0px 0px #4ea3d8;
    box-shadow: inset 5px 0px 0px #4ea3d8;
}