/* Variabler*/
@font-face {
  font-family: "AlegreyaSans-Regular";
  src: url("../fonts/Alegreya_Sans/AlegreyaSans-Regular.ttf");
}
@font-face {
  font-family: "Oxygen-Regular";
  src: url("../fonts/Oxygen/Oxygen-Regular.ttf");
}
/*Mixins for homepage, booking and services */
/*-----------------------------------------Til Showcase--------------------------------------*/
/*----------mixin til Showcase til @media only screen and (min-width: 901px) and (max-width:1200px)------*/
/*--------------mixin til Showcase til @media screen and (min-width: 1201px)-------------*/
/*Til Moedos-siden*/
/*Moesossiden*/
@font-face {
  font-family: "alegreya sans";
  src: url("../fonts/Alegreya_Sans/AlegreyaSans-Regular.ttf");
}
@font-face {
  font-family: "oxygen";
  src: url("../fonts/Oxygen/Oxygen-Regular.ttf");
}
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.pil-op {
  position: sticky;
  top: 90vh;
  margin-left: 83vw;
  margin-bottom: 10px;
}

/*.......Header- navigations bar...... */
header {
  position: sticky;
  top: 0;
  height: 95px;
  z-index: 100000;
}

.mobile-nav {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  background-color: #040126;
  width: 100%;
}
.mobile-nav img, .mobile-nav a {
  margin: 0 auto;
  padding: 10px;
}
.mobile-nav .icons {
  margin-top: 25px;
}
.mobile-nav .bars {
  display: none;
  cursor: pointer;
}

/*...........Header ending.........*/
/*........footer navigation .......*/
.desktop-nav-footer {
  display: none;
}

.mobile-nav-footer {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  height: 110px;
  background-color: #040126;
  color: #fffafa;
  bottom: 0;
}
.mobile-nav-footer img {
  height: 30px;
  margin: 10px;
}
.mobile-nav-footer aside:first-of-type {
  justify-self: left;
  margin-left: 15px;
}
.mobile-nav-footer aside:last-of-type {
  justify-self: right;
  margin-right: 15px;
}
.mobile-nav-footer a {
  text-decoration: none;
  cursor: pointer;
}
.mobile-nav-footer a:hover {
  color: #3b3e9f;
}
.mobile-nav-footer p {
  font-size: 18pt;
  padding-left: 10px;
  font-family: "Oxygen-Regular";
}

/*........footer navigation ending .......*/
/*..........Styling for homepage...*/
.body-forside {
  display: grid;
  grid-template-rows: auto 1fr auto;
  min-height: 100vh;
  background-color: #fffafa;
}

/*logo animation section*/
.logo-animation-section {
  width: 100%;
  height: 500px;
  background: linear-gradient(to bottom, #040126, #3B3E9F, #63A8F1, #FFFFFF);
  font-family: "AlegreyaSans-Regular";
}
.logo-animation-section img, .logo-animation-section #mds-heading, .logo-animation-section #slogan {
  display: flex;
  justify-content: center;
  align-content: center;
  margin: 0 auto;
}
.logo-animation-section #logo-animation-icon {
  padding-top: 100px;
}
.logo-animation-section #mds-heading {
  font-size: 28px;
  font-family: "AlegreyaSans-Regular";
  color: #ff800b;
  font-weight: bold;
}
.logo-animation-section #slogan {
  font-size: 24px;
  color: #fffafa;
}

.logo-animation-section .logo-animation-gif {
  display: none;
}
.logo-animation-section .logo-animation-static {
  display: block;
}

/* video-papercut section*/
.video-papercut-section {
  display: grid;
  grid-template-rows: auto auto auto auto auto;
}

#papercut-right {
  justify-self: right;
  max-height: 400px;
}

#hvem-er-vi {
  font-family: "AlegreyaSans-Regular";
  font-size: 2.5rem;
  color: #040126;
  display: flex;
  justify-content: center;
  padding: 10px;
}

#papercut-left {
  justify-self: left;
  max-height: 400px;
}

#peafowl {
  display: flex;
  justify-content: center;
  align-content: center;
  margin: 0 auto;
  padding-top: 30px;
  height: 200px;
}

.mds-working-companion h3 {
  font-family: "AlegreyaSans-Regular";
  font-size: 2.5rem;
  color: #040126;
  display: flex;
  justify-content: center;
  margin: 100px 15px 10px 15px;
}
.mds-working-companion p {
  line-height: 1.5;
  max-width: 1200px;
  margin: 0 auto;
  font-family: "Oxygen-Regular";
  font-size: 1.2rem;
  color: #040126;
  width: 75%;
  padding: 20px 15px 10px 15px;
}
.mds-working-companion p a {
  text-decoration: none;
  cursor: pointer;
}
.mds-working-companion p a:hover {
  color: #3b3e9f;
}

video {
  aspect-ratio: 1.7777777778; /* 1920x1080 = 16:9 format */
  width: 80%;
  max-width: 1920px;
  border-radius: 15px;
  display: flex;
  justify-content: center;
  align-content: center;
  margin: 0 auto;
  border: black 2px solid;
}

/* principles  section*/
#offer-heading {
  font-family: "AlegreyaSans-Regular";
  font-size: 2.5rem;
  color: #040126;
  display: flex;
  justify-content: center;
  padding-bottom: 30px;
}

