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: #FCF2A1; 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: #d00303;                          /*button, submit, menu active link, a:hover i footer, a*/
  --secondary-color:#f5585e;                         /*a:hover*/
  --text-color:#212121;                              /*all text*/
  --primary-font:Quicksand, sans-serif;            /*all text, p, html button etc.*/
  --secondary-font:Lobster Two, sans-serif;          /*Headings h1, h2, h3, h4*/
  --display-font:citrus-gothic, sans-serif;
  --second-display-font: quador-display, serif;
  --button-radius:5px;                               /*ställer in rundheten på alla knappar*/
  --header-bkg: #000;                                /*header, dropdown-menu, mobile slide*/
  --page-width:1320px;                                /*max page width  (Sidans storlek)*/
  --top-margin: 130px;                                 /*margin på toppen av alla sidor - OBS får inte var 0 utan måste isf vara 0px */

}



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

#page {overflow-x: hidden;}

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



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

h1 {font-size:65px; line-height:70px; text-wrap: balance; 
font-family:var(--secondary-font); color:var(--secondary-color);          font-weight: 700;  font-style:italic; }


h2 {font-size:50px; line-height:58px;  text-wrap: balance;
font-family:var(--secondary-font); color:var(--secondary-color);  font-weight: 700;  }

h3 {padding-bottom:10px; font-size:24px; line-height:32px; font-weight:700; text-wrap: balance;
font-family:var(--secondary-font); color:var(--text-color); }

h4 {font-size:24px; line-height:30px;  font-weight:700; text-wrap: balance; font-style:italic;
font-family:var(--secondary-font); color:var(--text-color);} 

h5 {font-family:var(--display-font); font-weight:400;}

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:17px; line-height:26px;
color:var(--text-color); font-family:var(--primary-font); font-weight:500;}
.white *, .white a {color:#fff;}

.intro p {font-size:22px; line-height:34px;}
.second-display h4 { font-family:var(--second-display-font); color:var(--text-color);}

#map-margin {left:50px!important;}
/**************** header ***************************/

#header {position:fixed; width:100%; transition: all 0.3s ease; background:var(--header-bkg); z-index:11111111;}
#header .container-fluid {  position:relative; padding:40px 0;}
#header .navbar-default { background-color:transparent!important;}
.menu-main-container {    transition: all 0.3s ease;    float: none;       display: flex;    justify-content: center; justify-content: flex-end;   }


.logoholder a img { transition:all 0.3s ease; width:100%; max-width:220px; position:absolute; left:50%; transform:translateX(-50%); z-index:10000; top:0;}


#above {position:fixed; top:40px; z-index:1111111111111111; left:15px;}
/********** 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; }


.lb-nav a.lb-prev, .lb-nav a.lb-next {opacity: 1!important;}
/*************************** header menu text *************************/

#header .navbar-default .navbar-nav>li a {text-decoration:none; font-size:18px; letter-spacing:1px; text-transform:uppercase; 
font-family:var(--display-font); font-weight:400;  color:#fff; 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(--secondary-color);}

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

.dropdown button {    position: absolute;    top: 50%;right: 4px;    transform: translateY(-50%);     background: transparent;   border: 0;     width: 24px;}
.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; }


