details > summary {
list-style: none;
box-sizing:border-box;
cursor: pointer;
font-size: 16px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
font-weight: normal;
font-style: normal;
line-height: 1.5;
display: inline-block;
padding:10px;
}


details.knapp {
padding:0}

details[open] > summary::after {
content: "✕";
display:inline-block;
float:right;
color: indianred;
background:none;
border-radius:5px;
padding-right: 7px;
padding-left: 7px;
padding-top: 1.7px;
}

details[open] > summary:hover {
color: indianred;
}
details[open] > summary {
width:100%;
padding: 10px;
background: honeydew;
border-radius:5px 5px 0px 0px;
border-bottom: 1px solid seagreen;
}

details:hover{
background:honeydew;
cursor: pointer;
}

details[open] {
display:block;
cursor:default;
padding: 0px;
border: 1px solid seagreen;
text-align:left;
}

details[open]:hover {

background-color: rgba(255,255,255,0.8);
}

details > summary::-webkit-details-marker {
display: none;
}

details p {
padding: 15px;
}

input::-webkit-calendar-picker-indicator {
display: none !important;
}

.tumme
{width:100px;
height:100px;}

.thumbs { 
padding: 8px; 
overflow: auto; 
display:flex; 
flex-wrap: wrap;
gap: 8px;
border-top: 1px solid gainsboro;
}

.thumbs img {
border: 2px solid transparent;
border-radius: 6px;
}

.thumbs img:hover{
border:2px solid midnightblue;
}

.thumbs img:active{

position: relative;
top: 2px;
left: 2px;
margin-bottom:0px;
border: 2px solid transparent;
}

.sidethumbs
{width:105px;
background:ghostwhite;}

.description  
{background: midnightblue;
font-size: 18px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
color: aliceblue;
font-weight: normal;
font-style: normal;
line-height: 1.5;
padding:10px;} 

a .description:hover
{background: #2A2ABB;
font-size: 18px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
color: white;
font-weight: normal;
font-style: normal;
line-height: 1.5;
padding:10px;}        

.gron {
color: seagreen;
font-weight: 800;
}

#searchband{
background:transparent;
text-align:middle;
border:none;
text-align: center;
font-size:20px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
margin:0px;
padding:7px;
width:50%;
}

::placeholder
{color:rgb(60, 71, 86);}

input:focus, textarea:focus
{
outline: 2px solid seagreen;
}



input:focus::placeholder 
{
color: transparent;
}

input::-webkit-calendar-picker-indicator {
display: none;
}

#searchband:focus{
background:ghostwhite;
outline:none;
}

.tabbed{
width : 100%;
}

.tabbed > input{
display : none;
}

.tabbed > section > h1{
float       : left;
box-sizing  : border-box;
margin      : 0;
padding     : 2.5px 0.5em 0;
overflow    : hidden;
font-size   : 1.2em;
font-weight : normal;
}

.tabbed > input:first-child + section > h1{
padding-left : 0em;
}

.tabbed > section > h1 > label{
display                 : block;
padding                 : 0.25em 0.75em;
border                  : 0px solid #dfdfe6;
border-bottom           : none;
border-top-left-radius  : 4px;
border-top-right-radius : 4px;
background              : #dfdfe6;;
cursor                  : pointer;
text-transform          : none;   
}

.tabbed > section > h1 > label:hover
{
background:mintcream;
color:seagreen;
}

.tabbed > section > div{
position      : relative;
z-index       : 1;
float         : right;
box-sizing    : border-box;
width         : 100%;
margin        : 2.5em 0 0 -100%;
background: linear-gradient(to bottom, white 0%,ghostwhite 100%);
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
box-shadow: 0 14px 28px rgba(23, 23, 89, 0.25), 0 10px 10px rgba(23, 23, 89,0.22);
border-radius: 0px 10px 10px 10px;
}

.tabbed > input:checked + section > h1{
position : relative;
z-index  : 2;
}

.tabbed > input:checked + section > h1 > label{
background:white;

}

.tabbed > input:not(:checked) + section > div{
display : none!important;
}

