.modal {
   -ms-overflow-style: -ms-autohiding-scrollbar
}

body,
html {
   margin: 0;
   padding: 0;
   font-size: 100% !important;
   overflow: hidden;
   height: 100%;
    width: 100%;
}

#maindiv {
   /* New to position maindiv right and thus searchfield at top of page */
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   margin: 0;
   /* new */

   padding: 0;
   font-size: 100%;
   width: 100%;
   height: 100%;
   /*max-width: 100%;
  max-height: 100%;*/
   /*overflow: visible*/
   overflow: hidden;
   /*New */
   display: inline-block;
   /*New */
}

#mapdiv {
   position: absolute;
   /*left: 0;*/
   right: 0;
   cursor: pointer; /* New to get pointer on map canvas which was somehow a hand when working with 2.0 */
   top: 0;
   width: 100%;
   height: 100%;
   /*New */
   overflow: hidden;
   /*z-index: 1000;*/
   /*New */
}

.alert {
   font-size: .8em
}

.map-alert {
   position: absolute;
   z-index: 1001;
   max-width: 80%;
   display: block;
   bottom: 0;
   right: 100px
}

.modal {
   /*z-index: 2000;*/
   z-index: 2002;
}

.modal-dialog {
   font-size: 1em
}

.leaflet-control-container .btn {
   padding: 12px 13px; /* 2023 switched from 18 to 16, image 20px padding 17, total 54 */
   max-width: 4.1em;
   min-width: 48px; /*3.1em; */
   -webkit-box-shadow: none;
   box-shadow: none
}

.leaflet-control-zoombar {
   transition: opacity 1.0s ease, max-height 1.0s ease;
}

.leaflet-marker-shadow {
   display: none;
}

@media (max-width:991px) {
   .leaflet-control-container .btn {
      padding: 12px 13px; /* 2023 switched from 18 to 16, image 20px padding 17, total 54 */
      
   }
}   

.mf-v4 .leaflet-top {
   top: 43px
}

.leaflet-bottom.leaflet-right .btn {
   max-width: 54px; /*3.5em;*/
   height: 45px; /* new 2023 */
   min-width: 100%
}

.leaflet-maplabel {
   color: rgb(255, 255, 255);
   white-space: nowrap;
   font-size: 1.0em;
   font-family: monospace;
   border-radius: 3px;
   letter-spacing: normal;
   line-height: 1;
   z-index: 900 !important;
   -webkit-transition: all ease .2s;
   transition: all ease .2s;
   text-shadow: 0px 0px 6px rgb(0, 0, 0);
   visibility: hidden;
   opacity: 0;
   padding: 7px 10px;
   margin-top: 0px;
}

.leaflet-maplabel .hidden-labelinfo {
   display: none
}

.leaflet-maplabel-hover,
.leaflet-maplabel:hover {
   text-shadow: none;
   background-color: rgba(0, 0, 0, .6);
   color: #fff;
   visibility: visible;
   margin-top: 10px;
   opacity: 1
}

/* New to only show dimensions on hover */
.leaflet-tooltip {
   background-color: white;
   border: 1px solid black;
   padding: 2px;
   font-size: 12px;
}


 .leaflet-maplabel-small {
   width: 4px;
   height: 4px;
   background-color: white;
   border-radius: 4px;
   content: none;
   align-content: center;
   content-visibility: hidden; /* No support in Safari */
   font-size: 8px;
   color: #eeeeee00; /* transparent needed to hide text in Safari */
   text-shadow: none; /* needed to hide in Safari */
   padding: 2px 2px;
   border: none;
   opacity: 0.9;
   margin-top: -2px;
   margin-left: -2px;
   visibility: visible;
   position: fixed;
   display: flow;
} 

/* 2024 Hide label point "markers" in layout mode */
.hiddenSizeMarker {
   opacity: 0;
   max-height: 0;
}
.leaflet-maplabel-small .hiddenSizeMarker {
   display: none;
}
.hiddenSizeMarker:hover {
   pointer-events: none;
}

.leaflet-maplabel-small:hover {
   font-size: 14px;
   color: #fcfcfc;
   background: 0 0;
   width: auto;
   height: auto;
   padding: 3px 5px 3px 15px;
   border: none;
   opacity: 1;
   margin-top: 0;
   visibility: visible;
   content-visibility: visible;
   z-index: 800 !important;
   position: fixed;
   display: flow;
   top: -7px; /* make label center */
   text-shadow: none;
   background-color: rgba(0, 0, 0, .6);
   color: #fff;
}


.leaflet-top.leaflet-left.with-search-bar {
   top: 6.5em
}

.leaflet-top.leaflet-right {
   margin-right: 10px;
   margin-top: 6px;
   /* border: 1px solid #ccc; removed 2023 */
}

.leaflet-top.leaflet-right .leaflet-control {
   clear: none !important;
   margin: 0 !important;
}

.leaflet-top.leaflet-right .leaflet-control .btn-group,
.leaflet-top.leaflet-right .leaflet-control button {
   display: block;
   /* border: none; */
   /* border: 1px solid rgb(182, 182, 182)!important; */
   border-radius: 3;
   max-width: none;
   max-height: none;
   width: 48px;
   height: 45px
}

.leaflet-right .leaflet-control {
   margin-right: 10px
}

/* Knapparna övre högra hörnet JL */
.leaflet-right .leaflet-control button {
   border-radius: 3;/* 2023 !important;*/
   opacity: 1.0;
}

.unselectable {
   -webkit-user-select: none;
   /*-moz-user-select: none;2024-05-08*/
   user-select: none;
   -ms-user-select: none;
   user-select: none
}

.modal-dialog .modal-header .close {
   font-size: 2em;
   margin-top: -3px
}

.core-select-modal .modal-dialog {
   max-width: 400px
}

.core-select-modal .modal-content {
   background-color: rgba(255, 255, 255, .8)
}

.core-select-modal .modal-content .modal-header {
   background-color: #fff
}

.core-select-modal .modal-body {
   padding: 0
}

.core-select-modal .modal-body .list-group {
   margin: 0
}

.core-select-modal .modal-body .list-group .list-group-item {
   border-radius: 0;
   background: 0 0;
   display: table;
   padding: 0
}

.core-select-modal .modal-body .list-group .list-group-item span {
   overflow: hidden;
   display: table-cell;
   width: 72%;
   vertical-align: middle;
   padding: 4%
}

.core-select-modal .modal-body .list-group .list-group-item span button {
   display: none
}

.core-select-modal .modal-body .list-group .list-group-item .select-btn-zoom-to-feature {
   width: 16%;
   display: table-cell;
   border: none;
   border-left: 1px solid #c3c3c3;
   height: 100%;
   padding: 0 20px;
   border-radius: 0;
   background-color: rgba(92, 184, 92, .7) !important;
   visibility: hidden
}

.core-select-modal .modal-body .list-group .list-group-item .select-btn-zoom-to-feature:hover {
   color: #fff;
   background: 0 0;
   background-color: #5cb85c !important;
   height: 100% !important;
   padding-top: 0;
   padding-bottom: 0
}

.core-select-modal .modal-body .list-group .list-group-item:hover {
   background-color: rgba(255, 255, 255, .2)
}

.core-select-modal .modal-body .list-group .list-group-item:hover .select-btn-zoom-to-feature {
   visibility: visible !important
}

.core-select-modal .modal-body .list-group .list-group-item:first-child {
   border-top: none
}

.core-select-modal .modal-body .list-group .list-group-item:last-child {
   border-bottom: none
}

