.grid-1-3 {
    display: grid;
    grid-template-columns: 0.5fr 3.5fr;
    grid-gap: 15px;
}
.yellow {
    color: #edb11e;
}
.img_left {
    width: auto;
    float: left;
    margin: 5px 10px 5px 5px;
}
.fa-lightbulb-on {
    font-size: 25px;
}
#layerControles {
    position: sticky;
    top: 0;
    align-self: start;
    width: 100%;
    margin: 42px auto 10px auto;
    padding: 75px;
}
#layeredImages {
    background-image: url(http://www.uen.org/lcs/images/network/UETNMap24-baseMap.png);
    background-repeat: no-repeat;
    background-position: center center;
    position: relative;
    width: 100%;
    height: 1125px;
    margin: 15px auto 10px auto;
}
#img_layer_1,
#img_layer_10,
#img_layer_11,
#img_layer_12,
#img_layer_13,
#img_layer_2,
#img_layer_3,
#img_layer_4,
#img_layer_5,
#img_layer_6,
#img_layer_7,
#img_layer_8,
#img_layer_9 {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.checkbox {
    float: left;
    margin: 5px;
    width: 275px;
    height: 25px;
}
label {
    font-family: myriad-pro;
    width: 275px;
    border-radius: 3px;
    font-size: 16px;
}
input[type="checkbox"]:empty {
    margin-left: -9999px;
}
input[type="checkbox"]:empty ~ label {
    position: relative;
    float: left;
    line-height: 1.5em;
    text-indent: 3.25em;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
input[type="checkbox"]:empty ~ label:before {
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: 0;
    content: "";
    width: 2.5em;
    border-radius: 3px 0 0 3px;
}
input[type="checkbox"]:checked ~ label:before {
    font-family: "Font Awesome 5 Pro";
    font-weight: 900;
    content: "\f00c";
    text-indent: 0.9em;
    color: #fff;
}
#oneg input[type="checkbox"]:checked ~ label:before,
#oneg input[type="checkbox"]:empty ~ label:before {
    background: #f7941d;
}
#oneg label {
    border: 1px solid #f7941d;
}
#twohundm input[type="checkbox"]:checked ~ label:before,
#twohundm input[type="checkbox"]:empty ~ label:before {
    background: #987db9;
}
#twohundm label {
    border: 1px solid #987db9;
}
#tenge input[type="checkbox"]:checked ~ label:before,
#tenge input[type="checkbox"]:empty ~ label:before {
    background: #009fda;
}
#tenge label {
    border: 1px solid #009fda;
}
#tenhund input[type="checkbox"]:checked ~ label:before,
#tenhund input[type="checkbox"]:empty ~ label:before {
    background: #d5af34;
}
#tenhund label {
    border: 1px solid #d5af34;
}
#tengb input[type="checkbox"]:checked ~ label:before,
#tengb input[type="checkbox"]:empty ~ label:before {
    background: #3bb54a;
}
#tengb label {
    border: 1px solid #3bb54a;
}
#broadcast input[type="checkbox"]:checked ~ label:before,
#broadcast input[type="checkbox"]:empty ~ label:before {
    background: #dfddd9;
}
#broadcast label {
    border: 1px solid #dfddd9;
}
#twenty input[type="checkbox"]:checked ~ label:before,
#twenty input[type="checkbox"]:empty ~ label:before {
    background: #a256a2;
}
#twenty label {
    border: 1px solid #a256a2;
}
#fourty input[type="checkbox"]:checked ~ label:before,
#fourty input[type="checkbox"]:empty ~ label:before {
    background: #0054a6;
}
#fourty label {
    border: 1px solid #0054a6;
}
#onehund input[type="checkbox"]:checked ~ label:before,
#onehund input[type="checkbox"]:empty ~ label:before {
    background: #ed1c24;
}
#onehund label {
    border: 1px solid #ed1c24;
}
#fourhund input[type="checkbox"]:checked ~ label:before,
#fourhund input[type="checkbox"]:empty ~ label:before {
    background: #313183;
}
#fourhund label {
    border: 1px solid #313183;
}
#pop input[type="checkbox"]:checked ~ label:before,
#pop input[type="checkbox"]:empty ~ label:before {
    background: #000;
}
#pop label {
    border: 1px solid #000;
}
#health input[type="checkbox"]:checked ~ label:before,
#health input[type="checkbox"]:empty ~ label:before {
    background: #000;
}
#health label {
    border: 1px solid #000;
}
#location input[type="checkbox"]:checked ~ label:before,
#location input[type="checkbox"]:empty ~ label:before {
    background: #000;
}
#location label {
    border: 1px solid #000;
}
input[type="checkbox"]:focus ~ label:before {
    box-shadow: 0 0 0 3px #999;
}
@media only screen and (min-width: 992px) and (max-width: 1221px) {
    #layerControles {
        width: 890px;
    }
    #layeredImages {
        background-image: url(http://www.uen.org/lcs/css/grid-10.png);
        width: 890px;
        height: 503px;
    }
}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #layerControles {
        width: 800px;
    }
    #layeredImages {
        background-image: url(http://www.uen.org/lcs/css/grid-8.png);
        width: 800px;
        height: 449px;
    }
    .checkbox {
        width: 255px;
        height: 25px;
    }
    label {
        width: 255px;
        font-size: 12px;
    }
}