/*
Theme Name: Black Theme 2017
Theme URI: http://underscores.me/
Author: Underscores.me
Author URI: http://underscores.me/
Description: Description
Version: 4.0.0
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: black-theme-2017
Tags:

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned with others.

Black Theme 2017 is based on Underscores http://underscores.me/, (C) 2012-2016 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal http://necolas.github.io/normalize.css/
*/

/* Variables */
:root {
  /* Colors */
  --text-color-white: #ffffff;
  --text-color-black: #000000;
  --text-color-yellow: #ecd54b;
  --text-color-pink: #b43f58;

  --bg-color-white: #ffffff;
  --bg-color-light-green: #e5e9ab;
  --bg-color-medium-light-green: #ebedbd;
  --bg-color-light-yellow: #f5f6de;
  --bg-color-light-blue: #8ab1cc;
  --bg-color-light-lightblue: #d0e0eb;
  --bg-color-light-gray: #d3d9d6;

  /* Button Color */
  --button-color-primary: #b43f58;
  --button-color-green: #1d4233;
  --button-color-llight-green: #ccd359;

  /* Fonts */
  --font-primary: "Albra";
  --font-secondary: "Gilroy";

  /* Font-sizes */
  --font-size-text: 1.125rem;

  --font-size-h1: 5.625rem;
  --font-size-h2: 4.375rem;
  --font-size-h3: 3.125rem;
  --font-size-h4: 2.5rem;
  --font-size-h5: 2.25rem;
  --font-size-h6: 2rem;

  /* Font Responsive-sizes (Medium screen size) */
  --font-size-medium-h1: 4rem;
  --font-size-medium-h2: 3.5rem;
  --font-size-medium-h3: 2.75rem;
  --font-size-medium-h4: 2.25rem;
  --font-size-medium-h5: 2rem;
  --font-size-medium-h6: 1.5rem;

  /* Font Responsive-sizes (Small screen size) */
  --font-size-small-h1: 2rem;
  --font-size-small-h2: 1.75rem;
}

body {
  margin: 0;
  padding: 0;
}

html {
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-size: var(--font-size-text);
  -webkit-user-select: text; /* Safari 3.1+ */
  -moz-user-select: text; /* Firefox 2+ */
  -ms-user-select: text; /* IE 10+ */
  user-select: text; /* Standard syntax */
  scroll-behavior: smooth;
}

.visually-hidden {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

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

/* =========== OVERWRITE =========== */

@media (min-width: 576px) {
  .modal-dialog {
    max-width: 1000px;
    margin: 1.75rem auto;
  }
}

/* ======== RESPONSIVE ========== */

@media only screen and (min-width: 1500px) and (orientation: landscape) {
  /* Landscape */

  .container-fluid {
    max-width: 1500px;
    margin: 0 auto;
  }
}

.video-foreground {
  width: 100%;
}

@media only screen and (min-width: 576px) {
  html {
    font-size: 1.2rem;
  }

  .even .order-1 {
    order: 2;
  }
  .even .order-2 {
    order: 1;
  }
}

/* ======== GDPR COOKIE CONSENT ========== */

@media only screen and (max-width: 985px) {
  .wt-cli-cookie-bar {
    right: 0 !important;
  }

  .cli-bar-container {
    justify-content: flex-start;
  }

  .cli-bar-message {
    line-height: 1.5;
    margin-bottom: 2rem;
  }

  .cli-bar-btn_container {
    flex-direction: column;
  }

  #wt-cli-accept-btn {
    margin-right: 0;
  }

  .cli-wrapper {
    margin: 0 !important;
  }
}

@media only screen and (min-width: 986px) and (max-width: 1339px) {
  /* .cli-bar-message {
    max-width: 50%;
  }

  .cli-bar-btn_container {
    max-width: 50%;
  } */
}

#wt-cli-privacy-save-btn {
  border-radius: 0;
  background-color: #73763e;
  color: white;
  font-size: 13px;
  font-weight: 500;
  line-height: 1;
  margin: 5px 5px 5px 30px;
  padding: 8px 25px;
}

