*,
*::before,
*,
::after {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
  font-size: 62.5%;
}

body {
  font-family: "Roboto", sans-serif;
  font-weight: 400;
}

html,
body {
  width: 100%;
  height: 100%;
  overflow-x: hidden;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
}

ul {
  list-style: none;
}

a {
  text-decoration: none;
  color: inherit;
}

h2 {
  font-family: "Cormorant Garamond", serif;
  font-size: 4.8rem;
  font-weight: 100;
  line-height: 5rem;
  color: #08212c;
  padding-bottom: 1rem;
  margin-bottom: 2rem;
}

.container {
  max-width: 140rem;
  margin: 0 auto;
}

.fourimages__images {
  display: none;
}
.fourimages__images > picture {
  width: 25%;
}
@media screen and (min-width: 750px) {
  .fourimages__images {
    display: flex;
  }
}
.fourimages__images-img {
  width: 100%;
  height: 35rem;
  -o-object-fit: cover;
     object-fit: cover;
}
.fourimages__images picture {
  height: 35rem;
}

.fiveimages__images > picture {
  width: 20%;
}
@media screen and (min-width: 750px) {
  .fiveimages__images {
    display: flex;
  }
}
.fiveimages__images-img {
  width: 100%;
  height: 30rem;
  -o-object-fit: cover;
     object-fit: cover;
}

.twoimages {
  margin-bottom: 5rem;
}
.twoimages > picture {
  width: 50%;
}
@media screen and (min-width: 600px) {
  .twoimages {
    display: flex;
  }
}
.twoimages-img {
  width: 100%;
  height: 35rem;
  -o-object-fit: cover;
     object-fit: cover;
}

.home {
  min-height: 100%;
}
.home__background {
  -o-object-fit: cover;
     object-fit: cover;
  position: fixed;
  height: 100vh;
  width: 100%;
  z-index: -1;
}

header {
  height: 6.5rem;
  background-color: rgba(8, 33, 44, 0.8);
  position: fixed;
  width: 100%;
  z-index: 80;
}
@media screen and (min-width: 450px) {
  header {
    height: 10rem;
  }
}

.promo-display {
  display: block;
}

.promo {
  position: relative;
  margin: 0 auto;
  padding-top: 16rem;
}
.promo-banner {
  background-color: #4ca0c5;
  padding: 1rem 2rem;
  color: white;
  margin-bottom: 1rem;
  border-radius: 5px;
  text-align: center;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
}
.promo-banner > p {
  font-weight: 100;
}
.promo-banner-link {
  font-weight: 900;
  color: #08212c;
}
.promo-banner-link:hover {
  color: #f6d50f;
}
.promo__heading {
  font-size: 2rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
  padding-bottom: 0.5rem;
  margin-bottom: 1rem;
}

.header__area {
  min-height: 100vh;
  display: grid;
  grid-auto-rows: 1fr 1fr;
  grid-template-columns: 1fr;
  grid-template-rows: minmax(18rem, 1fr) auto auto minmax(1rem, 1fr);
  gap: 10px 4px;
  grid-template-areas: "." "." "." ".";
}
.header__cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
.header__card {
  width: 100%;
  background-color: rgba(8, 33, 44, 0.75);
  margin: 0.5rem;
  color: white;
  padding: 1.5rem;
  border-radius: 1rem;
  text-align: center;
}
@media screen and (min-width: 380px) {
  .header__card {
    width: 35rem;
  }
}
.header__card-1 {
  border-bottom: 1rem solid #c62034;
}
.header__card-2 {
  border-bottom: 1rem solid #4ca0c5;
}
.header__card-3 {
  border-bottom: 1rem solid #f6d50f;
}
.header__card-heading {
  font-family: "Cormorant Garamond", serif;
  font-size: 2.5rem;
  font-weight: 100;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
}
.header__card-heading-red {
  border-bottom: 1px solid #c62034;
}
.header__card-heading-blue {
  border-bottom: 1px solid #4ca0c5;
}
.header__card-heading-yellow {
  border-bottom: 1px solid #f6d50f;
}
.header__card-text {
  position: relative;
  font-size: 1.2rem;
  line-height: 2rem;
  padding-bottom: 1rem;
}
.header__card-text-link {
  color: #f6d50f;
}
.header__card-text-link:hover {
  color: #4ca0c5;
}
.header__card-icon {
  max-height: 5rem;
  margin-bottom: 0.5rem;
}
.header__text {
  max-width: 90rem;
  margin: 0 auto;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}
.header__text-large {
  color: white;
  font-family: "Cormorant Garamond", serif;
  font-size: 5rem;
  font-weight: 100;
  text-align: center;
  line-height: 4.2rem;
  padding: 0 1.5rem;
}
@media screen and (min-width: 420px) {
  .header__text-large {
    font-size: 8rem;
    line-height: 7.5rem;
  }
}
.header__text-small {
  color: white;
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 3px;
  text-align: center;
  margin: 2rem;
}
@media screen and (min-width: 420px) {
  .header__text-small {
    font-size: 1.5rem;
  }
}