.select-css {
display: inline-block;
font-size: 16px;
color: black;
line-height: 1.3;
max-width: 100%;
box-sizing: border-box;
padding: 10px;
border: 1px solid mediumseagreen;
border-radius: 5px;
-moz-appearance: none;
-webkit-appearance: none;
appearance: none;
background-color: mintcream;
background-repeat: no-repeat, repeat;
background-position: right .7em top 50%, 0 0;
background-size: .65em auto, 100%;
width:180px;
margin-left:12px;
}

.select-css:hover {
border-color: seagreen;
background-color: rgb(171, 233, 199);
}

.select-css option {
font-weight: normal;
}

.select {
-webkit-appearance: none;
}

.goldbox {
padding: 5px 20px 5px 20px;
background: honeydew;
border-radius: 8px 8px 8px 8px;
}

.bildbox {
display: block;
position: relative;
overflow: hidden;
object-fit: cover;
flex:50%;
}

.bildbox img {
position: absolute;
top: 0;
right: 0;
height: 100%;
width: 100%;
object-fit: cover;
}

.bildbox-r {
display: block;
position: relative;
overflow: hidden;
object-fit: cover;
flex:50%;
}

.bildbox-r img {
position: absolute;
top: 0;
left: 0;
height: 100%;
object-fit: cover;
}

img {
display: block;
height:auto;
}

.ikon {
height: 32px;
vertical-align: middle;
margin-right: 10px;
display: inline-block;
}

.footer {
margin-top: 300px;
background: rgba(0,0,50,0.45);
backdrop-filter: blur(20px);
-webkit-backdrop-filter: blur(20px);
display:flex;
flex-direction:row;
}

.footer p{
color:ghostwhite;
}

.bokaknapp {
background-color: seagreen;
border-radius: 5px;
display: inline-block;
color: white !important;
padding: 12px 24px;
text-decoration: none;
font-size: 20px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
font-weight: normal;
font-style: normal;
text-transform: uppercase;
line-height: 150%;
-webkit-appearance: none;
border: none;
width: auto;
}

.bokaknapp:hover {
background-color: midnightblue;
color: mintcream !important;
}

.bokaknapp:active {
position: relative;
top: 1px;
}

.papper {
width: 80%;
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
background-color: rgba(255,255,255,0.85);
border-collapse: separate;
display: block;
box-shadow: 0 18px 50px rgba(0, 0, 0, 0.52);
border-spacing: 0;
margin: 0 auto;
line-height: 0;
border-radius: 10px;
overflow: hidden;
}

.papper:has(.tabbed){
overflow: visible ;
}

.smal {
width: 800px;
}

.kortknapp
{
border-left: 10px solid;
border-radius: 0px;
padding-top:4px;
padding-bottom:4px;
padding-left: 10px;
padding-right: 10px;
}

a .kortknapp:hover {
background-color: honeydew;
}

body:after {
background-size: cover!important;
content: "";
position: fixed; /* stretch a fixed position to the whole screen */
top:0;
height: 100vh;
left:0;
right: 0;
z-index: -1; /* needed to keep in the background */
}

.frigg {
padding: 30px;
line-height: 1.5em;
flex:1;
}

.gallery
{
padding:0px;
flex:1;
}

#panel {
max-height:600px; 
overflow:hidden
}

.largeImage {
width:100%;
aspect-ratio: 1 / 1;
object-fit: cover;
}

.svidur {
padding: 20px;
}

.balder {
padding: 15px;
background: rgb(169, 217, 193);
display:flex;
gap:8px;
justify-content: center;
flex-wrap:wrap;
}

.balder > h4 {
white-space: nowrap;
}

.band {
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
background-color: rgba(255,255,255,0.5);
width: 100%;
box-sizing: border-box;
display:flex;
justify-content:space-around;
border-top: 1px solid snow;

}

.band > * {
white-space: nowrap;
}

h1, h2, h3, h4, h5, h6, p, a, ul, ol, li {
margin: 0;
padding: 0;
}

h1 {
margin: 10;
padding: 0;
}

.frigg {
line-height: 150%;
box-sizing: border-box;
}

p {
margin: 10px 0;
font-family: Helvetica, 'Roboto', Tahoma, Arial, Sans-Serif;
line-height: 1.5;
}