.core-select-modal .modal-body .list-group .select-row-touch .select-btn-zoom-to-feature {
   visibility: visible !important
}

.core-select-modal .modal-footer {
   margin: 0
}

.loader {
   position: relative;
   z-index: 2000;
   color: #444;
   display: table;
   text-align: center;
   left: calc(50% - 154px);
   top: calc(50% - 154px);
   font-size: 110%
}

.loader span {
   display: table-cell;
   vertical-align: middle;
   font-size: 4em;
   -webkit-animation: spin 3s infinite linear;
   animation: spin 3s infinite linear
}

.loader label {
   display: table-cell;
   vertical-align: middle;
   padding-left: .2em;
   font-size: 2em;
   font-weight: 400
}

#loadingText {
   height: 5em;
   width: 5em;
   line-height: 5em;
   left: -2.5em;
   top: -2.5em;
   position: absolute;
   border-radius: 100%;
   text-align: center;
   font-weight: 700
}

.popup-divider {
   border-top: 1px dotted #aaa;
   margin: 1.5em 0;
   width: calc(100% + 40px);
   left: -20px;
   position: relative
}

.esri-attribution-logo {
   display: none
}

.img-load-indicator {
   display: block;
   position: relative;
   height: 200px
}

.img-load-indicator i {
   font-size: 4em;
   display: block;
   position: absolute;
   bottom: 30%;
   /* vertical-align: middle; */
   -webkit-animation-name: circulate;
   animation-name: circulate;
   -webkit-animation-duration: 1s;
   animation-duration: 1s;
   -webkit-animation-iteration-count: infinite;
   animation-iteration-count: infinite;
   -webkit-animation-timing-function: linear;
   animation-timing-function: linear
}

.img-smooth-loading {
   opacity: 0
}

.img-fade-in {
   -webkit-transition: all .5s;
   transition: all .5s;
   opacity: 1
}

.notify-transition {
   opacity: 0;
   -webkit-transition: all .3s;
   transition: all .3s;
   margin-bottom: -10%
}

.notify-visible {
   opacity: 1;
   margin-bottom: 0
}

.alert-blank {
   background: 0 0;
   background: rgba(0, 0, 0, .6);
   color: #fff;
   text-shadow: none;
}

.alert-blank .close {
   color: #fff;
   opacity: 1
}

.leaflet-popup-option {
   position: relative;
   margin: 0;
   padding: 1em;
   opacity: 1
}

.leaflet-popup-option-short {
   cursor: pointer;
   min-width: 200px
}

.leaflet-popup-option-short * {
   -webkit-transition: opacity 1s;
   transition: opacity 1s;
   opacity: 0;
   display: none
}

.leaflet-popup-option-short .popup-layertitle {
   opacity: 1;
   display: block
}

.leaflet-popup-option-short:hover {
   background-color: #eee;
   background-color: rgba(220, 220, 220, .5)
}

.leaflet-popup-content-wrapper-multichoice {
   background: #fff;
   background: rgba(255, 255, 255, .9)
}

.leaflet-popup-content-wrapper-multichoice .leaflet-popup-content {
   overflow-y: auto;
   max-height: 40em;
   overflow-x: hidden
}

.leaflet-popup-content-wrapper-multichoice .popup-divider {
   width: 100%;
   margin: 0;
   left: 0
}

.leaflet-container {
   font: 1em OpenSans, "Droid Sans", Verdana, "DejaVu Sans", "Bitstream Vera Sans", sans-serif
}

.leaflet-container a.leaflet-popup-close-button {
   z-index: 100
}

.leaflet-container a.leaflet-popup-minimize-button {
   right: 20px
}

@media (max-width:991px) {
   .leaflet-right .leaflet-control {
       margin-right: 5px
   }
}

@-webkit-keyframes spin {
   0% {
       -webkit-transform: rotate(0deg);
       transform: rotate(0deg)
   }

   100% {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg)
   }
}

@keyframes spin {
   0% {
       -webkit-transform: rotate(0deg);
       transform: rotate(0deg)
   }

   100% {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg)
   }
}

@-webkit-keyframes circulate {
   from {
       -webkit-transform: rotate(0);
       transform: rotate(0)
   }

   to {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg)
   }
}

@keyframes circulate {
   from {
       -webkit-transform: rotate(0);
       transform: rotate(0)
   }

   to {
       -webkit-transform: rotate(360deg);
       transform: rotate(360deg)
   }
}

.leaflet-bottom,
.leaflet-top {
   z-index: 900
}

.navbar {
   margin-bottom: 800px
}

.leaflet-popup-content {
   word-wrap: break-word
}

.leaflet-bar {
   -webkit-box-shadow: none;
   box-shadow: none;
   border: 1px solid #ccc;
   border-radius: 0
}

.leaflet-bar a,
.leaflet-bar a:last-child {
   border-radius: 0
}

.leaflet-control-container .smap-editor-savetoolbar {
   z-index: 1002;
   top: -2px;
   left: 14px;
   pointer-events: all;
   white-space: nowrap;
   min-width: 25em
}

.leaflet-control-container .smap-editor-savetoolbar button {
   max-width: none
}

.leaflet-edit-marker-selected {
   width: 33px !important;
   height: 49px !important
}

.editor-popup-edit button {
   min-width: 8em
}

.smap-editor-btnadd {
   z-index: 2000;
   top: 4px;
   left: 4px;
   position: relative;
   cursor: pointer;
   pointer-events: all;
   padding: .5em .7em .4em .8em;
   margin: 0
}

.smap-editor-btnadd i {
   font-size: 1.5em
}

.smap-editor-switcher-icon {
   display: inline;
   position: relative;
   right: 0;
   bottom: 0;
   color: #000;
   cursor: pointer;
   font-size: 1.5em;
   float: right
}

.smap-editor-switcher-icon:hover {
   color: #d43f3a
}

.list-group-item.list-group-item-danger {
   background-color: #d9534f !important;
   border-color: #d43f3a !important;
   color: #fff !important
}

.list-group-item.list-group-item-danger .smap-editor-switcher-icon {
   color: #fff
}

.leaflet-control-Geolocate .btn {
   outline: 0
}

.leaflet-control-Geolocate {
   transition: opacity 1.0s ease, max-width 1.0s ease;
}

.gp-popup img {
   max-width: 100%;
   margin: 10px 0
}

.gp-popup .tab-pane {
   padding-top: .5em
}

.gp-popup table td {
   vertical-align: top;
   padding-top: .7em
}

#gp-btn-show {
   display: block
}

#gp-listmoreinfo {
   margin-top: 10px
}

.gp-fullscreen {
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   z-index: 2000;
   background-color: #000;
   text-align: center;
   opacity: 0;
   -webkit-transition: opacity .5s;
   transition: opacity .5s;
   padding-top: 53px;
   overflow-y: auto
}

.gp-fullscreen h1 {
   color: #fff;
   margin-top: -20px
}

.gp-fullscreen .gp-mediapic {
   display: block;
   margin: 2em 0
}

.gp-fullscreen .carousel {
   max-height: calc(100% - 50px)
}

.gp-fs-visible {
   opacity: 1;
   -webkit-transition: opacity .5s;
   transition: opacity .5s
}

.gp-fullscreen img {
   max-width: 100%;
   max-height: 82%;
   display: inline !important
}

.gp-fullscreen .btn-default {
   position: absolute;
   top: 10px;
   right: 10px;
   color: #fff;
   opacity: 1;
   border: 1px solid #fff;
   background: 0 0;
   border-radius: 0
}

.gp-fullscreen .btn-default:hover {
   background: #fff;
   color: #000
}

