html, body {
    height: 100%;
    padding: 0;
    margin: 0;
}

body {
    font-size: 12px;
    font-family: Verdana, Helvetica, Sans-Serif;
    line-height: 150%;
}

form {
    height: 100%;
    margin: 0;
}

hr {
    color: #0060A9;
    height: 1px;
}

p, td {
    color: #000000;
}

td {
    vertical-align: top;
    border: none 0px white;
}

a {
    color: #E46809;
}

a:hover {
    text-decoration: none;
}

h1 {
    color: #0060A9;
    font-size: 12px;
    font-weight: bold
}

h2 {
    font-size: 12px;
    font-weight: normal;
    margin-bottom: 2px
}

li {
    color: #0060A9;
    font-size: 12px;
    list-style-type: none
}

li a {
    text-decoration: none
}

#wrap {
    width: 600px;
    margin: 0 auto -70px auto;
    min-height: 100%;
    height: auto !important;
    display: flex;
    flex-direction: column;
}


@media (min-width: 950px) {
    #wrap {
        width: 920px;
    }
}

@media (min-width: 1250px) {
    #wrap {
        width: 1200px;
    }
}

#header {
    width: 100%;
    margin-top: 10px;
    flex-basis: 120px;
    display: grid;
    grid-template-areas: 'logo title' 'menu menu';
    grid-template-columns: 180px auto;
}

#center {
    flex-grow: 1;
    display: flex;
    flex-direction: row;
}

#main {
    flex-grow: 1;
}

#single-main {
    width: 720px;
    min-height: 591px;
}

#wait {
    position: relative;
    z-index: 1000;
    width: 30px;
    height: 30px;
    left: 340px;
    top: 260px;
    margin-bottom: -30px;
    visibility: hidden;
}

.waitImage {
    background-color: white;
}

#push {
    clear: both;
    height: 70px;
}

#footer {
    width: 100%;
    height: 70px;
}

#bgPicture {
    background-image: url(images/Bolge_enkel_logo.gif);
    background-repeat: repeat-x;
    border: solid 1px #0060A9;
}

#layoutTable {
    border-collapse: collapse;
    width: 950px;
}

#left {
    flex-basis: 200px;
}

#fullmain {
    min-width: 920px;
    min-height: 591px;
    padding-left: 20px;
    padding-right: 20px;
}

.leftCell {
    width: 210px;
    border-top: none;
    border-bottom: none;
    border-right: none;
    border-left: none;
}

.middleCell {
    width: 530px;
    border: solid 1px #0060A9;
}

.bigrightCell {
    width: 728px;
    border-top: none;
    border-bottom: none;
    border-left: none;
    border-right: none;
}

.rightCell {
    width: 210px;
    border: solid 1px #0060A9;
}

.bottomCell {
    border: solid 1px #0060A9;
}

.fineText {
    font-size: 18pt;
    color: #0060A9;
}

.fineSmalltext {
    font-size: 12pt;
    color: #0060A9;
    white-space: nowrap;
}

#logo {
    width: 180px;
    padding-left: 10px;
    grid-area: logo;
}

#title {
    grid-area: title;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-top: 20px;
}

#title-left {
    padding-left: 20px;
    padding-top: 30px;
    padding-bottom: 10px;
}

.button {
    margin: 3px;
    padding: 3px 5px;
    color: white;
    font-size: 14px;
    border-radius: 5px;
    border: 1px solid #0093d1;
    background-color: rgb(0, 158, 224);
    text-align: center;
}

.button a {
    border: solid 1px #0060A9;
    color: #0060A9;
    text-decoration: none;
    padding: 2px;
}

.button a:hover {
    color: #0060A9;
    text-decoration: none;
    font-weight: normal;
}

.button a:active {
    color: #0060A9;
    text-decoration: none;
    font-weight: normal;
}

.button a:visited {
    color: #0060A9;
    text-decoration: none;
    font-weight: normal;
}

#menu {
    height: 37px;
    grid-area: menu;
}

.menuItem {
    color: #0060A9;
    border: 0px;
    text-align: center;
}

.menuItem {
    float: left;
    margin-top: 5px;
    margin-bottom: 5px;
    padding-bottom: 5px;
    margin-left: 20px;
}

.menuItem a {
    font-size: 14px;
    color: #0060A9;
    text-decoration: none;
    font-weight: bold;
    padding: 0px;
}

.menuItem a:hover {
    color: #E46809;
    text-decoration: underline;
}