.offer-boxes-section {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: 0 auto;
  max-width: 1000px;
}
.offer-boxes-section .purple {
  background-color: rgba(59, 62, 159, 0.5);
}
.offer-boxes-section .blue {
  background-color: rgb(149, 194, 244);
}

.offer-box {
  display: grid;
  grid-template-columns: auto auto 1fr;
  gap: 5px;
  max-width: 400px;
  width: auto;
  height: auto;
  margin: 0 auto;
  border-radius: 15px;
  color: #040126;
}
.offer-box img {
  height: 70px;
  padding: 10px;
  grid-column: 1;
  align-self: center;
}
.offer-box p {
  grid-column: 2;
  font-size: 22pt;
  margin: 0 auto;
  padding-top: 26px;
  font-family: "AlegreyaSans-Regular";
}
.offer-box .offer-text {
  grid-column: 1/span 3;
  text-align: left;
  padding: 0 25px 20px 25px;
  font-size: 16pt;
  font-family: "Oxygen-Regular";
  line-height: 1.1;
}

/* animated boxes and papercut in the bottom*/
.mds-animation img:first-of-type {
  display: flex;
  justify-content: center;
  align-content: center;
  margin: 0 auto;
  max-height: 250px;
}
.mds-animation img:last-of-type {
  float: right;
  max-height: 400px;
}

/*.......Styling for homepage ending......*/
/*........Styling for Service page........*/
.services-body {
  background-color: #fffafa;
}

#services-heading {
  font-family: "AlegreyaSans-Regular";
  font-size: 2.5rem;
  color: #040126;
  display: flex;
  justify-content: center;
  margin: 70px 15px 30px 15px;
}

.service-text {
  line-height: 1.5;
  max-width: 1200px;
  margin: 0 auto;
  font-family: "Oxygen-Regular";
  font-size: 1.2rem;
  color: #040126;
  width: 75%;
  padding: 10px 20px 70px 20px;
}

.services-boxes {
  display: flex;
  flex-wrap: wrap;
  gap: 30px;
  margin: 0 auto;
}
.services-boxes #konsultation-box, .services-boxes #junior-box, .services-boxes #premium-box, .services-boxes #pro-service-box {
  display: grid;
  grid-template-rows: 0.5fr 0.5fr 0.5fr 3fr;
  border: 1px solid #040126;
  border-radius: 10px;
  margin: 0 auto;
  height: 550px;
}
.services-boxes #konsultation-box p:first-of-type, .services-boxes #junior-box p:first-of-type, .services-boxes #premium-box p:first-of-type, .services-boxes #pro-service-box p:first-of-type {
  font-size: 20pt;
  justify-self: center;
  font-family: "AlegreyaSans-Regular";
  padding-top: 10px;
}
.services-boxes #konsultation-box P, .services-boxes #junior-box P, .services-boxes #premium-box P, .services-boxes #pro-service-box P {
  font-size: 18px;
  font-family: "Oxygen-Regular";
  margin: 10px;
  line-height: 1.5;
}
.services-boxes #konsultation-box a, .services-boxes #junior-box a, .services-boxes #premium-box a, .services-boxes #pro-service-box a {
  text-decoration: none;
  cursor: pointer;
  background-color: #ff800b;
  border-radius: 70px;
  color: #fffafa;
  text-decoration: none;
  text-align: center;
  padding: 5px;
  border: 0;
  font-family: "Oxygen-Regular";
  font-size: 18pt;
  width: 10rem;
  height: 3rem;
  display: block;
  margin: 10px auto 20px auto;
  grid-row: 5;
}
.services-boxes #konsultation-box a:hover, .services-boxes #junior-box a:hover, .services-boxes #premium-box a:hover, .services-boxes #pro-service-box a:hover {
  color: #3b3e9f;
}
.services-boxes #konsultation-box #konsultation-box, .services-boxes #junior-box #konsultation-box, .services-boxes #premium-box #konsultation-box, .services-boxes #pro-service-box #konsultation-box {
  height: 500px;
  background-color: #fffafa;
}
.services-boxes #junior-box {
  background-color: #95c2f4;
  border: none;
}
.services-boxes #junior-box p:nth-child(3n+3) {
  text-align: center;
}
.services-boxes #junior-box p:last-of-type {
  justify-self: center;
}
.services-boxes #premium-box {
  background-color: #63a8f1;
  border: none;
}
.services-boxes #premium-box p:nth-child(3n+3) {
  text-align: center;
}
.services-boxes #premium-box p:last-of-type {
  justify-self: center;
  padding-top: 30px;
}
.services-boxes #pro-service-box {
  background-color: #3b3e9f;
  border: none;
  color: #fffafa;
}
.services-boxes #pro-service-box p:nth-child(3n+3) {
  text-align: center;
}
.services-boxes #pro-service-box p:last-of-type {
  justify-self: center;
  padding-top: 30px;
}

.process-guide-section {
  background: linear-gradient(#fffafa, #3B3E9F, #0d056c);
  box-shadow: 0 4px 10px #fffafa;
}
.process-guide-section .process-guide-text h2 {
  font-family: "AlegreyaSans-Regular";
  font-size: 2.5rem;
  color: #040126;
  display: flex;
  justify-content: center;
  padding: 70px 15px 30px 15px;
}
.process-guide-section .process-guide-text p {
  line-height: 1.5;
  max-width: 1200px;
  margin: 0 auto;
  font-family: "Oxygen-Regular";
  font-size: 1.2rem;
  color: #040126;
  width: 75%;
  padding: 5px 15px 5px 15px;
  text-align: left;
}

#mds-proces-guide {
  display: grid;
  margin: 0 auto;
  padding: 100px 0 70px 0;
  width: 80%;
  max-width: 800px;
}

