/*
Theme Name: Närkes Energiteknik
Description: Wordpress-tema till Närkes Energiteknik skapat av Inspot.
Version: 1.0
Author URI: https://www.inspot.se/
*/

html {
  height: 100%;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
  background-color: #fcfcfc;
  color: #444;
  font-family: 'Source Sans Pro', sans-serif;
  height: 100%;
  margin: 0;
}

/* Layout */
.wrapper {
  margin: auto;
  max-width: 80rem;
  position: relative;
  width: calc(100% - 4rem);
}

@media screen and (max-width: 440px) {
  .wrapper {
    width: calc(100% - 2rem);
  }
}

.section {
  margin: auto;
  max-width: 60rem;
  position: relative;
  width: calc(100% - 4rem);
}

@media screen and (max-width: 440px) {
  .section {
    width: calc(100% - 2rem);
  }
}

.container {
  padding: 1.5rem;
}

@media screen and (max-width: 440px) {
  .container {
    padding: 1rem;
  }
}

.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 100%;
}

.col-100 {
  flex: 0 0 100%;
  max-width: 100%;
  -ms-flex: 0 0 100%;
}

.col-50 {
  align-items: center;
  display: flex;
  flex: 0 0 calc(50% - 1.5rem);
  margin: 3rem 3rem 0 0;
  max-width: calc(50% - 1.5rem);
  -ms-flex: 0 0 calc(50% - 1.5rem);
}

.col-50:nth-of-type(1), .col-50:nth-of-type(2) {
  margin-top: 0;
}

.col-50:nth-of-type(2n) {
  margin-right: 0;
}

.col-33 {
  flex: 0 0 calc(100% / 3 - 2rem);
  margin: 3rem 3rem 0 0;
  max-width: calc(100% / 3 - 2rem);
  -ms-flex: 0 0 calc(100% / 3 - 2rem);
}

.col-33:nth-of-type(1), .col-33:nth-of-type(2), .col-33:nth-of-type(3) {
  margin-top: 0;
}

.col-33:nth-of-type(3n),
.col-33:last-child {
  margin-right: 0;
}

.col-25 {
  flex: 0 0 calc(25% - 2.25rem);
  margin: 3rem 3rem 0 0;
  max-width: calc(25% - 2.25rem);
  -ms-flex: 0 0 calc(25% - 2.25rem);
}

.col-25:nth-of-type(1), .col-25:nth-of-type(2), .col-25:nth-of-type(3), .col-25:nth-of-type(4) {
  margin-top: 0;
}

.col-25:nth-of-type(4n) {
  margin-right: 0;
}

@media screen and (max-width: 840px) {
  .col-33 {
    flex: 0 0 calc(50% - 1.5rem);
    max-width: calc(50% - 1.5rem);
    -ms-flex: 0 0 calc(50% - 1.5rem);
  }
  .col-33:nth-of-type(3) {
    margin-top: 3rem;
  }
  .col-33:nth-of-type(3n) {
    margin-right: 3rem;
  }
  .col-33:nth-of-type(2n) {
    margin-right: 0;
  }
  .col-25 {
    flex: 0 0 calc(50% - 1.5rem);
    max-width: calc(50% - 1.5rem);
    -ms-flex: 0 0 calc(50% - 1.5rem);
  }
  .col-25:nth-of-type(3), .col-25:nth-of-type(4) {
    margin-top: 3rem;
  }
  .col-25:nth-of-type(4n) {
    margin-right: 3rem;
  }
  .col-25:nth-of-type(2n) {
    margin-right: 0;
  }
}

@media screen and (max-width: 640px) {
  .col-50 {
    flex: 0 0 100%;
    margin: 3rem 0 0;
    max-width: 100%;
    -ms-flex: 0 0 100%;
  }
  .col-50:nth-of-type(2) {
    margin-top: 3rem;
  }
  .col-33 {
    flex: 0 0 100%;
    margin: 3rem 0 0;
    max-width: 100%;
    -ms-flex: 0 0 100%;
  }
  .col-33:nth-of-type(2) {
    margin-top: 3rem;
  }
  .col-33:nth-of-type(3n) {
    margin-right: 0;
  }
  .col-25 {
    flex: 0 0 100%;
    margin: 3rem 0 0;
    max-width: 100%;
    -ms-flex: 0 0 100%;
  }
  .col-25:nth-of-type(2) {
    margin-top: 3rem;
  }
  .col-25:nth-of-type(4n) {
    margin-right: 0;
  }
}

@media screen and (max-width: 440px) {
  .col-50, .col-33, .col-25 {
    margin: 2rem 0 0;
  }
  .col-50:nth-of-type(2) {
    margin-top: 2rem;
  }
  .col-33:nth-of-type(2), .col-33:nth-of-type(3) {
    margin-top: 2rem;
  }
  .col-25:nth-of-type(2), .col-25:nth-of-type(3), .col-25:nth-of-type(4) {
    margin-top: 2rem;
  }
}

.wp-block-columns {
  align-items: center;
  margin: 0 0 3rem !important;
}

.wp-block-columns:last-child {
  margin-bottom: 0 !important;
}

.wp-block-columns .wp-block-columns {
  margin-bottom: 0 !important;
}

.wp-block-column:not(:first-child) {
  margin-left: 3em !important;
}