/*Ändra när page width används ---- OBS ändra min-width-queryn om du har ändrat var(--page-width) i de globala inställningarna**/
/*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;    }

#above {left: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;}

@media all and (max-width: 1450px) {
:root {    --page-width:90% ;}
 }

@media all and (max-width: 1200px) {
#footer li a {    padding: 15px;     line-height: 61px; }

}

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


/************hamburger menu icon***************/
.navbar-default .navbar-toggle .icon-bar {  background-color: #fff;}

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

.left-side-border, .right-side-border {
    width: 65px;
    background-size: 100% auto;
    background-image: url(/files/ruta.png);
    z-index: 111;
    top: 0;
    position: fixed;
    height: 100vh;

}

.right-side-border {
        right: 0px;
    border-left: 15px solid var(--primary-color);

}

.left-side-border {
   left: 0px;
    border-right: 15px solid var(--primary-color);


}

.entry-content {margin-top:var(--top-margin);} /*the height of the header*/
.wpb_gmaps_widget {margin-bottom:0!important;}
.wpb_gmaps_widget .wpb_wrapper {padding:0!important;}

.darker {background:rgb(56 48 57 / 34%); background-blend-mode:soft-light;}
#start-2 {background:rgb(56 48 57 / 34%); background-blend-mode:soft-light;}
#start-2 h1 {font-size:115px; line-height:115px; color:#fcf2a1!important;}
#start-2 h2 {font-family:var(--display-font); font-weight:400;}

.green h2 , .parallax h2 {font-family:var(--display-font); font-weight:400; }

.green h2 {color:#42ae49; font-size:50px; line-height:50px;}
.green h3 {color:#42ae49; font-size:30px; line-height:40px;}
.centerme * {text-align:center;}

#start h2 {color:var(--text-color);}
#start_inside { padding:75px 0 0 0;}
#tjej-start {position:absolute!important; z-index:11; bottom:-17px; left:30px!important; max-width:500px!important; margin-bottom:0!important; pointer-events:none!important;}
#tjej-start  .wpb_single_image  {margin-bottom:0!important;}

.padding-gone {padding-top:0!important;}

.vc_tta-color-grey.vc_tta-style-classic.vc_tta-tabs .vc_tta-panels {        background-color: transparent!important;   }
.vc_tta-container * { border: 0px solid transparent!important;}
.vc_tta-tabs-list {text-align:center;}
.vc_tta-color-grey a {background:transparent!important;}
.vc_active>a, .vc_tta-tab>a:hover  {color:var(--primary-color)!important;}

#manad > div {border: 15px double #C2EDFF !important;}

.girl-row {positon:relative!important;}
.girl {position:absolute!important; bottom:-15px; right:0; margin-bottom:0!important; pointer-events:none;}

.start-btn * {text-align:center;}
.start-btn .vc_btn3 {margin-left:10px!important; margin-right:10px!important;}
/**Poraiod bilder på om oss**/
.polaroid img {
    border-style: solid;
    border-width: 20px 20px 60px 20px;
    border-color:#fff;
    box-shadow: 2px 1px 2px 3px rgba(0, 0, 0, 0.11);}

.tilt-right {    transform: rotate(4deg); width:300px!important; height:370px!important;}
.tilt-left   {  transform: rotate(355deg); width:300px!important; height:370px!important;}

.polaroid {margin-left:auto!important; margin-right:auto!important; margin-bottom:70px!important;}
.polaroid .vc_figure-caption {position:absolute; bottom:-16px;     left: 50%;    transform: translateX(-50%);     font-family: var(--secondary-font); font-size:26px!important; width: 100%;}

/* event typografi*/
.event {position:relative; width:440px!important;}

 .manaden h2{font-family:var(--display-font); font-weight:400;}
.manaden h3 {font-size:40px;  color:#42ae49;}

.vc_gitem-zone {background-clip: content-box!important;}

#rutnat i {margin-right:5px;}
 #rutnat > div {max-width: calc(100% - 102px) !important;
    margin: auto !important;
    left: 0 !important;
    right: 0 !important;}

.smaller-margin {margin-bottom:10px!important;}

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

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


/***********mallar från stubbfrasning.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;}

#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); }
#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;}

/***********end of mallar från stubbfrasning.cmsp.se**********/


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

.vc_btn3 {background-image:none!important; text-transform:uppercase; letter-spacing:1px; font-weight:400!important; background:var(--primary-color)!important; color:#fff!important; border-radius:var(--button-radius)!important; padding:15px 30px!important; font-size:18px!important;         border: 7px double white !important;  font-family:var(--display-font); }
.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;}

 .vc_gitem-zone {transition:all 0.3s ease;}
.vc_is-hover .vc_gitem-zone {filter:brightness(0.7)!important;}

/************ forms ************/
/*Globala inställningar för form*/
form {
 --form-padding: 10px;
 --form-text-indent: 30px;  
 --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;}

#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: 700!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 {padding:70px 0 50px;     background: url(/files/IMG_4620-e1728646657452.jpg?id=742) !important;
    background-size: cover;
    background-position: right;
    background-blend-mode: soft-light;
    background-color: rgba(0, 0, 0, 0.6) !important;}
#footer * {color:#fff;}


/*#footer ul {display:flex; flex-wrap:wrap; justify-content:left;}
#footer li{list-style:none;  margin: 2px; text-transform:uppercase; font-family:var(--display-font);     line-height: 77px;}

#footer li a {text-decoration:none;
    padding: 20px;
    background: #bf030b;
   border: 7px double white !important;
}
#footer li a:hover {background:#910006;} */



#footer h4 {color:#f5585e !important; font-size:40px; line-height:50px; margin-bottom:10px;}
#nav_menu-2 {margin-top:30px;}
#footer img {width:200px; margin-top: -10px;}
/*************** footer text ****************/
#footer .footer-1 i, .social i {font-size:24px; margin-right:10px;}
.footer-2 i {margin-right:5px;}
/********footer cms icons ******/
#footer .fa-mobile-alt {display:none;}
.small, small {  font-size: 12px;}
.cms-icons {font-size: 16px; margin: 30px 15px 15px; 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;}

.cms-icons .cms-SP, .cms-icons div:last-child {float:none;}
/***************media querys***************/

/*************** 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  (max-width: 1600px) {

#manad {padding-right:  20px!important;}
}
@media  (max-width: 1400px) {
h1 {    font-size: 52px;    line-height: 63px; }
h2 {    font-size: 35px;    line-height: 40px;}

}

@media  (max-width: 1300px) {
h2 {    font-size: 30px;    line-height: 34px;}

#tjej-start {max-width:300px;}
#start-2 h1 {    font-size: 100px;    line-height: 110px; }

.left-side-border, .right-side-border {    width: 45px; }
.right-side-border {     border-left: 9px solid var(--primary-color);}
.left-side-border {   border-right: 9px solid var(--primary-color);}

#header .container-fluid {    max-width: 100%;    width: 100%;}
 #rutnat > div {max-width: calc(100% - 90px) !important; }

}

@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; }

.kontakt-btn {position:absolute; bottom:30px; left:50%; transform:translateX(-50%); }
.page-id-108 #rutnat .vc_col-sm-4 > div {padding-bottom:100px!important;}

.footer-1 {width:25%!important;}
.footer-2 {width:75%!important;}
#text-6 , #text-7, #text-9 {width:33.3%!important; float:left!important;}
#text-9, #text-5 {padding-left:8%;}

#rutnat .vc_col-sm-4 > div {padding:6% 10% 1% 10%!important;}
 #rutnat .vc_col-sm-8 > div {padding:6% 5% 1% 5%!important;}
}
/*************** change breaking point for mobile menu *****************/
@media  (max-width: 1100px) {
#header {    min-height: 75px;}

.girl {position:static!important;}

 #rutnat  .vc_col-sm-4 ,  #rutnat  .vc_col-sm-8 {width:100%!important;}
.left-side-border, .right-side-border {    width: 38px; }
.right-side-border {       border-left: 6px solid var(--primary-color);}
.left-side-border {        border-right: 6px solid var(--primary-color);}
#map-margin {left:5px!important;}

:root {    --top-margin: 60px; }
#start-2 h1 {    font-size: 80px;    line-height: 80px; }
 #rutnat > div {max-width: calc(100% - 76px) !important; }

.event h4 {    font-size: 30px; bottom: 8px;    right: 142px;}
.green h2 { font-size:45px; line-height:45px;}
.green h3 {font-size:30px; line-height:34px;}

#header .container-fluid {width:100%; max-width:100%; padding:10px;}
.logoholder a img {    max-width: 195px;}

/***********header text*********/
#header .navbar-default .navbar-nav>li a {text-decoration:none; font-size:20px; line-height:30px; }
#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;}

.menu-main-container {   float: none; height: 100%;   display: flex;   align-items: center;     justify-content: center;}

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

body .navbar-default .navbar-collapse {
    border-color: transparent;
    background: var(--header-bkg);
    position: fixed; 
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    text-align: center;
    width: 100%;
    z-index: 1;
}

.in {
    box-shadow: 60px 0 0 rgba(0,0,0, .5) !important;
     transition: all 1s !important;
}

.navbar-collapse[aria-expanded="true"] {
    left: 0 !important;
     transition: all .5s;
     top: 0;
     height: 100svh !important;
}

.navbar-collapse[aria-expanded="false"] {
    left: -300px !important;
    transition: all .2s;
    top: 0;
    height: 100svh !important;
}
body .collapsing {
    position: fixed;
    height: 100svh !important;
    left: -300px; top: 0;
}
.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;}

    #rutnat .vc_col-sm-4 > div {
        padding: 5% 17% 0 17% !important;
    }

/*******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: 20px; top:25px;}

}

@media all and (min-width: 768px)  {

.parallax, #footer {
  /* Set a specific height */
  min-height: 350px;
  /* Create the parallax scrolling effect */
  background-attachment: fixed!important;
  background-position: top!important;
  background-repeat: no-repeat;
  background-size: cover;
}

}

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