/* Cookie-bar styles */
#cookie-law-info-bar {
  /* border-top: 0.5rem rgb(115, 118, 62) solid; */
  padding: 2rem !important;
}
.wt-cli-cookie-bar {
  right: 2%;
  bottom: 2% !important;
  left: unset !important;
  max-width: 45rem;
  margin: unset !important;
}
/* .cli-wrapper {
  margin: 2rem;
} */
.cli-bar-container {
  align-items: unset !important;
  flex-direction: column;
}
.cli-bar-message {
  font-size: 1.5rem !important;
  font-weight: 500;
  font-family: var(--font-secondary);
  margin-bottom: 1rem;
  width: 100% !important;
}
.cli-bar-btn_container {
  display: flex;
}
#cookie-law-info-bar a {
  font-weight: bold;
}
#wt-cli-policy-link {
  font-size: 1.5rem;
  font-weight: unset !important;
  text-decoration: underline;
}
#wt-cli-accept-all-btn,
#wt-cli-settings-btn,
#wt-cli-accept-btn {
  margin: 0.5rem !important;
  padding: 1rem 0.5rem !important;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
/* Settings button */
#wt-cli-settings-btn {
  border-radius: unset;
  border-bottom: unset !important;
}

/* ======== POPUP ========== */
.popup {
  padding: 2rem 1rem 1rem 1rem !important;
  margin-bottom: 2rem !important;
  background: #a8ab81 !important;
}

.popup h1,
.popup h2,
.popup h3,
.popup h4,
.popup h5,
.popup h6,
.popup p {
  color: white !important;
}

.popup button {
  color: white !important;
  opacity: 1 !important;
  text-shadow: none !important;
}

.popup a:hover {
  text-decoration: underline !important;
  color: black !important;
}

/* The Modal */
.startpage_modal {
  position: fixed !important;
  z-index: 99;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  margin: 0 0 !important;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4) !important;
}

.startpage_modal-close {
  position: absolute !important;
  top: 4% !important;
  right: 23% !important;
  color: white !important;
  padding: 0 !important;
  margin-top: 15%;
  background-color: #757575;
  padding: 5px 10px !important;
  border-radius: 2rem;
  height: 31px;
  width: 31px;
  border-radius: 50%;
}

.startpage_modal p,
.startpage_modal p span {
  padding: 2rem;
  color: white !important;
}

.startpage_modal-white p,
.startpage_modal-white p span {
  color: #757575 !important;
}

.startpage_modal-content {
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  margin: auto;
  margin-top: 15%;
  padding: 20px;
  width: 60%;
  border-radius: 10px;
}

.startpage_modal-content h2 {
  text-align: center;
  color: rgb(243, 239, 218) !important;
}
/* 
.startpage_modal-white-content h2 {
  color: #a8ab81 !important;
} */

.startpage_modal-content-link {
  padding: 0 2rem;
  text-align: center;
  margin-bottom: 1rem;
}

.startpage_modal-content-link a:hover {
  color: #73763e !important;
  text-decoration: none !important;
}

.startpage_modal-content-button {
  padding: 1rem 1.5rem;
  background-color: rgb(240 255 216);
  color: #73763e !important;
  font-weight: bold;
  border-radius: 5px;
  cursor: pointer;
}

@media screen and (max-width: 1024px) {
  .startpage_modal-content {
    width: 80%;
  }

  .startpage_modal-close {
    right: 15% !important;
  }
}

@media screen and (max-width: 767px) {
  .startpage_modal-close {
    margin-top: 19%;
    right: 17% !important;
  }

  .startpage_modal-content {
    margin-top: 20%;
  }
}

@media screen and (max-width: 400px) {
  .startpage_modal-close {
    margin-top: 15%;
  }

  .startpage_modal-content {
    width: 95%;
  }

  .startpage_modal-content {
    margin-top: 15%;
  }
}

/* ======== SAWMILLS ========== */

.sawmills_listing_sawmill_info {
  margin-bottom: 1rem;
}