#gp-intro img,
.gp-mediaicons {
   cursor: pointer
}

.popover.smap-helper-popover {
   z-index: 10000;
   background-color: #000;
   color: #fff
}

.popover.smap-helper-popover.top .arrow:after {
   border-top-color: #000
}

.smap-helper-stepcont {
   position: absolute;
   z-index: 2001;
   -webkit-transition: all 1s;
   transition: all 1s;
   font-size: 2em;
   max-width: 9em;
   padding-left: 1em
}

.smap-helper-stepcont * {
   color: #fff
}

.smap-helper-stepcont .smap-helper-steptitle {
   font-size: 1em;
   word-wrap: break-word
}

.smap-helper-stepcont .smap-helper-stepdescription {
   font-size: .5em;
   margin-top: .5em
}

.smap-helper-bgcanvas {
   position: absolute;
   z-index: 2000;
   left: 0;
   top: 0;
   -webkit-transition: all .3s;
   transition: all .3s;
   opacity: 0
}

.smap-helper-btnclose {
   position: absolute;
   right: 30px;
   top: 10px;
   font-size: 3em;
   z-index: 3000;
   cursor: pointer;
   color: #fff;
   opacity: .8;
   -webkit-transition: opacity .3s;
   transition: opacity .3s
}

.smap-helper-btnclose:hover {
   opacity: 1
}

.smap-helper-fadein {
   opacity: 1 !important;
   -webkit-transition: opacity .2s;
   transition: opacity .2s
}

.smap-helper-button-group.smap-helper-clicktip {
   position: absolute;
   font-size: 2em;
   display: block;
   width: 100%;
   text-align: center;
   bottom: 1em
}

.smap-helper-button-group {
   position: relative;
   z-index: 2002;
   font-size: .7em;
   white-space: nowrap;
   opacity: 0;
   margin-top: .5em;
   text-align: left;
   display: block
}

.smap-helper-button {
   cursor: pointer;
   display: inline-block;
   white-space: nowrap;
   margin: 0 .5em
}

.smap-helper-button * {
   color: #e76a54
}

.smap-helper-button span {
   display: inline-block;
   font-size: 1.1em
}

.smap-helper-button i {
   display: inline-block;
   margin: 0 8px;
   -webkit-transition: all .3s;
   transition: all .3s
}

.smap-helper-button:first-child,
.smap-helper-button:first-child i,
.smap-helper-button:first-child span,
.smap-helper-button:first-of-type {
   margin-left: 0
}

.smap-helper-button.smap-helper-button-icon-effect:first-child:hover i {
   -webkit-transform: translateX(-2px);
   -ms-transform: translateX(-2px);
   transform: translateX(-2px)
}

.smap-helper-button.smap-helper-button-icon-effect:nth-child(2):hover i {
   -webkit-transform: translateX(2px);
   -ms-transform: translateX(2px);
   transform: translateX(2px)
}

.smap-helper-button-border {
   border: 1px solid #fff;
   padding: .2em .5em
}

@media (max-width:991px) {
   .smap-helper-btnclose {
       opacity: 1;
       top: 0;
       right: 10px
   }

   .smap-helper-button-group.smap-helper-clicktip {
       background-color: #000;
       bottom: 0
   }
}

#lswitch-btn {
   font-size: .7em;
   z-index: 1001;
   position: absolute;
   left: 0;
   bottom: 80px;
   padding: 7px 3px 5px 0;
   border: 1px solid #999;
   border-width: 1px 1px 1px 0;
   background-color: #fff;
   background-color: rgba(255, 255, 255, .8);
   cursor: pointer;
   border-radius: 0 .4em .4em 0
}

#lswitch-btn span {
   margin-left: 1px
}

.lswitch-btnhide.btn {
   display: table-cell;
   right: 0;
   vertical-align: middle;
   position: relative;
   top: 0;
   float: left; /* left för att placera vänster */
   /* margin-left: -7px; */ /* för att placera vänster */
   margin-top: -.4em;
   outline: 0;
   width: 44px; /* ny 2023 */
   height: 34px; /* ny 2023 */ 
}

.lswitch-btnhide.btn i {
   -webkit-transition: all .2s;
   transition: all .2s
}

.lswitch-btnhide.btn:focus {
   outline: 0
}

.rotate-90 {
   -webkit-transform: rotate(90deg);
   -ms-transform: rotate(90deg);
   transform: rotate(90deg)
}

.mapdiv-slidetransition {
   -webkit-transition: all .2s ease !important;
   transition: all .2s ease !important
}

.lswitch-panel .panel {
   
   -webkit-box-shadow: none;
   box-shadow: none;
   -webkit-transition: opacity .2s;
   transition: opacity .2s;
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
}

.lswitch-panelslide {
   -webkit-transition: margin-left 200ms ease;
   transition: margin-left 200ms ease
}

#overlays_label_id.panel-heading {
   border-top-left-radius: 5px;
   border-top-right-radius: 5px;
}


.lswitch-panel {
   
   z-index: -1; 
   position: absolute;
   left: 0;
   top: 0;
   width: auto; /* Tidigare 70% men auto snyggare och tar bort artefakt som uppstod där menyradsbakgrund kvarstod längst upp i kollapsat läge 2.0 */
   background-color: #38454e;
   height: auto;
   min-width: 55px; /* Ny 2.0 Vill ha värdet 250 men får sätta 55 så länge för att lagerpanelen spökar på hela bredden som anges och då funkar inte pekskärm */
   max-width: 320px;
   padding: 6px 1px 0 10px;
   overflow-x: hidden; /* Ny för att ta bort scrolllist x-axel JL */
   overflow-y: auto;
   -ms-overflow-style: -ms-autohiding-scrollbar !important;
   font-size: .9em; 
   /*display: block !important; /* !important removed to replace collapsed panel with independent div 2024 */
   
}

/*New
.panel-heading {
   border-bottom-left-radius: 0 !important;
   border-bottom-right-radius: 0 !important;
} */

.lswitch-panel .panel-heading {
   border-radius: 0;
   border: none;
   /*border: 1px solid #ccc; 2022-10 tagit bort för blicons ska bli rätt */
   border-width: 1px 1px 0;
   margin-left: -1px;
   margin-right: -1px;
   /* margin-bottom: 2px; 2022-10 tagit bort för att blicons ska bli rätt */
   /* background-color: #fff; */
   /*padding: .75em 1em;*/
   font-size: 1.1em;
   letter-spacing: 0.5px; /* Also in collapsed panel title */
}

.lswitch-cat {
   text-shadow: none !important;
   background-image: none !important;
   white-space: nowrap
}

.lswitch-cat span {
   margin-left: .7em;
   white-space: nowrap
}

@media (max-width:991px) {
   .lswitch-cat span {
      margin-left: .5em;
   }
}

.lswitch-cat.open i {
   -webkit-transform: rotate(90deg);
   -ms-transform: rotate(90deg);
   transform: rotate(90deg)
}

.lswitch-catcont {
   height: 0;
   overflow: hidden;
   overflow-x: visible;
   border: none;
   opacity: 0;
   border-color: #fff;
   border-color: rgba(255, 255, 255, 0)
}

.lswitch-catcont a:first-child {
   margin-top: 2px
}

.lswitch-catcont.lswitch-catcont-visible {
   height: auto;
   opacity: 1;
   background-color: none;
   overflow: visible;
   -webkit-box-shadow: rgba(0, 0, 0, .5) 0 2px 6px inset;
   box-shadow: rgba(0, 0, 0, .5) 0 2px 6px inset
}