.menuItemRight {
    color: #0060A9;
    border: 0px;
    text-align: center;
}

.menuItemRight {
    float: right;
    margin-top: 5px;
    margin-bottom: 5px;
    padding-bottom: 5px;
    margin-right: 20px;
    font-size: 12px;
}

.menuItemRight a {
    color: #0060A9;
    text-decoration: none;
    font-weight: normal;
    padding: 0px;
}

.menuItemRight a:hover {
    border: 0px;
    color: #0060A9;
    text-decoration: none;
    font-weight: normal;
    padding: 0px;
}

.menuItemRight a:active {
    border: 0px;
    color: #0060A9;
    text-decoration: none;
    font-weight: normal;
    padding: 0px;
}

.menuItemRight a:visited {
    border: 0px;
    color: #0060A9;
    text-decoration: none;
    font-weight: normal;
    padding: 0px;
}

#toolPanel {
}

.grafbox {
}

.grafdropdown {
    width: 130px;
    font-size: 12px;
}

.avgrensningbox {
    position: relative;
    width: 180px;
    border-bottom: solid 1px #0060A9;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 5px;
    padding-right: 5px;
}

.avgrensningrow {
    width: 100%;
    color: #0060A9;
    font-size: 12px;
    margin-bottom: 3px;
    margin-top: 5px
}

.avgrensningleft {
    width: 100px;
    height: 20px;
}

.avgrensningright {
    position: absolute;
    left: 90px;
    width: 95px;
}

.avgrensningicon {
    margin-left: 3px;
    border: 0px none white;
    float: right
}

.avgrensningtitle {
    font-size: 12px;
    color: #0060A9
}

.avgrensningtextbox {
    width: 90px;
    font-size: 12px;
}

.avgrensningsearch {
    width: 150px;
    font-size: 12px;
}

.avgrensningkalender td {
    font-size: 12px;
    color: #0060A9
}

#search {
    position: relative;
    left: 20px;
    top: 5px;
}

#searchresult {
    position: relative;
    top: 30px;
    padding: 5px;
    border: solid 1px #0060A9;
    margin: 20px
}

#tools {
    height: 32px;
    padding-left: 100px;
}

#content {
    float: left;
    width: 600px;
}

#right {
    float: right;
    width: 120px;
}

.avgrensningOKButton {
    font-size: 14px;
    text-align: center;
    padding-bottom: 10px;
    padding-top: 10px;
    padding-left: 5px;
    padding-right: 5px;
}

.avgrensningOKButton a {
    border: solid 1px #0060A9;
    color: #0060A9;
    text-decoration: none;
    padding: 2px;
}

.avgrensningOKButton a:hover {
    color: #E46809;
    border-color: #E46809;
    text-decoration: none;
    font-weight: normal;
}

.avgrensningdropdown {
    width: 180px;
    font-size: 12px;
}

.parameterbox {
    position: absolute;
    top: 0px;
    left: 590px
}

.parameterbox td {
    color: #0060A9;
}

.tegnforklaring {
}

.grafbox {
    margin-left: 5px;
}

.kontaktbox {
    font-size: 10pt;
    border-bottom: solid 1px #0060A9;
    margin-left: 20px;
    margin-right: 20px;
    padding-bottom: 10px;
    padding-top: 10px;
}

.progress {
    margin-left: 50px;
    text-align: center;
    font-size: 10pt;
    padding-top: 20px;
    padding-bottom: 10px;
}

.bottomCell {
    text-align: center;
    font-size: 10px;
    color: #0060A9;
    padding: 6px;
}

#identdiv {
    position: absolute;
    z-index: 100;
    background-color: White;
    border: dashed 1px Black;
    visibility: hidden;
}

.identhead {
    font-size: 0.8em;
    background-color: #dddddd;
    border-bottom: solid 1px black;
    width: 220px;
    font-weight: bold;
}

.identtext {
    font-size: 0.8em;
    width: 150px;
}

.identcmd {
    font-size: 0.7em;
    width: 35px;
}

.selectedtabellrow {
    background-color: #0060A9;
}

.selectedtabellrow td {
    color: #ffffff;
}

.tabell {
    width: 100%;
    margin-bottom: 3px
}

.tabellheading th {
    color: #0060A9;
    font-size: 12px;
    border-bottom: solid 1px #0060A9;
    border-right: none;
    border-top: none;
    border-left: none;
}

