/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 30-04-2018, 08:51:07
    Author     : tch
*/

html { 
    height:100%;
    overflow:hidden; 
    max-height:3000px; 
    max-width:3000px; }
select { 
    height:2em; 
}
iframe { 
    border-width: 0px;
}
body { 
    height:100%;
    padding-bottom:5px;
    width:100%;
    min-width:400px;
    max-height:3000px;
    max-width:3000px;
    margin-left:auto;
    margin-right:auto;
    background-color:rgb(250,250,250);
    overflow:hidden; 
    font-size:13px; 
}
h1 { 
    font-size:22px; 
}
h2 { 
    font-size:20px; 
}
h3 { 
    font-size:18px; 
}
h4 { 
    font-size:16px; 
}

button, input, select, textarea { 
    margin-bottom:1px; 
    margin-left:3px; 
}

input[type=checkbox] { 
    margin-top:1px; 
}

div#floatingDiv {
    position:absolute;
    top:3px;
    left:93%;
    margin-left:-325px;
    max-height:99%;
    width:320px;
    overflow:hidden;
    border:1px solid black;
    border-radius:5px;
    background-color:white;
    z-index:35;
}

h1#title {

}

.english .danish {
    display:none;
}
.clear {
    clear:both;
}
.modal-body .form-horizontal .col-sm-2,.modal-body .form-horizontal .col-sm-10 {
    width: 100%;
}
.modal-body .form-horizontal .control-label {
    text-align: left;
}
.modal-body .form-horizontal .col-sm-offset-2 {
    margin-left: 15px;
}
.closeButton { 
    top:5px; 
    color:rgba(0,60,136,.5); 
    cursor:pointer;
    position:absolute;
    font-size:2em;
    background-color:rgba(255,255,255,0.3); 
}

.list-group.list-group-root {
    padding: 0;
    overflow: hidden; 
    background-color:white; 
}
.list-group.list-group-root .list-group {
    margin-bottom: 0; 
}
.list-group.list-group-root .list-group-item {
    border-radius: 0;
    border-width: 1px 0 0 0; 
    padding:8px 5px; 
    background-color:rgba(0,60,136,.1); 
}
.list-group.list-group-root > .list-group-item:first-child {
    border-top-width: 0;
}
.list-group.list-group-root > .list-group > .list-group-item {
    padding-left: 15px;
}
.list-group.list-group-root > .list-group > .list-group > .list-group-item {
    padding-left: 30px;
}
.list-group .end-node { 
    padding:0px 5px 0px 5px; 
    border-width:1px 1px 0px 1px; 
    border-style:solid; 
    border-color:#f3f3f3; 
}

.layerContents .end-node{ 
    margin-bottom:3px; 
}

.list-group  { 
    margin-bottom:20px; 
}
.list-group-item .glyphicon {
    margin-right: 5px
}
list-group-item .span {
    font-size:13px;
}
.table-responsive { 
    overflow-y: auto !important; 
    max-height: fit-content !important;
    transform: rotateX(180deg);
}




.table {
    width: 100%;
    background-color: white;
    max-width: 100%;
    margin-bottom: 2px;
    font-size: 11px;
    transform: rotateX(180deg);
}

.maxtable{
    width:100%!important;
    height:100%!important;
    top: 0px!important;
    left:0px!important;
}



@media
screen 
and (max-width: 760px), (min-device-width: 768px) 
and (max-device-width: 1024px) {
    div#tip {
        display: none;
    }

    /* Force table to not be like tables anymore */
    div#mapdetails table, thead, tbody, th, td, tr {
        display: block;
        
    }
    
     div#mapdetails tbody{
        background: rgb(240, 248, 255);
        background-color: transparent;
    }
    
    .sideMenu.left {
        bottom: 20px !important;
    }
    
    .table{
        transform: none;
        background-color: transparent;
    }
    
    .table-responsive{
        transform: none;
    }
    
     div#mapdetails  {
/*        max-width: fit-content !important;
        max-height: fit-content !important;*/
    max-height: 99%!important;
    height:99%!important;
    z-index:40!important;
    max-width:97%!important;
    width:90%!important;
    bottom:0px!important;
    left:0%!important;
    right:0px!important;
    }

    /* Hide table headers (but not display: none;, for accessibility) */
    div#mapdetails thead tr {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    div#mapdetails tr {
        margin: 0 0 1rem 0;
        border: 1px #00008B solid;
        
    }
    
   
    
    .table > thead > tr > th {
 
        top: 0;
         position: sticky;
    }

    div#mapdetails tr:nth-child(odd) {
        background: white;
    }
    
    
    
    div#mapdetails tr:nth-child(even) {
        background: white;
    }

    div#mapdetails td {
        /* Behave  like a "row" */
        max-inline-size: 100% !important;
        overflow-wrap: break-word;
        
        position: inherit;
        padding-left: 5px;
        white-space: normal!important;
        text-align: left !important;
        border: 0px;
        padding-top: 0px;
        padding-bottom: 0px;
        padding-right: 0px;
        min-height: 15px;
    }
    
    div#mapdetails td a{
        /* Behave  like a "row" */
        min-height: 15px;
        text-align: left;
        
    }

    div#mapdetails td:before {
        /* Now like a table header */
        position: inherit;
        /* Top/left values mimic padding */