/*...Styling for Service page ending....*/
/*.......styling for booking page......*/
.kontaktformular {
  padding-top: 100px;
  padding-bottom: 50px;
}
.kontaktformular h1 {
  font-family: "AlegreyaSans-Regular";
  font-size: 2.5rem;
  color: #040126;
  display: flex;
  justify-content: center;
  padding: 30px 20px 30px 50px;
}
.kontaktformular .booking-text {
  line-height: 1.5;
  max-width: 1200px;
  margin: 0 auto;
  font-family: "Oxygen-Regular";
  font-size: 1.2rem;
  color: #040126;
  width: 75%;
  padding: 0 15px 30px 15px;
}

.kontaktform {
  display: flex;
  flex-direction: column;
  gap: 10px;
  background-color: #95c2f4;
  width: 290px;
  height: 500px;
  margin: 0 auto;
  border-radius: 30px;
  font-family: "Oxygen-Regular";
  font-size: 16pt;
  box-shadow: 0 4px 8px #2c3e50;
}
.kontaktform input, .kontaktform textarea, .kontaktform select {
  display: flex;
  justify-content: center;
  align-content: center;
  margin: 0 auto;
}
.kontaktform p {
  margin: 10px 0 5px 35px;
}
.kontaktform input, .kontaktform select {
  padding: 4px;
  border-radius: 10px;
  width: 224px;
  height: 30px;
  border: 1px solid #040126;
  background-color: #fffafa;
  font-family: "AlegreyaSans-Regular";
  font-size: 14pt;
}
.kontaktform textarea {
  max-width: 224px;
  min-width: 224px;
  max-height: 52px;
  min-height: 52px;
  border-radius: 10px;
  font-family: "Oxygen-Regular";
  padding: 5px;
  font-size: 12pt;
}
.kontaktform #book-button {
  background-color: #ff800b;
  border-radius: 70px;
  color: #fffafa;
  text-decoration: none;
  text-align: center;
  padding: 5px;
  border: 0;
  font-family: "Oxygen-Regular";
  font-size: 18pt;
  width: 130px;
  height: 40px;
  display: block;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 4px 8px #2c3e50;
  margin-top: 10px;
}
.kontaktform #book-button:hover {
  color: #3b3e9f;
}

.contact-booking {
  display: grid;
  justify-content: center;
  align-content: center;
  margin: 0 auto;
}
.contact-booking aside {
  padding: 10px;
}
.contact-booking a {
  text-decoration: none;
  padding: 10px;
  font-family: "Oxygen-Regular";
  font-size: 16pt;
  color: #040126;
}
.contact-booking img:nth-of-type(2) {
  height: auto;
}
.contact-booking img {
  margin-right: 20px;
  height: 40px;
}

#papercut-booking {
  float: right;
  height: 500px;
}