.lswitch-catcont.lswitch-catcont-visible .lswitch-cat {
   /* tidigare 2.3 */
   padding-left: 2.0em 
}

@media (max-width:991px) {
   .lswitch-catcont.lswitch-catcont-visible .lswitch-cat {
      padding-left: 1.7em 
   }
}

.lswitch-catcont.lswitch-catcont-visible .lswitch-catcont .lswitch-cat {
   padding-left: 3.5em
}

.lswitch-catcont.lswitch-catcont-visible .lswitch-catcont .lswitch-catcont.lswitch-catcont-visible a {
   padding-left: 3.5em
}

.lswitch-catcont.lswitch-catcont-visible .lswitch-catcont a {
   /* tidigare 3.3 */
   padding-left: 2.5em 
}

@media (max-width:991px) {
   .lswitch-catcont.lswitch-catcont-visible .lswitch-catcont a {
      padding-left: 1.5em 
   }
   .lswitch-catcont.lswitch-catcont-visible .lswitch-catcont .lswitch-cat {
      padding-left: 2.5em
   }
   .lswitch-catcont.lswitch-catcont-visible .lswitch-catcont .lswitch-catcont.lswitch-catcont-visible a {
      padding-left: 2.5em
   }
}

.lswitch-catcont a {
   border-radius: 0 !important;
   letter-spacing: -1px;
   white-space: inherit
}

.lswitch-catcont.lswitch-catcont-visible a {
   /* tidigare 2.5*/
   padding-left: 1.5em; 
   -webkit-transition: padding-left .2s;
   transition: padding-left .2s
}

.lswitch-legend {
   width: 20px;
   height: 20px;
   margin-right: .2em;
   /* 2.0 */
   margin-left: .2em
}

.lswitch-legend-big {
   display: block;
   max-width: 300px;
   min-width: 50px;
   max-height: 300px;
   min-height: 50px;
   position: absolute;
   /* Right and top controlled in smap.js */
   z-index: 2000;
   border: 1px solid #aaa
}

.lswitch-cat,
.lswitch-panel a {
   cursor: pointer;
   background: 0 0;
   border: none;
   margin-top: 1px;
   letter-spacing: -1px
}

.lswitch-cat {
   margin-top: 1px
}

.lswitch-cat.active {
   font-weight: 700
}

.lswitch-panel a.active {
   cursor: pointer
}

.lswitch-panel .panel-default {
   border: none;
   background-color: #38454e
}

.lswitch-panel .list-group {
   -webkit-transition: opacity .2s;
   transition: opacity .2s
}

.lswitch-overflow-hidden {
   overflow: hidden !important
}

.panel-with-toolbar {
   padding-top: 5em
}

.lswitch-btndialog {
   font-size: 1.4em;
   vertical-align: middle;
   margin-right: .2em
}

.lswitch-dialog {
   overflow-y: scroll
}

.lswitch-dialog .modal-body-container {
   right: 0;
   bottom: 0;
   left: 0;
   top: 0;
   position: absolute;
   -webkit-overflow-scrolling: touch
}

@media (max-width:991px) {

   .lswitch-cat {
       color: #fff
   }

   .lswitch-panel {
       position: absolute !important;
       background-color: #71ABD8; 
       height: auto; /*100% */
       padding-left: 5px;
       /* New JL från Kri */
       max-height: 100% !important;
       z-index: 900 !important; /* Innan var det 2000 men bredare skärm var 900 och välkomstruta hamnade bakom 2000 */
       /*display: none;*/
   }

   /* Kartlager, Bakgrundslager panelrubrik */
   .lswitch-panel .panel-default>.panel-heading {
       border: none !important;
       /* background: 0 0 !important; */
       background-color: #5497ce; 
       /* New JL från Kri */
       opacity: 1;
       /* margin: -1px -3px -1px -1px; tagit bort för att blicons blev för snäva */ 
       padding-right: 0;
       

   }

   .lswitch-catcont a {
       border: none !important
   }

   .lswitch-panel a {
       color: #fff;
       background: 0 0
   }

   .lswitch-panel a.active,
   .lswitch-panel a.active:active,
   .lswitch-panel a.active:hover {
       /* background: #000 !important; */
       /* 2.0 */
       background-color: rgb(200, 200, 200);
       color: rgb(212, 96, 29);
       border: none
   }

   /*
   a.list-group-item.active,
   a.list-group-item.active:focus,
   a.list-group-item.active:hover {
       background: #000 !important; 2.0 
       color: #fff
   } */

   

   /* Utseende på huvudpanel kartlager mindre skärm */
   .lswitch-panel .panel-default>.panel-heading {
       -webkit-filter: none !important;
       filter: none !important;
       color: #fff;
       outline: 0;
       font-weight: 700;
       font-size: 1.3em; /* 1.1 */
       /*padding: .75em 1em;*/
       padding-right: 0.75em;
      letter-spacing: 0;
   }
}