@media screen and (max-width: 840px) {
  .wp-block-columns {
    flex-wrap: wrap;
  }
  .wp-block-column:not(:first-child) {
    margin: 3rem 0 0 !important;
  }
  .wp-block-column:not(:only-child) {
    flex-basis: 100% !important;
    flex-grow: 0;
  }
}

@media screen and (max-width: 440px) {
  .wp-block-column:not(:first-child) {
    margin: 2rem 0 0 !important;
  }
}

/* Bakgrundsfärg */
.bg-white {
  background-color: #fff;
}

.bg-grey {
  background-color: #efeeee;
}

/* Media */
audio, canvas, progress, video {
  display: inline-block;
  vertical-align: baseline;
}

audio:not([controls]) {
  display: none;
  height: 0;
}

video {
  width: 100% !important;
  height: auto !important;
  vertical-align: middle;
}

figure {
  margin: 0;
}

img {
  display: block;
  height: auto;
  margin: auto;
  max-height: 100%;
  max-width: 100%;
  width: auto;
}

.wp-block-image {
  margin: 2rem 0 0;
}

.wp-block-image:first-child {
  margin-top: 0;
}

.wp-block-image img {
  max-height: 20rem;
}

svg:not(:root) {
  overflow: hidden;
}

iframe {
  height: 20rem;
}

/* Listor */
ul {
  padding: 0 0 0 1rem;
}

/* Formulär */
form {
  border-top: #444 solid 1px;
  font-weight: lighter;
  padding-top: 2rem;
}

form .row {
  height: 100%;
}

form .col-50 .col-50 {
  flex: 0 0 calc(50% - 1rem);
  margin-right: 2rem;
  max-width: calc(50% - 1rem);
  -ms-flex: 0 0 calc(50% - 1rem);
}

form .col-50 .col-50:nth-of-type(2) {
  margin-right: 0;
}

fieldset {
  border: none;
  margin: 0;
  padding: 0;
}

legend {
  border: 0;
  padding: 0;
}

label {
  height: 100%;
  width: 100%;
}

input, select {
  background-color: transparent;
  border: #444 solid 2px;
  border-radius: 1.5rem !important;
  box-shadow: none;
  color: #444;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1rem;
  height: calc(3rem - 4px);
  line-height: normal;
  padding: 0 1rem;
  /* -webkit-appearance: none;
  -ms-appearance: none;
  -moz-appearance: none;
  appearance: none; */
  width: calc(100% - 2rem - 4px);
}

input::placeholder {
  color: rgba(68, 68, 68, 0.8) !important;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: lighter;
}

select {
  background-color: transparent;
  color: rgba(68, 68, 68, 0.8);
  padding-right: 3rem;
  position: relative;
  width: 100% !important;
}

.select {
  position: relative;
}

.select::after {
  background: url() no-repeat;
  background-position: center center;
  background-size: 0.75rem 0.75rem;
  content: "";
  height: 100%;
  position: absolute;
  right: 1rem;
  top: 0;
  width: 1rem;
  z-index: -1;
}

input[type="file"] {
  border: none;
  border-radius: 0 !important;
  height: auto;
  margin-bottom: 1rem;
  padding: 0.5rem 0 0;
}

input[type="checkbox"], input[type="radio"] {
  background-color: #fff;
  border: #444 solid 2px;
  border-radius: 0.75rem !important;
  box-sizing: border-box;
  cursor: pointer;
  height: calc(1.5rem - 4px);
  margin: 0 0.25rem 0.25rem 0;
  padding: 0;
  position: relative;
  vertical-align: middle;
  -webkit-appearance: none;
  -ms-appearance: none;
  -moz-appearance: none;
  appearance: none;
  width: calc(1.5rem - 4px);
}

input[type="checkbox"]:checked::after, input[type="radio"]:checked::after {
  color: #fff !important;
  content: '\2714';
  font-size: 0.75rem;
  left: 50%;
  position: absolute;
  top: 50%;
  transform: translate(-50%, -50%);
}

input[type="checkbox"]:checked, input[type="radio"]:checked {
  background-color: #6ba500;
  border-color: #6ba500;
  color: #fff !important;
}

span.wpcf7-list-item {
  margin: 0 !important;
}

input[type="number"]::-webkit-inner-spin-button, input[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

input[type="search"] {
  -webkit-appearance: textfield;
  -moz-box-sizing: content-box;
  -webkit-box-sizing: content-box;
  box-sizing: content-box;
}

input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}

textarea {
  background-color: transparent;
  border: #444 solid 2px;
  border-radius: 1.5rem;
  box-shadow: none;
  display: block;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 1rem;
  font-weight: lighter;
  height: calc(100% - 4rem - 4px);
  padding: 1rem;
  width: calc(100% - 2rem - 4px);
}

textarea::placeholder {
  color: rgba(68, 68, 68, 0.8);
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 100%;
}

