/*-- vars --*/
:root {
  --blue: #04adef;
  --mediblue: #007fad;
  --barkblue: #003447;
  --white: #ffffff;
  --green: #7dc242;
  --darkgrey: #666666;
  --lightgrey: #f5f5f5;
  --medigrey: #e4e5e5;
}

/*-- colors  --*/
.bg-lightgrey {
  background: var(--lightgrey);
}

.bg-lightgrey-quote {
  background: var(--lightgrey);
  position: relative;
  z-index: -9;
}

.bg-medigrey {
  background: var(--medigrey);
}

/*-- generel --*/
html {
  scroll-behavior: smooth;
}

html,
body {
  overflow-x: hidden;
  max-width: 100%;
  font-family: "Open Sans", serif;
}

h1 {
  font-family: "Raleway", serif;
  color: var(--darkgrey);
  font-size: 46px;
  line-height: 50px;
  margin-bottom: 1.8rem;
}

h1.front-page,
h2 {
  font-family: "Raleway", serif;
  color: var(--darkgrey);
  font-size: 32px;
  line-height: 34px;
  font-weight: 400;
  margin-bottom: 1.8rem;
}

@media (max-width: 992px) {
  h1.front-pagee,
  h1,
  h2 {
    font-size: 26px;
    line-height: 32px;
    margin-bottom: 1.5rem;
  }
}

h3 {
  font-family: "Raleway", serif;
  color: var(--darkgrey);
  font-size: 26px;
  line-height: 34px;
  margin: 0 0 35px;
  font-weight: 500;
}

h4 {
  font-family: "Raleway", serif;
  color: var(--darkblue);
  font-size: 22px;
  line-height: 28px;
  margin: 0 0 15px;
  font-weight: 400;
}

@media (max-width: 992px) {
  h4 {
    font-size: 20px;
    line-height: 26px;
    margin: 0 0 10px;
  }
}

p {
  font-family: "Open Sans", serif;
  color: var(--darkgrey);
  font-size: 16px;
  line-height: 24px;
}

.phone {
  font-family: "Open Sans", serif;
  color: var(--darkblue);
  font-size: 15px;
  line-height: 24px;
  text-decoration: none;
  font-weight: 400;
}

a {
  font-family: "Open Sans", serif;
  font-weight: 600;
  text-decoration: underline;
}

a:hover {
  color: var(--darkgrey);
}

.pic-overflow {
  overflow: hidden;
  object-fit: cover;
  object-position: center center;
}
.curser-pointer {
  cursor: pointer;
}

.p-link {
  color: var(--darkblue);
  font-family: "Open Sans", serif;
  font-size: 15px;
  line-height: 26px;
  text-decoration: none;
  position: relative;
  padding: 0 20px 0 0;
  font-weight: 700;
  transition: all 0.2s ease;
}

.p-link:hover {
  color: var(--darkgrey);
  transition: all 0.2s ease;
}

.p-link:before {
  content: url(../img/p-link-arrow-darkblue.svg);
  position: absolute;
  right: 0;
  top: 50%;
  transform: translate(0, -50%);
  transition: all 0.2s ease;
}

.p-link:hover:before {
  content: url(../img/p-link-arrow.svg);
  right: -5px;
  transition: all 0.2s ease;
}

/*-- nav --*/
.navbar-light .navbar-nav .nav-link {
  color: var(--darkblue);
}

.navbar-light .navbar-nav .nav-link:hover {
  color: var(--darkgrey);
}

li.nav-item.active {
  color: var(--blue) !important;
}

a.nav-link.cta-btn,
a.cta-btn {
  text-decoration: none;
  background: var(--blue);
  color: var(--white) !important;
  padding: 15px 20px;
  width: 170px;
  cursor: pointer;
  box-shadow: inset 0 0 0 0 #007fad;
  -webkit-transition: ease-out 0.4s;
  -moz-transition: ease-out 0.4s;
  transition: ease-out 0.4s;
}

a.nav-link.cta-btn:hover,
a.cta-btn:hover {
  box-shadow: inset 170px 0 0 0 #007fad;
}

@media (max-width: 1200px) {
  a.nav-link.cta-btn,
  a.cta-btn {
    width: 100%;
  }

  a.nav-link.cta-btn:hover,
  a.cta-btn:hover {
    box-shadow: inset 1200px 0 0 0 #007fad;
  }
}

a.nav-link.cta-btn:active {
  background: var(--darkblue);
}

.navbar-light .navbar-toggler {
  border: 0;
  color: transparent;
  padding-right: 0;
}

/*-- HEROS --*/
.hero {
  margin-top: 105px;
  height: 70vh;
}

.hero-img {
  height: 70vh;
}

@media (max-width: 992px) {
  .hero,
  .hero-img {
    height: auto;
  }
}

/*-- intro --*/
.intro {
  z-index: 9;
  position: relative;
}

.intro-img,
.quote-img {
  position: relative;
  margin-right: 1rem;
}

.quote-img {
  width: 99%;
}

@media (max-width: 992px) {
  .intro-img {
    margin-top: 6rem;
  }

  .quote-img {
    width: 96%;
  }
}