.tabellrow td, .alttabellrow td, .selectedtabellrow td {
    font-size: 12px;
    padding-left: 3px;
    padding-right: 3px;
    border-bottom: solid 1px #0060A9;
    border-right: none;
    border-left: none;
    border-top: none;
}

.tabellpager td {
    font-size: 14px;
    padding-right: 2px;
    padding-left: 2px;
    margin: 2px;
}

.tabellpagertotal {
    font-size: 12px;
    font-weight: bolder;
    margin-right: 10px;
}

.detaljtabell {
    width: 600px;
    margin-left: 20px;
    margin-right: 20px;
    padding-bottom: 10px;
    padding-top: 10px;
}

.detaljrow td {
    font-size: 12px;
    text-align: left;
    padding-left: 5px;
    padding-bottom: 3px;
    border-left: dashed 1px #0060A9;
    border-top: none;
    border-bottom: none;
    border-right: none;
}

.detaljheading {
    color: #0060A9;
    border-left-style: none !important;
}

.rss {
    width: 200px;
    border-bottom: solid 1px #0060A9;
    margin: 10px;
    font-size: 11px;
    padding-bottom: 10px;
}

.rss h2 {
    color: #0060A9
}

.breadcrumb {
    position: relative;
    left: 10px;
    padding: 10px;
    font-size: 10px;
    color: #0060A9
}

.header {
    font-size: 12px;
    font-weight: normal;
}

.dropdown {
    font-size: 12px;
    border-color: #0060A9;
    width: 180px;
}

.menyparent {
    font-size: 12px;
    color: #0060A9;
}

.menyleaf {
    font-size: 10px;
}

.menyleaf a:hover {
    text-decoration: underline;
}

#login {
    padding-left: 150px;
    padding-top: 120px;
}

.loginbox {
    width: 120pt;
    margin: 2px
}

.box {
    float: left;
    margin-right: 0.7em;
    margin-top: 0.7em;
    width: 12em;
}

.textbox {
    width: 5em;
}

.heading {
    font-weight: bold;
    font-size: 1em;
}

.label {
    font-size: 0.8em;
}

.stasjonbox {
    font-size: 1em;
}

.buttonbox {
    float: left;
    margin-right: 0.7em;
    margin-top: 0.7em;
    width: 12em;
    text-align: center;
    padding: 3em
}

.buttonbox a {
    color: White
}

.buttonbox a:hover {
    color: Red
}

.linkbox {
    margin-left: 2px;
    font-size: 12px;
    padding: 5px;
    text-align: center
}

.linkbox a {
    border: solid 1px White;
    color: White;
    font-weight: bold;
    text-decoration: none;
    padding: 3px;
    width: 60px
}

.linkbox a:hover {
    border-color: Red;
    color: Red
}

.linkbox a:active, .linkbox a:visited {
    border: solid 1px White;
    font-weight: bolder;
    color: White
}


.editable {
    display: block;
    padding-bottom: 3px;
    padding-top: 5px;
    padding-left: 2px;
    padding-right: 2px;
    border-bottom: solid 1px #0060A9
}

.editable-alt {
    display: block;
    padding-bottom: 3px;
    padding-top: 5px;
    padding-left: 2px;
    padding-right: 2px;
    border-bottom: solid 1px #0060A9
}

.colophon {
    background: #272329;
    color: white;
    padding: 10px 0;
    overflow: hidden
}

.colophon .wrapper {
    width: 960px;
    margin: 0 auto;
    overflow: hidden
}

.colophon .contact div {
    padding-right: 40px;
    float: left;
    display: block
}

.colophon a {
    color: white
}

.list {
    margin-left: 20px;
    width: 180px
}

.list a:hover {
    color: #000
}

.list li {
    margin-bottom: 5px
}

.content {
    width: 960px
}

.kommpanel {
    border: 0 none white
}

.kommentar-list {
    margin-top: 8px
}

.kommentar-item {
    cursor: pointer;
    width: 690px;
    min-height: 30px;
    border-radius: 4px;
    border: 1px solid #D7D7D7;
    padding: 3px;
    margin-bottom: 8px
}

.kommentar-selected {
    background: #CCCCCC
}

.gray {
    background-color: #cdcdcd;
}

.x-body {
    font-family: Verdana, Helvetica, Sans-Serif;
    font-size: 12px
}

.x-label {
    height: auto
}

.x-grid .x-column-header {
    background-color: #0060A9
}