/*        top: 5px;
        left: 12px;
        width: 45%;*/
        /*text-align: left;*/
        padding-right: 10px;
        white-space: nowrap;
        content: attr(data-label);
        min-height: 15px;
        font-weight: bold;
        text-transform: capitalize;
        
    }

    

    
    
    div#mapdetails table tr {
        padding-bottom: 5px;
    }

    div#mapdetails tr:nth-child(odd) {
        background: white;
    }

    div#mapdetails table tr td:last-child {
        border-bottom: 0;
        padding-bottom: 0px;
    }
}
/* Side panels */
.sideMenu { 
    position:absolute;
    z-index:3; 
}
.sideMenu .content { 
    position:relative;
    height:100%;
    padding:0px;
    overflow-x:hidden;
    overflow-y:auto;
    background-color:white; 
}

.sideMenu div.title { 
    padding:11px 0px 5px 10px;
    cursor:pointer; 
    font-weight:bold; 
}
/*.sideMenu.left { display:none;width:355px;max-height:90%;margin-top:0px;padding-bottom:30px;overflow-x:auto;overflow-y:auto;top:3px;left:0px;right:auto;padding:0px 0px 0px 0px;border-width:1px 1px 4px 0px; border-style:solid; border-color:rgba(170,170,210,.5);background-color:white; }*/
.sideMenu.left {
    left: -1px;
    display:none;
    max-width:351px;
    max-height:98%;
    margin-top:0px;
    padding-bottom:1px;
    overflow-x:auto;
    overflow-y:auto;
    top:3px;
    
    padding:-1px 0px 0px 0px;
    border-width:1px 1px 4px 0px; 
    border-style:solid; 
    border-color:rgba(170,170,210,.5);
    background-color:white; 
}

.sideMenu.left::-webkit-scrollbar {
    width: 6px;
}
.sideMenu.left::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
}
.sideMenu.left::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.5);
}
.sideMenu.left #welcome { 
    border-width:0px 0px 1px 0px;
    border-style:solid;
    border-color:silver;
}
.sideMenu.left #welcome h2 { 
    margin:0px; 
    padding:3px 10px 5px 10px; 
    background-color:rgb(240,240,240);
}
.sideMenu.left #welcome{
    padding-top:0px;
    padding-left:0px;
    padding-right:0px;
    padding-bottom:3px;
}

#bigmaptitle {
    padding-left:10px;
    padding-right:10px;
    padding-top:7px;
    margin-top: 0px;
    margin-bottom:0px;
}
.sideMenu.left .closeButton { 
    cursor:pointer; 
}
.sideMenu.left #mapSettings .mapSettingsElm { 
    margin:15px; 
}
.sideMenu.left div.checkbox { 
    margin:5px 0px 5px 0px; 
    font-size:13px;
}			
.sideMenu.left div.checkbox label {  

}			
.sideMenu .tab-content { 
    background-color:white; 
    margin-bottom:2px; 
    height: auto;
    background-color: aliceblue;
}
.sideMenu .tab-content .tab-pane {
    min-height:175px;
    margin-bottom:5px;
}
.sideMenu .tab-content .tab-pane div,iframe {
    margin-bottom:5px;
}
div#mainfocus { 
    position:relative; 
}
div#map { 
    width:100%;
    height:100%;
    max-width:3000px;
    margin-left:auto;
    margin-right:auto;
    position:relative;
    background-color:white;
    padding-bottom:15px; 
}
/* upper-left corner */
div#map #main-search-ctrl {
    position:absolute; 
    top: 3px; 
    left:3px; 
    z-index:30;
    background-color:white;
    border:1px solid rgba(170,170,210,.5);
    height:86px;
    padding:5px;
    border-radius:1px; 
}
div#map .interactions {
    /*position:absolute;*/ 
    /*top: 4em;*/ 
    /*left:8px;*/ 
    /*z-index:29;*/ 
    /*margin-left:-3px;*/ 
    /*white-space:nowrap; */
}
div#map .interactions button { 
    /*background-color:white;*/ 
    /*border-color:rgb(150,150,150);*/ 
    /*    color:gray; */
    /*border-width:1px 1px 6px 1px;*/ 
}
div.ol-logo-only{
    display: none;
}