@media (max-width: 576px) {
  .intro-img {
    margin-right: 8px;
    margin-top: 3rem;
  }
}

.bg-element {
  background: var(--green);
  width: 90%;
  height: 95%;
  position: absolute;
  top: -15%;
  right: -0.5rem;
}

/*-- big keyword --*/
.keywords p {
  font-size: 138px;
  font-weight: 700;
  line-height: 80px;
  color: var(--lightgrey);
}

@media (max-width: 1200px) {
  .keywords p {
    font-size: 38px;
    line-height: 0;
  }
}

.keywords-dark p {
  color: var(--medigrey);
}

/*-- slider frontpage --*/
.cta-slider {
  position: relative;
  overflow: hidden;
}
.cta-slider-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease-out;
  will-change: transform;
}

.cta-slider-img:hover {
  transform: scale(1.1);
}

.cta-title {
  position: absolute;
  top: 0;
  width: 90%;
  margin: 20px;
  color: var(--white);
  font-size: 26px;
}

@media (max-width: 992px) {
  h3.cta-title {
    font-size: 22px;
    line-height: 28px;
    width: 85%;
  }
}

.cta-arrow {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 75px;
  height: 75px;
}

/*-- hero slideshow --*/
.overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(199, 199, 199, 0) 50%,
    rgba(85, 89, 93, 0.8) 100%
  );
}

.hero-slideshow {
  height: 80vh;
}

@media (max-width: 1200px) {
  .hero-slideshow {
    height: 50vh;
  }
}

@media (max-width: 992px) {
  .hero-slideshow {
    height: 45vh;
  }
}

@media (max-width: 992px) {
  .hero-slideshow {
    height: 45vh;
  }
}

@media (max-width: 576px) {
  .hero-slideshow {
    height: 320px;
  }
}

.swiperHero {
  margin-top: 105px;
  position: relative;
}

.arrows-hero {
  position: absolute;
  bottom: 0;
  left: 30px;
  height: 90px;
}

@media (max-width: 768px) {
  .arrows-hero {
    display: none;
  }
}

.arrow-down-hero {
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-align: center;
  z-index: 9;
  position: absolute;
  bottom: 5%;
  left: 48%;
}

.arrow-down-hero p {
  color: var(--white);
  font-size: 14px;
}

.arrow-down {
  text-decoration: none;
}

@media (max-width: 768px) {
  .arrow-down-hero {
    display: none;
  }
}

.bounce-arrow {
  animation: bounce 1.9s;
  animation-direction: alternate;
  animation-timing-function: cubic-bezier(0.8, 0.08, 1, 0.8);
  animation-iteration-count: infinite;
}

@keyframes bounce {
  from {
    transform: translate3d(2px, 2px, 2px);
  }

  to {
    transform: translate3d(2px, 5px, 2px);
  }
}

/*-- swiper --*/
.swiper-button-next:after,
.swiper-button-prev:after {
  content: none !important;
}

.swiper-button-next {
  left: 90px !important;
}
.swiper-button-prev {
  left: 0 !important;
}

.swiper-button-next,
.swiper-button-prev {
  position: absolute;
  bottom: 0;
}

.swiper-button-next img,
.swiper-button-prev img {
  left: 30px;
}

.mangfoldig-prev-img {
  left: 15px !important;
}

.mangfoldig-btn-box {
  position: relative;
  width: 140px;
  height: 75px;
  top: 0;
}

@media (max-width: 992px) {
  .mangfoldig-btn-box {
    height: 115px;
  }
}

.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {
  bottom: 20px !important;
}

.swiper-pagination-bullet-active {
  background: #fff !important;
}

.swiper-pagination-bullet {
  background: #fff !important;
  width: 12px !important;
  height: 12px !important;
}

/*-- quotes --*/
.quote-sektion {
  position: relative;
  z-index: 9;
}
.quote {
  padding: 30px 0 0 30px;
}

@media (max-width: 992px) {
  .quote {
    padding: 30px 0 30px 30px;
  }
}

@media (max-width: 576px) {
  .quote {
    padding: 30px 0;
  }
}

.quote p,
.quote-overlay-text p {
  font-size: 34px;
  line-height: 44px;
  font-family: "Open Sans", serif;
  font-weight: 700;
}

@media (max-width: 992px) {
  .quote p,
  .quote-overlay-text p {
    font-size: 28px;
    line-height: 35px;
  }
}

.quote p:before,
.quote-overlay-text:before {
  margin-bottom: 1.5rem;
  content: url(../img/quote-icon.svg);
  display: block;
}

.quote-overlay-text p,
.quote-overlay-text {
  color: var(--white) !important;
}

@media (max-width: 992px) {
  .quote-overlay-text p,
  .quote-overlay-text {
    color: var(--darkgrey) !important;
  }
}

.quote-overlay-text {
  width: 30%;
  position: absolute;
}

@media (max-width: 1400px) {
  .quote-overlay-text {
    width: 40%;
    position: absolute;
  }
}
@media (max-width: 1200px) {
  .quote-overlay-text {
    width: 60%;
  }
}