h1 a,
h2 a,
h3 a,
a:link {
text-decoration: none;
color: #313F9B;
}

a:hover{
color: seagreen;
}

p a{
text-decoration: underline !important;
text-underline-offset: 0.25em;
color: #313F9B;}

p a:hover {
text-decoration-color: seagreen !important;
}

h1 {
font-size: 28px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
font-weight: bold;
font-style: normal;
letter-spacing: 1px;
text-transform: uppercase;
line-height: 150%;
}

h2 {
margin: 5px 0;
font-size: 20px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
font-weight: normal;
font-style: normal;
text-transform: uppercase;
line-height: 150%;
}

h4 {
margin:10px 0;
font-size: 16px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
font-weight: normal;
font-style: normal;
text-transform: uppercase;
line-height: 1.5;
}

h5 {
color: ghostwhite;
font-size: 48px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
font-weight: 800;
line-height: 150%;
text-shadow: 3px 3px 6px rgb(0, 0, 0);
text-shadow: 3px 3px 11px rgba(0, 0, 0, 0.73); }
}

header, nav, #hmenu-bg, .checkbox:before, .radiobutton:before {
display: block;
box-sizing: border-box;
}

ul {
list-style-type: none;
}

ol {
list-style-position: inside;
}

html, body {
height: 100%;
overflow: hidden;
}

body {
padding: 0;
margin: 0;
color: black;
background: lightsteelblue;
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
}

body > .knapp {
margin-right: 10%
}

.header {
margin: 0 auto;
margin-bottom:250px;
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
position: relative;
z-index: auto !important;
box-shadow: 0 14px 28px rgba(23, 23, 89, 0.25);
}

.invert {
background: none;
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
}

.invert>nav a{
color: black !important;
}

.invert>a>.kivi {
filter: invert();
}


.kivi {
width: 296px;
margin: 18px;
margin-right: 0px;
margin-bottom: 0px;
display: inline-block;
z-index: 100;
}

.nav {
padding: 24px;
padding-left: 0px;
float: right;
z-index: 90;
text-align: right;
display: inline-block;
}

.nav p {
margin:0px;
}

ul.hmenu li {
float: left;
display: block;
font-size: 18px;
font-family: 'Nunito Sans', 'Trebuchet MS', Helvetica, Arial;
color: aliceblue;
border-radius: 7px;
}

ul.hmenu>li>a.active {
background-color: rgba(255,255,255, 0.6);
border-radius: 7px;
border-top: 1px solid snow;
box-shadow: 4px 4px 8px rgba(23, 23, 89, 0.25);
color: black;
padding-top: 2px;
padding-bottom: 2px;
}

ul.hmenu>li>a:hover{
color: midnightblue;
border-radius: 7px;
background: mintcream;
padding-top: 2px;
padding-bottom: 2px;
}

ul.hmenu>li {
margin-left: 10px;
}

ul.hmenu>li>a {
padding: 0 10px;
position: relative;
height: 30px;
cursor: pointer;
text-decoration: none;
color: aliceblue;
line-height: 30px;
}


.dropdown:hover .langlist {
display: flex;

}

.dropdown {
position: relative;
display: block;
background: rgba(0,0,0,0.3);
border-radius: 5px;
padding-right: 20px;
padding-left: 20px;
padding-top: 2px;
padding-bottom: 2px;
cursor: pointer;
}

.langlist {
display: none;
flex-direction:column;
justify-content:flex-start;
position: absolute;
right: 0px;
left: -16px;
top: 28px;
backdrop-filter: blur(15px);
-webkit-backdrop-filter: blur(15px);
border-radius: 5px;
background-color: rgba(255,255,255,0.8);
z-index: 80;
font-family: 'Nunito Sans', 'Trebuchet MS', Helvetica, Arial;
box-shadow: 0 14px 28px rgba(23, 23, 89, 0.25);
overflow: hidden;
border-top: 1px solid ghostwhite;
border-left: 1px solid ghostwhite;
text-align:left;
}

.langlist>li {
border-radius:0px;
padding:8px;
}

.langlist>li:hover{
background: mintcream;
color:seagreen!important;
border-radius:0px;
}