/*...styling for booking page ending......*/
/* media query for mobile version */
/* for header*/
@media screen and (max-width: 1200px) {
  .desktop-nav {
    display: none;
  }
  .desktop-nav img:first-of-type {
    display: none;
  }
  .desktop-nav a {
    text-decoration: none;
    text-decoration: none;
    cursor: pointer;
  }
  .desktop-nav a:hover {
    color: #3b3e9f;
  }
  /* styling for burgermenu when toggled*/
  .toggleShow {
    display: flex;
    padding: 10px;
    background-color: #ff800b;
  }
  .toggleShow input {
    display: none;
  }
  .toggleShow ul {
    list-style: none;
  }
  .toggleShow a {
    color: #fffafa;
    font-family: "AlegreyaSans-Regular";
    font-size: 20pt;
    padding: 10px;
    line-height: 1.5;
  }
  .services-boxes {
    width: 300px;
  }
  .mobile-nav .bars {
    display: flex;
  }
}
/*.....media query for desktop version.....*/
@media screen and (min-width: 1201px) {
  .desktop-nav ul {
    display: grid;
    grid-template-columns: 1fr auto auto auto auto auto;
    background-color: #040126;
    font-family: "Oxygen-Regular";
    gap: 20px;
    width: 100%;
  }
  .desktop-nav img {
    padding: 15px;
  }
  .desktop-nav .nav {
    list-style: none;
    padding-top: 65px;
  }
  .desktop-nav a {
    text-decoration: none;
    color: #fffafa;
    font-size: 22pt;
    text-decoration: none;
    cursor: pointer;
  }
  .desktop-nav a:hover {
    color: #3b3e9f;
  }
  .desktop-nav input {
    border-radius: 50px;
    height: 25px;
    width: 200px;
    padding: 15px;
    background-color: transparent;
    color: #fffafa;
    font-size: 22px;
    font-family: "AlegreyaSans-Regular";
    border: 2px solid #fffafa;
    margin: 65px 15px 0 15px;
  }
  header {
    height: 109px;
  }
  .mobile-nav {
    display: none;
  }
  /* header ends*/
  /* main homepage*/
  .logo-animation-section {
    height: 700px;
  }
  .logo-animation-section #mds-heading {
    font-size: 44pt;
  }
  .logo-animation-section #slogan {
    font-size: 38pt;
  }
  #papercut-right {
    max-height: none;
  }
  #papercut-left {
    max-height: none;
  }
  #hvem-er-vi {
    font-family: "AlegreyaSans-Regular";
    font-size: 4rem;
    color: #040126;
    display: flex;
    justify-content: center;
  }
  video {
    width: 60%;
  }
  #peafowl {
    height: auto;
  }
  /*principles homepage*/
  #offer-heading {
    font-family: "AlegreyaSans-Regular";
    font-size: 4rem;
    color: #040126;
    display: flex;
    justify-content: center;
  }
  .offer-boxes-section {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 30px;
  }
  .offer-boxes-section .offer-box {
    width: 500px;
    height: 300px;
  }
  .offer-boxes-section .box1 {
    grid-row: 2;
    grid-column: 2;
  }
  .offer-boxes-section .box2 {
    grid-row: 2;
    grid-column: 3;
  }
  .offer-boxes-section .box3 {
    grid-row: 3;
    grid-column: 3;
  }
  .offer-boxes-section .box4 {
    grid-row: 3;
    grid-column: 2;
  }
  .offer-boxes-section p {
    font-size: 28pt;
    padding-top: 35px;
  }
  .offer-boxes-section .offer-text {
    font-size: 22pt;
  }
  .offer-boxes-section img {
    height: 85px;
  }
  .mds-animation img:first-of-type {
    max-height: none;
  }
  .mds-working-companion h3 {
    font-family: "AlegreyaSans-Regular";
    font-size: 4rem;
    color: #040126;
    display: flex;
    justify-content: center;
    padding-top: 70px;
  }
  .mds-working-companion p {
    line-height: 1.5;
    max-width: 1200px;
    margin: 0 auto;
    font-family: "Oxygen-Regular";
    font-size: 1.5rem;
    color: #040126;
    width: 75%;
  }
  /*footer for desktop*/
  .mobile-nav-footer {
    display: none;
  }
  .desktop-nav-footer {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    height: auto;
    background-color: #040126;
    bottom: 0;
    color: #fffafa;
  }
  .desktop-nav-footer p, .desktop-nav-footer a {
    font-family: "AlegreyaSans-Regular";
    font-size: 20pt;
    color: #fffafa;
  }
  .desktop-nav-footer a {
    text-decoration: none;
    cursor: pointer;
  }
  .desktop-nav-footer a:hover {
    color: #3b3e9f;
  }
  .desktop-nav-footer #first-section {
    display: grid;
    grid-template-rows: 1fr 1fr;
    margin: 15px;
  }
  .desktop-nav-footer #first-section p {
    padding-left: 15px;
  }
  .desktop-nav-footer #first-section img {
    padding: 10px 0 5px 15px;
  }
  .desktop-nav-footer #second-section {
    display: grid;
    grid-template-rows: repeat(4, 1fr);
    margin: 10px;
    justify-self: center;
  }
  .desktop-nav-footer #second-section img {
    padding-right: 15px;
  }
  .desktop-nav-footer #third-section {
    justify-self: right;
    margin: 15px;
  }
  .desktop-nav-footer #third-section p {
    padding: 10px;
    line-height: 1.5;
  }
}
@media screen and (min-width: 1201px) and (min-width: 1201px) {
  /*.....styling for services desktop.....*/
  #services-heading {
    font-family: "AlegreyaSans-Regular";
    font-size: 4rem;
    color: #040126;
    display: flex;
    justify-content: center;
  }
  .service-text {
    line-height: 1.5;
    max-width: 1200px;
    margin: 0 auto;
    font-family: "Oxygen-Regular";
    font-size: 1.5rem;
    color: #040126;
    width: 75%;
  }
  .services-boxes {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    margin: 0 auto;
    gap: 100px;
    width: 90%;
    max-width: 1300px;
    overflow: hidden;
  }
  .services-boxes #konsultation-box, .services-boxes #junior-box, .services-boxes #premium-box, .services-boxes #pro-service-box {
    height: 700px;
  }
  .services-boxes #konsultation-box p:first-of-type, .services-boxes #junior-box p:first-of-type, .services-boxes #premium-box p:first-of-type, .services-boxes #pro-service-box p:first-of-type {
    font-size: 40px;
  }
  .services-boxes #konsultation-box p, .services-boxes #junior-box p, .services-boxes #premium-box p, .services-boxes #pro-service-box p {
    font-size: 20pt;
  }
  .process-guide-section .process-guide-text h2 {
    font-family: "AlegreyaSans-Regular";
    font-size: 4rem;
    color: #040126;
    display: flex;
    justify-content: center;
    padding: 70px 15px 30px 15px;
  }
  .process-guide-section .process-guide-text p {
    line-height: 1.5;
    max-width: 1200px;
    margin: 0 auto;
    font-family: "Oxygen-Regular";
    font-size: 1.5rem;
    color: #040126;
    width: 75%;
    padding: 5px 15px 5px 15px;
    text-align: left;
  }
}
@media screen and (min-width: 1201px) {
  /*.....styling for booking page desktop....*/
  .kontaktformular {
    padding-top: 100px;
    padding-bottom: 50px;
  }
  .kontaktformular h1 {
    font-family: "AlegreyaSans-Regular";
    font-size: 4rem;
    color: #040126;
    display: flex;
    justify-content: center;
  }
  .kontaktformular .booking-text {
    line-height: 1.5;
    max-width: 1200px;
    margin: 0 auto;
    font-family: "Oxygen-Regular";
    font-size: 1.5rem;
    color: #040126;
    width: 75%;
  }
  .kontaktform {
    display: grid;
    grid-template-rows: 0.5fr 0.5fr 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    width: 874px;
    height: 892px;
    font-size: 20pt;
  }
  .kontaktform p {
    margin: 50px 0 10px 60px;
  }
  .kontaktform input, .kontaktform select {
    padding: 7px;
    width: 326px;
    height: 70px;
    font-size: 16pt;
  }
  .kontaktform textarea {
    max-width: 760px;
    min-width: 760px;
    max-height: 218px;
    min-height: 218px;
    font-size: 16pt;
    font-family: "Oxygen-Regular";
    padding: 5px;
  }
  .kontaktform .column-span-4 {
    grid-column: span 2;
  }
  .kontaktform #book-button {
    background-color: #ff800b;
    border-radius: 70px;
    color: #fffafa;
    text-decoration: none;
    text-align: center;
    padding: 5px;
    border: 0;
    font-family: "Oxygen-Regular";
    font-size: 18pt;
    width: 12.8rem;
    height: 3.5rem;
    display: block;
    display: grid;
    grid-area: center;
  }
  .contact-booking a {
    font-size: 30pt;
    padding-right: 70px;
  }
}
/*.....styling for homepage desktop ending.....*/
@media screen and (min-width: 988px) and (max-width: 988px) {
  .logo-animation-section .logo-animation-gif {
    display: block;
  }
  .logo-animation-section .logo-animation-static, .logo-animation-section #mds-heading, .logo-animation-section #slogan {
    display: none;
  }
}
/*--------------------------------------Showcase-------------------------------------------*/
/*bg og styling af tekst*/
.sc_body {
  background-color: #fffafa;
}
.sc_body .sc_BG {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  margin-bottom: 5rem;
  margin-top: 3.5rem;
}
.sc_body .sc_BG h1, .sc_body .sc_BG h2, .sc_body .sc_BG .p {
  margin: 0.5rem auto;
  padding: 0.2rem 0.2rem;
  color: #040126;
  width: 75%;
}
.sc_body .sc_BG h1 {
  font-size: 2.5rem;
  font-family: "AlegreyaSans-Regular";
  text-align: center;
  margin-top: 2rem;
}
.sc_body .sc_BG h2 {
  font-family: "AlegreyaSans-Regular";
  font-size: 2rem;
  text-align: center;
  margin-top: 2rem;
}
.sc_body .sc_BG .p {
  font-size: 1.2rem;
  font-family: "Oxygen-Regular";
  line-height: 1.5rem;
  text-align: left;
}

