:root {
  --primary: #A4343A;
  --secondary: #25282A;
  --verydark: #434544;
  --dark: #333;
  --light: #E5E5E5;
  --grey: #888;
  --white: #fff;
  --header-height-wimg: 450px;
  --header-height-noimg: calc(var(--header-height-wimg) + 57px);
  --header-height-noimg-link: calc(var(--header-height-noimg) + 100px);
  --header-height-wimg-link: calc(var(--header-height-wimg) + 157px);
  --nav-height: 140px;
}

/* #navTop li.nav-menu-item {border-left: solid 1px var(--primary);border-right: solid 1px var(--primary);}

#navTop a{color:var(--secondary);font-size:.75em;font-weight:bold}
#navTop a:hover {color:var(--primary)}
#navTop [class^="icon-"] {color: var(--primary)} */

header.wimg {
  min-height: var(--header-height-wimg);
}

header.noimg,
.template-course-chooser header.wimg,
.template-course-chosen header.wimg {
  min-height: var(--header-height-noimg);
}

main.wimg {
  margin-top: calc((var(--header-height-wimg) - var(--nav-height)) * -1);
}

main.noimg,
.template-course-chooser main.wimg,
.template-course-location-chosen main.wimg {
  margin-top: calc((var(--header-height-noimg) - var(--nav-height)) * -1);
}

.template-course-location-chosen .hero,
.template-course-chooser .hero,
.template-course-chosen .hero {
  display: none;
}

.block {
  display: block;
}

.grid {
  display: grid;
}

.area.closed svg {
  transform: rotate(-180deg);
}

.text-bold {
  font-weight: bold;
}

.select-none {
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

main.wimg h1 {
  color: var(--dark)
}

.template-course-chooser main.wimg h1,
.template-course-location-chosen main.wimg h1 {
  color: var(--light)
}

main.noimg h1 {
  color: var(--white)
}

.menu-item {
  transition: all 0.1s ease-out;
}

.menu-item:hover,
.menu-item:active {
  transition: all 0.1s ease-in;
  transform: scale(1.1);
  text-decoration: underline;
}

#mob-menu .menu-item {
  transition: all 0.1s ease-out;
}

#mob-menu .menu-item:hover,
.menu-item:active {
  transition: all 0.1s ease-in;
  transform: none;
  text-decoration: underline;
}

.min-h-100px {
  min-height: 100px;
}

.listing-icon img {
  height: 87px;
}

.nav {
  max-height: var(--nav-height);
}

.h60px {
  height: 60px;
}

.h30px {
  height: 30px;
}

.color-inherit {
  color: inherit;
}

.nav a,
.footer-nav a {
  font-size: 0.9rem;
}

.shadow-box {
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.3)
}

.w100 {
  width: 100%;
}

.txt-inherit {
  color: inherit;
}

.hover-underline:hover {
  text-decoration: underline
}

.h-auto {
  height: auto;
}

.truncate {
  overflow: hidden;
  max-height: 8rem;
  -webkit-box-orient: vertical;
  display: block;
  display: -webkit-box;
  overflow: hidden !important;
  text-overflow: ellipsis;
  -webkit-line-clamp: 4;
}

.grid-container {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  grid-template-rows: 1fr min-content;
  gap: 1rem;
  /* grid-auto-rows: minmax(1vw, auto); */
  width: 100%;
  width: -moz-available;
  width: -webkit-fill-available;
}

.grid-container.col4 {
  grid-template-columns: repeat(4, 1fr);
}

.grid-container.col3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid-container.col2 {
  grid-template-columns: repeat(2, 1fr);
}

.grid-container.col1 {
  grid-template-columns: 1fr;
  grid-template-rows: 1fr;
}

.grid-container.min-1fr {
  grid-template-rows: min-content 1fr min-content;
  grid-row-gap: 0;
}

a.icon {
  display: block;
  position: absolute;
  right: 20px;
  top: 36px;
}

a.icon i {
  font-size: 1.5rem;
}

.z99 {
  z-index: 99;
}