.nav {
  max-width: 140rem;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
.nav__upper {
  background-color: #08212c;
  color: white;
  height: 3.5rem;
  padding-top: 1rem;
  display: none;
}
@media screen and (min-width: 450px) {
  .nav__upper {
    display: block;
  }
}
.nav__upper-items {
  display: none;
  max-width: 140rem;
  margin: 0 auto;
  justify-content: flex-end;
  font-size: 1.4rem;
  padding-right: 1rem;
}
.nav__upper-items-link {
  margin-left: 3rem;
}
.nav__upper-items-link:hover {
  color: #4ca0c5;
}
@media screen and (min-width: 670px) {
  .nav__upper-items {
    display: flex;
  }
}
.nav__logo-image {
  width: 16rem;
  margin: -4rem 2rem 0 1rem;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
  transition: all 0.5s;
}
@media screen and (min-width: 450px) {
  .nav__logo-image {
    width: 22rem;
    margin: -8rem 2rem 0 1rem;
  }
}
.nav__items {
  display: flex;
}
.nav__text {
  display: none;
  color: white;
  font-size: 1.1rem;
  font-weight: 100;
  letter-spacing: 0.08rem;
  text-transform: uppercase;
  height: 6.5rem;
  text-align: center;
}
.nav__text > a {
  display: block;
  padding: 2.6rem 1rem 2.6rem 1rem;
}
.nav__text:not(:last-child) {
  margin-right: 2rem;
}
.nav__text:hover {
  background-color: rgba(76, 160, 197, 0.3);
  transition: all 0.3s;
}
@media screen and (min-width: 1000px) {
  .nav__text {
    display: block;
  }
}
.nav__altmenu {
  display: inline;
  position: relative;
  color: white;
  font-size: 4rem;
  top: 3rem;
  margin-right: 1.5rem;
}
.nav__altmenu:hover {
  cursor: pointer;
}
@media screen and (min-width: 1000px) {
  .nav__altmenu {
    display: none;
  }
}
.nav__booking {
  background-color: #c62034;
  height: 6.5rem;
  font-weight: 700;
  font-size: 1.3rem;
  padding: 2.6rem 1.5rem 2.6rem 1.5rem;
}
.nav__booking:hover {
  background-color: #ff5314;
  cursor: pointer;
  transition: all 0.3s;
}

.icon__blue {
  color: #4ca0c5;
}
.icon__green {
  color: #d9e021;
}

.eco-logo {
  position: absolute;
  width: 9rem;
  right: 4%;
  top: 28%;
  z-index: -1;
}
@media screen and (min-width: 520px) {
  .eco-logo {
    width: 12rem;
    right: 2%;
    top: 20%;
  }
}
@media screen and (min-width: 700px) {
  .eco-logo {
    width: 15rem;
    right: 5%;
    top: 16%;
  }
}
@media screen and (min-width: 1163px) {
  .eco-logo {
    width: 22rem;
    right: 2%;
    top: 20%;
  }
}

.creambox {
  color: #08212c;
  max-width: 140rem;
  margin: 0 1.5rem;
  background-color: #f2efea;
  border-radius: 1rem;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
  padding: 3rem 3rem;
  display: flex;
  flex-direction: column;
}
.creambox__container {
  padding: 6rem 0;
  background: #08212c;
  background: linear-gradient(0deg, rgba(8, 33, 44, 0.7777485994) 0%, rgba(8, 33, 32, 0) 100%);
}
@media screen and (min-width: 500px) {
  .creambox {
    padding: 3rem 4rem;
  }
}
@media screen and (min-width: 850px) {
  .creambox {
    flex-direction: row;
  }
}
@media screen and (min-width: 1400px) {
  .creambox {
    margin: 0 auto;
  }
}
.creambox__text-area {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (min-width: 850px) {
  .creambox__text-area {
    width: 49%;
  }
}
.creambox__text-heading {
  border-bottom: 2px solid #4ca0c5;
}
.creambox__text-subhead {
  font-size: 1.8rem;
  font-weight: 100;
}
.creambox__text-para {
  color: #08212c;
  font-size: 1.4rem;
  line-height: 2rem;
  margin-top: 1.5rem;
  font-weight: 100;
}
.creambox__contact {
  margin-top: 2rem;
  font-size: 1.6rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.creambox__contact > a {
  margin-top: 1.5rem;
}
.creambox__contact-btn {
  background-color: #c62034;
  color: white;
  padding: 1.5rem;
  border-radius: 1rem;
  text-transform: uppercase;
  transition: all 0.3s;
}
.creambox__contact-btn:hover {
  background-color: #ff5314;
}
.creambox__image-area {
  background-color: #d9cfc0;
  width: 100%;
  margin-top: 8rem;
  margin-left: 0;
}
@media screen and (min-width: 850px) {
  .creambox__image-area {
    width: 49%;
    margin-top: 0;
    margin-left: 2%;
  }
}
.creambox__map {
  width: 100%;
  height: 120%;
  margin-top: -8%;
  -o-object-fit: cover;
     object-fit: cover;
}

.green {
  background-color: #f2efea;
  padding: 4rem 0;
}
.green__container {
  padding: 0 2rem;
  display: flex;
  flex-direction: column;
  max-width: 140rem;
  margin: 0 auto;
}
@media screen and (min-width: 850px) {
  .green__container {
    flex-direction: row;
  }
}
.green__icon {
  width: 10rem;
  position: absolute;
  bottom: 2rem;
  right: 2rem;
  z-index: 50;
}
@media screen and (min-width: 500px) {
  .green__icon {
    width: 16rem;
  }
}
.green__image {
  position: relative;
  width: 100%;
  margin-bottom: 2.5rem;
}
@media screen and (min-width: 850px) {
  .green__image {
    width: 49%;
    margin-bottom: 0;
  }
}
.green__image-image {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.green__textarea {
  width: 100%;
  margin-left: 2%;
}
@media screen and (min-width: 850px) {
  .green__textarea {
    width: 49%;
  }
}
.green__heading {
  border-bottom: 2px solid #d9e021;
}
.green-subhead {
  font-size: 2.8rem;
}
.green__list {
  margin-top: 2rem;
  text-indent: -1.4rem;
  margin-left: 1.4rem;
}
.green__list > li {
  list-style: none;
  color: #08212c;
  font-size: 2rem;
  font-weight: 700;
  line-height: 2.5rem;
  margin-bottom: 1rem;
  padding-left: 1rem;
}
.green__list > li > i {
  color: #d9e021;
  padding-right: 1rem;
}

.kirstys {
  background-image: none;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right center;
}
@media screen and (min-width: 1000px) {
  .kirstys {
    background-image: url("../img/band-image.jpg");
  }
}
.kirstys__container {
  max-width: 140rem;
  margin: 0 auto;
}
.kirstys__textcontainer {
  padding: 0;
  display: flex;
  justify-content: flex-end;
}
@media screen and (min-width: 1000px) {
  .kirstys__textcontainer {
    padding: 4rem;
  }
}
.kirstys__logo {
  border-bottom: 1px solid grey;
  padding-bottom: 1.5rem;
  margin-bottom: 1.5rem;
}
.kirstys__icons {
  margin-top: 2.5rem;
}
.kirstys__btn {
  background-color: #4ca0c5;
  padding: 1.3rem;
  font-size: 1.6rem;
  font-weight: 700;
  border-radius: 0.8rem;
  display: block;
  max-width: 23rem;
  margin: 0 auto;
  transition: all 0.3s;
}
.kirstys__btn:hover {
  background-color: #ff5314;
}
.kirstys__textbox {
  border-radius: 0;
  padding: 2rem 5.5rem 5.5rem 5.5rem;
  max-width: 100%;
  background-color: #08212c;
  color: white;
  text-align: center;
}
@media screen and (min-width: 1000px) {
  .kirstys__textbox {
    max-width: 60rem;
    border-radius: 1.5rem;
  }
}
.kirstys__textbox > p {
  font-weight: 100;
  font-size: 1.5rem;
  line-height: 2.3rem;
  margin-bottom: 2rem;
}

.homeglamping {
  background-image: none;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right center;
  background-color: #08212c;
}
@media screen and (min-width: 750px) {
  .homeglamping {
    background-image: url("../img/belltent-main.jpg");
  }
}
.homeglamping__border {
  border-bottom: 2px solid #4ca0c5;
  margin: 4rem 0 1rem 0;
}
.homeglamping__border-2 {
  border-bottom: 2px solid #f6d50f;
  margin: 1rem 0 4rem 0;
}
.homeglamping__container {
  max-width: 100%;
  margin: 0 auto;
  display: flex;
}
@media screen and (min-width: 750px) {
  .homeglamping__container {
    max-width: 140rem;
  }
}
.homeglamping__textbox {
  background-color: #f2efea;
  margin: 3rem 1rem 3.2rem 1rem;
  padding: 3rem;
  border-radius: 1rem;
  text-align: center;
  max-width: 100%;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
}
@media screen and (min-width: 750px) {
  .homeglamping__textbox {
    max-width: 40rem;
  }
}
.homeglamping__textbox > h3 {
  font-family: "Cormorant Garamond", serif;
  font-size: 3.4rem;
  font-weight: 100;
  line-height: 3rem;
  color: #08212c;
  padding: 1rem 0 2rem 0;
  border-bottom: 1px solid #4ca0c5;
  margin-bottom: 1.5rem;
}
.homeglamping__textbox > p {
  font-weight: 100;
  font-size: 1.3rem;
  line-height: 2rem;
  margin-bottom: 2rem;
}
.homeglamping__textbox > a {
  font-size: 1.5rem;
  text-transform: uppercase;
  color: #4ca0c5;
  font-weight: 700;
}
.homeglamping__textbox > a:hover {
  color: #ff5314;
}
.homeglamping__textbox-img {
  width: 100%;
  margin-top: 2rem;
}
.homeglamping__textbox-img-2 {
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
  height: 20rem;
}
@media screen and (min-width: 750px) {
  .homeglamping__textbox-img-2 {
    display: none;
  }
}

.prefooter {
  background: #08212c;
  background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
  text-align: center;
  margin-bottom: -4px;
}
.prefooter__headline {
  font-family: "Cormorant Garamond", serif;
  font-size: 3.6rem;
  font-weight: 100;
  line-height: 3.6rem;
  color: #08212c;
  margin-bottom: 3rem;
  padding: 1rem;
}
@media screen and (min-width: 400px) {
  .prefooter__headline {
    font-size: 5rem;
    line-height: 4.1rem;
  }
}
.prefooter > img {
  width: 100%;
}
.prefooter__btn {
  background-color: #c62034;
  transition: all 0.3s;
  text-transform: uppercase;
  color: white;
  font-size: 2.2rem;
  font-weight: 700;
  padding: 1rem 4rem;
  border-radius: 1rem;
  max-width: 52rem;
  margin-left: 0 auto;
  display: inline-block;
  text-align: center;
  margin-bottom: 15rem;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
}
.prefooter__btn:hover {
  background-color: #ff5314;
}

.footer {
  background-color: #004437;
  padding-bottom: 1.5rem;
}
.footer__container {
  max-width: 140rem;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  color: white;
  padding: 2rem 1rem;
}
@media screen and (min-width: 700px) {
  .footer__container {
    flex-direction: row;
  }
}
.footer__item {
  padding-top: 2rem;
}
@media screen and (min-width: 700px) {
  .footer__item {
    padding-top: 0;
  }
}
.footer__left {
  display: flex;
  flex-direction: column;
  font-size: 1.5rem;
  line-height: 3.2rem;
  font-weight: 100;
}
@media screen and (min-width: 700px) {
  .footer__left {
    flex-direction: row;
  }
}
.footer__left-2 {
  border-left: none;
  margin-top: 2rem;
  font-weight: 400;
  border-top: 2px solid #d9e021;
  border-bottom: 2px solid #d9e021;
  padding: 2rem 0;
}
@media screen and (min-width: 700px) {
  .footer__left-2 {
    padding: 0 1.5rem;
    border-left: 2px solid #d9e021;
    border-top: none;
    border-bottom: none;
    margin-top: 0;
  }
}
.footer__left-2 > ul > li:hover {
  color: #d9e021;
}
.footer__left > div {
  margin-right: 3rem;
}
.footer__right {
  font-size: 1.6rem;
  text-align: left;
  margin-top: 2rem;
  font-weight: 100;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (min-width: 700px) {
  .footer__right {
    text-align: right;
  }
}
.footer__right > div > a {
  display: block;
  margin-top: 2rem;
}
.footer__right-copyright {
  margin-top: 1rem;
  font-size: 1.1rem;
}

.mobilenav {
  background-color: rgba(8, 33, 44, 0.9);
  width: 94%;
  left: 3%;
  position: absolute;
  top: 0;
  z-index: 100;
  padding: 1.5rem;
  border-bottom: 15px solid #c62034;
  border-radius: 0 0 1rem 1rem;
  overflow: hidden;
  transition-timing-function: ease;
  transform: translateY(-100%);
  transition: all 0.5s;
}
.mobilenav__items {
  color: white;
  padding-bottom: 2rem;
}
.mobilenav__items > i {
  float: right;
  font-size: 3rem;
  padding: 2rem 0;
}
.mobilenav__items > i:hover {
  cursor: pointer;
}
.mobilenav__text {
  color: white;
  text-align: center;
  font-size: 3rem;
  font-weight: 100;
  border-bottom: 1px solid #c62034;
  padding: 1.5rem;
}
.mobilenav__text:hover {
  color: grey;
}

.selected {
  color: grey;
}

.tent_img {
  -o-object-position: 100% 75%;
     object-position: 100% 75%;
}

.lodges__btn {
  background-color: rgb(150, 150, 150);
  color: white;
  padding: 1rem 2rem;
  font-size: 1.8rem;
  font-weight: 100;
  border-radius: 10px;
  margin-top: 2rem;
  display: block;
  text-align: center;
}
.lodges__btn:hover {
  background-color: #4ca0c5;
}

.parkheader {
  margin: 0 1rem;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding-top: 18rem;
}
.parkheader__container {
  max-width: 140rem;
  margin: 0 auto;
}
@media screen and (min-width: 800px) {
  .parkheader {
    flex-direction: row;
  }
}
.parkheader__left {
  width: 100%;
  padding: 2.5rem;
  background-color: #f2efea;
  margin-right: 2%;
  border-radius: 4px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
  margin-bottom: 10rem;
}
@media screen and (min-width: 800px) {
  .parkheader__left {
    width: 38%;
  }
}
.parkheader__right {
  width: 100%;
}
@media screen and (min-width: 800px) {
  .parkheader__right {
    width: 60%;
  }
}
.parkheader__img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.facilities {
  background-color: #f2efea;
  margin-top: 5rem;
}
.facilities__container {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 2.5rem 1rem;
}
@media screen and (min-width: 800px) {
  .facilities__container {
    flex-direction: row;
  }
}
.facilities__imagebox {
  width: 100%;
  overflow: hidden;
  height: auto;
  margin-bottom: 1rem;
}
@media screen and (min-width: 800px) {
  .facilities__imagebox {
    width: 32.5%;
    margin-bottom: 0;
  }
}
.facilities__img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.facilities__text {
  order: -1;
  width: 100%;
  padding: 0.5rem;
  padding-bottom: 3rem;
}
.facilities__text > h2 {
  line-height: 4.1rem;
}
@media screen and (min-width: 800px) {
  .facilities__text {
    width: 33%;
    order: 2;
    padding-bottom: 1rem;
  }
}

.stay {
  background-color: #08212c;
  background-image: none;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: right center;
}
@media screen and (min-width: 650px) {
  .stay {
    background-image: url("../img/caravans.jpg");
  }
}
.stay__container {
  padding: 2rem;
}
.stay__textbox {
  background-color: #08212c;
  max-width: 100%;
  text-align: center;
  padding: 3rem 4rem;
  color: white;
  font-weight: 100;
  font-size: 1.5rem;
  line-height: 2.3rem;
  border-radius: 5px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
}
@media screen and (min-width: 650px) {
  .stay__textbox {
    max-width: 50rem;
  }
}
.stay__textbox > p {
  margin-bottom: 2rem;
}
.stay__heading {
  color: white;
  border-bottom: 1px solid grey;
}

.lodges__container {
  padding: 2rem;
}
.lodges__container-inner {
  background-color: #f2efea;
  padding: 2rem 3rem;
  border-radius: 10px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.8);
}

.parkgreen {
  background-color: #d9e021;
  margin-bottom: 5rem;
}
.parkgreen__heading {
  border-bottom: 1px solid white;
}
.parkgreen__icons > li > i {
  color: white;
}

.areaone {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (min-width: 800px) {
  .areaone {
    flex-direction: row;
  }
}
.areaone__left {
  display: flex;
  width: 100%;
  flex-direction: column;
  height: 50rem;
}
@media screen and (min-width: 400px) {
  .areaone__left {
    width: 100%;
    flex-direction: row;
    height: auto;
  }
}
@media screen and (min-width: 1000px) {
  .areaone__left {
    width: 48%;
  }
}
.areaone__left > picture {
  width: 100%;
  height: 50%;
}
@media screen and (min-width: 400px) {
  .areaone__left > picture {
    width: 100%;
    height: auto;
  }
}
.areaone > picture {
  width: 100%;
  height: 50rem;
}
@media screen and (min-width: 800px) {
  .areaone > picture {
    width: 24%;
    height: auto;
  }
}
.areaone__textbox {
  width: 100%;
  background-color: #f2efea;
  padding: 1.5rem 2.5rem 3rem 2.5rem;
}
@media screen and (min-width: 800px) {
  .areaone__textbox {
    width: 40%;
  }
}
@media screen and (min-width: 1000px) {
  .areaone__textbox {
    width: 28%;
  }
}
.areaone__heading {
  font-family: "Cormorant Garamond", serif;
  color: #08212c;
  font-size: 4rem;
  border-bottom: 1px solid #d9e021;
}
.areaone__img {
  -o-object-position: 30% 0;
     object-position: 30% 0;
}

.attractions {
  background-image: url("../img/arialshot.jpg");
  background-size: cover;
}
.attractions__container {
  padding: 1.5rem;
  display: flex;
  justify-content: center;
  flex-direction: column;
  align-items: f;
  height: 40rem;
  width: 100%;
}
.attractions__container > h2 {
  color: white;
  text-align: center;
}
.attractions__container > picture {
  max-width: 342px;
  margin: 0 auto;
}

.attractions2 {
  margin: 0 0 8rem 0;
}
@media screen and (min-width: 700px) {
  .attractions2 {
    margin: 0.5rem 0.5rem 8rem 0.5rem;
  }
}
.attractions2__container {
  background-color: #08212c;
  padding: 3rem;
  color: white;
  border-radius: 0;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (min-width: 700px) {
  .attractions2__container {
    flex-direction: row;
    border-radius: 10px;
  }
}
.attractions2__textbox {
  width: 100%;
  margin-bottom: 3rem;
  text-align: center;
}
@media screen and (min-width: 700px) {
  .attractions2__textbox {
    width: 32%;
    margin-bottom: 0;
  }
}
.attractions2__textbox > h2 {
  color: white;
  width: 80%;
  margin-left: 10%;
  border-bottom: 1px solid grey;
}
.attractions2__textbox > p {
  font-weight: 100;
  font-size: 1.5rem;
  line-height: 2.3rem;
  margin-bottom: 3rem;
}
.attractions2__imagebox {
  width: 100%;
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 25%;
  gap: 6px 6px;
}
@media screen and (min-width: 700px) {
  .attractions2__imagebox {
    width: 66%;
  }
}
@media screen and (min-width: 900px) {
  .attractions2__imagebox {
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-template-rows: 50% 50%;
  }
}
.attractions2__imagebox-img {
  background-color: red;
}
.attractions2__imagebox-img > picture > img {
  -o-object-fit: cover;
     object-fit: cover;
  width: 100%;
  height: 100%;
}
.attractions2__logos {
  width: 80%;
  margin: 0 auto;
  display: grid;
  grid-auto-columns: 1fr;
  grid-auto-rows: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  grid-template-rows: auto;
  gap: 10px 10px;
  grid-template-areas: ". .";
}
.attractions2__logos > a > picture > img {
  width: 100%;
}

.kirstyspage__logo-main {
  width: 25rem;
  margin-left: 50%;
  transform: translateX(-50%);
}
@media screen and (min-width: 450px) {
  .kirstyspage__logo-main {
    width: 42rem;
  }
}
.kirstyspage__logo-hire {
  width: 20rem;
  position: absolute;
  right: 30;
  top: 15rem;
  opacity: 0.6;
  z-index: -1;
}
.kirstyspage__smalltext {
  font-style: italic;
  font-size: 1.5rem;
  margin-top: 2rem;
}
.kirstyspage__header {
  position: relative;
  max-width: 140rem;
  margin: 0 auto;
  display: flex;
  height: 100vh;
  flex-direction: column;
  justify-content: center;
  padding-top: 4rem;
}
.kirstyspage__header-text {
  color: white;
  text-align: center;
  padding-top: 2rem;
}
.kirstyspage__icons {
  margin: 0 auto;
}
.kirstyspage__image-area {
  display: flex;
  flex-direction: column;
  width: 100%;
  justify-content: space-between;
  padding-left: 0;
}
@media screen and (min-width: 850px) {
  .kirstyspage__image-area {
    flex-direction: row;
    width: 50%;
    padding-left: 1.5rem;
  }
}
.kirstyspage__image-area > picture {
  width: 100%;
  margin-top: 1.5rem;
  height: 40rem;
}
@media screen and (min-width: 850px) {
  .kirstyspage__image-area > picture {
    width: 100%;
    margin-top: 0;
    height: auto;
  }
}
.kirstyspage__intro-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.kirstyspage__occasions {
  background-color: #08212c;
  padding: 5rem 1.5rem;
  margin-top: -2px;
}
.kirstyspage__occasions > .container > picture {
  width: 100%;
  margin: 1.5rem 0;
}
@media screen and (min-width: 856px) {
  .kirstyspage__occasions > .container > picture {
    width: 33%;
    margin: 0;
  }
}
.kirstyspage__occasions > .container > picture > img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.kirstyspage__occasions > div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media screen and (min-width: 856px) {
  .kirstyspage__occasions > div {
    flex-direction: row;
  }
}
.kirstyspage__occasions-textarea {
  width: 100%;
  padding-right: 0rem;
  margin-bottom: 2rem;
}
@media screen and (min-width: 856px) {
  .kirstyspage__occasions-textarea {
    width: 33%;
    padding-right: 1.5rem;
    margin-bottom: 0;
  }
}
.kirstyspage__occasions-textarea > ul > li {
  color: white;
  font-size: 2rem;
  font-weight: 900;
  list-style: disc;
  margin-left: 2rem;
  line-height: 3rem;
}
.kirstyspage__occasions-textarea > p {
  color: white;
  font-weight: 100;
  line-height: 3rem;
  font-size: 1.3rem;
  margin-bottom: 1.5rem;
}
.kirstyspage__occasions > div > div > h2 {
  color: white;
  border-bottom: 1px solid #4ca0c5;
  padding-bottom: 2rem;
}
.kirstyspage__contact {
  color: white;
}
.kirstyspage__kirsty-text {
  flex-basis: 100%;
  padding-bottom: 4rem;
}
@media screen and (min-width: 850px) {
  .kirstyspage__kirsty-text {
    flex-basis: 65%;
  }
}
.kirstyspage__kirsty-text > p {
  -moz-column-count: 1;
       column-count: 1;
}
@media screen and (min-width: 500px) {
  .kirstyspage__kirsty-text > p {
    -moz-column-count: 2;
         column-count: 2;
  }
}
.kirstyspage__kirsty-container {
  background-color: #f2efea;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  padding: 3rem 4rem;
  margin-top: 2rem;
  border-radius: 10px;
  margin-bottom: 3rem;
}
@media screen and (min-width: 850px) {
  .kirstyspage__kirsty-container {
    flex-direction: row;
  }
}
.kirstyspage__kirsty-img-container {
  flex-basis: 33%;
  background-image: none;
  background-size: cover;
  background-position: 0% 20%;
  background-repeat: no-repeat;
}
@media screen and (min-width: 850px) {
  .kirstyspage__kirsty-img-container {
    background-position: 30% 20%;
    background-image: url(../img/kirsty.jpg);
  }
}
.kirstyspage__kirsty-img-container picture img {
  width: 100%;
  display: block;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (min-width: 850px) {
  .kirstyspage__kirsty-img-container picture img {
    display: none;
  }
}
.kirstyspage__signature {
  width: 18rem;
  padding-top: 2rem;
}
.kirstyspage__link {
  color: rgb(28, 91, 151);
  text-decoration: underline;
}

.glampingpage__mainbg {
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
     object-fit: cover;
  position: fixed;
  z-index: -20;
}
.glampingpage__link {
  color: #4ca0c5;
  font-size: 1.6rem;
  margin-top: 2rem;
  display: block;
}
.glampingpage__link:hover {
  color: white;
}
.glampingpage__vikinglogo {
  position: absolute;
  right: 20;
  bottom: 20;
  width: 25rem;
}
.glampingpage__lodges {
  background-color: #08212c;
  display: flex;
  flex-direction: column;
  position: relative;
  justify-content: space-between;
}
@media screen and (min-width: 1000px) {
  .glampingpage__lodges {
    flex-direction: row;
  }
}
.glampingpage__lodges-link {
  color: #4ca0c5;
}
.glampingpage__lodges-link:hover {
  color: yellow;
}
.glampingpage__lodges-imgs {
  width: 100%;
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 1000px) {
  .glampingpage__lodges-imgs {
    width: 60%;
  }
}
.glampingpage__lodges-imgs-main {
  height: 100%;
}
.glampingpage__lodges-imgsmall {
  display: flex;
  margin-top: 3rem;
  justify-content: space-between;
}
.glampingpage__lodges-imgsmall picture {
  width: 48%;
}
.glampingpage__lodges-imgsmall picture img {
  -o-object-fit: cover;
     object-fit: cover;
}
.glampingpage__lodges-text {
  padding: 3rem 3rem 3rem 5rem;
  width: 100%;
}
@media screen and (min-width: 1000px) {
  .glampingpage__lodges-text {
    width: 60%;
  }
}
@media screen and (min-width: 1400px) {
  .glampingpage__lodges-text {
    width: 40%;
  }
}
.glampingpage__lodges picture img {
  width: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
}
.glampingpage__lodges div h2 {
  color: white;
  border-bottom: 1px solid #4ca0c5;
  padding-bottom: 2rem;
}
.glampingpage__bg {
  display: flex;
  position: relative;
}
.glampingpage__bg picture {
  position: relative;
  width: 50%;
  height: 100vh;
}
.glampingpage__header {
  width: 100%;
  height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  position: absolute;
}
.glampingpage__header-text {
  text-shadow: 0 2px 7px rgba(34, 22, 2, 0.9);
}
.glampingpage__intro-img {
  flex-basis: 0 0 50%;
  margin-left: 2rem;
  position: relative;
}
.glampingpage__intro-img-2 {
  width: 100%;
  margin-left: 0;
}
@media screen and (min-width: 850px) {
  .glampingpage__intro-img-2 {
    width: 50%;
    margin-left: 2rem;
  }
}
.glampingpage__intro-img-2 img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.glampingpage__intro-img p {
  font-size: 1.2rem;
  color: gray;
  font-weight: 100;
  position: relative;
  width: 20rem;
  line-height: 1.5rem;
  left: -2rem;
  top: 1rem;
}
@media screen and (min-width: 850px) {
  .glampingpage__intro-img p {
    left: 2rem;
  }
}
@media screen and (min-width: 750px) {
  .glampingpage__intro-img p {
    position: absolute;
    line-height: 3rem;
  }
}
.glampingpage__intro-img picture img {
  height: 100%;
  width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

#glamping-intro {
  background-color: #f9f8f6;
  padding-right: 5rem;
}
@media screen and (min-width: 850px) {
  #glamping-intro {
    padding-right: 0;
  }
}

#nogradient {
  background: none;
}

.lodges__mainbg {
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: -20;
  overflow: hidden;
}
.lodges__top-btn {
  color: white;
  text-align: center;
  background-color: #004437;
  margin: 0 auto;
  width: -moz-max-content;
  width: max-content;
  padding: 2rem;
  font-size: 1.5rem;
  border-radius: 10px;
}
.lodges__intro-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}
.lodges__fullwidthimg {
  width: 100%;
  margin-bottom: 5rem;
  margin-top: -2px;
}
.lodges__gap {
  display: block;
  height: 5rem;
}
.lodges__map {
  background: #08212c;
  background: linear-gradient(180deg, rgba(8, 33, 44, 0.7777485994) 0%, rgba(8, 33, 32, 0) 100%);
}
.lodges__map-image {
  max-width: 30rem;
  margin: 0 auto;
  display: block;
}
@media screen and (min-width: 500px) {
  .lodges__map-image {
    max-width: 50remh;
  }
}
@media screen and (min-width: 800px) {
  .lodges__map-image {
    max-width: 140rem;
  }
}
.lodges__subhead {
  color: #004437;
  font-size: 4rem;
  margin-bottom: 0;
  margin-top: 2rem;
}
.lodges__price {
  font-size: 2.5rem;
  font-weight: 100;
}
.lodges__price-btn {
  background-color: #4ca0c5;
  padding: 1.5rem;
  color: white;
  border-radius: 10px;
  font-size: 1.5rem;
  font-weight: 100;
  margin-top: 2rem;
}
@media screen and (min-width: 600px) {
  .lodges__price-btn {
    font-size: 2rem;
  }
}
.lodges__wideimg {
  width: 100%;
}
.lodges__logo {
  max-width: 20rem;
  margin: 1.5rem auto;
  display: block;
  border-radius: 150%;
  box-shadow: 1px 5px 8px rgba(0, 0, 0, 0.5);
}
@media screen and (min-width: 600px) {
  .lodges__logo {
    max-width: 40rem;
  }
}
.contact__main {
  max-width: 140rem;
  margin: 0 auto;
  display: flex;
  padding-top: 16rem;
}
.contact__main-inner {
  min-width: 80%;
  margin: 0.3rem;
  background-color: #f2efea;
  width: 100%;
  display: flex;
  border-radius: 10px;
  justify-content: space-between;
  flex-direction: column;
}
@media screen and (min-width: 600px) {
  .contact__main-inner {
    margin: 3rem;
  }
}
@media screen and (min-width: 1000px) {
  .contact__main-inner {
    flex-direction: row;
  }
}
.contact__text {
  padding: 3rem;
  flex-basis: 45%;
  font-size: 1.5rem;
  font-weight: 100;
  color: #08212c;
  line-height: 2rem;
}
.contact__text-bold {
  font-weight: 900;
  color: #c62034;
}
.contact__text p {
  margin: 2rem 0;
}
.contact__text hr {
  margin: 2rem 0;
  color: #4ca0c5;
}
.contact__text h3 {
  color: #c62034;
  font-size: 2.5rem;
}
.contact__text a {
  color: #c62034;
  font-size: 2rem;
}
.contact__heading {
  font-family: "Cormorant Garamond", serif;
  font-size: 5rem;
  color: #c62034;
}
.contact__caption {
  font-size: 3rem;
  padding-top: 2rem;
  font-weight: 100;
  color: #c62034;
}
.contact__phone {
  display: block;
  margin-top: 2rem;
}
.contact__map {
  flex-basis: 52%;
  margin: 2rem;
}

.booking {
  height: 18rem;
}
.booking__container {
  max-width: 134rem;
  margin: 0 auto 15rem auto;
}
.booking__container-inner {
  border-radius: 10px;
  padding: 2rem;
  background-color: #f2efea;
  margin: 1.5rem;
}
.booking__container div p {
  font-size: 1.5rem;
  font-weight: 100;
  padding-bottom: 2rem;
}
.booking__container div hr {
  margin-top: 2rem;
}
.booking__title {
  color: #c62034;
}
.booking__terms {
  font-size: 1.6rem;
  color: #c62034;
}

.news {
  height: 18rem;
}
.news__container {
  max-width: 134rem;
  margin: 0 auto 15rem auto;
}
.news__container-inner {
  border-radius: 10px;
  padding: 2rem;
  background-color: #f2efea;
  margin: 1.5rem;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.news__container-inner-left {
  padding-right: 0;
}
@media screen and (min-width: 800px) {
  .news__container-inner-left {
    padding-right: 1.5rem;
  }
}
@media screen and (min-width: 800px) {
  .news__container-inner {
    flex-direction: row;
  }
}
.news__container div p {
  font-size: 1.2rem;
  font-weight: 100;
  line-height: 3rem;
}
.news__container div hr {
  margin-top: 0.5rem;
}
.news__title {
  color: #004437;
  font-size: 5rem;
  margin-bottom: 0;
}
.news__heading {
  font-family: "Cormorant Garamond", serif;
  color: #c62034;
  font-size: 3.5rem;
  margin-top: 3rem;
  padding-bottom: 1rem;
}
.news__subhead {
  font-weight: 100;
  font-size: 1.5rem;
  margin-bottom: 1rem;
}
.news__para {
  border-bottom: 1px solid #d9e021;
  padding-bottom: 2rem;
}
.news__fb {
  width: 500px;
  margin-top: 3rem;
}
@media screen and (min-width: 800px) {
  .news__fb {
    margin-top: 0;
  }
}/*# sourceMappingURL=style.css.map */