* {font-family: sans-serif; box-sizing: border-box; margin: 0;}
a:link {color: black; text-decoration: none;} a:visited {color: black; text-decoration: none;} a:hover {color: black; text-decoration: underline;} a.active {color: black; text-decoration: underline;}
a[href ^= 'tel:']{font-size: 1.35em; text-transform: none; background-color: transparent; color: #fff;}
hr{height: 6px; width: 100%; margin: 9px 0px 18px 0px; background-color: white;}
@viewport {
    zoom: 0.8;
    min-zoom: 0.8;
    max-zoom: 0.8;
  }
  .faq-toggle-btn {
    background-color: white;
    color: #02648b;
    border: none;
    padding: 5px 10px;
    font-size: 14px;
    cursor: pointer;
    border-radius: 10px;
    font-weight: bold;
    margin-bottom: 15px;
    transition: background 0.3s ease;
    top: -2px; position: relative;
}

.faq-toggle-btn:hover {background-color: #ddd;}

.top-column {
    width: 98%;
    background-color: #02648b;
    color: white;
    padding: 10px;
    border-radius: 4px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.5s ease-out, opacity 0.5s ease-out;
    display: none; 
    justify-content: space-between; 
}

.top-column.show {display: flex; max-height: 1000px; opacity: 1;}
.faq-section {flex: 9; padding: 10px 0px 10px 10px;}
.faq-section h2 {text-align: center;}
.faq-section p {padding: 5px 0;}
.faq-section2 {flex: 10; padding: 10px;}


.faq-toggle-btnB {
    background-color: white;
    color: #02648b;
    border: none;
    padding: 5px 10px;
    font-size: 14px;
    cursor: pointer;
    border-radius: 10px;
    font-weight: bold;
    margin-bottom: 15px;
    transition: background 0.3s ease;
    top: -2px; position: relative;
}

.faq-toggle-btnB:hover {background-color: #ddd;}

.top-columnB {
    width: 98%;
    background-color: #02648b;
    color: white;
    padding: 10px;
    border-radius: 4px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    overflow: hidden;
    max-height: 0;
    opacity: 0;
    transition: max-height 0.5s ease-out, opacity 0.5s ease-out;
    display: none; 
    justify-content: space-between; 
}

.top-columnB.show {display: flex; max-height: 1000px; opacity: 1;}
.faq-sectionB {flex: 9; padding: 10px 0px 10px 10px;}
.faq-sectionB h2 {text-align: center;}
.faq-sectionB p {padding: 5px 0;}
.faq-section2B {flex: 10; padding: 10px;}


.center{margin: auto; max-width: 960px}
.fixedtotop{position: fixed; right: 10px; bottom: 10px; z-index:12; width: 115px; height: 35px; font-weight: bold; text-align: center; padding: 5px; background-color: #0396d0; border: 1px solid white; border-radius: 7px;} 
.fixedtotop:hover{background-color: #0181b4;}
.price-list {
    user-select: none; /* Prevents text selection */
    list-style-type: none; /* Removes bullets */
    padding: 0;
    margin: 0;
}

ul:first-of-type {
    margin-left: 0 !important;
    padding-left: 0 !important;
}

ul[id$="PriceList"] {
    user-select: none;
    list-style-type: none;
    padding: 0; 
    margin: 0;  
}

.price-item {
    display: flex;
    justify-content: space-between;
    width: 98%;
    padding: 5px 0;
    border-bottom: 1px solid #ddd;
}

.item-name {flex-grow: 1;}
.item-price {text-align: right; min-width: 80px;}

/* ------ */
/* MOBILE */
/* ------ */

@media only screen and (min-width: 320px) and (max-width: 860px) {
    hr{height: 6px; width: 98%; margin: 9px 0px 18px 0px; background-color: white;}
    .hide_scroll{-ms-overflow-style: none;  /* Internet Explorer 10+ */ scrollbar-width: none;  /* Firefox */}
    .hide_scroll::-webkit-scrollbar {display: none;  /* Safari and Chrome */}

    .hours{
        height: 100%; width: 100%; margin-top: 10px; top: 220px;
        display: block; position: relative; background-color: transparent; z-index: 10; 
    }

    .rubrik{display: block; color: white; background-color: #005f85; margin-top: -6px; padding: 10px; text-align: center;}
    .table_openinghours{width: 100%; height: 230px; margin-top: 25px; padding: 27px 0px 1px 0px;}
    .td_openinghours{color: white; background-color: #0398d2; padding: 8px 4px 8px 8px; line-height: 21px;}
    .td_openinghours_details{color: white; padding: 8px 8px 8px 8px; line-height: 21px;}
    
    .index_nav_map_hours{display: none;}    
    
    [class*="col-"]{float: left; padding: 0px;}
    .row::after{content: ""; clear: both; display: table;}
    .row{display: flex;}

    /* Social row styling*/
    .soc_table{float: right; margin-right: 10px;}
    .soc_col_text{width: 75px; text-align: right;}
    .soc_col_img{padding: 0px 0px 0px 16px;}
    .soc_block_link{display: block; text-decoration: none; font-size: 0.9em;}
    .col-social {width: 100%; float: right; margin-top: 10px; margin-bottom: 8px; font-size: 0.9em; font-family: sans-serif; color: black;}
    
    .col-logo {min-width: 180px; width: 15%;}      
    .col-image-beh { margin-top: 7px; position: relative; width: 35%; background-image: url("Images/beh.jpg"); background-size: cover; background-position-x: 95%;}
    .col-image-om { margin-top: 7px; margin-right: 7px; position: relative; width: 40%; background-image: url("Images/kliniken.jpg"); background-size: cover; background-position-x: 20%;}

    /* Index slideshow related*/
    .slideshow {display: none;}
    .slidestyle{width: 100%; height: 100%; max-height: 220px; object-position: left 70%; object-fit: cover;}
    .fade {animation-name: fade; animation-duration: 1.5s;}
    @keyframes fade {from {opacity: .4} to {opacity: 1}}

    .col-image {
        position: absolute; top: 135px; max-height: 220px; width: 100%; background-color: white;
        border-top: 7px solid white; 
    }
     
    .col-text{
        position: relative; min-width: 100%; z-index: 10; top: 220px; height: 220px; 
        color: white;  background-image: linear-gradient(#0398d2 0px, #02648b 100%);
        line-height: 24px; font-size: min(2.70vw, 20px); padding: 25px 10px 20px 20px;
        border-top: 7px solid white; 
    }  
    
    .col-text-beh{
        width: 70%; color: white; z-index: 10; border-right: 7px solid white;
        font-size: min(2.70vw, 20px); margin-top: 7px; padding: 4% 30px 30px 30px;
        background-image: linear-gradient(#0398d2 0px, #02648b 100%); line-height: 24px;
    }
    .col-text-om-L{
        width: 60%; color: white; z-index: 10; border-right: 7px solid white;
        font-size: min(2.70vw, 20px); margin-top: 7px; padding: 4% 30px 30px 30px;
        background-image: linear-gradient(#0398d2 0px, #02648b 100%); line-height: 24px;
    }
    .col-text-om-R{
        width: 100%; color: white; z-index: 10; border-left: 0px solid white;
        font-size: min(2.70vw, 20px); margin-top: 7px; padding: 4% 30px 30px 30px;
        background-image: linear-gradient(#0398d2 0px, #02648b 100%); line-height: 24px;
    }
    .col-image-om-L {display: none;}
    .col-menu{width: 100%;}
    #menu_item:hover {background-image: linear-gradient(#49A6D2 0%, #49A6D2 91%, #466a99 91%, #466a99 100%); background-color: #49A6D2;}
    #menu_item{
        display: block; float: left; width: 24%; height: 67px; border-bottom: 10px;
        background-color: #287ea4; background-image: linear-gradient(#287ea4 0%, #287ea4 91%, #466a99 91%, #466a99 100%);
        text-align: center; line-height: 67px; text-transform: uppercase; text-decoration: none;
        font-size: min(2.0vw, 1.1em); font-family: arial; font-weight: bold; color: white;
    }
      
    .beh_item:hover{background-color: #287ea4;}
    .beh_item{
        display: block; position: relative; width: 94%; height: 45px; margin: 10px 0px 10px 0px;
        background-color: #005f85; border: 1px solid #056b94; 
        text-transform: uppercase; font-size: 0.8em; font-family: arial; font-weight: bold;
        text-align: center; line-height: 3.4em; cursor: pointer; color: white;
    }
    .beh_itemC{
       width: 97%; margin-bottom: 0px; 
    }
    .break{display: none;}
    .beh_image_L{width: 50%; float: left; padding: 5px 4px 0px 0px;}
    .beh_image_C{width: 100%; float: left; padding: 5px 5px 5px 0px;}
    .beh_image_R{width: 50%; float: left; padding: 5px 12px 0px 0px;}
    .beh_TRkit_table{ width: 100%; text-align: center; margin: 0px;}
    .beh_TRkit_cell{width: 50%; max-width: 50%; margin: 0px; padding: 5px 5px 30px 5px;}
    .beh_blek_table{width: 98%; background-image: url("Images/bleaching.png"); background-repeat: no-repeat; background-position: right bottom; background-size: auto 75%; background-color: white;}
    .beh_blek_cell{font-size: smaller; width: 33%; vertical-align: top; border-spacing: 5px; padding: 10px 10px 10px 10px; background-color: #0397d1;}
    .beh_menu_stylingC{position: relative; width: 100%; padding-top: 5px; padding-left: 20px; margin-right: 0px; height: 100%; color: white; background-color: #0398d2;}
    .beh_menu_stylingL{position: relative; width: 50%; padding-left: 20px; padding-top: 10px; height: 100%; color: white; border-top: 0px solid white; border-bottom: 3px solid #0398d2; background-color: #0398d2;}
    .beh_menu_stylingR{position: relative; width: 50%; height: 100%; padding-top: 10px; color: white; border-top: 0px solid white; border-bottom: 3px solid #0398d2; background-color: #0398d2;}
    .hide_panel{display: none; font-size: min(2.65vw, 24px);}
    .panel_wrap{display: block; width: 100%; height: 100%; color: white; background-color: transparent;}
    .panelImage{display: none;}
    .panelText{
        display: inline-block; position: relative; background-color: #02668e; 
        width: 100%; height: 100%; padding: 20px 10px 20px 20px;  min-height: 1200px;
        background-image: linear-gradient(#0398d2 0px, #02648b 100%)
    }
    .hide_img{display: contents}
}


/* ------- */
/* DESKTOP */
/* ------- */

  
@media only screen and (min-width: 860px) {
    body{height: 100%; background-image: linear-gradient(white 0px, white 59px, #00b4fb 59px, #01a7e9 120px,#466a99 120px, #466a99 126px, white 126px, white 133px, #0398d2 133px, #02648b 100%);}
    hr{height: 5px; width: 98%; margin: 9px 0px 18px 0px; background-color: white; border: 0px solid #0398d2;}
    .hide_scroll{-ms-overflow-style: none;  /* Internet Explorer 10+ */ scrollbar-width: none;  /* Firefox */}
    .hide_scroll::-webkit-scrollbar {display: none;  /* Safari and Chrome */}

    .hours{
        height: 100%; width: 100%; margin-top: 10px; top: 355px; padding-top: 7px;
        display: block; position: relative; background-color: white; z-index: 10; 
    }
    .hoursrow{
        min-height: 1700px;
    }
    .rubrik{display: block; color: white; background-color: #005f85; margin-top: -3px; padding: 10px; text-align: center;}
    .table_openinghours{width: 100%; height: 220px; margin-top: 25px; padding: 27px 0px 0px 0px;}
    .td_openinghours{color: white; background-color: #0398d2; padding: 8px 10px 8px 14px;  line-height: 22px;}
    .td_openinghours_details{ color: white; padding: 8px 10px 8px 14px;  line-height: 22px;}
    
    .index_nav_map_hours{display: none;}
        
    [class*="col-"]{float: left; padding: 0px;}
    .row::after{content: ""; clear: both; display: table;}
    .row{display: flex;}

    /* Social row styling*/
    .soc_table{float: right; margin-right: 0px;}
    .soc_col_text{width: 75px; text-align: right;}
    .soc_col_img{padding: 0px 0px 0px 16px;}
    .soc_block_link{display: block; text-decoration: none; font-size: 0.9em;}
    .col-social {width: 100%; float: right; margin-top: 10px; margin-bottom: 8px; font-size: 0.9em; font-family: sans-serif; color: black;}
    
    .col-logo {min-width: 180px; width: 15%; background-color: white;}      
    .col-image-beh { margin-top: 7px; position: relative; width: 35%; background-image: url("Images/beh.jpg"); background-size: cover; background-position-x: 100%;}
    .col-image-om { margin-top: 7px; position: relative; width: 40%; background-image: url("Images/kliniken.jpg"); background-size: cover; background-position-x: 65%;}
    .col-image-om-L { margin-top: 0px; border-top: 7px solid white; position: relative; width: 40%; background-image: url("Images/kliniken2.jpg"); background-size: cover; background-position-x: 83%;}
    /* Index slideshow related*/
    .slidestyle{width: 100%; width: 585px; height: 430px; max-height: 430px; object-position: 20% 70%; object-fit: cover;}
    .col-image{
        position: relative; left: 375px; top: 0px; height: 72px; max-height: 440px; width: 60%; background-color: transparent;
        border-top: 7px solid white; 
    }
    .break{display: block;}
    .col_text_limit{display: inline-block; max-width: 475px;}
    .col-text{
        width: 375px; position: absolute; top: 126px; max-width: 475px; z-index: 10; min-height: 440px; max-height: 476px; 
        color: white; background-image: linear-gradient(#0398d2 0px, #02648b 100%);
        line-height: 24px; font-size: min(2.70vw, 20px); padding: 25px 20px 20px 25px;
        border-top: 7.3px solid white; border-right: 7px solid white;
    }  
    
    .col-text-beh{
        width: 70%; color: white; z-index: 10; border-right: 7px solid white;
        font-size: min(2.70vw, 20px); margin-top: 7px; padding: 30px 30px 30px 30px;
        background-image: linear-gradient(#0398d2 0px, #02648b 100%); line-height: 24px;
    }
    .col-text-om-L{
        width: 60%; color: white; z-index: 10; border-right: 7px solid white;
        font-size: min(2.70vw, 20px); margin-top: 7px; padding: 30px 30px 30px 30px;
        background-image: linear-gradient(#0398d2 0px, #02648b 100%); line-height: 24px;
    }
    .col-text-om-R{
        width: 60%; color: white; z-index: 10; border-top: 7px solid white; border-left: 7px solid white;
        font-size: min(2.70vw, 20px); margin-top: 0px; padding: 30px 30px 30px 30px;
        background-image: linear-gradient(#0398d2 0px, #02648b 100%); line-height: 24px;
    }

    .col-menu{width: 100%;}

    #menu_item:hover {background-image: linear-gradient(#49A6D2 0%, #49A6D2 91%, #466a99 91%, #466a99 100%); background-color: #49A6D2;}
    #menu_item{
        display: block; float: left; width: 24%; height: 67px; border-bottom: 10px;
        background-color: #287ea4; background-image: linear-gradient(#287ea4 0%, #287ea4 91%, #466a99 91%, #466a99 100%);
        text-align: center; line-height: 67px; text-transform: uppercase; text-decoration: none;
        font-size: min(1.6vw, 1.1em); font-family: arial; font-weight: bold; color: white;
    }
      
    .beh_item:hover{background-color: #287ea4;}
    .beh_item{
        display: block; position: relative; width: 94%; height: 45px; margin: 10px 0px 10px 0px;
        background-color: #005f85; border: 1px solid #056b94; 
        text-transform: uppercase; font-size: 0.9em; font-family: arial; font-weight: bold;
        text-align: center; line-height: 3.1em; cursor: pointer; color: white;
    }

    .beh_itemC{
       width: 97%; margin-bottom: 0px;
    }

    .beh_image_L{width: 50%; float: left; padding: 25px 0px 0px 0px;}
    .beh_image_C{width: 100%; float: left; padding: 25px 0px 15px 0px;}
    .beh_image_R{width: 50%; float: left; padding: 25px 0px 0px 0px;}
    .beh_TRkit_table{ width: 100%; text-align: center; margin: 0px;}
    .beh_TRkit_cell{width: 50%; max-width: 50%; margin: 0px; padding: 5px 5px 30px 5px;}
    .beh_blek_table{width: 98%; background-image: url("Images/bleaching.png"); background-repeat: no-repeat; background-position: right bottom; background-size: auto 100%; background-color: white;}
    .beh_blek_cell{font-size: smaller; width: 33%; vertical-align: top; border-spacing: 10px; padding: 10px 10px 10px 10px; background-color: #0397d1;}
    .beh_menu_stylingC{position: relative; width: 100%; padding-top: 5px; padding-left: 20px; margin-right: 0px; height: 100%; color: white; background-color: #0398d2;}
    .beh_menu_stylingL{position: relative; width: 50%; padding-left: 20px; padding-top: 10px; height: 100%; color: white; border-top: 0px solid white; border-bottom: 3px solid #0398d2; background-color: #0398d2;}
    .beh_menu_stylingR{position: relative; width: 50%; height: 100%; padding-top: 10px; color: white; border-top: 0px solid white; border-bottom: 3px solid #0398d2; background-color: #0398d2;}
    .hide_panel{display: none; font-size: min(2.65vw, 24px);}
    .panel_wrap{display: block; width: 100%; height: 100%;}
    
    .panelText{
        display: inline; float: left; position: relative; background-color: transparent; 
        width: 100%; height: 100%; min-height: 2000px; padding: 20px 10px 20px 25px;        
        font-size: min(2.1vw, 20px); left: 0px; color: white;
    }
}
/* =====================================================================
   ÖPPETTIDER — läggs till sist i styling.css
   =====================================================================
   Rör inga befintliga regler. Allt nytt har prefixet .oh- utom de tre
   regler som justerar .table_openinghours och .td_openinghours, och de
   är markerade nedan.
   ===================================================================== */

/* Tabellen och sidorutan ligger bredvid varandra i stället för att
   sidorutan är en cell i tabellen. Som rowspan-cell bestämde den
   tabellens höjd, och på en telefon sträcktes varje veckodag ut för att
   matcha meddelandet bredvid. */
.oh-wrap{
  display:flex; align-items:stretch; gap:0;
  /* .hours har vit bakgrund på dator. Tidigare täcktes den helt av
     tabellen (fast höjd 220px) och detaljcellen. Nu är tabellen kortare
     än meddelandespalten bredvid, och då lyste ett vitt fält igenom
     under den. Sidans egen gradient läggs därför här. */
  background-image:linear-gradient(#0398d2 0px, #02648b 100%);
}
/* Vitt bara bakom tabellen — det är mellanrummen mellan cellerna som
   blir de vita linjerna. align-self:flex-start gör att det vita slutar
   där tabellen slutar. */
/* Tabellen sträcks till samma höjd som sidorutan.

   align-self:stretch tillsammans med height:100% på tabellen gör att
   raderna delar på den höjd som finns — de fördelas jämnt i stället för
   att sluta halvvägs och lämna ett tomt fält under.

   Blir sidorutan kortare än tabellens naturliga höjd är det i stället
   sidorutan som sträcks, eftersom flexbox alltid utgår från det högsta
   av de två. Tabellen blir alltså aldrig högre än den behöver. */
.oh-tabell{ flex:0 0 auto; align-self:stretch; background-color:#fff; }
/* Vit ram runt sidorutan.

   Tabellens linjer är mellanrum mellan cellerna som visar den vita
   bakgrunden bakom. Sidorutan är inte längre en cell i tabellen och fick
   därför inga linjer alls — den flöt ihop med bakgrunden. En ram i samma
   bredd som cellmellanrummen återskapar intrycket. */
.oh-sido{ flex:1 1 auto; min-width:0; border:2px solid #fff; }

/* Måndagens två veckovarianter.

   På dator ryms båda på EN rad. Då blir alla veckodagar lika höga, och
   tidsspalten behöver inte vara lika bred — utrymmet går i stället till
   meddelanderutan, som har mer att säga.

   På mobil ryms de inte bredvid varandra; där ligger de kvar på var sin
   rad, se mobilblocket längst ned. */
.oh-tid-rad{ display:inline-block; white-space:nowrap; }
.oh-tid-rad + .oh-tid-rad{ margin-left:18px; }
.oh-vlabel{ display:inline-block; margin-right:6px; font-weight:bold;
            opacity:.85; font-size:0.86em; }

/* Dagens rad markeras, så att man ser var man är. */
tr.oh-idag .td_openinghours{ background-color:#0aa9e8; font-weight:bold; }

/* Meddelandet från portalen. */
.oh-medd{ background:rgba(255,255,255,0.14); border-left:4px solid #fff;
          padding:10px 13px; margin:0 0 12px; }
.oh-medd-rubrik{ font-weight:bold; font-size:1.06em; margin-bottom:5px; }
.oh-medd-text{ line-height:1.45; }

/* Avvikande dagar. */
.oh-avvik-rubrik{ font-weight:bold; font-size:0.92em; text-transform:uppercase;
                  letter-spacing:.02em; opacity:.85; margin-bottom:4px;
                  white-space:nowrap; }
.oh-rad{ display:flex; gap:10px; padding:4px 0;
         border-bottom:1px solid rgba(255,255,255,0.32); }
.oh-rad:last-child{ border-bottom:none; }
.oh-datum{ flex:0 0 auto; min-width:104px; font-weight:bold; white-space:nowrap; }
.oh-txt{ flex:1; }
.oh-tom{ opacity:.9; padding:4px 0 6px; }
.oh-mer{ display:block; margin-top:8px; font-size:0.9em; opacity:.9; color:#fff !important; }

/* Telefon och Facebook. */
.oh-kontakt{ margin-top:12px; padding-top:10px;
             border-top:2px solid rgba(255,255,255,0.75); }
.oh-tel{ display:block; font-size:1.5em !important; font-weight:bold;
         color:#fff !important; letter-spacing:.01em; }
.oh-fb{ display:inline-flex; align-items:center; gap:8px; margin-top:10px;
        color:#fff !important; font-size:0.92em; opacity:.92; }

/* På dator delar telefonnumret och Facebook-länken rad — det finns
   gott om bredd, och numret behöver inte en hel rad för sig. På mobil
   staplas de, se mobilblocket längst ned. */
@media only screen and (min-width: 860px) {
  .oh-kontakt{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
  .oh-tel{ margin:0; }
  .oh-fb{ margin-top:0; }
}

/* Telefon och Facebook delar rad — även på mobil.

   Sidan skalas ned i stället för att brytas om, så bredden räcker även
   på en telefon. Att stapla dem där gjorde bara rutan högre utan att
   lösa något. */
.oh-kontakt{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.oh-fb{ margin-top:0; }

/* --- justeringar av befintliga klasser --- */
/* Den inbakade margin-top:-25px balanserade padding:27px. Båda är borta
   i den nya markupen; utan detta kryper tabellen upp över rubriken. */
.table_openinghours{ padding-top:2px !important; margin-top:0 !important;
                     height:auto !important; }
.td_openinghours{ padding-top:5px !important; padding-bottom:5px !important; }
/* Tabellen tar den plats den behöver, sidorutan får resten.

   width:auto är nödvändigt: den befintliga regeln sätter width:100%, och
   då kunde tabellen inte växa för att rymma måndagens två veckotider på
   en rad — texten rann i stället ut över meddelanderutan bredvid. */
.table_openinghours{ width:auto !important; height:100% !important; }
.oh-dagnamn{ white-space:nowrap; }
.oh-dagnamn + .td_openinghours{ white-space:nowrap; }

/* ---- MOBIL ---- */
@media only screen and (min-width: 320px) and (max-width: 860px) {
  /* Sidorutan hamnar under tabellen i stället för bredvid. */
  .oh-wrap{ display:block; }
  .oh-tabell, .oh-sido{ width:100%; }
  .oh-sido{ background-image:linear-gradient(#0398d2 0px, #02648b 100%); }

  /* De vita linjerna är mellanrum mellan cellerna, inte ramar — på dator
     lyser den vita .hours-bakgrunden igenom, men på mobil är den
     transparent. Tabellen får därför en egen vit botten. */
  .table_openinghours{ background-color:#fff; width:100% !important;
                       height:auto !important; }
  /* Alla dagar lika höga. Måndag har två rader och blir annars högre än
     de andra, vilket får tabellen att se ojämn ut. */
  .td_openinghours{ padding:8px 10px 8px 12px !important; height:58px; vertical-align:middle; }
  /* Måndag har två rader och blir annars högre än de andra. En fast
     radhöjd gör tabellen jämn — texten centreras i cellen. */
  .oh-dagnamn{ white-space:normal; }
  .oh-dagnamn + .td_openinghours{ white-space:normal; }
  .oh-tid-rad{ display:block; }
  .oh-tid-rad + .oh-tid-rad{ margin-left:0; }
  .oh-vlabel{ min-width:54px; margin-right:4px; }

  .oh-avvik-rubrik{ font-size:0.82em; }
  .oh-tid-rad{ font-size:0.95em; }

  /* Datum och text på varsin rad — i en smal spalt bröts annars
     "Öppet 10.00 - 15.00" mitt itu bredvid datumet. */
  .oh-rad{ display:block; padding:3px 0; }
  .oh-datum{ display:block; min-width:0; }
  .oh-txt{ display:block; }

  .oh-medd{ padding:9px 11px; margin-bottom:10px; }
  .oh-medd-text{ line-height:1.35; }
  .oh-sido{ padding:12px 14px !important; }
  .oh-kontakt{ margin-top:10px; padding-top:9px; gap:12px; }
}