:root {
  --top-margin:75px;   
}

#header .navbar-default {border-color:transparent!important;}
#header .navbar-default .navbar-collapse, #header .navbar-default .navbar-form {    border-color: transparent;}

#header .navbar-default .navbar-nav>li a {text-align:center;}

.logoholder a img {width:130px;}
.height {height:200px!important;}
.empty-75 {height:20px!important;}

    #manad > div {        margin: 10px!important;     }

.tilt-right {    width:289px!important; height:340px!important;}
.tilt-left   {  width:289px!important; height:340px!important;}
.polaroid .vc_figure-caption {    font-size: 18px !important; bottom:-30px;} 

.event h4 {    font-size:28px;   padding-right: 40px; }

#above {top:unset; bottom:0px; background:#000; width:100%; left:0!important; padding:9px;}
audio {    margin: auto;    display: block;}
/***************** content *****************/
#start-2 {background-image: url(/files/start-mobile.jpg) !important;}

#start-2 .wpb_text_column , #start-2 .vc_btn3-container{padding:0!important;}
#start-2 h1 {    font-size: 45px;    line-height: 45px; }
#start-2    h2 {        font-size: 24px;        line-height: 36px;    }

.green h2 {; font-size:40px; line-height:40px;}
.green h3 {font-size:25px; line-height:30px;}