div#map .interactions button.active { 
    border-color: rgba(240,140,40,1); 
    color:black; 
}
div#map .interactions button span { 
    vertical-align: text-top; 
}
div#map .tool-box{ 
    float:left; 
}				
/* upper-right corner */
div#map .layer-info { 
    position:absolute; 
    top:52px;
    right:0px; 
    z-index:2; 
    font-size:3em; 
}
div#map .layer-info button { 
    border-radius: 27px 0px 0px 27px; 
    height:58px; 
    padding:4px 9px 4px 8px; 
    margin-right:-2px; 
}
div#map .layer-info button span { 
    font-size:40px; 
}
/* lower-left corner */
div#map .ol-overviewmap {
    position:fixed; 
    bottom:25px; 
    right:3px; 
    z-index:2;
    left:inherit; 
}
div#map .ol-overviewmap div.ol-overviewmap-map { 
    background-color:rgb(210,230,240); 
}
div#map .ol-overviewmap button { 
    bottom:3px; 
}
div#map div.ol-scale-line { 
    bottom:21px; 
    left:100%; 
    margin-left:-200px; 
    background-color:white; 
    padding:0px; 
    font-weight:bold; 
}
div#map div.ol-scale-line-inner { 
    border-color: silver; 
    color: black; 
    margin:0px; 
}
/* lower-right corner */
div#map .ol-zoom { 
    position:fixed; 
    left:inherit; 
    right:3px; 
    top:inherit; 
    bottom:55px;
} 
div#map .ol-zoom button { 
    font-size:2em; 
}
/* bottom of map */
div#map div#mapdetails { 
    position:absolute;
    
    max-width:100%;
    max-height: 99%;
    width:fit-content ;
    min-width:200px;
    min-height:200px;
    height:400px ;
    bottom:2px  ;
    left:2px;
    z-index:100000;
    border-width:1px 1px 1px 1px;
    border-style:solid;
    border-color: black;
    /*  background-color:rgb(240,255,240);*/
    background-color:aliceblue;
    display:none; 
}
div#map div#mapdetails button.source { 
    background-color:white; 
    border:1px solid gray; 
}
div#map div#mapdetails button.download { 
    background-color:white; 
    border:1px solid gray; 
}
div#map div#mapdetails .topTitle { 
    font-size:2em;
    background-color:silver;
    color:#337ab7;
    background-color: rgb(240,240,240);
    margin-top:0px;
    padding:7px;
    margin-bottom:0px;
    
/*    padding:5px;
    height:35px; */
}

div#map div#mapdetails .topTitle h2{ 
    margin-top:0px;
    margin-bottom: 0px;
/*    padding:5px;
    height:35px; */
}

div#mapdetails thead tr {
    background-color:white !important; 
}

div#map div#mapdetails div#mapinfo { 
    width:100%;
    height:100%;
    overflow:auto;
    padding:5px 10px 10px 15px;
    height: -moz-calc(100% - 45px);
    height: -webkit-calc(100% - 45px);
    height: calc(100% - 45px);
}
div#map div#mapdetails div#mapinfo table button { 
    margin-top:-3px; 
}
div#map #progress_circle { 
    position:absolute; 
    top:250px; 
    left:50%; 
    z-index:1000; 
    overflow:hidden; 
}

@-webkit-keyframes uil-default-anim { 0% { 
                                          opacity: 1
                                      } 100% {
                                          opacity: 0
                                      } 
}@keyframes uil-default-anim { 
    0% { 
        opacity: 1
    } 
    100% {
        opacity: 0
    } 
}