/*Styling af billed/navigations delen af siden*/
.sc_nav {
  margin: 1.5rem auto;
}
.sc_nav .container_1, .sc_nav .container_2, .sc_nav .container_3, .sc_nav .container_4, .sc_nav .container_5, .sc_nav .container_6, .sc_nav .container_7 {
  object-fit: cover;
  border-radius: 10px;
  margin: 2rem 0.5em;
  width: 17.2rem;
  height: 12.8rem;
  background-position: center;
}
.sc_nav .container_1 .sc_text, .sc_nav .container_2 .sc_text, .sc_nav .container_3 .sc_text, .sc_nav .container_4 .sc_text, .sc_nav .container_5 .sc_text, .sc_nav .container_6 .sc_text, .sc_nav .container_7 .sc_text {
  width: 17.2rem;
  height: 12.8rem;
  padding-top: 5.1rem;
  text-align: center;
  border: 5px solid #3b3e9f;
  border-radius: 10px;
  background: rgba(59, 62, 159, 0.7); /*giver et farveoverlay med mindsket opacitet*/
  backdrop-filter: blur(12.5px);
  object-fit: cover;
  filter: drop-shadow(-8px 8px 4px rgba(0, 0, 0, 0.25));
}
.sc_nav .container_1 .sc_text a, .sc_nav .container_2 .sc_text a, .sc_nav .container_3 .sc_text a, .sc_nav .container_4 .sc_text a, .sc_nav .container_5 .sc_text a, .sc_nav .container_6 .sc_text a, .sc_nav .container_7 .sc_text a {
  text-decoration: none;
  color: #ff800b;
  font-size: 1.5rem;
  font-weight: bold;
  font-family: "Oxygen-Regular";
  padding: 5rem 4.5rem 5rem 4.5rem;
}
.sc_nav .container_1 .sc_text:hover, .sc_nav .container_2 .sc_text:hover, .sc_nav .container_3 .sc_text:hover, .sc_nav .container_4 .sc_text:hover, .sc_nav .container_5 .sc_text:hover, .sc_nav .container_6 .sc_text:hover, .sc_nav .container_7 .sc_text:hover {
  background-color: #3b3e9f;
  color: #fffafa;
  transition: 0.3s ease-in-out;
}
.sc_nav .container_1 {
  background-image: url(../img/sc_hjemmeside.png);
}
.sc_nav .container_2 {
  background-image: url(../img/sc_logo.png);
}
.sc_nav .container_3 {
  background-image: url(../img/sc_poster.png);
  height: 27.9rem;
}
.sc_nav .container_3 .sc_text {
  height: 27.9rem;
  padding-top: 12.7rem;
}
.sc_nav .container_3 .sc_text a {
  padding: 12.4rem 5rem 12.4rem 5rem;
}
.sc_nav .container_4 {
  background-image: url(../img/sc_animationer.png);
}
.sc_nav .container_5 {
  background-image: url(../img/sc_maskotter.png);
}
.sc_nav .container_6 {
  background-image: url(../img/sc_videoer.png);
}
.sc_nav .container_7 {
  background-image: url(../img/sc_branding.png);
  height: 2.8rem;
}
.sc_nav .container_7 .sc_text {
  height: 2.8rem;
  padding-top: 0.2rem;
}
.sc_nav .container_7 .sc_text a {
  padding: 0.2rem 4.5rem 0.2rem 4.5rem;
}