button, input[type="button"], input[type="reset"] {
  cursor: pointer;
  font-family: 'Source Sans Pro', sans-serif;
  font-weight: 600 !important;
  -webkit-appearance: none;
  -ms-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

input[type="submit"] {
  align-items: center;
  background-color: transparent;
  /* background-image: linear-gradient(#fe7826, #fe7826); */
  background-image: linear-gradient(#538000, #538000);
  border: none;
  border-radius: 1.5rem;
  color: #fff;
  cursor: pointer;
  display: inline-flex;
  font-size: 1rem;
  font-weight: 400;
  height: 3rem;
  justify-content: center;
  margin-top: 2rem;
  min-width: 10rem;
  padding: 0 1rem;
  transition: all 0.35s;
  -webkit-appearance: button;
  width: auto;
  z-index: 2;
}

input[type="submit"]:hover {
  /* background-image: linear-gradient(#fe9351, #fe9351); */
  background-image: linear-gradient(#6ba500, #6ba500);
}

.service-form .col-50 {
  align-items: unset;
}

.service-form p {
  margin-top: 0;
  width: 100%;
}

.service-form .wpcf7-form-control-wrap {
  display: block;
  margin-top: 0.5rem;
}

.service-form .wpcf7-checkbox, .service-form .wpcf7-radio {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
}

.service-form .wpcf7-checkbox .wpcf7-list-item {
  display: inline-flex;
}

.service-form .wpcf7-checkbox label {
  display: flex;
}

.service-form .wpcf7-not-valid-tip {
  margin-bottom: 0;
}

@media screen and (max-width: 840px) {
  .service-form input, .service-form select {
    margin-bottom: 0;
  }
}

@media screen and (max-width: 840px) {
  form .col-50:nth-of-type(2) {
    margin-top: 0;
  }
  form .col-50 .col-50 {
    flex: 0 0 100%;
    margin: 0;
    max-width: 100%;
    -ms-flex: 0 0 100%;
  }
  input, select {
    margin-bottom: 2rem;
  }
  input[type="submit"] {
    margin-bottom: 0;
  }  
}

@media screen and (max-width: 440px) {
  input[type="submit"] {
    width: 100% !important;
  }
}

/* Felmeddelande */
.wpcf7-not-valid-tip {
  color: #FF0F2B !important;
  margin: 0 0 2rem 0.5rem;
}

.wpcf7-response-output {
  background-color: #e1edcc;
  border: 0 !important;
  margin: 2rem 0 0 !important;
  padding: 1rem !important;
}

.invalid .wpcf7-response-output {
  background-color: #ffe9dc !important;
}

@media screen and (max-width: 840px) {
  .wpcf7-not-valid-tip {
    color: #FF0F2B !important;
    margin-top: -2rem;
  }
}

/* Länkar */
a {
  color: #444;
  font-weight: 400;
  text-decoration: none;
}

a:hover {
  /* color: #6bd7ad; */
  /* color: #fe7826; */
  color: #6ba500;
}

.btn {
  align-items: center;
  background-image: linear-gradient(#538000, #538000);
  border-radius: 1.5rem;
  color: #fff;
  display: inline-flex;
  font-weight: 400;
  height: 3rem;
  justify-content: center;
  padding: 0 1rem;
  position: relative;
  transition: all 0.35s;
  min-width: 8rem;
}

.btn:hover {
  /* background-image: linear-gradient(#fe9351, #fe9351); */
  background-image: linear-gradient(#6ba500, #6ba500);
  color: #fff;
}

.btn-black {
  align-items: center;
  border: #444 solid 2px;
  border-radius: 1.5rem;
  color: #444;
  display: inline-flex;
  font-weight: 400;
  height: calc(3rem - 4px);
  justify-content: center;
  padding: 0 1rem;
  position: relative;
  transition: all 0.35s;
  min-width: 8rem;
}

.btn-black:hover {
  /* background-image: linear-gradient(#fe7826, #fe7826); */
  border-color: #6ba500;
  color: #6ba500;
}

.btn-white {
  align-items: center;
  border: #fff solid 2px;
  border-radius: 1.5rem;
  color: #fff;
  display: inline-flex;
  font-weight: 400;
  height: calc(3rem - 4px);
  justify-content: center;
  padding: 0 1rem;
  position: relative;
  transition: all 0.35s;
  min-width: 8rem;
}

.btn-white:hover {
  /* background-image: linear-gradient(#fe7826, #fe7826); */
  border-color: #6ba500;
  color: #6ba500;
}

.wp-block-button a {
  align-items: center;
  background-image: linear-gradient(#538000, #538000);
  border-radius: 1.5rem;
  color: #fff;
  display: inline-flex;
  font-size: 1rem;
  font-weight: 400;
  height: 3rem;
  justify-content: center;
  padding: 0 1rem;
  position: relative;
  transition: all 0.35s;
  min-width: 8rem;
}

.wp-block-button a:hover {
  background-image: linear-gradient(#6ba500, #6ba500);
}

@media screen and (max-width: 440px) {
  .btn, .btn-black, .btn-white {
    min-width: calc(100% - 2rem);
  }
}

/* Rubriker */
h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  font-weight: lighter;
  margin: 1rem 0;
}

h1, .h1 {
  font-family: 'neue-kabel', sans-serif;
  font-size: 2.5rem;
}

h2, .h2 {
  font-family: 'neue-kabel', sans-serif;
  font-size: 2rem;
}

h3, .h3 {
  font-size: 1.5rem;
}

h4, .h4 {
  font-size: 1.25rem;
}

.wp-block-column h2:first-child {
  margin-top: 0;
}

.wp-block-column h3:first-child {
  margin-top: 0;
}

@media screen and (max-width: 440px) { 
  h1, .h1 {
    font-size: 2.25rem;
  }
  h2, .h2 {
    font-size: 1.75rem;
  }
}

/* Paragraf */
p {
  font-weight: lighter;
}

.wp-block-column p:first-child {
  margin-top: 0;
}

.wp-block-column p:last-child {
  margin-bottom: 0;
}

/* Listor */
li {
  font-weight: lighter;
  padding: 0.25rem 0;
}

li:first-child {
  padding-top: 0;
}

li:last-child {
  padding-bottom: 0;
}

/* Sidhuvud */
header {
  box-shadow: 5px 10px 10px -10px rgb(68 68 68 / 25%);
  position: relative;
}

header .wrapper.desktop {
  border: none;
  display: grid;
  grid-template-columns: 7rem auto auto;
  height: 5rem;
  margin: auto;
}

header .wrapper.mobile {
  border: none;
  display: none;
  height: 3rem;
}

@media screen and (max-width: 1040px) {
  header .bg-white:last-child {
    border-top: #444 solid 1px;
  }
  header .wrapper.desktop {
    grid-template-columns: 7rem 0 auto;
  }
  header .wrapper.mobile {
    display: grid;
    grid-template-columns: auto auto;
  }
}

@media screen and (max-width: 440px) {
  header .wrapper.desktop {
    grid-template-columns: 6rem 0 auto;
  }  
}

/* Logotyp */
.logo {
  align-items: center;
  display: flex;
  height: 100%;
}

.logo a {
  align-items: center;
  display: flex;
  height: 4rem;
  width: auto;
}

/* Kontaktuppgifter */
.contact-bar {
  height: 100%;
}

.contact-bar ul {
  margin: 0;
  padding: 0;
  text-align: right;
}

.contact-bar ul li {
  align-items: center;
  display: inline-flex;
  height: 5rem;
  list-style-type: none;
  padding: 0 0 0 1rem;
  position: relative;
}

.contact-bar ul li:first-child {
  padding-left: 0;
}

.contact-bar ul li .btn-black {
  min-width: calc(3rem - 4px);
  padding: 0;
}

.contact-bar ul li a .icon {
  background-size: 1rem 1rem;
  background-position: center left;
  display: inline-flex;
  height: 1rem;
  /* padding-right: 0.5rem; */
  vertical-align: middle;
  width: 1rem;
}

.contact-bar ul li a .phone {
  background: url(images/phone-solid.svg) no-repeat;
}

.contact-bar ul li a:hover .phone {
  background: url(images/phone-solid-green.svg) no-repeat;
}

.contact-bar ul li a .email {
  background: url(images/envelope-solid.svg) no-repeat;
}

.contact-bar ul li a:hover .email {
  background: url(images/envelope-solid-green.svg) no-repeat;
}

@media screen and (max-width: 1040px) {
  .contact-bar ul .hide-in-mobile {
    display: none;
  }
}

@media screen and (max-width: 340px) {
  .contact-bar ul li .btn-black {
    font-size: 0;
    min-width: calc(3rem - 4px);
    padding: 0;
    width: calc(3rem - 4px); 
  }
  .contact-bar ul li a .icon {
    padding-right: 0;
  }
}

/* Global meny */
.menu-bar {
  display: flex;
  height: 100%;
  position: relative;
  width: 100%;
}

.menu-mobile {
  display: none;
}

.menu ul {
  margin: 0;
  padding: 0;
}

.menu ul li {
  display: inline-flex;
  list-style-type: none;
  padding: 0;
  position: relative;
}

.menu ul li a {
  align-items: center;
  display: flex;
  height: 5rem;
  padding: 0 1rem;
  position: relative;
  transition: all 0.35s;
}

.menu ul li a:hover,
.menu ul li a[aria-current="page"],
.menu ul li .hover {
  color: #6ba500;
}

.menu ul .has-sub .toggle-link {
  display: none;
}

.menu ul li>.sub-menu {
  background-color: #fff;
  box-shadow: 5px 10px 10px -10px rgb(68 68 68 / 25%);
  display: none;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 100%;
  width: 20rem;
  z-index: 99;
}

.menu ul .has-sub:hover>.sub-menu {
  display: block;
}

.menu ul li .sub-menu li {
  display: flex;
  position: relative;
}

.menu ul li .sub-menu li a {
  height: 3rem;
  position: relative;
  width: 100%;
}

.menu ul li .sub-menu li a:hover,
.menu ul li .sub-menu li a[aria-current="page"] {
  color: #6ba500;
}

.menu ul li .sub-menu li a:hover::after {
  background: url(images/long-arrow-alt-right-regular-green.svg) no-repeat;
  background-size: 1rem 1rem;
  background-position: center center;
  content: "";
  display: flex;
  height: 1rem;
  position: absolute;
  right: 1rem;
  vertical-align: middle;
  width: 1rem;
}

.menu ul li .sub-menu a::after {
  display: none;
}

.menu ul li .sub-menu li>.sub-menu {
  display: none;
  left: 100%;
  top: 0;
}

.menu ul li .sub-menu li.has-sub:hover>.sub-menu {
  display: block;
}

@media screen and (max-width: 1040px) {
  .menu {
    border-top: #444 solid 1px;
    box-shadow: 5px 10px 10px -10px rgb(68 68 68 / 25%);
  }
  .menu, .sub-menu {
    background-color: #fff;
    display: none;
    height: auto;
    left: -9rem;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: absolute;
    top: 8rem;
    width: 100vw;
    z-index: 99;
  }
  .menu.active, .sub-menu.active {
    display: block;
    max-height: 500rem;
  }
  .menu ul li {
    display: block;
  }
  .menu ul li a {
    height: 3rem;
    padding: 0 2rem;
  }
  .menu ul li a::after {
    display: none;
  }
  .menu ul .has-sub>a {
    width: calc(100% - 9rem);
  }
  .menu ul .has-sub>a::after {
    display: none;
  }
  .menu ul .has-sub .toggle-link {
    background: url(images/long-arrow-alt-down-regular.svg) no-repeat;
    border: #444 solid 2px;
    background-size: 1rem 1rem;
    background-position: center center;
    border-radius: 1rem;
    cursor: pointer;
    display: block !important;
    height: calc(2rem - 4px);
    position: absolute;
    right: 2rem;
    text-indent: -9999px;
    top: 0.5rem;
    transition: all 0.35s;
    width: calc(2rem - 4px);
    z-index: 3;
  }
  .menu ul .has-sub .toggle-link.active {
    background: url(images/long-arrow-alt-down-regular-green.svg) no-repeat;
    border-color: #6ba500;
    background-size: 1rem 1rem;
    background-position: center center;
    transform: rotate(180deg);
  }
  .menu ul li>.sub-menu {
    border-bottom: #444 solid 1px;
    border-top: #444 solid 1px;
    box-shadow: none;
    display: none;
    left: 0;
    position: relative;
    top: 100%;
    transform: inherit;
    width: 100%;
  }
  .menu ul .has-sub:hover>.sub-menu {
    box-shadow: none;
    display: none;
  }
  .menu ul .has-sub .sub-menu.active {
    display: block !important;
  }
  .menu ul li .sub-menu li a {
    padding: 0 3rem;
  }
  .menu ul li .sub-menu li a:hover::after {
    display: none;
  }
  .menu ul li .sub-menu li.has-sub:hover>.sub-menu {
    display: none;
  }
  .menu ul li .sub-menu li .sub-menu a {
    padding: 0 4rem;
  }
}

@media screen and (max-width: 440px) {
  .menu, .sub-menu {
    left: -7rem;
  }
  .menu ul li a {
    padding: 0 1rem;
  }
  .menu ul .has-sub>a {
    width: calc(100% - 8rem);
  }
  .menu ul .has-sub .toggle-link {
    right: 1rem;
  }
  .menu ul li .sub-menu li a {
    padding: 0 2rem;
  }
}

/* Hamburgermeny */
.menu-burger {
  align-items: center;
  background-color: transparent;
  color: #444;
  display: flex;
  height: 1.5rem;
  position: relative;
  /* text-decoration: none; */
  top: 50%;
  transform: translate(0, -50%);
  width: auto;
}

.menu-burger:hover {
  color: #444;
}

.menu-burger .menu-burger-line {
  height: 3px;
  background-color: #444;
  border-radius: 1.5px;
  position: absolute;
  left: 0;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity, left;
  -webkit-transition-property: opacity, left, -webkit-transform;
  transition-property: opacity, left, -webkit-transform;
  -o-transition-property: transform, opacity, left;
  transition-property: transform, opacity, left;
  transition-property: transform, opacity, left, -webkit-transform;
  -webkit-transition-duration: .25s;
  -o-transition-duration: .25s;
  transition-duration: .25s;
  width: 1.5rem;
}

.menu-burger.active .menu-burger-line {
  background-color: #6ba500;
}

.menu-burger .menu-burger-line-top {
  top: 0.25rem;
}

.menu-burger.active .menu-burger-line-top {
  top: 0;
}

.menu-burger.active .menu-burger-line-top {
  -webkit-transform: rotate(45deg) translate3d(7.5px, 7.5px, 0);
  transform: rotate(45deg) translate3d(7.5px, 7.5px, 0);
}

.menu-burger .menu-burger-line-bottom {
  bottom: 0.25rem;
}

.menu-burger.active .menu-burger-line-bottom {
  bottom: 0;
}

.menu-burger.active .menu-burger-line-bottom {
  -webkit-transform: rotate(-45deg) translate3d(7.5px, -7.5px, 0);
  transform: rotate(-45deg) translate3d(7.5px, -7.5px, 0);
}

.menu-burger .menu-burger-text {
  margin-left: 2rem;
}

/* Direktlänkar (mobilmeny) */
.mobile-menu ul {
  display: flex;
  justify-content: space-between;
  margin: 0;
  padding: 0;
}

.mobile-menu ul li {
  display: inline-flex;
  list-style-type: none;
  padding: 0;
}

.mobile-menu ul li a {
  align-items: center;
  display: flex;
  height: 3rem;
  position: relative;
}

.mobile-menu ul li a:hover {
  color: #444;
}

/* Sidomeny för kontakt och sociala medier i mobil */
.aside {
  background-color: rgba(107, 165, 0, 0.8);
  border-radius: 1.5rem 0 0 1.5rem;
  position: fixed;
  right: 0;
  top: 25%;
  z-index: 98;
  width: 3rem;
}

.aside:hover {
  background-color: #6ba500;
}

.aside.mobile {
  display: none;
}

.aside .aside-toggle-link {
  align-items: center;
  display: flex;
  height: 3rem;
  justify-content: center;
  width: 3rem;
}

.aside .toggle-icon {
  background: url(images/plus-light-white.svg) no-repeat;
  background-size: 1.5rem 1.5rem !important;
  background-position: center center !important;
  content: "";
  display: block;
  height: 1.5rem;
  position: relative;
  width: 1.5rem;
}

.aside .aside-toggle-link.active .toggle-icon {
  background: none;
}

.aside .aside-toggle-link.active .toggle-icon-line {
  height: 2px;
  background-color: #fff;
  border-radius: 1px;
  position: absolute;
  left: 0;
  -webkit-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0);
  will-change: transform, opacity, left;
  -webkit-transition-property: opacity, left, -webkit-transform;
  transition-property: opacity, left, -webkit-transform;
  -o-transition-property: transform, opacity, left;
  transition-property: transform, opacity, left;
  transition-property: transform, opacity, left, -webkit-transform;
  -webkit-transition-duration: .25s;
  -o-transition-duration: .25s;
  transition-duration: .25s;
  width: 100%;
}

.aside .aside-toggle-link.active .toggle-icon-line-top {
  top: 0;
  -webkit-transform: rotate(45deg) translate3d(7.5px, 7.5px, 0);
  transform: rotate(45deg) translate3d(7.5px, 7.5px, 0);
}

.aside .aside-toggle-link.active .toggle-icon-line-bottom {
  bottom: 0;
  -webkit-transform: rotate(-45deg) translate3d(7.5px, -7.5px, 0);
  transform: rotate(-45deg) translate3d(7.5px, -7.5px, 0);
}

.aside ul {
  display: none;
  margin: 0;
  padding: 0;
  transition: all 0.35s;
}

.aside ul.active {
  display: block;
}

.aside ul li {
  display: flex;
  list-style-type: none;
  padding: 0;
}

.aside ul li a {
  height: 2.5rem;
  position: relative;
  width: 3rem;
}

.aside ul li:last-child a {
  margin-bottom: 0.5rem;
}

.aside ul li a::after {
  background-size: 1.5rem 1.5rem !important;
  background-position: center center !important;
  content: "";
  display: block;
  height: 100%;
  right: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.aside ul li a:hover::after {
  background-size: 1.5rem 1.5rem;
  background-position: center center;
}

.aside .phone::after {
  background: url(images/phone-solid-white.svg) no-repeat;
}

.aside .email::after {
  background: url(images/envelope-solid-white.svg) no-repeat;
}

.aside .Facebook::after {
  background: url(images/facebook-square-brands-white.svg) no-repeat;
}

.aside .Instagram::after {
  background: url(images/instagram-square-brands-white.svg) no-repeat;
}

.aside .Linkedin::after {
  background: url(images/linkedin-brands-white.svg) no-repeat;
}

.aside .Twitter::after {
  background: url(images/twitter-square-brands-white.svg) no-repeat;
}

.aside .Youtube::after {
  background: url(images/youtube-square-brands-white.svg) no-repeat;
}

@media screen and (max-width: 1140px) {
  .aside.mobile {
    display: block;
  }
}

/* Breadcrumbs */
.breadcrumbs {
  font-size: 0.9rem;
}

.breadcrumbs .separator {
  padding: 0 0.25rem;
}

.breadcrumbs span {
  display: inline-flex;
  padding-top: 0.5rem;
}

/* Footer */
footer p:first-child {
  margin-top: 0;
}

footer p:last-child {
  margin-bottom: 0;
}

footer a:hover {
  color: #6ba500;
}

footer ul {
  padding: 0;
}

footer ul li {
  list-style-type: none;
}

footer ul .has-sub .toggle-link {
  display: none;
}

footer ul li .sub-menu {
  display: none;
}

/* Sociala medier */
.social-media {
  width: 100%;
}

.social-media ul {
  align-items: center;
  display: flex;
  height: 1.5rem;
  justify-content: flex-end;
  margin: 0;
  padding: 0;
}

.social-media ul li {
  display: inline-flex;
  height: 100%;
  list-style-type: none;
  padding: 0;
}

.social-media ul li a {
  padding-left: 1rem;
  position: relative;
  width: 1.5rem;
}

.social-media ul li a::after {
  background-size: 1.5rem 1.5rem !important;
  background-position: center right !important;
  content: "";
  display: block;
  height: 100%;
  right: 0;
  position: absolute;
  top: 0;
  width: 100%;
}

.social-media ul li a:hover::after {
  background-size: 2rem 2rem;
  background-position: center right;
}

.social-media .Facebook::after {
  background: url(images/facebook-square-brands-white.svg) no-repeat;
}

.social-media .Facebook:hover::after {
  background: url(images/facebook-square-brands-orange.svg) no-repeat;
}

.social-media .Instagram::after {
  background: url(images/instagram-square-brands-white.svg) no-repeat;
}

.social-media .Instagram:hover::after {
  background: url(images/instagram-square-brands-orange.svg) no-repeat;
}

.social-media .Linkedin::after {
  background: url(images/linkedin-brands-white.svg) no-repeat;
}

.social-media .Linkedin:hover::after {
  background: url(images/linkedin-brands-orange.svg) no-repeat;
}

.social-media .Twitter::after {
  background: url(images/twitter-square-brands-white.svg) no-repeat;
}

.social-media .Twitter:hover::after {
  background: url(images/instagram-square-brands-orange.svg) no-repeat;
}

.social-media .Youtube::after {
  background: url(images/youtube-square-brands-white.svg) no-repeat;
}

.social-media .Youtube:hover::after {
  background: url(images/youtube-square-brands-orange.svg) no-repeat;
}

/* Logotyper */
.logotypes img {
  max-height: 6rem;
}

@media screen and (max-width: 640px) {
  .logotypes .col-25 {
    flex: 0 0 calc(50% - 1.5rem);
    margin-right: 3rem;
    max-width: calc(50% - 1.5rem);
    -ms-flex: 0 0 calc(50% - 1.5rem);
  }
  .logotypes .col-25:nth-of-type(2) {
    margin-top: 0;
  }
  .logotypes .col-25:nth-of-type(2n) {
    margin-right: 0;
  }
}

@media screen and (max-width: 440px) {
  .logotypes .col-25 {
    flex: 0 0 calc(50% - 1rem);
    margin-right: 2rem;
    max-width: calc(50% - 1rem);
    -ms-flex: 0 0 calc(50% - 1rem);
  }
}

/* Scrolla up */
.scroll-up {
  background-color: rgb(107, 165, 0, 0.8);
  border: none;
  border-radius: 1.5rem 0 0 1.5rem;
  bottom: 6rem;
  cursor: pointer;
  height: 3rem;
  position: fixed;
  right: 0;
  transition: all 0.35s;
  width: 3rem;
}

.scroll-up:hover {
  background-color: #6ba500;
}

.scroll-up .scroll-up-link {
  background: url(images/long-arrow-alt-down-regular-white.svg) no-repeat;
  background-position: center center;
  background-size: 1.5rem 1.5rem;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  transform: rotate(180deg);
  width:100%;
  z-index: 99;
}

/* Cookies */
#moove_gdpr_cookie_info_bar {
  background-color: rgba(68, 68, 68, 0.8)!important;
  border: none!important;
}

.moove-gdpr-info-bar-container {
  padding: 2rem 1rem!important;
}

.moove-gdpr-info-bar-content {
  margin: auto;
  max-width: 60rem;
  padding: 0 !important;
}

.moove-gdpr-cookie-notice {
  padding: 0 !important;
}

.moove-gdpr-cookie-notice p {
  font-size: 1rem !important;
  font-weight: 300 !important;
  text-decoration: none !important;
}

.moove-gdpr-cookie-notice a {
  font-weight: 500 !important;
	text-decoration: none !important;
}

#moove_gdpr_cookie_info_bar a:hover {
	color: #fff !important;
  text-decoration: underline !important;
}

.moove-gdpr-button-holder {
  margin-left: 1rem;
  padding: 0 !important;
}

#moove_gdpr_cookie_info_bar button {
  align-items: center;
  background-color: transparent !important;
  border: #fff solid 2px !important;
  border-radius: 3rem !important;
  color: #fff !important;
  display: inline-flex !important;
  height: 3rem;
  font-family: 'Open Sans', sans-serif;
  font-size: 1rem !important;
  font-weight: 500 !important;
  justify-content: center;
  margin: 0 !important;
  padding: 0 1rem !important;
  transition: all 0.35s;
  width: auto;
}

#moove_gdpr_cookie_info_bar button:hover {
  border-color: #6ba500 !important;
  color: #6ba500 !important;
}

@media screen and (max-width: 768px) {
  .moove-gdpr-cookie-notice {
    margin: 0 0 1rem !important;
  }
  .moove-gdpr-button-holder {
    margin-left: 0;
  }  
}

@media screen and (max-width: 440px) {
  .moove-gdpr-info-bar-container {
    padding: 1rem !important;
  }
  #moove_gdpr_cookie_info_bar button {
    width: 100%;
  }
}

/* Startsidan */
.hero.bg-img {
  position: relative;
}

.hero.bg-img::after {
  background-color: rgb(34, 34, 34, 0.25);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1;
}

.hero.bg-img img {
  max-height: 40rem;
  min-height: 25rem;
  object-fit: cover;
  position: relative;
  width: 100%;
  z-index: -2;
}

.hero.bg-img .section {
  align-items: center;
  color: #fff;
  display: flex;
  left: 50%;
  height: calc(100% - 6rem);
  padding: 3rem 0;
  position: absolute;
  top: 0;
  transform: translate(-50%, 0);
}

.hero:not(.bg-img) .col-50 .btn-white {
  border-color: #000;
  color: #000;
}

.hero:not(.bg-img) .col-50 .btn-white:hover {
  border-color: #6ba500;
  color: #6ba500 ;
}

.hero .col-50 a:first-child {
  margin-right: 1rem;
}

.hero .col-50 .breadcrumbs a:first-child {
  margin-right: 0;
}

@media screen and (max-width: 840px) {
  .hero .col-50 {
    flex: 0 0 100%;
    margin: 0;
    max-width: 100%;
    -ms-flex: 0 0 100%;
  }
}

@media screen and (max-width: 440px) {
  .hero .col-50 a:first-child {
    margin: 0 0 1rem;
  }
}

.services {
  text-align: center;
}

.services .col-content {
  background-color: #e1edcc;
  border-radius: 1.5rem;
  display: flex;
  font-weight: 400;
  justify-content: space-between;
  text-align: left;
}

.services .col-content.sm {
  border-radius: 2.5rem;
  flex-direction: row;
  padding: 1rem;
}

.services .col-content.lg {
  flex-direction: column;
  height: calc(100% - 1rem);
  padding: 0 1rem 1rem;
}

.services .col-content.sm .h4 {
  align-self: center;
  margin: 0;
  width: calc(100% - 3rem);
}

.services .col-content .read-more {
  align-self: flex-end;
  background: url(images/long-arrow-alt-right-regular.svg) no-repeat;
  background-size: 1rem 1rem;
  background-position: center center;
  border: #444 solid 2px;
  border-radius: 1rem;
  content: "";
  display: flex;
  height: calc(2rem - 4px);
  vertical-align: middle;
  width: calc(2rem - 4px);
}

.services .col-content.sm .read-more {
  align-self: center;
}

.services .col-content:hover .read-more {
  background: url(images/long-arrow-alt-right-regular-green.svg) no-repeat;
  background-size: 1rem 1rem;
  background-position: center center;
  border-color: #6ba500;
}

.services .btn {
  margin: 2rem auto 0;
}

.contact {
  text-align: center;
}

.contact .wrapper {
  border-top: #fff solid 1px;
}

/* Varumärke */
.brands {
  text-align: center;
}

.brands .row {
  justify-content: center;
}

.brands .col-content {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-align: left;
}

.brands .col-content img {
  max-height: 6rem;
}

.brands .col-content .col-text {
  align-items: center;
  display: inline-flex;
  justify-content: center;
  margin-top: 1rem;
}

.brands .col-content .h4 {
  margin: 0;
}

.brands .col-content .read-more {
  align-self: center;
  background: url(images/long-arrow-alt-right-regular.svg) no-repeat;
  background-size: 1rem 1rem;
  background-position: center center;
  border: #444 solid 2px;
  border-radius: 1rem;
  content: "";
  display: flex;
  height: calc(2rem - 4px);
  margin-left: 1rem;
  vertical-align: middle;
  width: calc(2rem - 4px);
}

.brands .col-content:hover .read-more {
  background: url(images/long-arrow-alt-right-regular-green.svg) no-repeat;
  background-size: 1rem 1rem;
  background-position: center center;
  border-color: #6ba500;
}

.brands .btn {
  margin: 2rem auto 0;
}

@media screen and (max-width: 640px) {
  .brands .col-content img {
    max-width: 20rem;
  }
}

@media screen and (max-width: 440px) {
  .brands .col-content img {
    max-width: 100%;
  }
}

/* FAQ */
.rank-math-block {
  margin-bottom: 3rem;
}

.rank-math-block:last-of-type {
  margin-bottom: 0;
}

.rank-math-list-item {
  margin-bottom: 1rem;
}

.rank-math-list-item:last-child {
  margin-bottom: 0;
}

.rank-math-question {
  background-color: #e1edcc;
  border-radius: 2.5rem;
  cursor: pointer;
  margin: 0;
  padding: 1rem 4rem 1rem 1rem;
  position: relative;
}

.rank-math-question:hover {
  color: #6ba500;
}

.rank-math-question::after {
  background: url(images/long-arrow-alt-down-regular.svg) no-repeat;
  border: #444 solid 2px;
  background-size: 1rem 1rem;
  background-position: center center;
  border-radius: 1rem;
  content: "";
  display: block !important;
  height: calc(2rem - 4px);
  position: absolute;
  right: 1rem;
  text-indent: -9999px;
  top: 50%;
  transform: translate(0, -50%);
  width: calc(2rem - 4px);
}

.rank-math-question:hover::after {
  background: url(images/long-arrow-alt-down-regular-green.svg) no-repeat;
  border-color: #6ba500;
  background-size: 1rem 1rem;
  background-position: center center;
}

.rank-math-question.active::after {
  background: url(images/long-arrow-alt-down-regular-green.svg) no-repeat;
  border-color: #6ba500;
  background-size: 1rem 1rem;
  background-position: center center;
  transform: translate(0, -50%) rotate(180deg);
}

.rank-math-answer {
  display: none;
  padding: 0 1.5rem;
}

.rank-math-answer.active {
  display: block;
}


/*blogg feed utseende - tips och råd*/

.blogg-feed-ip {display: none!important;}

.blogg-feed-ip ul {
	    display: flex;
    flex-direction: row;
    gap: 15px;
    flex-wrap: nowrap;
}

.blogg-feed-ip ul li {
	padding: 0px;
}

.blogg-feed-ip ul li figure img{
min-height: 250px;
}

.blogg-feed-ip ul li .wp-block-post-excerpt__more-text {padding-top: 15px}




.col-50-for-tips-rad {
  align-items: flex-start; /* keep children at top */
}

.category-tips-rad-image-wrapper {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	text-align: left;
}


.category-tips-rad-image-wrapper img {
  width: 420px;
  height: 250px;
  object-fit: cover;
  display: block;
  align-self: flex-start; 
}

.category-tips-rad-image-wrapper a {
  background-color: transparent !important;
  background-color: rgba(0,0,0,0) !important;
  padding: 0px !important;
}

.category-tips-rad-image-wrapper > a >.read-more-btn {
	text-align: left;
	margin-bottom: auto;
}


@media only screen and (max-width: 840px) {
	.category-tips-rad-image-wrapper > a >.read-more-btn {
		padding-bottom: 18px;
	}
	
	p {
		word-break: break-word;
	}
}

