body {
    margin:0;
    font-family : arial, "Helvetica Neue", helvetica, sans-serif;
    font-size: 14px;
}

a{
    color: #246036;
    text-decoration: underline;
}

.map {
    width: 100%;
    position : fixed;
    top: 5.625rem;
    bottom : 0px;
    left : 0px;
}

header {
    position: fixed;
    width: 100%;
    height: 5.625rem;
    display: flex;
    justify-content: space-between;
}

.bs-brand-image {
    height: 4.375rem;
    margin-left: 1.25rem;
    margin-bottom: 1.25rem;
}
footer {
    position : fixed;
    bottom:0;
    left:0;
    right:0;
    height:25px;
    padding:5px 10px;
    background-color:#ffffff;
    text-align:center
}

footer #copy {
    float:left;
    margin-top:3px;
}

footer #disclaimer {
    float:left;
    margin-top:3px;
    padding-left: 10px;
}

footer #map-bs{
    float: right;
    margin-top: 3px;
    cursor: pointer;
}

footer #map-bs::before{
    width: 10px;
    height: 10px;
    padding-right: 5px;
    content: url('img/forward.svg');
    cursor: pointer;
}

footer .tool {
    padding-right : .5rem;
    padding-left : .5rem;
    border-left : solid 1px #666;
}

footer .tool:first-child {
    border-left : none;
}

footer #lupe {
    position:relative;
    top:2px;
}

#logo {
    position : absolute;
    top:0;
    left:0;
    height:90px;
}

#attributes {
    position : absolute;
    left : 270px;
    right : 100px;
    bottom : 0px;
    top : 0;
    padding : 1em;
    display: flex;
    justify-content: flex-end;
}

.bs-brand-name{
    font-weight: bold;
    vertical-align: middle;
    font-size: 16px;
    margin-top: 2.4rem;
    padding-right:2rem;
}
 
table {
    display : inline-block;
    margin-right : 2em;
    float : right;
}

td {
    color : #333;
    padding-right : 1em;
    font-weight : bold;
}

td:first-child {
    font-weight : normal;
}

td:first-child::after {
    content:':';
}

.ol-rotate {
    top:3em;
}

.ol-control{
    border-radius: 0%;
    background-color: transparent;
    padding:0px;
}

.ol-control button{
    background-color: white!important;
    width: 1.875em;
    height: 1.875em;
    color:black;
    font-weight: bold;
    font-size: 1.3em;
    border-radius: 0px;
    cursor: pointer;
    border:none!important;
    outline: none;
}

.ol-control button:focus, .ol-control button:hover{
    background-color: #E4E4E4;
    border:none!important;
}

.ol-full-screen-false{
    background: url('img/ol-fullscreen.svg');
    background-size: 20px;
    background-repeat: no-repeat;
    background-position: center;
    color: white!important;
}

.ol-full-screen-false:hover, .ol-full-screen-false:hover{
    color: #E4E4E4!important;
    background-color: #E4E4E4!important;
}

.ol-full-screen{
    background-color: white!important;
    border: none!important;
}

.ol-zoom:focus, .ol-zoom:active #geoportalLink{
    display: none;
}

@media (max-width: 1000px) {
    footer .tool:last-child {
        display: none;
    }
}

@media (max-width: 800px) {
    #logo {
        display : none;
    }
    #attributes {
         top:0px;
    }
    table {
        font-size : 12px;
        float : left;
        margin : 0;
    }
    td:first-child {
        padding-right : 0.2em;
    }
}

@media (max-width: 600px) {
    footer #tools {
        display:none;
    }
    #attributes{    
        top: 5rem;
        justify-content: flex-start;
        left:0px;
        right:0px;
        height: 3rem;
        background-color: white;
    }
    header{
        height: 8rem;
        background-color: transparent;
        z-index: 99;
    }
    td {
        color : #333;
        padding-right : 1em;
        font-weight : bold;
    }
    .ol-zoom, .ol-full-screen{
        top: 5em;
    }
    #map:focus .ol-zoom, .ol-full-screen{
        top: 5em;
    }
}