/*-------------------------------Testimonials-------------------------------*/
.testimonial {
  margin: 1rem auto 2rem auto;
}
.testimonial article {
  height: 22rem;
  width: 17.2rem;
  border: 5px solid #3b3e9f;
  border-radius: 10px;
  padding: 1rem;
  margin: 1.5rem auto;
  background-color: #fffafa;
  filter: drop-shadow(-8px 8px 4px rgba(0, 0, 0, 0.25));
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.testimonial article p {
  width: 80%;
  font-family: "Oxygen-Regular";
  color: #040126;
  font-size: 1rem;
  text-align: left;
  line-height: 1.5rem;
}
.testimonial article p:nth-of-type(2) {
  font-weight: bold;
}

/*------------------------------------------Showcase media-----------------------------------------*/
@media screen and (min-width: 700px) and (max-width: 1200px) {
  .sc_body .sc_BG {
    justify-content: center;
    align-content: center;
    /*--------billedenavigationen-------*/
  }
  .sc_body .sc_BG h1 {
    font-size: 3.8rem;
  }
  .sc_body .sc_BG h2 {
    font-size: 2.5rem;
  }
  .sc_body .sc_BG .p {
    font-size: 1.2rem;
    line-height: 1.5rem;
  }
  .sc_body .sc_BG .sc_nav {
    margin: 0.5rem 0.5rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr 1fr 1fr 1fr 0.5fr;
    gap: 0.5rem;
  }
  .sc_body .sc_BG .sc_nav .container_1, .sc_body .sc_BG .sc_nav .container_2, .sc_body .sc_BG .sc_nav .container_4, .sc_body .sc_BG .sc_nav .container_5, .sc_body .sc_BG .sc_nav .container_6 {
    object-fit: cover;
    border-radius: 10px;
    margin: 0.5rem 0.5em;
    width: 17.2rem;
    height: 12.8rem;
    background-position: center;
  }
  .sc_body .sc_BG .sc_nav .container_1 {
    grid-column: 2;
    grid-row: 1;
  }
  .sc_body .sc_BG .sc_nav .container_2 {
    grid-column: 2;
    grid-row: 2;
  }
  .sc_body .sc_BG .sc_nav .container_3 {
    object-fit: cover;
    border-radius: 10px;
    margin: 0.5rem 0.5em;
    width: 17.2rem;
    height: 12.8rem;
    grid-column: 3;
    grid-row: 1/3;
    height: 27.9rem;
  }
  .sc_body .sc_BG .sc_nav .container_4 {
    grid-column: 2;
    grid-row: 3;
  }
  .sc_body .sc_BG .sc_nav .container_5 {
    grid-column: 3;
    grid-row: 3;
  }
  .sc_body .sc_BG .sc_nav .container_6 {
    grid-column: 2/4;
    grid-row: 4;
    width: 35.8rem;
  }
  .sc_body .sc_BG .sc_nav .container_6 .sc_text {
    width: 35.8rem;
  }
  .sc_body .sc_BG .sc_nav .container_6 .sc_text a {
    padding: 5rem 14rem 5rem 14rem;
  }
  .sc_body .sc_BG .sc_nav .container_7 {
    grid-column: 2/4;
    grid-row: 5;
    object-fit: cover;
    border-radius: 10px;
    margin: 0.5rem 0.5em;
    width: 17.2rem;
    height: 12.8rem;
    height: 4rem;
    width: 35.8rem;
  }
  .sc_body .sc_BG .sc_nav .container_7 .sc_text {
    height: 4rem;
    width: 35.8rem;
    padding-top: 0.6rem;
  }
  .sc_body .sc_BG .sc_nav .container_7 .sc_text a {
    padding: 0.2rem 14rem 0.2rem 14rem;
  }
  /*-----------------testimonials--------------------*/
  .testimonial {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    justify-content: center;
    align-items: center;
    gap: 1.5rem;
  }
  .testimonial .ts_1 {
    grid-column: 2;
    grid-row: 1;
  }
  .testimonial .ts_2 {
    grid-column: 3;
    grid-row: 1;
  }
  .testimonial .ts_3 {
    grid-column: 2;
    grid-row: 2;
  }
  .testimonial .ts_4 {
    grid-column: 3;
    grid-row: 2;
  }
  .testimonial article {
    height: 32rem;
    margin: auto auto;
  }
  .testimonial article p {
    font-size: 1.5rem;
  }
}
/*------------------Showcase fra 1201px---------------------------*/
@media screen and (min-width: 1201px) {
  .sc_body .sc_BG {
    justify-content: center;
    align-content: center;
    /*------billedenavigationen-----*/
  }
  .sc_body .sc_BG h1 {
    font-size: 4rem;
  }
  .sc_body .sc_BG h2 {
    font-size: 3rem;
  }
  .sc_body .sc_BG .p {
    font-size: 1.5rem;
    line-height: 2rem;
  }
  .sc_body .sc_BG .sc_nav {
    margin: 4rem 0.5rem;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: 1fr 1fr 1fr 1fr 0.5fr;
    gap: 1.5rem;
  }
  .sc_body .sc_BG .sc_nav .container_1, .sc_body .sc_BG .sc_nav .container_2, .sc_body .sc_BG .sc_nav .container_4, .sc_body .sc_BG .sc_nav .container_5, .sc_body .sc_BG .sc_nav .container_6 {
    object-fit: cover;
    border-radius: 10px;
    margin: 0.5rem 0.5rem;
    width: 26.8rem;
    height: 20rem;
    background-position: center;
  }
  .sc_body .sc_BG .sc_nav .container_1 .sc_text, .sc_body .sc_BG .sc_nav .container_2 .sc_text, .sc_body .sc_BG .sc_nav .container_4 .sc_text, .sc_body .sc_BG .sc_nav .container_5 .sc_text, .sc_body .sc_BG .sc_nav .container_6 .sc_text {
    width: 26.8rem;
    height: 20rem;
    padding-top: 8rem;
    text-align: center;
  }
  .sc_body .sc_BG .sc_nav .container_1 .sc_text a, .sc_body .sc_BG .sc_nav .container_2 .sc_text a, .sc_body .sc_BG .sc_nav .container_4 .sc_text a, .sc_body .sc_BG .sc_nav .container_5 .sc_text a, .sc_body .sc_BG .sc_nav .container_6 .sc_text a {
    text-decoration: none;
    color: #ff800b;
    font-size: 2.5rem;
    font-weight: bold;
    font-family: "Oxygen-Regular";
    padding: 7rem 5.5rem;
  }
  .sc_body .sc_BG .sc_nav .container_1 {
    grid-column: 2;
    grid-row: 1;
  }
  .sc_body .sc_BG .sc_nav .container_2 {
    grid-column: 2;
    grid-row: 2;
  }
  .sc_body .sc_BG .sc_nav .container_3 {
    grid-column: 3;
    grid-row: 1/3;
    object-fit: cover;
    border-radius: 10px;
    margin: 0.5rem 0.5rem;
    width: 26.8rem;
    height: 20rem;
    background-position: center;
    height: 42.5rem;
    width: 26.8rem;
  }
  .sc_body .sc_BG .sc_nav .container_3 .sc_text {
    width: 26.8rem;
    height: 20rem;
    padding-top: 8rem;
    text-align: center;
    height: 42.5rem;
    width: 26.8rem;
    padding-top: 20rem;
  }
  .sc_body .sc_BG .sc_nav .container_3 .sc_text a {
    text-decoration: none;
    color: #ff800b;
    font-size: 2.5rem;
    font-weight: bold;
    font-family: "Oxygen-Regular";
    padding: 7rem 5.5rem;
    padding: 20rem 9rem;
  }
  .sc_body .sc_BG .sc_nav .container_4 {
    grid-column: 2;
    grid-row: 3;
  }
  .sc_body .sc_BG .sc_nav .container_5 {
    grid-column: 3;
    grid-row: 3;
  }
  .sc_body .sc_BG .sc_nav .container_6 {
    grid-column: 2/4;
    grid-row: 4;
    height: 20rem;
    width: 57rem;
  }
  .sc_body .sc_BG .sc_nav .container_6 .sc_text {
    width: 26.8rem;
    height: 20rem;
    padding-top: 8rem;
    text-align: center;
    height: 20rem;
    width: 57rem;
  }
  .sc_body .sc_BG .sc_nav .container_6 .sc_text a {
    text-decoration: none;
    color: #ff800b;
    font-size: 2.5rem;
    font-weight: bold;
    font-family: "Oxygen-Regular";
    padding: 7rem 5.5rem;
    padding: 7rem 23rem;
  }
  .sc_body .sc_BG .sc_nav .container_7 {
    grid-column: 2/4;
    grid-row: 5;
    object-fit: cover;
    border-radius: 10px;
    margin: 0.5rem 0.5rem;
    width: 26.8rem;
    height: 20rem;
    background-position: center;
    height: 7.1rem;
    width: 57rem;
  }
  .sc_body .sc_BG .sc_nav .container_7 .sc_text {
    width: 26.8rem;
    height: 20rem;
    padding-top: 8rem;
    text-align: center;
    height: 7.1rem;
    width: 57rem;
    padding-top: 1.5rem;
  }
  .sc_body .sc_BG .sc_nav .container_7 .sc_text a {
    text-decoration: none;
    color: #ff800b;
    font-size: 2.5rem;
    font-weight: bold;
    font-family: "Oxygen-Regular";
    padding: 7rem 5.5rem;
    padding: 2rem 23rem;
  }
  .sc_body .sc_BG .testimonial {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, 1fr);
    justify-content: center;
    align-items: center;
    gap: 1.5rem;
  }
  .sc_body .sc_BG .testimonial .ts_1 {
    grid-column: 2;
    grid-row: 1;
  }
  .sc_body .sc_BG .testimonial .ts_2 {
    grid-column: 3;
    grid-row: 1;
  }
  .sc_body .sc_BG .testimonial .ts_3 {
    grid-column: 2;
    grid-row: 2;
  }
  .sc_body .sc_BG .testimonial .ts_4 {
    grid-column: 3;
    grid-row: 2;
  }
  .sc_body .sc_BG .testimonial article {
    height: 27rem;
    width: 26.8rem;
    margin: 0.7rem 0.5rem;
  }
  .sc_body .sc_BG .testimonial article p {
    font-size: 1.5rem;
    padding-top: 0.5rem;
    line-height: 2rem;
  }
}
/*........Styling for Moedos-page........*/
/* Moedos-siden starter*/
.overskriftmoedos-side h1 {
  font-size: 2.5rem;
  font-family: "AlegreyaSans-Regular";
  color: #040126;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 75px;
  margin-bottom: 10px;
}