/*@media (min-width:992px) {

   .lswitch-displaynone .list-group,
   .lswitch-displaynone .panel:nth-child(2) {
       display: none
   }*/

   /* 2.0  */
   .lswitch-panel.lswitch-hidden .panel-heading {
       border-width: 0px;
       background-color: transparent; /*testing title visible when collapsed here /*
       /*overflow: hidden*/
   }

   .lswitch-panel.lswitch-hidden .panel-heading:nth-child(1) span {
       -webkit-animation-name: slipout;
       animation-name: slipout;
       -webkit-animation-duration: .4s;
       animation-duration: .4s
   }

   .lswitch-panel.lswitch-hidden .list-group,
   .lswitch-panel.lswitch-hidden .panel:nth-child(2) {
       opacity: 0;
       /* New JL from Kri */
       display: none !important;
   }

   .slipout-anim {
       -webkit-animation-name: slipout;
       animation-name: slipout;
       -webkit-animation-duration: .6s;
       animation-duration: .6s
   }

   a.list-group-item {
       color: #000;
       /*New*/
    /* padding: 0 !important; This overrides min list-group-item padding */
    max-width: 100%;
    /*New*/
   }

   a.list-group-item.active,
   a.list-group-item.active:focus,
   a.list-group-item.active:hover {
       z-index: 2;
       background-color: #fff;
       color: #000;
       /*font-weight: 700;*/
       border-color: #ccc !important
   }

   .lswitch-panel a.active,
   .lswitch-panel a.active:active,
   .lswitch-panel a.active:hover {
       -webkit-filter: none !important;
       filter: none !important;
       background-image: none !important;
       text-shadow: none !important;
       color: #000
   }

   .lswitch-catcont.lswitch-catcont-visible a {
       border: 1px solid #ccc;
       border-width: 0 1px !important
   }

   /*.lswitch-cat:hover {
       background-color: #fafafa
   }*/

   .lswitch-cat.open,
   .lswitch-cat.open:hover {
       background: #fff;
       -webkit-filter: none;
       filter: none;
       color: #000
   }

   .list-group-item.lswitch-cat.active,
   .list-group-item.lswitch-cat.active:focus,
   .list-group-item.lswitch-cat.active:hover,
   .list-group-item.lswitch-cat.open.active,
   .list-group-item.lswitch-cat.open.active:focus,
   .list-group-item.lswitch-cat.open.active:hover {
       /*background: #fff;*/
       -webkit-filter: none !important;
       filter: none !important
   }

   .lswitch-cat {
       background: #fff;
       color: #000;
       outline: #ccc solid 1px;
       letter-spacing: -0.5px
   }

   .leaflet-left {
       left: auto; /*325px */
   }

   .lswitch-catcont {
       -webkit-transition: none;
       transition: none
   }

   .lswitch-cat i {
       -webkit-transition: -webkit-transform .2s, color .1s;
       transition: transform .2s, color .1s;
       font-size: 1em
   }

   .lswitch-cat i:hover {
       color: #fffd83
   }

   #mapdiv {
       margin-left: 0 !important
   }

   #lswitch-btn {
       display: none !important
   }

   .lswitch-panel {
       -webkit-box-shadow: none;
       box-shadow: none;
       /* -webkit-transition: all 100ms;
      -webkit-transition-delay: 0;
       transition: all 100ms;
       transition-delay: 0; */
       transition: opacity 0.5s ease, max-height 0.5s ease;
      opacity: 1;
      overflow: hidden; /* Hide overflowing content during transition */
       display: block; /*!important;*/
       background-color: none;
       -webkit-filter: none !important;
       filter: none !important;
       background-color: rgba(255, 255, 255, 0);
       z-index: 900;
       max-height: 100%;
       position: absolute !important;
   }

   /* New for 2024 hidden panel transition, display: none set with timer in js to after transition */
   .hiddenItem {
         opacity: 0;
         max-height: 0;
         /*max-width: 0;*/
   }

   .lswitch-panel a {
       border-color: #fff;
       background-color: rgba(255, 255, 255, 1.0)
   }

   /*.lswitch-panel a.active:active,*/
   .lswitch-panel a.active:hover,
   .lswitch-panel a:active,
   .lswitch-panel a:hover {
       background-color: rgb(255, 255, 255)
   }

   .lswitch-panel .panel-default {
       border: none;
       background: 0 0;
       -webkit-filter: none !important;
       filter: none !important
   }

   #lswitch-blcont,
   #lswitch-olcont {
       background-color: none;
       margin-top: -1px;
       /* following to widen panel in Safari so layer names fit with buttons */
       /*min-width: 255px;*/
   }

   
   .collapsed-panel {
      z-index: 899;
      background-color: #4c91ca; /* #3a88d5; */
      position: absolute;
      top: 8px;
      left: 10px;
      /*padding: 0px;*/
      height: 40px;
      border: 1px solid #ccc; /* Light border */
      border-radius: 5px; /* Rounded corners */
      display: flex;
      align-items: center; /* Vertically center the items */
      display: none;
      transition: opacity 0.5s ease, max-height 0.5s ease;
   }

   #showPanelButton, #showPanelButton:focus {
      background-color: transparent; /* Transparent background by default */
      background-image: url(img/Logga2023k-s.png);
      /*background-image: url(img/fa-chevron-down.png);*/
      background-repeat: no-repeat;
      background-size: 30px 30px;
      background-position: center;
      border: none;
      display: table-cell;
      right: 0;
      vertical-align: middle;
      position: relative;
      top: 0;
      float: left;
      /* margin-left: -7px; */
      margin-top: 3px;
      outline: 0;
      width: 40px;
      height: 30px;
      margin-left: 5px;
      margin-right: 5px;
      color: #000; /* Set icon color to black or any color you prefer */
      cursor: pointer; /* Change cursor to pointer on hover */
      border-radius: 3px; /* Rounded corners */
      transition: background-color 0.3s ease; /* Smooth transition for hover effect */
      user-select: none;
  }
  
  #showPanelButton:hover {
      background-color: white; /* White background on hover */
      /*background-image: url(img/fa-chevron-down.png);*/
  }
  
  .collapsed-panel:hover #showPanelButton{
      background-image: url(img/chevron-down2.png);
   }

  .collapsed-panel #collapsedTitle {
      display: inline-block;
      margin-top: 7px;
      color: #fff;
      outline: 0;
      font-weight: 700;
      font-size: 20px;
      padding-right: 15px;
      font-variant-caps: all-small-caps;
      line-height: 20px;
      font-family: sans-serif;
      max-width: 140px;
      letter-spacing: 0.5px; /* Also in lswitch-panel heading */
  }

  @media (max-width:991px) {

   .collapsed-panel {
      height: 46px;
      width: 48px;
      top: 5px;
      left: 5px;
   }
   #showPanelButton, #showPanelButton:hover {
      background-color: transparent;
      margin-top: 6px;
      margin-left: 3px;
  }
   .collapsed-panel #collapsedTitle {
      opacity: 0;
      padding-right: 15px;
      max-width: 40px;
  }
  

   }


   #lswitch-blcont a:last-child,
   #lswitch-olcont a:last-child {
       border-radius: 0 0 .4em .4em
   }


@-webkit-keyframes slipout {
   0% {
       margin-left: 0
   }

   50% {
       margin-left: -100%
   }

   100% {
       margin-left: 0
   }
}

@keyframes slipout {
   0% {
       margin-left: 0
   }

   50% {
       margin-left: -100%
   }

   100% {
       margin-left: 0
   }
}

.overflow-y {
   overflow-x: auto !important;
   -ms-overflow-style: -ms-autohiding-scrollbar !important
}

/* Här fanns .gintro definitioner */

#malmo-masthead {
   z-index: 1999
}

#malmo-masthead .dropdown-menu {
   overflow-y: auto !important
}

/*
#smap-search-div.malmoheader-offset-top,
.leaflet-top.leaflet-right.malmoheader-offset-top,
.thandler-btn.malmoheader-offset-top {
   top: 0px;
   margin-top: 0
}
*/

.map-with-header .lswitch-panel {
   padding-top: 48px
}

#smap-search-div .dropdown-menu li {
   font-size: 14px
}

.dropdown-menu.active:hover {
   background-color: white;
}

.leaflet-control-measuredraw .dropdown-menu {
   overflow: hidden;
   left: auto;
   right: -41px;
   top: 44px;
   min-width: 18em !important
}

.leaflet-control-measuredraw .dropdown-menu li {
   min-width: 14em
}

.leaflet-control-measuredraw .dropdown-menu li a {
   line-height: 2.0 !important;
   cursor: pointer
}

.leaflet-control-measuredraw .dropdown-menu li a span {
   display: table-cell;
   vertical-align: middle
}

.leaflet-control-measuredraw .dropdown-menu li a span:first-child {
   top: 3px
}

.leaflet-control-measuredraw .dropdown-menu li a .drawicons {
   width: 30px;
   height: 20px;
   margin-right: .2em
}

/* New for share dropdown menu, same appearance as measuredraw */
.leaflet-control-sharelink .dropdown-menu {
   overflow: hidden;
   left: auto;
   right: 0;
   top: 44px;
   min-width: 18em !important;
}

.leaflet-control-sharelink .dropdown-menu li {
   min-width: 14em;
}

.leaflet-control-sharelink .dropdown-menu li a {
   line-height: 2.5 !important;
   cursor: pointer;
}

.leaflet-control-sharelink .dropdown-menu li a span {
   display: table-cell;
   vertical-align: middle;
}

.leaflet-control-sharelink .dropdown-menu li a span:first-child {
   top: 3px;
}

.leaflet-control-sharelink .dropdown-menu li a .drawicons {
   width: 30px;
   height: 20px;
   margin-right: .2em;
}

.dropdown-menu-measure-comment {
   text-align: center;
   font-size: smaller;
   margin-top: 7px;
   margin-left: 20px;
   margin-right: 20px;
}

.thandler-popover .measuredraw-btntoggle-image {
   width: 30px;
   height: 20px;
   margin-right: .2em;
   left: -7px;
   top: -4px
}