.uil-default-css > div:nth-of-type(1){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: -0.5s;
    animation-delay: 0.5s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(2){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: -0.4166666666666667s;
    animation-delay: 0.4166666666666667s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(3){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: -0.33333333333333337s;
    animation-delay: 0.33333333333333337s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(4){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: -0.25s;
    animation-delay: 0.25s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(5){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: -0.16666666666666669s;
    animation-delay: 0.16666666666666669s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(6){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: -0.08333333333333331s;
    animation-delay: 0.08333333333333331s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(7){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: 0s;
    animation-delay: 0s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(8){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: 0.08333333333333337s;
    animation-delay: 0.08333333333333337s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(9){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: 0.16666666666666663s;
    animation-delay: 0.16666666666666663s;
}
.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(10){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: 0.25s;
    animation-delay: 0.25s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(11){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: 0.33333333333333337s;
    animation-delay: 0.33333333333333337s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

.uil-default-css > div:nth-of-type(12){
    -webkit-animation: uil-default-anim 1s linear infinite;
    animation: uil-default-anim 1s linear infinite;
    -webkit-animation-delay: 0.41666666666666663s;
    animation-delay: 0.41666666666666663s;
}

.uil-default-css { 
    position: relative;
    background:none;
    width:200px;
    height:200px;
}

/* other */
div#map img#logo { 
    position:absolute;
    top:2px;
    right:2px;
    z-index:2;
    width:100px;
    height:115px;
    opacity:0.8;
    padding:5px 0px 10px 0px;
    background-color:rgba(252,255,255,0.2);
    border-radius:10px;  
    border:2px solid rgba(255,255,255,0.2);
}
div#map .ol-rotate-reset {
    display: none; 
}
.ol-control button {
    font-size:1.3em;
}
div#foot { 
    z-index:5; 
    border-top:1px solid silver;
    position:fixed;
    bottom:0px;
    right:0px;
    width:100%;
    height:1.8em;
    background-color:white; 
    padding:1px; 
}
div#foot div#tip { 
    position:absolute; 
    left:5px; 
    top:2px; 
    width:100%;
    font-size:0.9em; 
}
div#foot div#wkt { 
    position:absolute; 
    left:5px; 
    top:2px; 
    width:100%;
    font-size:0.9em; 
}
div#foot div#mouse-position { 
    position:absolute; 
    right:5px; 
    top:4px; 
    overflow-x:auto;
    font-size:0.8em; 
    background-color:white; 
}
div#foot div#mouse-position div { 
    float:left; 
}

div#foot div#mouse-position div.mouseticket { 
    margin-left:15px; 
}

.basketpop { 
    position:fixed; 
    bottom:20px; 
    left:50%; 
    padding:4px 10px; 
    background-color:rgb(255,180,60);
    color:white; 
    margin:1px; 
    border-radius:10px 10px 0px 0px;
}

input[type=search]::-webkit-search-cancel-button { 
    -webkit-appearance: searchfield-cancel-button; 
}	

.input-group-addon {
    border-left-width: 0;
    border-right-width: 0;
    background-color: transparent;
    border: 0px solid transparent;
    padding: 2px 2px;
}

.input-group {
    margin-bottom: 1px;
}

.input-group-addon:first-child {
    border-left-width: 1px;
}

.input-group-addon:last-child {
    border-right-width: 1px;
}

.form-control{
    padding: 6px;
    font-size: 12px;
}

.glyphicon-menu-hamburger:hover{
    background-color: #e6e6e6;

}

.glyphicon-sort:hover{
    background-color: #e6e6e6;
    cursor: grab;
}

.show-layer-details:hover{
    background-color: #e6e6e6;
}

.hide-layer-details:hover{
    background-color: #e6e6e6;

}

.show-layer-details{
    color: orange;
}

.hide-layer-details{
}

.tabpanel {
    border-color: #e6e6e6;
    border-bottom-width: 1px;
    border-left-width: 1px; 
    border-right-width: 1px;
    border-left-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    padding-bottom: 5px;
}

.glyphicon-cog{
    font-size: 15px;
}

.glyphicon-cog:hover{
    color: #c12e2a;
}

.ui-accordion-header-active{
    background-color: #337ab7;
    border-color: #337ab7;
}

.jstree-anchor {
    /*enable wrapping*/
    white-space : normal !important;
    /*ensure lower nodes move down*/
    height : auto !important;
    /*offset icon width*/
    padding-right : 24px;
}

.svg-layer-group{
    background-image: url(./../svg/layer-group.svg); 
    display: inline-block;
    width: 15px;;
    height: 15px;
    color: white;
}

.svg-layer{
    background-image: url(./../svg/layer.svg); 
    display: inline-block;
    width: 16px;;
    height: 16px;
}

.svg-layer-white{
    background-image: url(./../svg/layer-white.svg); 
    display: inline-block;
    width: 16px;;
    height: 16px;
    margin-right: 4px;
    vertical-align: bottom;
}

.groupname{
    font-size: 13px;
}

.layertitle{

    font-size: 12px;

}

.subgroup {
    background-color: rgba(91,132,185,.1) !important;
}



label {
    margin-bottom: 2px;
    margin-top: 5px;
    
}

.form-group label{
    font-size: 12px!important;
    font-weight: 700!important;
}

.subgrouptitle{
    font-size: 12px;

}

.subsubgroup{

}