.overskriftmoedos-side p {
  line-height: 1.5;
  max-width: 1200px;
  margin: 0 auto;
  font-family: "Oxygen-Regular";
  font-size: 1.2rem;
  color: #040126;
  width: 75%;
  font-size: 1.2rem;
  font-family: "Oxygen-Regular";
  color: #040126;
  line-height: 1.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: left;
  width: 75%;
  margin-bottom: 2.5%;
  margin-top: 1%;
}
@media only screen and (min-width: 700px) {
  .overskriftmoedos-side p {
    line-height: 1.5;
    max-width: 1200px;
    margin: 0 auto;
    font-family: "Oxygen-Regular";
    font-size: 1.5rem;
    color: #040126;
    width: 75%;
  }
}

.teamkorttekst h3 {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 10px;
  font-family: "AlegreyaSans-Regular";
  font-weight: 700;
  font-size: 1.3rem;
  text-align: center;
  margin-left: 15%;
}

.teamkorttekst p {
  font-family: "Oxygen-Regular";
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 5px;
  font-size: 1.2rem;
  text-align: center;
  margin-left: 15%;
}

/* Bold animation starter */
.baggrunds-bold {
  width: 60px;
  height: 60px;
  background: url("../img/mds-bold.svg");
  border-radius: 50%;
  position: absolute;
  animation: moveBall 20s linear infinite;
}

