*{margin:0px;padding:0px;font-family:arial;user-select:none}
iframe{border:0;overflow:hidden;background-color:transparent;}
html,body{overflow:hidden;height:calc(100%)}
section{width:100%}
header{background:#111;color:#fff;width:100vw;height:20px}
main{width:100vw;height:calc(100% - 70px);background:#333;color:#000;overflow:auto}

.fullvideoiframe{border:0;overflow:hidden;background-color:transparent;width:100%;height:calc(100%)}
.noscroll{overflow:hidden}

.center{
 display:grid;
 place-items:center;
 text-align:center;
}

h1{font-size:1.0em}
h2{font-size:0.8em}
h3{font-size:0.7em}
h4{font-size:0.6em}

.w100p{
 width:100%;
}
a{
 text-decoration:none;
 color:#000;
}
.link{
  text-decoration:underline;
}
.nolink{
  text-decoration:none;
}
.linkicon{
  display: inline-flex;
  align-items: center;
  gap: 0.5rem; 
  text-decoration:none;
}
.disabled{
 background:gray;
}
.textcenter {
 text-align:center;
}
.tc-black{
 color:#000;
}
.tc-white{
 color:#fff;
}
.tc-gray{
 color:gray;
}
.tc-green{
 color:green;
}
.tc-red{
 color:#990000;
}
.tc-blue{
 color:#87CEFA;
}
.icon1{
font-size:1.0em;padding-right:5px;

}
.icon2{
font-size:1.5em;padding-right:5px;
}
.fs-06{
 font-size:0.6em;
}
.fs-08{
 font-size:0.8em;
}

/* FORM */
form {
max-width: 100%;
margin: auto;
background: #fff;
padding: 20px 24px; /* extra sidopadding för luft */
border-radius: 8px;
box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

label {
display: block;
margin-bottom: 6px;
font-weight: bold;
}

input, textarea, select {
width: 100%;
padding: 10px 0px;
margin-bottom: 16px;
border: 1px solid #ccc;
border-radius: 6px;
font-size: 1rem;
text-indent: 10px;
}

textarea {
height: 120px;
resize: vertical;
}

.form-actions {
display:flex;
justify-content: space-between; /* vänster + höger */
margin-top: 12px;
}

.form-actions > div {
display: flex;
gap: 8px; /* mellanrum mellan knapparna till höger */
}

button {
padding: 10px 16px;
border: none;
border-radius: 6px;
font-size: 1rem;
cursor: pointer;
}

.cancel {
background: #e5e7eb;
color: #111;
}
.cancel:hover {
background: #d1d5db;
}
.submit {
background: #2563eb;
color: white;
}
.submit:hover {
background: #1e40af;
}
/* FORM */

/* INSTALL */
#installBtn {
  display: none;
  padding: 14px 22px;
  background: #0078ff;
  color: white;
  border: none;
  border-radius: 10px;
  font-size: 18px;
  font-weight: 600;
  cursor: pointer;
  width: 100%;
  max-width: 320px;
  margin: 20px auto;
  display: block;
  text-align: center;
  box-shadow: 0 4px 12px rgba(0,0,0,0.15);
  transition: transform 0.15s ease, background 0.2s ease;
}

#installBtn:hover {
  background: #0068d6;
  transform: translateY(-2px);
}

#installBtn:active {
  transform: translateY(0);
  background: #005bb8;
}

#iosSafari, #iosOther, #fallback {
  background: #bbb;
  padding: 15px;
  border-radius: 10px;
  margin-top: 20px;
  font-size: 16px;
  line-height: 1.5;
}
/* INSTALL */

/* INFO */
.info-item{
 text-align:left;
 font-size:1.0em;
 padding:10px;
 border-bottom:1px solid #ccc;
}
/* INFO */

/* MENU */
.menu-cont{
 width:clamp(350px, 50vw, 600px);
 border-top:1px solid #ccc;
 border-radius:10px 10px 0px 0px;
 border-inline:1px solid #ccc;
}
.menu-header{
 display:flex;justify-content:left;align-items:center;text-align:left;
 font-size:1.0em;font-weight:bold;
 padding:10px;
 border-bottom:1px solid #ccc;
 border-radius:10px 10px 0px 0px;
}
.menu-item{
 display:flex;justify-content:left;align-items:center;text-align:left;
 font-size:1.5em;font-weight:bold;
 padding:10px;
 border-bottom:1px solid #ccc;
 cursor:pointer;
}
.menu-item:hover {
 background-color:#333;
 color:#fff;
}
.menu-header-color{
 background:#082567;color:#fff;
}
.menu-header-color2{
 background:#ddd;color:#000;
}
.menu-header-color3{
 background:green;color:white;
}
.menu-item-color{
 background:#eee;color:#000;
}
.menu-item-disabled{
 background:gray;color:#000;
}
.menu-item-link{
 background:green;color:white;
}
/* MENU */

/* APP MENU FOOTER MENU grid-row span styr rader */
.footer-text{color:#fff;font-family:verdana;font-size:1.0em;line-height:0px;width:calc(100% + 20px);position:relative;left:-10px}
.footer-icon{font-size:1.5em;padding-left:4%;padding-right:4%}
.footer-home{font-size:1.5em;padding-left:4%;padding-right:4%}

.footer-cont {
  position:fixed;bottom:0;left:0;width:100%;height:50px;display:grid;

  /* tre kolumner: en vänster, en mitten, en höger */
  grid-template-columns:50px 1fr 50px;
  grid-template-rows:1fr 1fr;  /* mitten har två rader */
  gap:0px;background:#222;
}

/* Vänster */
.footer-col-left {
  display:flex;align-items:center;justify-content:center;
  grid-column:1;grid-row:1 / span 2;
}

/* Mitten två rader */
.footer-mid-top {
  display:flex;align-items:center;justify-content:center;padding:0px;height:30px;
  grid-column:2;grid-row:1;
}

.footer-mid-bottom {
  display:flex;align-items:center;justify-content:center;padding:0px;height:20px;background:#000;border-radius:20px 20px 0px 0px;
  grid-column:2;grid-row:2;
}

/* Höger */
.footer-col-right {
  display:flex;align-items:center;justify-content:center;
  grid-column:3;grid-row:1 / span 2;
}
/* APP MENU FOOTER MENU */