.z100 {
  z-index: 100;
}

#mob-menu a {
  width: 100%;
}

.display-none {
  display: none;
}

.grid-container.employees {
  grid-template-rows: min-content min-content 1fr;
}

.h-1_5em {
  height: 1.5em;
}

.h-2em {
  height: 2em;
}

.min-h-1_7em {
  min-height: 1.7em;
}

.min-h-3_5em {
  min-height: 3.5em;
}

.row-gap-0 {
  row-gap: 0;
}

.h85 {
  height: 85%;
}

.h100 {
  height: 100%;
}

.col-span-1 {
  grid-column: span 1;
}

.col-span-2 {
  grid-column: span 2;
}

.col-span-3 {
  grid-column: span 3;
}

.shadow-box .listing-icon img {
  transition: all 0.2s ease-in;
}

.shadow-box:hover .listing-icon img {
  transform: scale(1.1);
}

.right-0 {
  right: 0;
}

.relative {
  position: relative;
}

.overflow-hidden {
  overflow: hidden;
}

.p-2 {
  padding: 0.5rem;
}

.mt-4 {
  margin-top: 1rem
}

.max-h-0 {
  max-height: 0px
}

.max-h-screen {
  max-height: 100vh
}

.w-screen {
  width: 100vw
}

.transition-all {
  transition-property: all;
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  transition-duration: 150ms
}

.cursor-pointer {
  cursor: pointer
}

.duration-300 {
  transition-duration: 300ms
}

.duration-500 {
  transition-duration: 500ms
}

.py-8 {
  padding-top: 2rem;
  padding-bottom: 2rem
}

.m-0 {
  margin: 0
}

.p-0 {
  padding: 0
}

.px-16 {
  padding-left: 4rem;
  padding-right: 4rem
}

.gap-6 {
  gap: 1.5rem
}

.min-w-\[10rem\] {
  min-width: 10rem
}

.rtl {
  direction: rtl
}

.ltr {
  direction: ltr
}

.shadow-\[inset_0px_0px_0px_2px_var\(--primary\)\] {
  --tw-shadow: inset 0px 0px 0px 2px var(--primary);
  --tw-shadow-colored: inset 0px 0px 0px 2px var(--tw-shadow-color);
  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
}

.max-h-\[200vh\] {
  max-height: 200vh
}

.max-h-screen {
  max-height: 100vh
}

.max-h-0 {
  max-height: 0px
}

.min-w-max {
  min-width: max-content
}

.sertifisering-svg svg {
  width: 100%;
  height: auto;
  max-width: 200px;
}




@media (min-width: 1024px) {
  .lg\:w-max {
    width: max-content
  }
}

@media (min-width: 1024px) {
  .lg\:min-w-\[10rem\] {
    min-width: 10rem
  }
}

.rounded-md {
  border-radius: 0.375rem
}

.-mr-\[20px\] {
  margin-right: -20px
}

@media (min-width: 1024px) {
  .lg\:-mr-0 {
    margin-right: -0px
  }
}

.grid {
  display: grid
}

@media (min-width: 768px) {
  .md\:grid-cols-2 {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
}

#clickWrapper {
  cursor: pointer;
  height: 20px;
  width: 25px;
}

/* menu start */
.menu {
  position: absolute;
  background-color: #fff;
  width: 25px;
  height: 1px;
  margin-top: 8px;
}

.animate.menu {
  animation-name: menu-menu;
  animation-duration: 0.3s;
}

.scale-75 {
  transform: scale(1);
}

@keyframes menu-menu {
  0% {
    width: 0px;
    height: 0px;
  }

  50% {
    width: 0px;
    height: 0px;
  }

  51% {
    position: absolute;
    background-color: #fff;
    width: 25px;
    height: 1px;
  }
}

.menu:after {
  content: "";
  position: absolute;
  background-color: #fff;
  width: 25px;
  height: 1px;
  margin-top: -8px;
}

.animate.menu:after {
  animation-name: menu-after;
  animation-duration: 0.3s;
}