.sawmill-button {
  background: #860331;
  border: none;
  color: #fff;
  padding: 8px 10px;
  font-weight: 700;
  cursor: pointer;
  display: inline-block;
  width: fit-content;
  -webkit-transition: all 300ms ease 0ms;
  transition: all 300ms ease 0ms;
  margin-top: 1rem;
}

.sawmill {
  padding-left: 6rem;
  padding-right: 6rem;
}

@media screen and (max-width: 767px) {
  .sawmill {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

.sawmills-hero-image-wrapper {
  position: relative;
  margin-left: -15rem;
  margin-right: -15rem;
  margin-bottom: 3rem;
}

@media screen and (max-width: 1199px) {
  .sawmills-hero-image-wrapper {
    margin-left: -2rem;
    margin-right: -2rem;
    margin-bottom: 2rem;
  }
}

.sawmills-hero-image {
  height: 331px;
  object-fit: cover;
}

@media screen and (max-width: 767px) {
  .sawmills-hero-image {
    height: 9rem;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .sawmills-hero-image {
    height: 300px;
  }
}

@media screen and (max-width: 767px) {
  .sawmills-hero-image {
    height: 97px;
  }
}

@media screen and (max-width: 767px) {
  .sawmills-text {
    padding-left: 1rem;
    padding-right: 1rem;
  }
}

.sawmills-hero-image-wrapper-plate {
  background: linear-gradient(
    to right,
    rgba(168, 173, 128, 1) 0%,
    rgba(168, 173, 128, 0.75) 100%
  );
  width: 260px;
  height: 290px;
  position: absolute;
  bottom: 0;
  left: 15rem;
}

.sawmills-hero-titles {
  position: absolute;
  bottom: 4rem;
  left: 18rem;
  max-width: 720px;
}

@media screen and (max-width: 767px) {
  .sawmills-hero-titles {
    position: static;
  }
}

.sawmills-hero-image-title {
  color: white;
}

@media screen and (max-width: 767px) {
  .sawmills-hero-image-title {
    color: #a8ab81;
  }
}

.sawmills-hero-image-subTitle {
  color: white;
  font-size: 1.75rem;
}

@media screen and (max-width: 767px) {
  .sawmills-hero-image-subTitle {
    color: #a8ab81;
    font-size: 1.3rem;
  }
}

/* .sawmills {
  margin-top: 2rem;
} */

@media screen and (max-width: 769px) {
  .sawmills-map {
    margin-bottom: 2rem;
  }
}

.sawmills-ul {
  margin: 0;
  padding: 0;
}

.sawmills-li {
  list-style: none;
}

.sawmills-accordion {
  margin-bottom: 1rem;
  border-bottom: 1px solid #73763e;
}

.sawmills-accordion-content {
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
}

.sawmills-accordion-content p {
  margin-bottom: 0.5rem !important;
}

.sawmills-accordion-content a {
  margin-bottom: 0.5rem !important;
}

.sawmills-accordion-content ul {
  margin-bottom: 1rem;
}

/* ======== SAWMILL ========== */

.sawmills-accordion-title {
  display: flex;
  justify-content: space-between;
}

.sawmills-accordion-title::after {
  font-family: "Font Awesome 5 Free";
  content: "\f068";
  display: inline-block;
  vertical-align: middle;
  font-weight: 900;
  color: rgb(134, 3, 49) !important;
  font-style: normal;
}

.sawmills-accordion-title.collapsed::after {
  font-family: "Font Awesome 5 Free";
  content: "\f067";
  display: inline-block;
  vertical-align: middle;
  font-weight: 900;
  color: rgb(134, 3, 49) !important;
  font-style: normal;
}

.sawmill_hero--imagewrapper {
  position: relative;
  margin-left: -15.5rem;
  margin-right: -15.5rem;
  margin-bottom: 3rem;
}

@media (min-width: 1024) and (max-width: 1199px) {
  .sawmill_hero--imagewrapper {
    margin-left: -7rem;
    margin-right: -7rem;
  }
}

@media (min-width: 768px) and (max-width: 1024px) {
  .sawmill_hero--imagewrapper {
    margin-left: -6rem;
    margin-right: -6rem;
  }
}

@media (max-width: 767px) {
  .sawmill_hero--imagewrapper {
    margin-left: 0;
    margin-right: 0;
  }
}

.sawmill_hero--image {
  height: 470px;
  object-fit: cover;
}

@media (min-width: 768px) and (max-width: 1199px) {
  .sawmill_hero--image {
    height: 331px;
  }
}

@media (max-width: 767px) {
  .sawmill_hero--image {
    height: 246px;
  }
}

.sawmill_hero--image__title--wrapper {
  background: rgba(168, 171, 129, 0.75);
  padding: 42px 70px;
  position: absolute;
  bottom: 0;
  width: 100%;
}

@media (min-width: 1199px) and (max-width: 1441px) {
  .sawmill_hero--image__title--wrapper {
    left: 7.5rem;
    width: 85%;
  }
}

@media (min-width: 768px) and (max-width: 1199px) {
  .sawmill_hero--image__title--wrapper {
    left: 3rem;
    width: 88%;
  }
}

@media (max-width: 767px) {
  .sawmill_hero--image__title--wrapper {
    background: rgba(168, 171, 129, 0.75);
    padding: 21px 35px;
  }
}

.sawmill_hero--image__title {
  color: white;
}

.sawmill-contact-info {
  margin-top: 3rem;
  background: rgba(243, 239, 218);
}

.sawmill_contactbar--inner {
  width: 100%;
  display: flex;
  justify-content: space-between;
}

@media screen and (max-width: 769px) {
  .sawmill_contactbar--inner {
    flex-direction: column;
  }
}

.sawmill-contact-header {
  font-size: 4rem;
}

@media (min-width: 768px) and (max-width: 1199px) {
  .sawmill-contact-header {
    font-size: 2rem;
  }
}
@media (max-width: 767px) {
  .sawmill-contact-header {
    font-size: 2rem;
    margin-bottom: 1rem;
  }
}

@media (min-width: 1199px) {
  .sawmill-contact-info {
    display: flex;
    margin-right: -2rem !important;
  }
  .sawmill-contact-info div:first-of-type {
    margin-right: 2rem;
  }
}

.sawmill_ul {
  list-style: none;
  padding-left: 0;
}

.sawmill_li {
  margin-bottom: 0.5rem;
}

/* ======== VÄX MED VIDA - 33% BREDD ========== */
.vmv-33-listing {
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%;
}

@media (max-width: 768px) {
  .vmv-33-listing {
    flex-basis: auto;
  }
}

/* ======== BOOTSTRAP HIDE ========== */

.hide {
  display: none !important;
}
.show {
  display: block !important;
}
.invisible {
  visibility: hidden;
}
.text-hide {
  font: 0/0 a;
  color: transparent;
  text-shadow: none;
  background-color: transparent;
  border: 0;
}
.hidden {
  display: none !important;
}
.affix {
  position: fixed;
}
@-ms-viewport {
  width: device-width;
}
.visible-xs,
.visible-sm,
.visible-md,
.visible-lg {
  display: none !important;
}
.visible-xs-block,
.visible-xs-inline,
.visible-xs-inline-block,
.visible-sm-block,
.visible-sm-inline,
.visible-sm-inline-block,
.visible-md-block,
.visible-md-inline,
.visible-md-inline-block,
.visible-lg-block,
.visible-lg-inline,
.visible-lg-inline-block {
  display: none !important;
}
@media (max-width: 767px) {
  .visible-xs {
    display: block !important;
  }
  table.visible-xs {
    display: table !important;
  }
  tr.visible-xs {
    display: table-row !important;
  }
  th.visible-xs,
  td.visible-xs {
    display: table-cell !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-block {
    display: block !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline {
    display: inline !important;
  }
}
@media (max-width: 767px) {
  .visible-xs-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 325px) and (max-width: 767px) {
  .visible-sm {
    display: block !important;
  }
  table.visible-sm {
    display: table !important;
  }
  tr.visible-sm {
    display: table-row !important;
  }
  th.visible-sm,
  td.visible-sm {
    display: table-cell !important;
  }
}
@media (min-width: 325px) and (max-width: 767px) {
  .visible-sm-block {
    display: block !important;
  }
}
@media (min-width: 325px) and (max-width: 767px) {
  .visible-sm-inline {
    display: inline !important;
  }
}
@media (min-width: 325px) and (max-width: 767px) {
  .visible-sm-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .visible-md {
    display: block !important;
  }
  table.visible-md {
    display: table !important;
  }
  tr.visible-md {
    display: table-row !important;
  }
  th.visible-md,
  td.visible-md {
    display: table-cell !important;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .visible-md-block {
    display: block !important;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .visible-md-inline {
    display: inline !important;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .visible-md-inline-block {
    display: inline-block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg {
    display: block !important;
  }
  table.visible-lg {
    display: table !important;
  }
  tr.visible-lg {
    display: table-row !important;
  }
  th.visible-lg,
  td.visible-lg {
    display: table-cell !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-block {
    display: block !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline {
    display: inline !important;
  }
}
@media (min-width: 1200px) {
  .visible-lg-inline-block {
    display: inline-block !important;
  }
}
@media (max-width: 767px) {
  .hidden-xs {
    display: none !important;
  }
}
@media (min-width: 325px) and (max-width: 767px) {
  .hidden-sm {
    display: none !important;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .hidden-md {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  .hidden-lg {
    display: none !important;
  }
}

/* Ninja forms */
div[id^="nf-field"] .checkbox-wrap {
  flex-direction: column;
}

div[id^="nf-field"] .nf-field-description {
  margin-top: 1rem;
}

.acc-item-school {
  background-color: white;
  color: black;
  cursor: pointer;
  padding: 10px;
  width: 100%;
  border: 1px solid black;
  text-align: left;
  font-size: 16px;
  transition: 0.4s;
  margin-bottom: 0.5rem;
  display: flex;
  justify-content: space-between;
  font-weight: bold;
}

.acc-item-school:hover {
  text-decoration: none;
  color: rgb(134, 3, 49) !important;
}

.acc-item-school::after {
  font-family: "Font Awesome 5 Free";
  content: "\f068";
  display: inline-block;
  vertical-align: middle;
  font-weight: 900;
  color: rgb(134, 3, 49) !important;
  font-style: normal;
}

.acc-item-school.collapsed::after {
  font-family: "Font Awesome 5 Free";
  content: "\f067";
  display: inline-block;
  vertical-align: middle;
  font-weight: 900;
  color: rgb(134, 3, 49) !important;
  font-style: normal;
}

@media (min-width: 780px) {
  .acc-item-school {
    padding: 16px;
  }
}

.acc-item-content {
  padding: 0 12px;
  display: none;
  overflow: hidden;
  color: black;
}

@media (min-width: 780px) {
  .acc-item-content {
    padding: 0 16px;
  }
}

@media (min-width: 780px) {
  .acc-item_inner_wrapper {
    width: 75%;
  }
}

.acc-item_inner_wrapper {
  width: 100%;
}

/* Skogsutbildnings */
.skogsutbildnings-items {
  max-width: 350px;
}

.forest_film_content {
  padding-bottom: 2rem;
}

/* Sidebar */
.sidebar_additional_image {
  padding-top: 1.5rem;
}

/* 
  Checkout page - for Woocommerce layout
  Note: This layout will be replaced if 'Klarna Checkout for Woocommerce' plugin is active
 */
.woocommerce-billing-fields__field-wrapper {
  display: flex;
  flex-direction: column;
}
.woocommerce .col2-set .col-1,
.woocommerce .col2-set .col-2 {
  max-width: unset;
  width: 100%;
}
.woocommerce form .form-row {
  width: 100%;
}
.woocommerce span.woocommerce-input-wrapper {
  width: 100%;
}