.x-grid-group-hd .x-grid-cell-inner {
    border-top-color: #0060A9;
    border-right-color: #0060A9;
    border-bottom-color: #0060A9;
    border-left-color: #0060A9;
    border-bottom-width: 1px
}

.x-grid-group-title {
    font-family: Verdana, Helvetica, sans-serif;
    color: #0060A9
}

.x-grid-cell-inner {
    white-space: normal
}

.x-accordion-hd {
    background: #AEDCF8 !important;
    color: #5D6BAF
}

.x-accordion-hd .x-panel-header-text {
    font-weight: bold;
    color: #5D6BAF
}

#map {
    width: 100%;
    height: 100%;
    position: relative;
    margin-top: -25px;
}

.outside {
    width: 100px;
    height: 100px;
    position: absolute;
    top: -120px;
}

.labelSpan {
    font-family: inherit;
    font-weight: normal;
    font-size: 12px;
    padding-left: 5px;
    vertical-align: top
}

.result-item {
    height: 120px;
    border-radius: 5px;
    border: 1px solid #0060A9;
    margin: 4px;
}

.result-header {
    margin-top: 5px;
    margin-left: 5px;
    margin-right: 5px;
    height: 20px;
    width: 100%;
    display: flex;
    flex-direction: row;
}

.result-name {
    overflow: hidden;
    width: 40%;
}

.result-type {
    flex-grow: 1;
}

.result-center {
    margin-left: 5px;
    margin-bottom: 5px;
    margin-right: 5px;
    display: flex;
    flex-direction: row;
}

.result-checkbox {
    margin-top: 30px;
    width: 40px;
    flex: none;
}

.result-content {
    flex-grow: 1;
    display: flex;
    flex-direction: row;
}

.result-link {
    margin-left: 10px;
    margin-top: 30px;
    width: 30px;
    flex: none;
}

.result-project {
    flex-grow: 1;
}

.result-datatype {
    flex-grow: 1;
}

#map-wait {
    position: relative;
    visibility: hidden;
    width: 20px;
    height: 25px;
    top: 2.2em;
    left: 12px;
    z-index: 900;
}

#info {
    height: 200px;
    width: 1200px;
}

#map-controls {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 60px;
    z-index: 1;
    left: 6px;
}

#map-controls button {
    width: 32px;
    height: 32px;
    margin: 1px;
    border: none;
}

#map-cntr-identify.normal {
    background-image: url("../images/identify.png")
}

#map-cntr-identify.selected {
    background-image: url("../images/identify-red.png")
}

#map-cntr-select.normal {
    background-image: url("../images/select.png")
}

#map-cntr-select.selected {
    background-image: url("../images/select-red.png")
}

#map-cntr-zoom {
    background-image: url("../images/zoom-selected.png")
}

#map-cntr-select.normal {
    background-image: url("../images/select.png")
}

#map-cntr-select.selected {
    background-image: url("../images/select-red.png")
}

.show {
    animation: 1.5s fadeIn;
    animation-fill-mode: forwards
}

.hide {
    animation: 0.5s fadeOut;
    animation-fill-mode: forwards
}

@keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1;
        visibility: visible
    }
}

@keyframes fadeOut {
    from {
        opacity: 1
    }

    to {
        opacity: 0;
        visibility: hidden
    }
}


.ol-overlaycontainer-stopevent {
    display: flex;
    flex-direction: row;
}

.layer-control {
    display: flex;
    flex-direction: row;
    position: relative !important;
    height: 2em;
}

.layer-control button {
    width: 5em !important;
    font-size: 1.2em;
}

.resultpanel {
    z-index: 850;
    margin-top: -450px;
}

.resultitem {
    height: 120px;
    border-radius: 5px;
    border: 1px solid #0060A9;
    margin: 10px;
    background: rgba(255,255,255,0.8)
}

.resultpanel-body {
    background: rgba(255,255,255,0)
}

.resultpanel-close {
    background: rgba(255,255,255,1);
    padding: 2px;
    margin-right: 5px;
    border-radius: 3px;
    border: 1px solid #0060A9 !important
}

ul.map-overlegg {
    padding-inline-start: 5px;
}

li.map-overlegg {
    color: var(--ol-foreground-color);
    background-color: var(--ol-background-color);
    padding: 2px 15px;
}

li.map-overlegg > input {
    margin-left: 0px;
}

li.map-overlegg > span {
    padding-left: 2px;
}

.hidden {
    display: none !important;
}