@media (max-width: 992px) {
  .quote-overlay-text {
    position: static;
    width: 100%;
  }
}

.quote span {
  color: var(--darkgrey);
  font-weight: 500;
}

/*--full width quote--*/
.quote-bg-element {
  background: var(--green);
  width: 90%;
  height: 95%;
  position: absolute;
  bottom: -1.5rem;
  right: -0.5rem;
  z-index: -1 !important;
}
@media (max-width: 992px) {
  .quote-bg-element {
    top: 2rem;
    height: 98%;
  }
}

.quote-overlay {
  background: linear-gradient(280deg, rgba(255, 255, 255, 0) 30%, rgba(85, 89, 93, 1) 100%);
  width: 100%;
  height: 100%;
  position: absolute;
}
/*-- Undervisning landekort --*/
.locations-map {
  margin-top: -35%;
  position: relative;
  z-index: -99;
}

/*-- jobfeed --*/
[hidden] {
  display: none !important;
}

.job-container-empty {
  background: #f3f3f3;
}

.job-container-empty p {
  font-family: "Open Sans", sans-serif;
  font-size: 18px;
  line-height: 26px;
  margin: 0;
}

.job-card {
  padding: 25px;
  display: flex;
  flex-direction: column;
  min-height: 155px;
  width: 100%;
  background: #f3f3f3;
  position: relative;
}

@media (max-width: 992px) {
  .job-card {
    padding: 15px;
    min-height: 130px;
  }
}

.job-card:after {
  content: url("../img/arrow-white-right.svg");
  position: absolute;
  bottom: -8px;
  right: 0;
}

.job-card:hover .job-card__title,
.job-card:hover .job-card__location,
.job-card:hover .job-card__apply-deadline {
  color: var(--darkgrey);
  text-decoration: none;
  transition: all 0.2s ease;
}

.job-card__main {
  flex-grow: 1;
}

.job-card__footer {
  margin-top: 40px;
}

.job-card__title {
  color: var(--darkblue);
  font-size: 20px;
  line-height: 26px;
  text-decoration: none;
  word-break: break-word;
  margin-top: 10px;
  display: inline-block;
  transition: all 0.2s ease;
}

@media (max-width: 992px) {
  .job-card__title {
    font-size: 20px;
    line-height: 24px;
  }
}

@media (max-width: 576px) {
  .job-card__title {
    font-size: 16px;
    margin-right: 95px;
  }
}

.job-card__apply-deadline {
  font-size: 12px;
  line-height: 16px;
  font-weight: 500;
  font-family: "Open Sans", sans-serif;
  flex-shrink: 0;
  color: var(--darkgrey);
  margin: 7px 0 0;
}

.job-card__apply-deadline time {
  font-weight: 400;
}

.job-card__location {
  padding-left: 15px;
  position: relative;
  color: var(--darkblue);
  font-family: "Open Sans", sans-serif;
  font-size: 12px;
  line-height: 20px;
  font-weight: 600;
}

.job-card__location:before {
  content: url(../img/lacation-icon.svg);
  position: absolute;
  left: 0;
  top: 0;
}

.job-card:hover .job-card__location:before {
  content: url(../img/lacation-icon-hover.svg);
}

/*-- footer --*/
.footer p {
  color: var(--darkblue);
  margin: 3px 0;
  font-size: 15px;
}

.footer img {
  max-width: 170px;
}

.footer-content {
  position: relative;
}
p.footer-contact-phone,
.footer-contact-clock p,
.footer-contact-clock1 p {
  padding-left: 18px;
}
.footer-contact-phone:before {
  content: url(../img/icon-phone.svg);
  position: absolute;
  top: 0;
  left: 0;
}

.footer-contact-clock:before,
.footer-contact-clock1:before {
  content: url(../img/icon-clock.svg);
  position: absolute;
  top: 0;
  left: 0;
}

/*-- some --*/
.some .figure {
  text-decoration: none;
  display: inline-block;
}

.figure {
  position: relative;
  width: 50px;
  max-width: 50px;
  margin-left: 10px;
}

.figure img.youtube.hover,
.figure img.instagram.hover,
.figure img.facebook.hover,
.figure img.linkedin.hover {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  object-fit: contain;
  opacity: 0;
  transition: opacity 0.2s;
}

.figure:hover img.youtube.hover,
.figure:hover img.instagram.hover,
.figure:hover img.facebook.hover,
.figure:hover img.linkedin.hover {
  opacity: 1;
}

/*-- ScrollTrigger GSAP --*/
.fade-up,
.fade-up-two,
.fade-up-three {
  opacity: 0;
  transform: translate(0, 70px);
}

.fade-down,
.fade-down-two,
.fade-down-three {
  opacity: 0;
  transform: translate(0, -70px);
}

.scrub-down {
  transform: translate(0px, -100px);
  opacity: 0.3;
}

.scrub-up {
  transform: translate(0px, 100px);
  opacity: 0.9;
}

@media (max-width: 768px) {
  .scrub-up,
  .scrub-down {
    transform: translate(0px, 0px) !important;
    opacity: 1 !important;
  }
}