.tg {
line-height:150%;
table-layout: fixed; 
width: 100%;
border-collapse:collapse;
border-spacing:0;
border:none;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
padding:8px;
}

.tg td {
font-size:14px;
padding:8px;
overflow:hidden;
word-break:normal;
vertical-align:top
}

.tg th {
text-align:left;
font-weight:bold;
font-size:16px;
padding:8px;
vertical-align:top;
overflow:hidden;
}

hr {
border: 0;
border-bottom: solid 1px gray;
margin: 2rem 0;
}

.foter-hr {
border: 0;
margin: 0px;
}

.row {
display: flex;
flex-shrink: 0;
}

.sidebar {
flex:1.3; 
background: ghostwhite; 
text-align:right; 
vertical-align:top;
}

.sidebar h4 {
color:seagreen;
font-weight:700;

}
input, textarea, a.search-button span {
vertical-align: middle;
font-size: 16px;
font-weight: normal;
font-style: normal;
border: 1px solid gainsboro;
padding: 15px 15px;
width: 180px;
box-sizing: border-box;
margin-left: 12px;
}

input[type="date"] { 
-webkit-appearance: none;
background:white;
font-size: 16px;
padding: 15px 15px;
}

.nav .menu-btn {
border-radius: 0px;
display: none;
background: none;
float: right;
padding: 18px;
width: 20px;
z-index: 99;
}


.knapp {
all: unset; /* Reset button styles */
display: inline-block;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
margin: 4px 2px;
background-color: rgba(255,255,255,0.8);
text-align: middle;
border: 1px solid transparent;
border-radius: 5px;
padding: 10px;
text-transform:none;
font-size: 16px;
font-family: 'Nunito Sans',  Helvetica, Arial, Sans-serif;
line-height: 1.5;
}


a .knapp:hover {
background-color: honeydew;
border: 1px solid transparent;
}

.knapp:active {
position:relative;
top:1px;
}

.gronknapp {
white-space: nowrap;
background: seagreen;
background: radial-gradient(circle, rgba(46,139,87,1) 0%, rgba(15,99,72,1) 100%); 
color:mintcream;
}

.guldknapp {
white-space: nowrap;
background: gold;
background: radial-gradient(circle, rgba(255,215,0,1) 0%, rgba(255,158,0,1) 100%); 
color:black;"
}

.bokapris {
background-color: ghostwhite;
padding: 15px;
text-align: right;
display: flex;
border-top: 1px solid gainsboro;
justify-content: flex-end; 
align-items: center; 
gap: 20px
}

.ingar {
display: flex;
background:rgb(169, 217, 193);
border-radius: 10px 0px 0px 10px;
margin-left: 20px;
margin-bottom: 20px;
}

.ingar-sida {
display: flex;
background:rgb(169, 217, 193);
border-radius: 0; 
flex-direction: column; 
}

.ingar-sida h2 {
color: darkgreen;
text-align: center;
font-weight: 800;
border-bottom:1px dashed seagreen;
padding:5px;
margin-bottom: 0;}

.flap {
border-radius: 10px 0px 0px 10px; 
writing-mode: vertical-rl;
background:seagreen;
color: mintcream;
text-align: center;
font-weight: 800;
}

.personpris {
background: seagreen;
color: mintcream;
text-align: center;
font-weight: 800;
border-bottom:1px dashed honeydew;
padding:5px;
margin-bottom: 0;
}

.prisruta {
background: seagreen}

.tillval {
background: #EDE9E0;
}

.tillval h2 {
color: #6D4C27;
text-align: center;
font-weight: 800;
border-bottom:1px dashed darkgoldenrod;
padding:5px;
margin-top: 0;
}

.nav .menu-btn span {
background: aliceblue;
border-radius: px;
display: block;
height: 3px;
margin: 3px 1px;
position: relative;
top: 50%;
transform: translateY(-50%);
}

.invert > .nav .menu-btn span {
background: black;
}

.nav .menu-btn:hover span {
background: lightgreen;
}

.invert > .nav .menu-btn:hover span {
background: seagreen;
}
.desktop-only {
display: inline-block;
}

.mobile-only {
display: none;
}

.frimarke{
float: right;
margin: 20px;}