.drawicons {
   background-image: url(lib/leaflet.draw/dist/images/spritesheet-2x.png);
   -webkit-background-size: 270px 30px;
   background-size: 270px 30px;
   display: block;
   text-align: center;
   /*position: relative; removed when shortening line height to 2.0 */
   background-repeat: no-repeat;
   width: 100%;
   height: 100%;
}

/* alternative for crosshairs marker, no background */
.drawicons-alt {
   background-size: 35px 30px;
   display: block;
   background-repeat: no-repeat;
   width: 30px;
   height: 30px;
}

.drawicons.leaflet-draw-draw-target {
   background-image: url('img/crosshairs.png');
    background-size: contain;
    width: 18px;
    height: 18px;
    display: inline-block;
}
.drawicons.leaflet-draw-draw-polyline {
   background-position: -2px -2px
}

.drawicons.leaflet-draw-draw-polygon {
   background-position: -31px -2px
}

.drawicons.leaflet-draw-draw-rectangle {
   background-position: -62px -2px
}

.drawicons.leaflet-draw-draw-circle {
   background-position: -92px -2px
}

.drawicons.leaflet-draw-draw-marker {
   background-position: -122px -3px
}

.dropdown-toggle .drawicons.leaflet-draw-draw-marker {
   background-position: -125px -5px
}

.drawicons.leaflet-draw-edit-edit {
   background-position: -152px -2px
}

.drawicons.leaflet-draw-edit-remove {
   background-position: -182px -2px
}

/* override popup, disables EVERY popup so don't use this */
/* .leaflet-popup-content-wrapper, .leaflet-popup-tip, .leaflet-popup-close-button, .leaflet-popup-minimize-button {
   display: none;
} */

.measuredraw-popup-div-save textarea {
   min-width: 15em;
   /*min-height: 8em; 2024-06 switch from text to title = less space */
   border: none !important;
   -webkit-box-shadow: none !important;
   box-shadow: none !important;
   resize: none
}

.measuredraw-popup-div-save textarea:focus {
   border: inherit;
   -webkit-box-shadow: inherit;
   box-shadow: inherit
}

#smap-mmp-btn {
   position: absolute;
   left: calc(50% - 6em);
   bottom: 2em
}

.mmpmarker {
   font-size: 18px !important;
   margin-top: 9px !important
}

#smap-menu-div {
   z-index: 1001;
   background-color: #58708f;
   color: #fff;
   padding-left: 0
}

#smap-menu-div .container {
   padding-left: 0;
   margin-left: 2em
}

#smap-menu-div a {
   color: #fff
}

@media (min-width:992px) {
   #smap-menu-div {
       left: 0
   }
}

@media (min-width:768px) {
   #submitDiv {
       position: absolute;
       right: 0;
       bottom: 1em
   }
}

@media (max-width:767px) {
   #submitDiv {
       margin-top: 1em
   }
}

.sprint-modal .checkbox {
   font-size: 90%
}

.sprint-modal .checkbox label {
   padding: 0
}

.link {
   color: #00f;
   text-decoration: underline;
   cursor: pointer
}

.print-conditions {
   font-size: .9em
}

.printmodal .alert {
   width: 100%
}

.printmodal .checkbox label {
   padding-left: 0
}

a:active {
   text-decoration: none
}

.op-modal-slideeffect {
   opacity: .5 !important
}

#op-rowsdiv {
   margin-top: 1em
}

.op-rows {
   margin-top: .5em;
   position: relative;
   -webkit-touch-callout: none;
   -webkit-user-select: none;
   -khtml-user-select: none;
   /*-moz-user-select: none;*/
   -ms-user-select: none;
   user-select: none;
   outline: 0;
   clear: both;
   padding: 20px 10px 20px 0
}

#op-collapsebtn {
   width: 100%
}

.op-mapname {
   float: left;
   margin-right: 5px
}

.op-values {
   float: right;
   margin-right: 10px;
   margin-left: 15px
}

.slider {
   float: right
}

#op-prefdiv {
   float: left
}

#op-prefs {
   margin-left: 5px;
   margin-right: 10px
}

#op-rowsdiv>div.op-rows:nth-child(odd) {
   background-color: none
}

#op-rowsdiv>div.op-rows:nth-child(even) {
   color: gray
}

.smap-search-div-in-toolbar {
   top: .2em !important;
   z-index: 1002 !important
}

#smap-search-div .form-control,
#smap-search-div .input-group-addon {
   border: none
}

.lswitcher-slidetransition .smap-search-div {
   left: 250px !important
}

#smap-search-div {
   /*position: absolute;*/
   
   /*New*/
   margin-left: 52px;
   margin-right: 54px; /* 52 */
   top: 6px;
   max-height: 100%;
   vertical-align: top;
   float: right;
   /*New*/

   /*left: 60px;*/
   /*top: 5px;*/
   z-index: 1010; /* 1010 */
   /*width: 79%;*/
   /*max-width: 380px; */
   -webkit-transition: left .3s, width .4s, max-width .4s;
   transition: left .3s, width .4s, max-width .4s;
   overflow-y: visible; /* hidden */
   /* border: 1px solid #ccc */
}

#smap-search-div .smap-search-div-focused {
   /* max-width: 450px */
   max-width: 75%;
}

#smap-search-div input {
   letter-spacing: -1px;
   width: 100%;
   /*New*/
   height: 45px;
   /*New*/

   /*border-left: none;*/
   -webkit-box-shadow: none;
   box-shadow: none;
   appearance: none;
   /*border-radius: 0 !important;*/
   background-color: rgba(255, 255, 255, 0.7); /* new */
   font-size: 16px; /* new */

   /*New*/
   border: solid 1px #ccc !important;
   border-radius: 6px;
   
   /*opacity: .9;*/
   /*New*/
}

#smap-search-div ul {
   /*left: -1px!important;*/
    /*width: calc(100% + 2px);*/
    border: solid 1px #ccc;
    border-radius: 6px;
    max-height: 500%;
    max-width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
    /*New*/
    /*padding-right: 10px;*/
    margin-top: -1px;
    /*New*/
}

#smap-search-div .input-group-addon {
   background-color: rgba(255, 255, 255, 0.6) !important; /* #fff */
   
   padding-right: 0 !important;
   /*border-radius: 0!important*/
   /*New*/
   /*border-top-left-radius: 6px;
   border-bottom-left-radius: 6px;*/
   height: 0;
   width: 0;
   padding-left: 10px;
   padding-top: 0;
   padding-bottom: 0;
   margin: 0;
   border: 0;
   display: none;
   /*New*/
   
}

.mf-v4 #smap-search-div {
   top: 48px
}

#smap-search-bg {
   background-color: rgba(255, 255, 255, 0);
   width: 100%;
   height: 100%;
   z-index: 1000;
   left: 0;
   top: 0;
   position: absolute;
   -webkit-transition: background-color .3s;
   transition: background-color .3s
}

.search-bg-visible {
   background-color: #fff !important;
   background-color: rgba(255, 255, 255, .8) !important
}
/*
.search-active {
   left: 2% !important;
   max-width: 600px !important
}

.search-active ul {
   width: 95% !important;
   max-width: 635px
}

@media (max-width:767px) {
   .smap-search-div-in-toolbar {
       max-width: 80% !important
   }

   .smap-search-div-focused {
       width: 83%;
       max-width: 83%
   }
}

@media (max-width:467px) {
   .smap-search-div-focused {
       width: calc(100% - 10px) !important;
       max-width: calc(100% - 10px) !important
   }
}
*/