@keyframes moveBall {
  0% {
    transform: translateX(0) translateY(0);
  }
  25% {
    transform: translateX(300px) translateY(200px);
  }
  35% {
    transform: translateX(0) translateY(500px);
  }
  50% {
    transform: translateX(350px) translateY(600px);
  }
  65% {
    transform: translateX(0) translateY(800px);
  }
  75% {
    transform: translateX(0px) translateY(1200px);
  }
  100% {
    transform: translateX(1200px) translateY(-700);
  }
  /* Bold animation slutter */
}
.kort-indholdrikke {
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.kort-indholdvictoria {
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.kort-indholdnanna {
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.kort-indholdmathilde {
  height: 400px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.team-kort {
  position: relative;
  width: 210px;
  height: 230px;
  padding-inline-end: 30px;
  border-radius: 30px;
  box-shadow: 0 8px 4px 0 rgba(0, 0, 0, 0.25);
  background-color: #63A8F1;
}
@media only screen and (min-width: 700px) {
  .team-kort {
    width: 280px;
    height: 240px;
  }
}

.teamkortbillede {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 15%;
  margin-top: -35%;
}

.teamkortbillede img {
  width: 123px;
  height: 135px;
  border-radius: 20px;
  border: 5px solid #3B3E9F;
  background: #D9D9D9;
  box-shadow: 0 8px 4px 0 rgba(0, 0, 0, 0.25);
}
@media only screen and (min-width: 700px) {
  .teamkortbillede img {
    width: 143px;
    height: 155px;
  }
}

.team-kort:hover::before {
  transform: scale(1.1);
  box-shadow: 0 0 30px #ff800b;
}

.team-kort:hover {
  border-radius: 30%;
  border: 5px;
  transform: translateY(-50px);
  box-shadow: 0 0 20px #ff800b;
}

/*........MEDIA til Moedos-page........*/
@media screen and (min-width: 700px) {
  .mo {
    width: 100%;
    height: 1400px;
  }
  .overskriftmoedos-side h1 {
    font-size: 3.8rem;
  }
  .overskriftmoedos-side p {
    margin-bottom: 6.5%;
  }
  .grid-containerkort {
    display: grid;
    grid-template-rows: repeat(2, 1fr);
    grid-template-columns: repeat(2, 1fr);
    gap: 5px;
    padding-left: 8%;
    padding-right: 8%;
    max-width: 1200px;
    margin: 0 auto;
  }
  .kort-indholdrikke {
    width: 100%;
    grid-row: 1;
    grid-column: 1;
  }
  .kort-indholdvictoria {
    width: 100%;
    grid-row: 1;
    grid-column: 2;
  }
  .kort-indholdnanna {
    width: 100%;
    grid-row: 2;
    grid-column: 1;
  }
  .kort-indholdmathilde {
    width: 100%;
    grid-row: 2;
    grid-column: 2;
  }
  /* Bold animation Media */
  @keyframes moveBall {
    0% {
      transform: translateX(0) translateY(0);
    }
    25% {
      transform: translateX(900px) translateY(400px);
    }
    35% {
      transform: translateX(0) translateY(600px);
    }
    50% {
      transform: translateX(0) translateY(800px);
    }
    65% {
      transform: translateX(800px) translateY(0);
    }
    75% {
      transform: translateX(0px) translateY(-400px);
    }
    100% {
      transform: translateX(1200px) translateY(-1200);
    }
  }
  /* Bold animation media slutter */
  .teamkorttekst h3 {
    font-size: 1.5rem;
  }
  .teamkorttekst p {
    font-size: 1.2rem;
  }
  .pil-op {
    position: sticky;
    top: 93vh;
    margin-left: 93vw;
    margin-bottom: 10px;
  }
}
/*.......Moedos-page og Media ends........*/

/*# sourceMappingURL=style.css.map */
