h1 { font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 42px; color: #223347; line-height: 44px; font-weight: 700; }
h2 { font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 28px; color: #223347; line-height: 32px; font-weight: 600; }
h3 { font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 20px; color: #223347; line-height: 24px; font-weight: 500; }
p { font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 16px; color: #4f5966; line-height: 24px; font-weight: 400; }
li { font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 16px; color: #4f5966; line-height: 24px; font-weight: 400;  }body { background: #ffffff; font-size: 10px; font-family: -apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif; color: #4f5966; line-height: 24px; font-weight: 400; }
a:link { text-decoration: underline; color: #2c60a3; font-weight: 400; }
a:visited { text-decoration: underline; color: #2c60a3; font-weight: 400; }
a:active { text-decoration: underline; color: #253952; font-weight: 400; }
a:hover { text-decoration: none; color: #253952; font-weight: 400; }
a:focus { text-decoration: none; color: #253952; font-weight: 400; }
.navbar-default li { font-family:-apple-system, BlinkMacSystemFont, "San Francisco", "Segoe UI", Roboto, "Helvetica Neue", sans-serif; font-size: 16px; text-transform:none; }
.navbar-default .navbar-toggle .glyphicon {color: #455161;}
.navbar-default .navbar-toggle .icon-bar {background-color: #455161;}.navbar-default .navbar-nav>li a { color:#455161; text-decoration:underline; font-weight:600; }
.navbar-default .navbar-nav>li a:hover { color:#2b558c; text-decoration:none; font-weight:600; }
.navbar-default .navbar-nav>li.active a:hover { color:#2b558c; text-decoration:none; font-weight:600; }
.navbar-default .dropdown-menu>li a:hover { color:#2b558c; text-decoration:none; font-weight:600; }
.navbar-default .navbar-nav>li a:focus { color:#2b558c; text-decoration:none; font-weight:600; }
.navbar-default .navbar-nav>li.active a:focus { color:#2b558c; text-decoration:none; font-weight:600; }
.navbar-default .dropdown-menu>li a:focus { color:#2b558c; text-decoration:none; font-weight:600; }
.navbar-default .navbar-nav>.active>a { color:#455161; text-decoration:none; font-weight:600; }
.navbar-default .dropdown-menu>li.active a { color:#455161; text-decoration:none; font-weight:600; }
.navbar { margin-bottom:0px; }
header { margin-bottom:0px; position:relative; }
/******************* theme color - se i anteckningarna vad dessa globala inställningarna gör ******************************/
:root {
  --primary-color: #2a3784;                          /*button, submit, menu active link, a:hover i footer, a*/
  --secondary-color: #462b1e;                        /*a:hover*/
  --text-color:#3f3f3f;                              /*all text*/
  --header-bkg: #fff;                             /*header, dropdown-menu, mobile slide*/
  --header-text-color: #3f3f3f;             /* Meny utan hover */
  --bg-color: #f1ecec;                               /* bakgrund */
  --footer-color: #f1ecec;                           /* footerns bakgrund */
  --button-radius:2em;                               /*ställer in rundheten på alla knappar*/
  --page-width:1170px;                               /*max page width  (Sidans storlek) obs måste också ändra under "PAGE WIDTH"*/
  --top-margin: 60px;                                /*margin på toppen av alla sidor - OBS får inte var 0 utan måste isf vara 0px */
  --primary-font: adobe-garamond-pro, serif;         /*all text, p, html button etc.*/
  --secondary-font: sofia-pro, sans-serif;           /*Headings h1, h2, h3, h4*/
  --thin-font: 400;                                  /*tunnare font weight */
  --bold-font: 700;                                  /*fetare font weight */
  --light-color:#fff;
}


.wpb_button, .wpb_content_element, ul.wpb_thumbnails-fluid>li {
    margin-bottom: 15px!important;
}

.empty-75 {height:32px!important;}

/******************* dark theme color - om sidan är mörk gäller följande ******************************/
.grecaptcha-badge {visibility: hidden;}

[data-theme="dark"] {
  --text-color:#ffffff;                               /*all text*/
  --header-bkg: #222;                                 /*header, dropdown-menu, mobile slide*/
  --header-text-color:var(--text-color);              /* Meny utan hover */
  --bg-color: #222;                                   /* bakgrund */
  --footer-color: #101520;                            /* footerns bakgrund */
}



/****************** general ***********************************/

#page {overflow-x: hidden;}

#content ul {
   list-style: outside;
   margin-left: 2em;
   margin-bottom: 15px;
}

body { background-color: var(--bg-color)!important; }

.home .entry-content {margin-top:0;}

.navbar-default .navbar-nav>.open>a, .navbar-default .navbar-nav>.open>a:focus, .navbar-default .navbar-nav>.open>a:hover {    background-color: transparent!important;}

/******************* text ************************************/

h1, h2, h3, h4 { text-wrap: balance; }

h1 {font-size:40px; line-height:48px;
font-family:var(--primary-font); color:var(--primary-color); font-weight: var(--thin-font);   }

h2 {font-size:24px; line-height:38px;
font-family:var(--primary-font); color:var(--text-color); font-weight: var(--thin-font);  }

h3 {font-size:23px; line-height:38px;
font-family:var(--primary-font); color:var(--text-color); font-weight: var(--thin-font); }

h4 {font-size:23px; line-height:38px;
font-family:var(--secondary-font); color:var(--text-color); font-weight: var(--thin-font); }

a, i {transition: all 0.3s ease;  }
a:link, a:visited {color:var(--primary-color);}
main a:link:hover {text-decoration:underline;     color:var(--secondary-color);}

body, p, li, #content form.wpcf7-form input, #content form.wpcf7-form textarea, .with_frm_style .frm_primary_label {font-size:16px; line-height:24px; text-wrap: pretty;
color:var(--text-color); font-family:var(--primary-font); font-weight: var(--thin-font); }
.white *, .white a, .white a:hover, main .white a:link:hover {color:var(--light-color);}

.forlag p { font-family:var(--secondary-font); font-weight: var(--thin-font); text-transform: uppercase; font-size: 18px; }
.small p {font-size:12px; line-height:15px;}
.italic { font-style: italic;  color:var(--secondary-color); }

/**************** header ***************************/

#header {position:fixed; width:100%; transition: all 0.3s ease; background: var(--header-bkg);}
#header .container-fluid { padding:15px 0;     display: flex;   align-items: center; justify-content: space-between;}
#header .navbar-default { background-color:transparent!important;}
.menu-main-container { transition: all 0.3s ease; float: right;}

/*logotyp*/
.logoholder {max-width:200px;}
.logoholder a img { transition:all 0.3s ease; width:100%; }



body.page-id-44 #footer {
    display: none !important;
}


/********** header scrolled ************/
#header.menu-scroll {box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;}
#header.menu-scroll .logoholder a img {width:160px; }

/*************************** header menu text *************************/

#header .navbar-default .navbar-nav>li a {text-decoration:none; font-size:14px; text-transform:uppercase; 
font-family:var(--primary-font);  color:var(--header-text-color); position:relative; }
#header .navbar-default .navbar-nav>.active>a, #header .navbar-default .navbar-nav>li a:hover, #header .navbar-default .navbar-nav>li.active a:hover, #header .navbar-default .dropdown-menu>li.active a, #header .navbar-default > .navbar-nav>li.active a {color:var(--primary-color);}

/************** arrow in menu desktop ***************************/

.dropdown button {    position: absolute;    top: 50%;right: 4px;    transform: translateY(-50%);     background: transparent;   border: 0;     width: 24px;}
.dropdown button i {color:var(--header-text-color);}
.current_page_item.dropdown >button> i, .dropdown a:hover  + button> i  {color:var(--primary-color);}
.dropdown  {margin-right: 15px;   padding-right: 5px; }

/******************** fix from theme ************************/
.dropdown-menu>li>a {padding:10px 20px;}
.dropdown-menu>.active>a, .dropdown-menu>.active>a:focus, .dropdown-menu>.active>a:hover {background-color: transparent;}
.dropdown-menu>li>a:focus, .dropdown-menu>li>a:hover {background-color: transparent;}
#header .navbar-default .navbar-toggle {border-color: transparent;}
#header .navbar-default .navbar-toggle:focus, #header .navbar-default .navbar-toggle:hover {  background-color: transparent;}
.dropdown-menu>.active>a {background:transparent;}
#header .container-fluid:after, #header .container-fluid:before, #header .container-fluid .nav:before, #header .container-fluid .nav:after { content: none; }


/*PAGE WIDTH  Ändra när page width används ---- OBS ändra pixlarna i min-width-queryn om du har ändrat var(--page-width) i de globala inställningarna**/
@media all and (min-width: 1200px) {
/*default*/
.wpb_row:not([data-vc-full-width]):not([data-vc-stretch-content]) , .vc_section:not([data-vc-full-width]):not([data-vc-stretch-content]) {  
  margin-left: calc((100% - var(--page-width)) / 2)!important;  margin-right: calc((100% - var(--page-width)) / 2)!important;  }

/*stretch row*/
.wpb_row[data-vc-full-width], .vc_section[data-vc-full-width] {  padding-left: calc((100% - var(--page-width)) / 2)!important;  padding-right: calc((100% - var(--page-width)) / 2)!important;    }

/*stretch row and content and innerrow*/
.wpb_row[data-vc-stretch-content],.vc_section[data-vc-stretch-content],.vc_section[data-vc-stretch-content] .wpb_row, .wpb_row[data-vc-stretch-content] .vc_inner, .wpb_row[data-vc-full-width] .vc_inner, .wpb_row:not([data-vc-full-width]) .vc_inner, .wpb_row:not([data-vc-stretch-content]) .vc_inner, .vc_section[data-vc-stretch-content] .vc_inner, .vc_section[data-vc-full-width] .wpb_row, .vc_section:not([data-vc-full-width]) .wpb_row, vc_section:not([data-vc-stretch-content]) .vc_inner {
 padding-left: 0!important;  padding-right: 0!important; margin-left: 0!important;  margin-right: 0!important;}

#footer .container-fluid {max-width: var(--page-width);    width: var(--page-width);   margin: auto!important;}
#header .container-fluid {max-width: var(--page-width);    width: var(--page-width);   margin: auto!important;}
#video-section #on-top-video {max-width: var(--page-width);    width: var(--page-width);   margin: auto!important;}
}

div.container-fluid {    padding-left: 15px;    padding-right: 15px;}


/***************DARK MODE SWITCH*******************/
.theme-switch-wrapper { display: flex; align-items: center; }
.theme-switch-wrapper p { margin-left: 10px; margin-bottom: 0px; }
.theme-switch { display: inline-block; height: 34px; position: relative; width: 60px; }
.theme-switch input { display:none; }
.slider { background-color: #ccc; bottom: 0; cursor: pointer; left: 0; position: absolute; right: 0; top: 0; transition: .4s; }
.slider:before { background-color: #fff; bottom: 4px; content: ""; height: 26px; left: 4px; position: absolute; transition: .4s; width: 26px; }
input:checked + .slider { background-color: #66bb6a; }
input:checked + .slider:before { transform: translateX(26px); }
.slider.round { border-radius: 34px; }
.slider.round:before { border-radius: 50%; }



/************hamburger menu icon***************/
.navbar-default .navbar-toggle .icon-bar {  background-color: var(--header-text-color);}

/*********** content ***************/
.entry-content {margin-top:var(--top-margin);} /*the height of the header*/
body #contentholder {    min-height: calc(100svh - 153px);} /*100svh -  footer*/
.wpb_gmaps_widget {margin-bottom:0!important;}
.wpb_gmaps_widget .wpb_wrapper {padding:0!important;}

#wide { background-blend-mode:soft-light; background-color: rgb(255 255 255 / 40%); }
#mobile { background-blend-mode:soft-light; background-color: rgb(255 255 255 / 60%); }

#start_inside {background:#f4f3ef; padding:75px 0 30px 0;}
.darker {background-blend-mode:soft-light; background-color:rgba(0,0,0,0.2);}

#ikonrow {    position: absolute;    bottom: 10px;    transform: translateX(-50%);    left: 50%;}


#wide {display: block;}
#mobile {display: none;}

#mobile { background-attachment: fixed; }

#color-row { background:var(--primary-color)!important; }

.good > div {padding-top:20px!important; padding-bottom:5px;}

#top-section {  height:173px;  position:relative; background-image: url(/files/apple.jpg) !important;  
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important; padding-top:0px; padding-bottom:90px;     position: fixed !important;    z-index: 111; width:100%; left:0!important; right:0!important;}

#top-section .textwidget h2, #top-section .textwidget p {padding-left:15px;}
#top-section.vc_row {    margin-left: 0!important;    margin-right: 0!important;}
#text-5 {position: absolute;    z-index: 1111; top:74px;}

#custom_html-2 {position: absolute;   top: 0;    left: 0;   width: 100%;}

#trad .wpb_text_column, #trad .wpb_single_image  {margin:0!important; padding:0!important;}
#trad .vc_column-inner  {padding-top:0!important;}
#trad p {font-size:14px; line-height:20px;}
#trad .wpb_single_image img {  aspect-ratio: 3 / 2;    object-fit: cover;}
 .mickebella {        margin-top: -111px;    }

.streck-down {transform: rotate(90deg);    width: 29px!important;}
.sterck-lang {        transform: translate(-248px);    width: 410px !important;}
.streck-down-2 {    width: 119px!important;   transform: rotate(90deg) translate(2px); margin-bottom:0!important;}
.streck-down-three {       width: 124px !important;   transform: rotate(90deg) translate(-44px);}

#tidningar-press ul {    column-count: 2; margin-left:5px;}

#tidningar-press li {   font-size: 14px;    line-height: 18px;    margin-bottom: 5px; }

.page-id-763 #footer { display: none; }



/* Play-symbol istället för punkter */
.page-id-374  #content ul {
    list-style: none;   /* tar bort vanliga punkter */
    padding-left: 0;    /* valfritt: tar bort indrag */
  }

.page-id-374  #content li {
    margin: 0.25em 0;   /* lite luft mellan raderna */
  }

.page-id-374  #content li i {
    margin-right: 0.5em; /* lite avstånd mellan ikon och text */
  }


.social-icons { display: flex; justify-content: space-between; max-width: 200px; width:120px; margin: 0 auto; align-items: center;} .social-icons i { font-size: 30px; color: #fff; transition: color 0.3s;} .social-icons a:hover i { color: var(--secondary-color);}




/* Playknappar */
.video-container {
    position: relative; display: inline-block;
}
.video-container .vc_icon_element { position: absolute !important; top: 40%; left: 50%; transform: translate(-50%, -50%); font-size: 60px; color: #ffffff; cursor: pointer; z-index: 10;
}


/* badge */
.relative-top-img {
    position: relative;
}
.overlap-img {
    position: absolute;
    bottom: -90px;   /* justera hur mycket den ska sticka ner */
    left: 80%;       /* centrera */
    transform: translateX(-50%);
    z-index: 10;     /* ligga ovanpå raden under */
    width: 90px;    /* sätt önskad bredd */
    height: auto;    /* behåll proportionerna */
}

/* badge större */
.relative-top-img-stor {
    position: relative;
}
.overlap-img-stor {
    position: absolute;
    bottom: -80px;   /* justera hur mycket den ska sticka ner */
    left: 80%;       /* centrera */
    transform: translateX(-50%);
    z-index: 10;     /* ligga ovanpå raden under */
    width: 120px;    /* sätt önskad bredd */
    height: auto;    /* behåll proportionerna */
}




/* app */

.ca-relative { position: relative; }
.ca-flex { display: flex; }
.ca-flex-col { flex-direction: column; }
.ca-mt-32 { margin-top: 8rem; }

/* Video fyller ytan */
#ca-video {
    width: 100%;
    height: auto;
    display: block;
}

/* Telefonbilden i mitten, initialt dold */
.ca-phone-img {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    height: 0;
    transition: all 1s ease;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Text och animation i mitten */
.ca-text-wrapper {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: opacity 0.5s ease;
}

/* Ping-animation (ersätter Tailwind animate-ping) */
.ca-ping {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(59, 130, 246, 0.2); /* bg-primary/20 */
    border-radius: 1.5rem;
    scale: 0.75;
    animation: ca-ping 2s cubic-bezier(0, 0, 0.2, 1) infinite;
}

@keyframes ca-ping {
    0% { transform: scale(0.75); opacity: 1; }
    100% { transform: scale(2); opacity: 0; }
}

/* Textbubblan */
.ca-text-bubble {
    position: relative;
    background-color: rgba(59, 130, 246, 0.5); /* bg-primary/50 */
    padding: 2rem;
    border-radius: 1.5rem;
    z-index: 10;
}

/* Texten */
.ca-text {
    color: white;
    font-size: 1.125rem;
}

.hero-video {
  width: 100%;
  height: 55vh;          /* desktop-höjd */
  max-height: 650px;
  min-height: 420px;
  object-fit: cover;    /* superviktigt */
  display: block;
}


/*********** SLIDESHOW / BILDSPEL i fullbredd **********************/
#slideshow {min-height: 100dvh; background-blend-mode:soft-light; background-color:rgba(0,0,0,0.6)!important; position:relative;}
#slideshow .metaslider .slides img { width: 100vw!important; display: block; height: 100dvh!important; object-fit: cover; }
#slideshow .vc_column_container>.vc_column-inner {padding:0!important;}
#slideshow .wpb_button, #slideshow  .wpb_content_element {margin:0!important;}
#slideshow .metaslider .slides img {
    filter: brightness(0.8); /* 50% ljusstyrka */
}

#video-text-over {position:absolute;  z-index: 111;    top: 50%;    left: 50%;    transform: translate(-50%, -50%);}
#video-text-over * {color:#fff;}
#video-text-over {
    width: 80%;
}

/* All text i overlay ska vara vit */
#video-text-over p,
#video-text-over span,
#video-text-over strong {
    color: #fff;
}

/* Länkar i overlay */
#video-text-over a { color: #fff; transition: color 0.3s ease;
}

/* Länkar hover */
#video-text-over a:hover { color: var(--primary-color);
}

/* Ikoner i overlay */
#video-text-over i { color: #fff; transition: color 0.3s ease;
}

/* Ikoner hover */
#video-text-over i:hover { color: var(--primary-color);
}

.metaslider .flex-control-nav {margin-bottom: 50px!important;}



/**********tables*************/

table {width:100%;}
td {padding:10px 0;}
td:nth-child(1) {    width: 70%;}
td:last-child {    text-align: right;}
tr {border-bottom:1px solid #ccc;}


/***********mallar från base.cmsp.se**********/

/*video section*/
#video-section {height:calc(100svh - var(--top-margin))!important;  position: relative;}
#video-section #on-top-video{position:absolute; top:50%; left:50%; transform:translate(-50%, -50%);        width: 100%;   }
#video-section video {    object-fit: cover; height:calc(100svh - var(--top-margin))!important;     filter: brightness(0.95);}
#video-section .wpb_raw_code {margin:0!important;}

/*tjanster-base*/
#tjanster-base * {  text-align:center;  color:#fff;}
#tjanster-base .wpb_text_column {    position: absolute;    top:50%;    left: 50%;    transform: translate(-50%, -50%);    width: 90%;    text-align: center;    pointer-events: none; margin-bottom:0!important;}

/*zooma in bild (byt ut id# eler .klass)*/
#tjanster-base .wpb_single_image {overflow:hidden;  margin:15px 0!important;}
#tjanster-base img {    aspect-ratio: 1 / 1; object-fit:cover; transition:all 0.3s ease; filter:brightness(0.9);}
#tjanster-base img:hover {transform:scale(1.1); }

/*finns ikon*/
#tjanster-base .wpb_raw_code {position: absolute;    bottom:30px;    right: 35px;    transform: translate(-50%, -50%); margin-bottom:0!important;  font-size:24px;  pointer-events: none;}


.centerme * {text-align:center;}
/***********end of mallar från base.cmsp.se**********/


/*********** btn - alla knappars utseende ***************/

.vc_btn3 {background-image:none!important; text-transform:uppercase; letter-spacing:1px; font-weight: var(--bold-font)!important; background:var(--primary-color)!important; color:#fff!important; border-radius:var(--button-radius)!important; padding:15px 30px!important; font-size:16px!important;     border: none !important; border-color: transparent; }
.vc_btn3:hover {    box-shadow: 0 20px 38px rgba(0,0,0,0.16)!important;    -ms-transform: translateY(-3px);    transform: translateY(-3px);    -webkit-transform: translateY(-3px);}

.vc_btn3.vc_btn3-size-md.vc_btn3-icon-right:not(.vc_btn3-o-empty) {    padding-right: 48px!important;}
.vc_btn3.vc_btn3-size-md.vc_btn3-icon-left:not(.vc_btn3-o-empty) {    padding-left: 48px!important;}


.secondbutton .vc_btn3 {
    opacity: 0.9;                /* startläge: lite genomskinlig */
    transition: opacity 0.3s ease;
}

.secondbutton .vc_btn3:hover {
    opacity: 1;                  /* hover: helt fylld */
}



/************ forms ************/
/*Globala inställningar för form*/
form {
 --form-padding: 6px;
 --form-text-indent: 0px;  
 --form-border-radius: 3px;
 --form-bkg:#fff;
}


body form.wpcf7-form .wpcf7-acceptance input[type="checkbox"] {width: auto !important; margin: 5px 10px 10px 0 !important;}


#content form.wpcf7-form label { width: 100%;  margin: 0 0 10px; font-weight:700;}
.with_frm_style .frm_primary_label { margin: 0 0 0px 0; font-weight:700;}
#content form.wpcf7-form label i {position: absolute; z-index: 1; margin-top: 45px; margin-left: 15px; opacity: .7; color:var(--text-color);}
#content form.wpcf7-form input, .with_frm_style input {padding: var(--form-padding)!important; font-weight: normal;  border-radius: var(--form-border-radius)!important; background:var(--form-bkg)!important;}
#content form.wpcf7-form textarea, .with_frm_style textarea {padding: var(--form-padding); font-weight: normal; height:80px; border-radius: var(--form-border-radius);  background:var(--form-bkg)!important;}
#content form.wpcf7-form .wpcf7-list-item {margin: 0 20px 0 0;}
#content form.wpcf7-form .wpcf7-radio .wpcf7-list-item label input[type="radio"],  #content form.wpcf7-form input[type="checkbox"] { width: auto; margin: 5px 10px 0 0;}
.frm_dropzone.frm_single_upload {max-width:100%; width:100%;}
.vertical_radio .frm_radio, .with_frm_style .vertical_radio .frm_checkbox {display:inline-block!important;     margin-right: 15px; }

.with_frm_style .frm_radio input[type=radio],  .with_frm_style .frm_checkbox input[type=checkbox] {padding:unset!important;}
input { accent-color:  var(--primary-color); }

#content form.wpcf7-form select, .with_frm_style select {width:100%; padding:var(--form-padding)!important; background:var(--form-bkg)!important;}
.frm_dropzone .dz-message {background:var(--form-bkg)!important;}
.wpcf7-list-item-label {font-weight:400;}
.wpcf7 input[type="file"] {text-indent:0!important;}

/*only contact form 7*/
#content form.wpcf7-form input {text-indent: var(--form-text-indent); }
#content form.wpcf7-form textarea {text-indent: var(--form-text-indent);}
/***** form submit *****/
#content form.wpcf7-form input[type="submit"], .frm_style_formidables-stilmall.with_frm_style .frm_submit button {width: auto; text-indent: 0; color: #fff; background:var(--primary-color)!important; border-radius:var(--button-radius)!important; border:none!important; 
transition: all 0.3s ease; text-transform: uppercase;   font-weight: var(--bold-font)!important;    letter-spacing: 1px; padding:15px 30px!important;    }
#content form.wpcf7-form input[type="submit"]:hover, .frm_style_formidables-stilmall.with_frm_style .frm_submit button:hover { box-shadow: 0 20px 38px rgba(0,0,0,0.16)!important;    -ms-transform: translateY(-3px);    transform: translateY(-3px);    -webkit-transform: translateY(-3px); color:#fff!important; } 



/********* Contact form response ************/
.wpcf7 form .wpcf7-response-output {margin: 0 0 35px; padding: 1em; text-align: center; }

/*404 page*/
.error404  #contentholder, .archive #contentholder{    display: flex;    justify-content: center;    align-items: center; padding:15px;}
/* Archive specific */
.archive #contentholder .container-fluid { width: 100%; }

.vc_tta-container ul {margin:0!important;}


/*********** footer ***************/
#footer { background: var(--footer-color);    }
#footer a:hover, #footer i:hover {color:var(--primary-color);}

/*************** footer text ****************/
#footer h4 {text-transform:uppercase; }
#footer .col-sm-3 i, .social i {font-size:24px; margin-right:10px;}

/********footer cms icons det som är under footer widgets ******/
#footer .fa-mobile-alt {display:none;}
.small, small {  font-size: 12px;}
.cms-icons {font-size: 16px; padding: 30px 0; opacity:0.5;}
.cms-icons .fas {font-size:12px;}
.cms-icons .fa-bolt {display: none;}
.cms-icons .cms-PB a:hover {text-decoration: underline;}
.cms-icons .cms-PB a {font-weight: 600; text-decoration: none;}
.cms-icons .fa-mobile-alt {display: none !important;}
.cms-icons .cms-SP {float: left; margin: 0;}


/***************media querys***************/

@media  (max-width: 1200px) {


.streck-down {transform: rotate(90deg);  }
.sterck-lang {        transform: translate(-248px);    width: 410px !important;}
.streck-down-2 {    width: 100%!important;   transform: rotate(90deg);}
.streck-down-three {      transform: rotate(90deg) translate(-44px);}
.page-id-44 .vc_section {    margin-left: 15px!important;    margin-right: 15px!important;}

}


/*************** change breaking point for mobile menu = ändra både denna queryn och den som kommer efter för att byta när hamburgaremenyn bryts*****************/
@media (min-width: 1101px) {
#header .navbar-default .dropdown-menu {   background: var(--header-bkg); }
.dropdown-menu.level-0 i {    transform: rotate(270deg);}
.dropdown-menu.level-0  button {      right: 0px!important; }

#three-columns p {column-count:3;}
#two-columns p {column-count:2;}

#top-section video {    transform: translateY(-114px);}

#overlayText__content {
        padding: 3rem!important;
        font-size: 1.5rem!important;
        line-height: 2rem!important;
    }

}




/*************** change breaking point for mobile menu *****************/
@media  (max-width: 1100px) {
h2 {    font-size: 27px;    line-height: 30px; }
.navbar-default ul.dropdown-menu .level-1 {position:static!important;}
#header .container-fluid {width:100%; max-width:100%; padding:0px; display:block;}
.dropdown {    margin-right: 0;  padding-right: 0;}
.center-text-mobile *, .center-text-mobile {text-align:center!important;}

.bg-bild {
    height: 250px !important;       /* höjden på kolumnen i mobilvy */
    background-size: cover !important; /* ser till att bilden beskärs snyggt */
    background-position: center center !important;
  }

body:not(.page-id-44) .vc_empty_space {
    height: 20px !important;
}

/* badge större */
.relative-top-img-stor {
    position: relative;
}
.overlap-img-stor {
    position: absolute;
    bottom: -75px;   /* justera hur mycket den ska sticka ner */
    left: 85%;       /* centrera */
    transform: translateX(-50%);
    z-index: 10;     /* ligga ovanpå raden under */
    width: 80px;    /* sätt önskad bredd */
    height: auto;    /* behåll proportionerna */
}

.bakgrundbild {
    height: 200px; 
    width: auto;  
}

.page-id-436 ul li {
        list-style: none !important;
        margin-left: 0 !important;
        padding-left: 0 !important;
    }






/***********header text*********/
#header .navbar-default .navbar-nav>li a {text-decoration:none; font-size:16px; line-height:19px; }
#header .navbar-nav {margin: 3rem 10px; float: none;}
#header .navbar-nav li { width: 100%; }

#header .navbar-collapse.collapse {        display: none !important;}
#header .navbar-collapse.collapse.in {        display:block !important; }
#header .navbar-header .collapse, #header .navbar-toggle {display:block !important;}
#header .navbar-header {float:none;}
#header .navbar-default {float: none; margin: .5rem 0 0 0;}

#header .container {    padding: 5px 0px 5px 5px;}
.logoholder a img {    width: 165px;     margin-top: 6px;}
.navbar-toggle {    margin-top: 15px;}
.menu-main-container {float:left;     padding-top: 20px;    padding-bottom: 20px;} 

.dropdown-menu {    position: static; display:block; min-width: 100%; }
.dropdown-menu.level-0 a{font-weight:400!important; text-align:left;}
ul.level-0, ul.level-1, ul.level-2 {    margin-bottom: 0;}

ul.level-0>li>a, ul.level-1>li>a, ul.level-2>li>a {  margin-left: 35px; white-space: normal;  word-break: break-word;   max-width: calc(100% - 35px); display: block; }
.navbar-default .navbar-collapse, .navbar-default .navbar-form {    border-color: transparent;}
.dropdown-menu.level-1 {margin-left:30px;}


.navbar-default .navbar-toggle .icon-bar {
   background-color: #111;
}

.dropdown-menu.level-0 > li > a {
  font-weight: 600 !important;
}



.active .icon-bar:nth-child(2) {
    display: block;
    position: relative;
    transform: rotate(-45deg);
    top: 6px; left: 0;
    transition: all 300ms;
}
.active .icon-bar:nth-child(3) {
   position: relative;
    transform: rotate(45deg);
    transition: all 300ms;
}
.active .icon-bar:nth-child(4) {
   display: none;
}
#header .navbar-default .navbar-toggle {
    border-color: transparent;
    margin-right: 0;
    position: relative;
    z-index: 10;
}
#header .navbar-default .navbar-toggle:focus, .navbar-default .navbar-toggle:hover {
    background-color: transparent;
}

body  .bottommenuwidget {display: block;}
body  .bottommenuwidget p {font-size: 12px; color: #fff; line-height: 1.25;}






/*******on arrow click, show submenu**********/
.dropdown button {display:block;}
.dropdown{    display: inline-block!important;}
ul.nav li.dropdown > ul.dropdown-menu {max-height:0; overflow:hidden; transition:all .5s ease; padding: 0!important;}
ul.nav li.dropdown > ul.dropdown-menu.openme {max-height:500px;}

.openme + .dropdown-menu {max-height:500px!important;}
.openme i {transform:rotate(180deg);}

.dropdown button {        right: 0;        top: 20px;        width: 100%;         padding: 10px;   }
.dropdown button i {float: right; margin-right:0px;}
.dropdown-menu.level-0 .dropdown button {top:15px;}



.menu-main-container , #header .navbar-nav {        max-width: 100%;    }

.nav .open>a, .nav .open>a:focus, .nav .open>a:hover {    background-color: transparent!important;    border-color: transparent!important;}

}

@media all and (min-width: 768px)  {
   
.streck-mobile ,.streck-down-three-mobile, .hide-desktop{display:none!important;}

#firstbook {width:90%!important;}

}

@media all and (max-width: 1024px)  {

 .mickebella {        margin-top: -95px;    }
}

@media all and (max-width: 767px)  {
.navbar-nav .open .dropdown-menu .dropdown-header, .navbar-nav .open .dropdown-menu>li>a , .navbar-nav .dropdown-menu .dropdown-header, .navbar-nav .dropdown-menu>li>a {padding: 7px 0 7px 0px;}
#header .navbar-default {border-color:transparent!important;}
#header .navbar-default .navbar-collapse, #header .navbar-default .navbar-form {    border-color: transparent;}
.navbar-default .navbar-nav .open .dropdown-menu>.active>a, .navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus, .navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover {background:transparent!important;}

.logoholder a img {width:100%;}
 .mickebella {        margin-top: 0px;    }

#recensioner .vc_col-has-fill {margin-bottom:30px;}

#tidningar-press ul {    column-count:1;}
#tidningar-press li {    font-size: 16px;    line-height: 24px;    margin-bottom: 5px;}

  .hero-video {
    height: 35vh;
    min-height: 260px;
  }


/***************** content *****************/

#top #nav_menu-2 li {    font-size: 19px;    line-height: 27px;}

/*lägg till denna klassen om du vill byta plats på 2 kolumner i mobilvy*/
.row-reverse   { display: flex; flex-direction: row-reverse; -webkit-flex-direction: column-reverse!important; flex-direction: column-reverse!important; }

 .page-id-44 .vc_section {        margin-left: 0;        margin-right: 0;           padding: 0; }

#hem {padding-top:200px;}
#hem .mobile-col .vc_col-sm-6 {width:50%!important; float:left!important;}
#hem .mobile-col .vc_column-inner {padding-left:0!important; padding-right:0!important;}
#hem h2 {font-size:20px; line-height:27px;}

#tjanster-base .wpb_single_image { margin:7.5px 0!important;}

.books .wpb_single_image { display: flex; }
.books img { width: 50%;  }

.hidemobile {display:none!important;}

#wide {display: none;}
#mobile {display: block;}

#mobile-order {display:flex;         flex-wrap: wrap;}
#mobile-order .mobile1 {order:1; width:100%;}
#mobile-order .mobile3 {order:2; width:100%;}
#mobile-order .mobile2 {order:3; width:100%;}

#first-trad-row {padding-top:20px;}
#trad * {text-align:center;}
#trad img {max-width:45px!important;}
#trad .vc_col-sm-6 {width:50%!important; float:left!important;}
#trad .barn > .vc_column_container {width:20%!important;  float:left!important;}
.streck-down {          width:50% !important;       }
.streck-down-2 {       width: 101px !important;       transform: rotate(90deg);   }

.sterck-lang {       transform: none;  width: 100% !important;   }
.streck-down-three {   display:none!important;    }
.streck-down-three-mobile {        width: 30px !important;        transform: rotate(90deg);}
.streck-mobile {          width: 143px !important;        transform: translate(0px, -52px);}

#trad p {    font-size: 18px;}
#trad #biggerimg img {max-width:100%!important;}

.leftmobile h2{text-align:left!important;}

.hem-inner .vc_col-sm-6 , .hem-inner .vc_col-sm-5 {width:50%!important; float:left!important;}
.mobile-left * {text-align:left!important;}

.empty-250 {height:190px!important;}


/*************text***********/
h1 {font-size:23px; line-height:30px;}
h2 {font-size:23px; line-height:30px;}
h3 {font-size:22px; line-height:32px;}
h4 {font-size:20px; line-height:30px;}



/*****************footer************/
#footer .col-sm-3 {margin-bottom:20px;}

#footer .menu-main-container {        justify-content: left;    }

/****footer cms-icons ***/
.cms-icons { margin-left: 0px; margin-right: 0px;     padding: 15px;}
.cms-icons div:last-child {float: none!important; clear: left; margin-top: -5px;}

.error404 #contentholder, .archive #contentholder {   padding: 100px 15px 15px 15px;}

} 



html {
  /* Load system fonts */
  font-family: -apple-system, BlinkMacSystemFont, San Francisco, Segoe UI,
    Roboto, Helvetica Neue, sans-serif;

  /* Make type rendering look crisper */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;

  /* Deactivate auto-enlargement of small text in Safari */
  text-size-adjust: 100%;

  /* Enable kerning and optional ligatures */
  text-rendering: optimizeLegibility;
}

button, input, optgroup, select, textarea {
  font-family: inherit;
}



/**************** Archive, tags and single posts **********/

.bloggheader.dn {display: block !important;}
.entry-meta, .clt, #nav-below, .lb-number {display: none !important;}
.cat-links {font-size: 16px; display: block; margin: 0 0 5px; text-align: center;}
.tag-links {font-size: 16px; display: block; margin: 0 0 50px; text-align: center;}
.single .entry-footer {margin-top: 100px; position: relative;}
.single .entry-footer::before {content: ""; position: absolute; width: 100px; height: 2px; background: #222; top: -58px; left: 50%; margin-left: -50px;}
.single h1.entry-title  { display:none;}
.archive h1 {margin-top: 30px; padding: 15px 15px 0;}
.archive .archive-meta {padding: 0 15px;}
.archive.tag .entry-title + p {padding: 0 15px;}
.archive-meta p {font-size: 20px; line-height: 1.5; max-width: 1000px;}
.archive h2 {font-size: 24px; margin: 0;}
.archive h2 a {font-weight: 700;}
.archive .cat-links, .archive .tag-links {display: none;}
.archive .post {background: #eceae8; padding: 20px; float: left; width: 48%; margin: 2% 2% 0 0; border-bottom: 2px solid #e3e0dd;}
.archive .post .entry-summary {display: none;}
.single .attachment-post-thumbnail {display:none;}


/*********** Popup Fix *********/
.pp_top, .pp_bottom {display: none !important;}
body div.pp_default .pp_content_container .pp_left {background: transparent; padding: 0;}
body div.pp_default .pp_content_container .pp_right {background: transparent; padding: 0;}
body div.pp_default .pp_nav {display: none !important;}
body div.pp_default .pp_content {background: transparent;}
body div.pp_default .pp_description {font-size: 13px; color: #fff; line-height: 14px;}
body div.pp_default .pp_description {margin: 0;}
div.pp_default .pp_content_container .pp_details {margin: 0; position: absolute; top: -50px; background: transparent;}
div.pp_default .pp_content_container .pp_details .pp_description {display: none !important;}
div.pp_default .pp_content_container .pp_details a.pp_close {right: 0px !important; top: 18px !important;}
div.pp_default .pp_loaderIcon {display: none !important;}
.pp_gallery {display: none !important;}
body div.pp_default .pp_close  {background: url(/files/sprite.png) 2px 1px no-repeat;}
body div.pp_default .pp_next:hover {background: url(/files/sprite_next.png) center right no-repeat; filter: invert(100%);}
body div.pp_default .pp_previous:hover {background: url(/files/sprite_prev.png) center left no-repeat; filter: invert(100%);}

/* Mobile CSS */
@media all and (max-width: 767px)  {



/* Archive, tags and single posts */
.section-head.sp {padding-bottom: 1.5svh; padding-top: 1svh;}
.single #content .ikl {margin: -5px 0 35px 0 !important; float: left;}
.archive h2 a {font-weight: 700; font-size: 14px;}
.archive .post {width: 98%; margin: 1%;}
/* Popup Fix Mobile */
div.pp_default .pp_content_container .pp_details a.pp_close {right: 0px !important; top: 32px !important;}
.pp_pic_holder.pp_default { width: 96%!important; margin-top:-100px !important; left: 2%!important; overflow: hidden; }
div.pp_default .pp_content_container .pp_left {padding-left: 0!important;}
div.pp_default .pp_content_container .pp_right {padding-right: 0!important;}
.pp_content {width: 100%!important; height: auto!important;}
.pp_fade {width: 100%!important; height: 100%!important;}
a.pp_expand, a.pp_contract, .pp_gallery, .pp_top, .pp_bottom { display: none !important;}
#pp_full_res img {width: 100%!important; height: auto!important; padding: 15px;}
.pp_details {box-sizing: border-box; width: 100%!important; padding-left: 3%; padding-right: 4%; padding-top: 10px; padding-bottom: 10px; background-color: #fff; margin-top: -2px!important;}
a.pp_close {right: -10px!important; top: -10px!important;}
body .pp_hoverContainer {width: 100% !important; height: 100% !important;}