/* New Jake */
@media (min-width:467px) {
   #smap-search-div,
   .smap-search-div-focused {
      min-width: 300px;
   }
}
/* new end */

@media (min-width:992px) {
   #smap-search-div,
   .smap-search-div-focused {
   /*left:330px;*/
   right: 176px;
   /*min-width: 300px; se ovan */
   z-index: 800;
   }

   
   #smap-search-div input {
   /*border-right-style: none !important;*/
   border-bottom-right-radius: 0;
   border-top-right-radius: 0;
   
   }
}
/*
.smap-searchlund-div-in-toolbar {
   top: .2em !important;
   z-index: 1002 !important
}

#smap-searchlund-div .form-control,
#smap-searchlund-div .input-group-addon {
   border: none
}

#smap-searchlund-div {
   position: relative;
   left: 5px;
   top: 5px;
   z-index: 1010;
   width: 79%;
   max-width: 380px;
   -webkit-transition: left .3s, width .4s, max-width .4s;
   transition: left .3s, width .4s, max-width .4s;
   overflow-y: hidden;
   border: 1px solid #ccc
}

#smap-searchlund-div .smap-searchlund-div-focused {
   max-width: 450px
}

#smap-searchlund-div input {
   letter-spacing: -1px;
   width: 100%;
   border-left: none;
   -webkit-box-shadow: none;
   box-shadow: none;
   appearance: none;
   border-radius: 0 !important
}

#smap-searchlund-div .dropdown-menu {
   left: 0 !important
}

#smap-searchlund-div .input-group-addon {
   background-color: #fff !important;
   padding-right: 0 !important;
   border-radius: 0 !important
}
*/
.dropdown-menu>li>a {
   /*line-height: 2.5;*/
   line-height: 2.36;
   /*New*/
   padding-right: 5px;
   padding-left: 10px;
   padding-top: 1px;
   padding-bottom: 1px;
}

.dropdown-menu>li>a:hover,
.dropdown-menu>li>a:focus {
      background-color: rgb(200, 230, 255);
      background-image: none;
}

/*
#smap-searchlund-bg {
   background-color: rgba(255, 255, 255, 0);
   width: 100%;
   height: 100%;
   z-index: 1000;
   left: 0;
   top: 0;
   position: absolute;
   -webkit-transition: background-color .3s;
   transition: background-color .3s
}

.searchlund-bg-visible {
   background-color: #fff !important;
   background-color: rgba(255, 255, 255, .8) !important
}

.searchlund-active {
   left: 2% !important;
   max-width: 600px !important
}

.searchlund-active ul {
   width: 95% !important;
   max-width: 635px
}

@media (max-width:767px) {
   .smap-searchlund-div-in-toolbar {
       max-width: 80% !important
   }

   .smap-searchlund-div-focused {
       width: 83%;
       max-width: 83%
   }
}

@media (max-width:467px) {
   .smap-searchlund-div-focused {
       width: calc(100% - 10px) !important;
       max-width: calc(100% - 10px) !important
   }
}

@media (min-width:992px) {
   #smap-searchlund-div {
       left: 330px
   }
}
*/
.redirect-click-btn-on,
.redirect-click-btn-on span {
   color: #000 !important;
   background-color: #fff
}

.leaflet-draw-tooltip {
   z-index: 3001
}

.rclick-static-tooltip {
   z-index: 1101;
   background-color: #000;
   color: #fff;
   padding: .1em .5em;
   position: absolute;
   width: 73%;
   left: 10%;
   bottom: 4em;
   text-align: center;
   border-radius: 1em;
   -webkit-border-radius: 1em
}

.leaflet-label {
   background: #000;
   background: rgba(0, 0, 0, .5) !important;
   color: #fff !important;
   font-size: small;
   padding: 3px;
   border-radius: 3px;
   position: fixed;
   width: max-content;
   max-width: 120px;
   text-align: center;
   z-index: 999;
}

#sharetweet-btn {
   -webkit-transition: width .2s ease-in-out;
   transition: width .2s ease-in-out;
   width: 180px
}

#sharetweet-btn.btn-primary {
   width: 230px
}

#sharetweet-form table {
   margin-top: 20px
}

#sharetweet-form td {
   padding: 2px 20px 2px 0
}

.sharetweet-footer {
   width: 100%;
   text-align: right;
   margin: 20px 0 0
}

#sharetweet-form .btn-primary {
   margin-left: 10px
}

.test-thelabel {
   z-index: 2000;
   position: relative;
   text-align: center;
   top: 40%;
   font-size: 5em
}

#myCanvas {
   position: absolute;
   left: 0;
   top: 0;
   z-index: 1999
}

.thandler-btn {
   display: none;
   z-index: 1001;
   position: absolute;
   left: auto;
   right: 5px;
   top: 5px
}

/* Mohammad Change*/
/*.thandler-btn button{width:52px;height:47px;border-radius:0!important}*/
.thandler-btn button {
    /*width: 52px;*/
    width: 48px;

    height: 46px; /*47*/
    /*border-radius: 0.4em;*/
    border-radius: 6px; /*0?*/
    /*opacity: 0.8;*/
    opacity: 0.9;
}

/* Mohammad Change*/

.mf-v4 .thandler-btn {
   top: 48px
}

.thandler-collapsed .thandler-btn,
.thandler-container.thandler-visible {
   display: block
}

.thandler-collapsed .thandler-container {
   display: none
}

.thandler-container {
   transition: opacity 1.0s ease, max-height 1.0s ease;
}

.thandler-collapsed .thandler-popover {
   left: auto !important;
   right: 3px;
   max-width: calc(100% - 3px) !important;
}

.thandler-collapsed .thandler-popover .popover-content {
   padding: 0 0 1em
}

.thandler-collapsed .thandler-popover .popover-content .leaflet-control {
   clear: none;
   margin: .2em
}

.thandler-collapsed .thandler-popover .popover-content .leaflet-control button {
   width: 35px;
   height: 35px;
   padding: 0;
}

/*.thandler-collapsed .thandler-popover .dropdown-menu {
   left: -17em !important
}*/

.thandler-collapsed .thandler-popover .arrow {
   left: auto !important;
   right: 17px
}

#smap-vspuHeaderLund-div {
   z-index: 1001;
   background-color: #cde;
   padding-left: 0
}

#smap-vspuHeaderLund-div .container {
   padding-left: 0;
   margin-left: 2em
}

#smap-vspuHeaderLund-div .btn-group {
   padding-top: 7px
}

#smap-vspuHeaderLund-div .dropdown-menu {
   font-size: 12px
}

#smap-vspuHeaderLund-div .container {
   width: 95%
}

body {
   font-family: OpenSans, "Droid Sans", Verdana, "DejaVu Sans", "Bitstream Vera Sans", sans-serif
}

.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1,
h2,
h3,
h4,
h5,
h6 {
   font-family: Georgia, "Droid Serif", "DejaVu Serif", "Bitstream Vera Serif", serif
}

h3 {
   font-weight: 700
}

h4 {
   font-style: italic
}



/* New VattenAtlas 2.0 */
/* Override from Bootstrap.css */
@media (min-width:992px) {
   .list-group-item {

      padding-top: 10px;
      padding-bottom: 10px;
      padding-right: 10px;
      /* border: 1px solid rgb(128, 178, 253)!important; */
   }
}


@media (max-width:991px) {
   .list-group-item {
      padding-top: 6px;
      padding-bottom: 6px;
      padding-right: 2px;
      /* border: 1px solid rgb(128, 178, 253)!important; */
   }
}