@keyframes menu-after {
  0% {
    transform: rotate(-45deg);
    margin-top: 0px;
  }

  50% {
    transform: rotate(0deg);
    margin-top: 0px;
  }

  100% {
    transform: rotate(0deg);
    margin-top: -8px;
  }
}

.menu:before {
  content: "";
  position: absolute;
  background-color: #fff;
  width: 25px;
  height: 1px;
  margin-top: 8px;
}

.animate.menu:before {
  animation-name: menu-before;
  animation-duration: 0.3s;
}

@keyframes menu-before {
  0% {
    transform: rotate(45deg);
    margin-top: 0px;
  }

  50% {
    transform: rotate(0deg);
    margin-top: 0px;
  }

  100% {
    transform: rotate(0deg);
    margin-top: 8px;
  }
}

/* menu end */

/* close start */
.close {
  position: absolute;
  margin-top: 8px;
  margin-left: 0;
}

.close.animate {
  animation-name: close-close;
  animation-duration: 0.3s;
}

@keyframes close-close {
  0% {
    position: absolute;
    background-color: #fff;
    width: 25px;
    height: 1px;
    margin-top: 8px;
  }

  50% {
    display: none;
    width: 25px;
    height: 5px;
  }

  100% {
    width: 0px;
    height: 0px;
  }
}

.close:after {
  content: "";
  position: absolute;
  background-color: #fff;
  width: 25px;
  height: 1px;
  transform: rotate(45deg);
}

.animate.close:after {
  animation-name: close-after;
  animation-duration: 0.3s;
}

@keyframes close-after {
  0% {
    transform: rotate(0deg);
    margin-top: 8px;
  }

  50% {
    transform: rotate(0deg);
    margin-top: 0px;
  }

  100% {
    transform: rotate(45deg);
  }
}

.close:before {
  content: "";
  position: absolute;
  background-color: #fff;
  width: 25px;
  height: 1px;
  transform: rotate(-45deg);
}

.animate.close:before {
  animation-name: close-before;
  animation-duration: 0.3s;
}

@keyframes close-before {
  0% {
    transform: rotate(0deg);
    margin-top: -8px;
  }

  50% {
    transform: rotate(0deg);
    margin-top: 0px;
  }

  100% {
    transform: rotate(-45deg);
  }
}

/* close end */



/* .shadow-box:nth-child(even) figure{order: -1;} */
@media screen and (max-width:1200px) {

  .grid-container.col3,
  .grid-container.col4,
  .grid-container {
    grid-template-columns: repeat(2, 1fr);
  }

  .nav a {
    font-size: 0.8rem;
  }

  .col-span-3,
  .col-span-2 {
    grid-column: span 1;
  }

  .col-span-1 {
    grid-column: span 2;
  }

  /* .hide-small-screen{display: none;}
    .show-small-screen{display: flex;} */
}

@media screen and (min-width:768px) and (max-width:850px) {
  .col-span-1 {
    grid-column: span 1;
  }
}

@media screen and (max-width:767px) {
  :root {
    /* --header-height-wimg: 450px;
        --header-height-noimg: calc(var(--header-height-wimg) + 57px);
        --header-height-noimg-link: calc(var(--header-height-noimg) + 100px);
        --header-height-wimg-link: calc(var(--header-height-wimg ) + 157px); */
    --header-height-wimg: 250px;
    --nav-height: 100px;
    --header-height-noimg: calc(var(--header-height-wimg) + 90px);
  }


  /* .grid-container.col3, .grid-container.col4, .grid-container{grid-template-columns: repeat(1, 1fr);} */
  .grid-container.col4.employees {
    grid-template-columns: repeat(4, 1fr);
  }

  .nav a {
    font-size: 0.8rem;
  }

  .mob-min-h60vh {
    min-height: 60vh;
  }

  .col-span-3,
  .col-span-2 {
    grid-column: span 2;
  }

  .mob-col-4of4 {
    grid-column: span 4;
  }

  /* .hide-small-screen{display: none;}
    .show-small-screen{display: flex;} */
}