#tjej-start {    left: 10px !important;    max-width: 209px !important; }
#menuimg {width:50%!important; margin:0 auto 20px;}
.vc_btn3 {    padding: 12px 15px !important;   font-size: 15px !important;    border: 4px double white !important; }
.vc_do_btn {    margin-bottom: 7px!important;}

.parallax {background-size:cover!important;}
.parallax  .vc_empty_space {max-height:190px!important;}
/*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; }

.big-arrow-img img{max-width:120px!important;}

.arrow-img img{max-width:80px!important;}
.twist-arrow-mobile img{    transform: rotate(85deg);}

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

.left-side-border, .right-side-border {    width: 20px; }
.right-side-border {    border-left: 3px solid var(--primary-color);}
.left-side-border {border-right: 3px solid var(--primary-color);}

.vc_grid.vc_row.vc_grid-gutter-25px .vc_pageable-slide-wrapper {
    margin-right: -10px!important;
}


.vc_tta.vc_tta-accordion .vc_tta-tabs-container, .vc_tta.vc_tta-tabs .vc_tta-tabs-container {display:block!important;}
.vc_tta.vc_general .vc_tta-panel-title {display:none;}
.vc_tta-color-grey.vc_tta-style-classic .vc_tta-panel .vc_tta-panel-body {    background-color: transparent!important;}

.vc_grid.vc_row.vc_grid-gutter-25px .vc_grid-item {
    padding-right: 10px!important;
    padding-bottom: 10px!important;
}

.vc_grid .vc_gitem-zone-a {    border: 4px double #F5585E !important;}
.smallermobile img {max-width:70px!important;}

 #rutnat > div {max-width: calc(100% - 40px) !important; }
    #rutnat .vc_col-sm-4 > div {        padding: 5% 1% 0 1% !important;    }
.hide-mobile {display:none!important;}
/*************text***********/


h1 {font-size:35px; line-height:45px;}
h2 {font-size:30px; line-height:40px;}
h3 {font-size:24px; line-height:34px;}

.vc_grid-item {width:25%!important; float:left!important;}
.grid-full .vc_grid-item {width:100%!important; }

#manad {
         padding-right: unset!important;
    }
/*****************footer************/
#footer * {text-align:center;}
#footer .col-sm-3 {margin-bottom:20px;}
#footer li a {    padding: 12px;}
#footer li {margin-bottom:20px!important;}
#footer {background:#000!important; background-color:#000!important;}
/****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;}

}


@media all and (max-width: 350px)  {
.event h4 {        position: static;   }
}