.slack-alla-kartskikt.btn, .slack-alla-kartskikt.btn:focus {
   float: right;
   width: 44px; /* 2023: från 40 till 44 */
   height: 34px; /* ny 2023 */ 
   margin-top: -.4em;
   margin-right: 0.2em;
   background-image: none;
   background-color: transparent;
   border: none;
   outline: 0;
}
.slack-alla-kartskikt.btn:hover {
   background-color: white;
   border: none;
}

@media (max-width:991px) {
   .slack-alla-kartskikt.btn:hover {
      background-color: transparent;
   }
}


/* .slack-alla-kartskikt.btn.btn-default.lswitch-btnhide {
   background-image: none;
} */

/* .btn-default.lswitch-btnhide {
   background-image: url(img/fa-chevron-up2.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
   background-color: transparent;
   border: none;
} */

.hide-panel-button, .hide-panel-button:focus {
   background-image: url(img/fa-chevron-up2.png);
   background-repeat: no-repeat;
   /*background-size: contain;*/
   background-size: 30px 30px; /* width height */
   background-position: center;
   background-color: transparent;
   border: none;
   display: table-cell;
   right: 0;
   vertical-align: middle;
   position: relative;
   top: 0;
   float: left; /* left för att placera vänster */
   /* margin-left: -7px; */ /* för att placera vänster */
   margin-top: -.4em;
   outline: 0;
   width: 44px; /* ny 2023 */
   height: 34px; /* ny 2023 */ 
}

.hide-panel-button.btn:hover {
   background-color: white;
}


@media (max-width:991px) {
   .hide-panel-button.btn:hover {
      background-color: transparent;
   }
}

/* .lswitch-btnhide.btn {
   background-image: url(img/fa-chevron-up2.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
   background-color: transparent;
   border: none;
} */

.lswitch-btnhide.btn:hover {
   background-color: white;
}


.lswitch-btnshow {
   /*background-image: url(img/icon-layers.png);*/
   background: transparent;
   background-repeat: no-repeat;
   background-size: cover;
   background-position: center;
}

.lswitch-btnshow, .lswitch-btnshow:focus {
   width: 48px;
   height: 46px;
   position: absolute;
   left: 5px;
   top: 5px;
   /*border: 1px solid #ccc;*/
   opacity: 1.0;
   outline: 0;
}

.layer-info-btn {
   display: inline-block!important;
   width: 25px!important; /* used to be 30 */
   height: 25px!important; /* used to be 30 */
   padding-top: 2px!important; /* 4.5 */
   text-align: center!important;
   border: 1px solid #ddd!important;
   border-radius: 6px!important;
   vertical-align: middle!important;
   margin-top: 0px; /* used  to be 2 */
   margin-left: 1px;
}

.layer-info-btn:hover {
   background: rgba(247, 247, 247, 0.9)
} 

.panel-heading {
   margin-left: 10px;
   text-align: center;
}

/* Utseende för större skärm, ska vara samma som mindre skärm */
.lswitch-panel .panel-heading {
   background-color: #5497ce; /* 2015-2022: #71abd8; */
   color: #fff;
   outline: 0;
   font-weight: 700;
   font-size: 20px; /* new 2023 1.1em; */
   /*padding: .75em 1em;*/
   /* new 2023 */
   font-variant-caps: all-small-caps;
   line-height: 20px;
   font-family:sans-serif;
}

/* Färg på synliga lager */
.lswitch-panel a.active,
.lswitch-panel a.active:hover {
   background-color: rgb(199, 199, 199);
   /* border: 1px solid rgb(189, 35, 35)!important; */
}

/* När lagerlista är gömd */
.lswitch-panel.unselectable {
   overflow-y: auto;
   scrollbar-width: thin;
   /* -ms-overflow-style: -ms-autohiding-scrollbar !important */
}

/* Issue with scrollbar taking up space within div on Safari fix */
.lswitch-panel.unselectable::-webkit-scrollbar {
   width: 0; /* Remove scrollbar space */
   background: transparent; /* Optional: Just in case */
}

/* New Denna verkar påverka scrollbars på kollapsad meny */ 
.lswitch-panel-ol {
   /*background-color: transparent;*/
   margin-bottom: -4px !important;
   /*border-bottom-style: solid !important;*/
} 

/* New */
.lswitch-panel.unselectable.lswitch-hidden.lswitch-displaynone {
   height: inherit; /* Ändrat från auto för att få bort y-scrollist */
   background-color: none;
   /*max-height:47px!important;*/
}

.displayname-div-lvl1 {
   display: inline !important;
   white-space: nowrap !important;
   vertical-align: middle !important;
   margin-top: -38px;
}

.displayname-div-lvl2 {
   display: inline-block !important;
   white-space: normal !important;
   vertical-align: middle !important;
   max-width: 165px;
   padding-right: 20px;
   padding-left: 5px;
   /*padding-bottom: 2px;*/
   line-height: 1;
   margin-right: -17px;
   letter-spacing: -0.5px;
}

.glyphicon-info-sign:before {
   content: "\e086";
}

/* Info ruta om lager */
.col-xs-12 {
   font-size: small;
   text-align: right;
   width: 30%
}
.col-sm-6 {
   font-size: small;
   text-align: left
}

/* 2.1 större knapptext */
.btn {
   
   /* font-size: 16px; */
   line-height: 1.3;
}
/* 2.0 Ingen skugga eller gradient på knappar */
.btn-default {
   text-shadow: none;
   background-image: none;
   background-color: white;
   border-color:rgb(170, 170, 170);
}
/* ... eller på meny Kartlager, Bakgrundslager */
.panel-default>.panel-heading {
   background-image: none;
}

/* Media hover deklaration utesluter pekskärmar, annars ligger denna bakgrundsfärg kvar när man klickar bort ett lager */
@media (hover: hover) {
   .btn-default:hover,
   .lswitch-panel a:hover,
   .list-group-item.active:hover,
   .lswitch-cat:hover {
      background-color: rgb(200, 230, 255);
   }

   .btn-default:focus {
      background-color: white;
      outline-color: rgba(255, 255, 255, 0)
   } 
}

/* 2.0 avstånd mellan rader i lagerinfo popup */
.row {
   padding-bottom: 3px;
}

#popuplinkbutton {
   background-color: rgb(233, 231, 231);
}

/* 2.0 snyggare lagerinfo-popup på mobil */
@media (max-width:467px) {
   .col-xs-12 {
       width: auto;
   }
}

button#smap-showhidesearch-btn.btn.btn-default.btn-primary {
    
    color: #333;
    
}

button#logga.btn-default {
   /* background-image: url(img/Logga2023k-s.png); */
   /* background-repeat:no-repeat; */
   /* background-size: contain; */
   background-color: #3A88D5; /* real logga: 3A88D5 */
   padding: 0;
   overflow: hidden
}

button#logga.btn-default:hover {
   background-color: #8c8c8c;
   padding: 0;
   overflow: hidden
}

/* För att sökruta ska funka */
.input-group .form-control {
   position: relative;
   z-index: 2;
   float: left;
   width: 100%;
   margin-bottom: 0
}

/* För att få geolocate knapp rätt bakgrund när den är aktiv */
.btn-primary:focus {
   background-color: #71ABD8;
}

.btn-primary {
   background-image: none;
   background-color: white;
   color: black;
   border-color: rgb(170, 170, 170);
   font-family: monospace;
   text-shadow: none;
}
.btn-primary:hover {
   background-image: none;
   background-color: rgb(200, 230, 255);
   color:#000;
   text-shadow:none;
}

/* standarder
background-color: rgb(200, 230, 255); (hover)
*/