@import url('./partials/slider.css');
@import url('./partials/defaults.css');
@import url('./partials/header.css');
@import url('./partials/menu-center.css');
@import url('./partials/quickbook.css');
@import url('./partials/offers.css');
@import url('./partials/footer.css');

/* reset */
section :is(p, h1, h2, h3, h4, h5) {
  margin: 0;
  font-weight: 300;
}

:root {
  --book-btn: #F7F7F7;
  --regular-color: #393939;
  --light-color: #F7C407;
  --dark-color: rgba(66,49,43,1);
  --gray-color: #2B2B2B;
  --rezform-color: #dfdfdf;
  --spacing: 60px;
  --font30:30px;
}

#container-hs {
  background: #fff;
}

section {
  order: 4;
}

.section-16125, .section-16197, .section-16127 {
  order: 2;
}

.roomsMain {
  order: 3;
}

#offersMain {
  order: 1;
}
body:not(.body-ident-main) #offersMain {
  order:5
}

.section-16172 {
  order: 7;
  padding-top: 0;
}

section a {
  color: var(--dark-color);
}

section a:hover, footer a:hover {
  color: var(--light-color);
}

#galeria_home {
  order: 7;
}

body, #accordion p {
  font-family: 'futura-pt';
  font-weight: 300;
  font-style: normal;
  letter-spacing: 0.05em;
  line-height: 1.5;
  color: var(--regular-color);
}

.animatedTitle {
  font-family: "luxus-brut", cursive;
  font-size: 80px;
  line-height: 1;
  color: var(--dark-color);
  z-index: 9;
  position: relative;
}

strong {
  font-weight: 700
}

.beutyFont, .faqList #accordion h3 {
  font-family: 'futura-pt';
  font-style: normal;
  font-weight: 400;
  letter-spacing: 0.04em;
}

.icon-youtube::before, .icon-people:before {
  width: 2em !important;
}

.scrollDown {
  width: 30px;
  height: 100px;
}

.scrollDown::before {
  content: '';
  position: absolute;
  left: calc(50% - 1px);
  top: 0;
  height: 100%;
  background: linear-gradient(white 60%, var(--dark-color) 40%);
  width: 1px;
}

.icon-arrows:before {
  width: 4em !important;
}

.contentTitle .beutyFont {
  font-size: 50px;
  line-height: 1;
  position: relative;
  color: var(--regular-color);
  display: inline-flex;
}

.heroTitle .beutyFont {
  color: white;
}

section {
  position: relative;
}

section .sectionImage {
  display: block
}

/* section simple start */
.sectionSimple .sectionSlider {
  width: 670px;
  position: relative;
}

.accent {
  position: absolute;
  top: 50%;
}

section:not(.reverse) .accent {
  right: 0;
  transform: translate(100%, -50%) rotate(180deg);
}

.reverse .accent {
  left: 0;
  transform: translate(-100%, -50%);
}

.sectionSimple .animatedTitle {
  position: absolute;
  bottom: 0;
  transform: translate(0, 100%);
}

.reverse .sectionSimple .animatedTitle {
  right: 0;
}

section:not(.reverse) .sectionSimple .animatedTitle {
  left: 0;
}

.sectionSimple.reverse .sectionRow {
  flex-direction: row-reverse;
}

section.sectionSimple:not(.reverse) .sectionContent {
  padding-left: 100px;
}

.reverse.sectionSimple .sectionContent {
  padding-right: 100px;
}

.sectionContentText {
  margin-top: 30px;
}

.sectionSide {
  position: relative;
}

.sectionSide .buttonWrapper {
  margin-top: var(--spacing);
}

.contentTitle h3 {
  position: relative;
  color: var(--dark-color);
  font-size: 16px;
  margin-bottom: 25px;
  display: flex;
  align-items: center;
  line-height: 1;
}

.contentTitle h3::after {
  content: '';
  position: relative;
  width: 40px;
  height: 1px;
  background: var(--dark-color);
  margin-left: 10px;
}

/* section simple end */
/* section layers start */
.sectionLayer .sectionImages {
  width: 538px;
  position: relative;
}

.sectionLayer .sectionContent {
  padding-left: 30px;
  position: relative;
}

.sectionImageSmall {
  max-width: 396px !important;
}

.sectionLayer .contentTitle {
  width: 320px
}

.contentTitleWrapper {
  width: 100%;
}

.sectionLayer .sectionContent .imageWrapper {
  position: absolute;
  left: -150px;
  top: -180px;
}

.sectionImages {
  z-index: 2;
}

.sectionLayer .sectionImages .imageWrapper {
  position: relative;
}

.sectionLayer .sectionImages .imageWrapper::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 10px solid white;
  border-left: 0;
  border-bottom: 0;
}

.sectionLayer .sectionRow {
  padding-top: 140px;
  position: relative;
}

.sectionLayer .sectionContentText {
  margin-top: var(--spacing);
}

/* section layers end */
/* section Columns start */
.sectionColumns .sectionImages {
  width: 480px;
}

.sectionColumns .sectionImage {
  width: 100%;
}

.sectionColumns .sectionContentText {
  margin-top: 60px;
  padding-right: 90px;
}

section :is(p) {
  letter-spacing: 0.05em;
}

.sectionColumns .animatedTitle {
  position: absolute;
  top: 0;
  left: 0;
  transform: translate(0, -100%);
}

.sectionColumns .sectionContent .imageWrapper {
  margin-top: 30px;
}

/* section Columns end */
/* section kafelki */
.singleKafelek {
  padding: 7.5px;
  flex: 0 0 50%;
  position: relative;
}

.singleKafelek:nth-child(even) .animatedTitle {
  right: 0;
}

.kafelkiWrapper {
  margin: -7.5px;
}

.kafelekImageWrapper {
  position: relative;
}

.singleKafelek .contentTitleWrapper {
  margin-bottom: var(--spacing);
}

.kafelekImageWrapper .sectionImage {
  width: 100%;
}

.singleKafelek .contentTitleWrapper {
  max-width: 396px;
}

.kafelekIcon {
  font-size: 43px;
}

.icon-spa.kafelekIcon {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  opacity: 1;
}

.singleKafelek:hover .icon-spa.kafelekIcon {
  opacity: 0;
}

.icon-flower.kafelekIcon {
  color: var(--dark-color);
  font-size: 50px;
}

.kafelekContent {
  width: 80%;
  max-width: 420px;
  max-height: 337px;
  height: 80%;
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgba(255, 255, 255, .6);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 30px;
  opacity: 0;
}

.singleKafelek:hover .kafelekContent {
  opacity: 1;
  top: 50%;
}

.kafelekContent .buttonWrapper {
  margin-top: 40px;
}

.icon-spa:before {
  width: 2em !important
}

.singleKafelek .animatedTitle {
  position: absolute;
}

/* section kafelki */
/* gallery */
.sliderNav {
  margin: 0 -7.5px;
  margin-top: 60px;
}

.sliderNav .slick-slide {
  padding: 0 7.5px;
  cursor: pointer;
}

.galleryImageWrapper {
  transition: 300ms;
}

.sliderNav .slick-slide:hover img, .sliderNav .slick-current.slick-slide img, .galleryImageWrapper:hover {
  opacity: .7;
}

:is(.roomsWrapper, .sectionGallery, .offersMain, .offersPage) .contentTitle {
  margin-bottom: var(--spacing);
}

.btnOfferSpacing, .btnRoomSpacing, .sectionGallery .buttonWrapper {
  margin-top: var(--spacing);
}

.galleryContainer {
  position: relative;
}

.sectionGallery .animatedTitle {
  position: absolute;
  left: 0;
  right: unset;
  top: 0;
  transform: translate(0, -100%);
}

.sectionGallery:nth-child(odd) .animatedTitle {
  right: 0;
  left: unset;
}

.galleryImageWrapper .beutyFont {
  position: absolute;
  max-width: 380px;
  width: 100%;
  left: 0;
  bottom: 0;
  background: white;
  color: var(--regular-color);
  padding: 7px 20px;
  line-height: 1;
  font-size: var(--font30);
  letter-spacing: 0.042em;
}

/* gallery */
/* faq */
.faq {
  padding-top: 0;
  margin-top: calc(var(--spacing) * 2);
  position: relative;
}

.faq .faqWrapper {
  max-width: 684px;
  background: white;
}

.faqWrapper {
  padding: 25px 50px;
  position: relative;
  z-index: 2;
}

.faqBG {
  top: 25px;
  position: absolute;
  left: 0;
  height: calc(100% - 50px);
  width: 100%;
  max-height: 600px;
}

.faqBG::before, .faqBG::after {
  content: '';
  position: absolute;
  z-index: 2;
}

.faqBG::before {
  top: 0;
  width: 100%;
  left: 0;
  height: 30%;
  background: linear-gradient(white, transparent);
}

.faqBG::after {
  bottom: 0;
  width: 100%;
  left: 0;
  height: 30%;
  background: linear-gradient(transparent, white);
}

.faqBG img {
  object-fit: cover;
  height: 100%;
  width: 100%;
}

.faqBG img.lozad[data-loaded='true'] {
  opacity: .8 !important;
}

/* faq */
/* Main Rooms Start */
.roomsBg {
  background: var(--dark-color);
  position: relative;
}

.roomSide {
  background: white;
  width: 50%;
}

.roomsMain .animatedTitle {
  position: absolute;
}

.offersMain .animatedTitle {
  position: absolute;
  transform: translate(0, -100%);
}

.roomDescription {
  padding: 20px 20px 40px 100px;
  display: flex;
}

.contentTitleRoom {
  margin-top: var(--spacing);
}

.bottomRoom {
  margin-top: var(--font30);
}

.roomDescription .buttonWrapper {
  margin: 0 -12.5px;
}

.roomDescription .buttonWrapper .button {
  margin: 12.5px;
}

.roomImage img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.roomPrice strong {
  font-size: var(--font30);
  font-weight: normal;
  color: var(--dark-color);
}

.contentTitleRoom h2 {
  font-size: var(--font30);
}

/* Main Rooms End */
/* offers */
.offersContainer {
  flex-wrap: wrap;
}

#offersPage .offerWraper {
  height: 100%;
}

#offersPage .offerName {
  min-height: 70px;
}

@media(min-width:1080px) {
  #offersPage .singleOffer .offerWraper {
    max-width: 100%;
  }
}

/* offers */
/* newsletter */
.newsletterWrapper .contentTitleWrapper {
  width: auto;
}

.newsletter {
  max-width: 400px;
  width: 100%;
}

.newsletterContent {
  position: relative;
  margin-top: 30px;
}

#newsletter_email {
  width: 100%;
  border: 0;
  border-bottom: 1px solid var(--dark-color);
  padding: 5px 10px;
  outline: none;
  background: transparent;
}

.newsletter-btn {
  position: absolute;
  right: 0;
  z-index: 2;
}

.newsletterContent p {
  margin-top: 30px;
  color: var(--dark-color)
}

.newsletterImageBig {
  position: absolute;
  left: 50%;
  top: 50%;
  object-fit: cover;
  transform: translate(-50%, -50%);
}

.sectionOpinie .newsletterWrapper {
  min-height: 450px;
}

.newsletterSection {
  padding-bottom: calc(var(--spacing) * 2)
}

/* newsletter */
@media(max-width:1250px) {
  .siteWidth {
    max-width: calc(100% - 120px)
  }
}

@media(max-width:1180px) {
  .siteWidth {
    max-width: 700px;
  }
  #offersPage .singleOffer {
    flex:0 0 50%;
  }

  section .sectionImage,.galleryGrid .galleryImage, #rooms .roomsImage img {
    min-height: 300px;
    height: 60vw;
    width: 100%;
    object-fit: cover;
  }

  .sectionSide {
    width: 100% !important;
  }

  .sectionRow {
    flex-direction: column !important;
  }

  .sectionLayer .sectionContent .imageWrapper {
    display: none;
  }

  :is(.sectionLayer, .sectionSimple, .sectionColumns) .contentTitleWrapper {
    justify-content: flex-start;
    margin-top: var(--spacing)
  }

  .sectionLayer .sectionContent, section.sectionSimple:not(.reverse) .sectionContent {
    padding-left: 0;
  }

  .sectionImages img {
    width: 100%;
  }

  :is(.sectionSimple,.roomsMain) .animatedTitle {
    bottom: unset;
    transform: translateY(-100%);
    top: 0;
  }

  .singleKafelek {
    flex: 0 0 100%;

  }
  .singleKafelek:not(:first-child) {
    margin-top: calc(var(--spacing) * 2)
  }

  .kafelkiWrapper {
    flex-direction: column;
  }

  .singleKafelek .animatedTitle {
    top: 0;
    left: 0;
    right: unset;
    transform: translate(0, -100%);
  }

  .sectionColumns .sectionImages img {
    display: none;
  }
  .sectionColumns .sectionContent .imageWrapper,.sectionOpinie .newsletterWrapper {
    margin-top:var(--spacing)
  }
  .sectionLayer .sectionRow {
    padding-top: 0;
  }
  .accent {
    display: none;
  }
  .roomWrapper {
    flex-direction: column;
  }
  .roomWrapper .roomSide {
    width: 100%;
  }
  .contentTitleRoom {
    margin-top:0;
  }
  .roomDescription {
    padding: 60px;
  }
  .roomDescWrapper {
    width: 100%;
  }
  .roomSlider.centerArrows .slick-arrow,#offersMainSlider.centerArrows .slick-arrow {
    top: 35vw;
}

}

@media(max-width:700px) {
  #offersPage .singleOffer {
    flex:0 0 100%;
  }
  .roomsDescription {
    flex-direction: column;
  }
  .roomsDescription .buttonWrapper {
    margin-top:10px !important;
  }
  .siteWidth {
    max-width: calc(100% - 60px)
  }
  body,.animsition-disabled {
    overflow-x: hidden;
  }
  .contentTitle .beutyFont {
    font-size: 36px;
  }
  .heroTitle {
    max-width: 300px
  }
  .hero .socialMediaHeader {
    right: 50px;
  }
  .hero ul.langs {
    left: 50px;
  }
  .body-ident-main .sliderImage {
    min-height: 500px;
    height: calc(100vh - 60px);
}
.animatedTitle {
  font-size: 45px;
}
.faqWrapper {
  padding: 25px;
}

}
@media(max-width:480px) {
  .offersMainWrapper.siteWidth,.siteWidth {
    max-width: calc(100% - 30px);
  }
  :root {
    --font30:24px;
  }
  .reviewButton {
    flex-direction: column;
    margin-top:calc(var(--spacing) / 2)
  }
  .average {
    margin-top:calc(var(--spacing) / 2)
  }
  .sectionOpinie .newsletterWrapper {
    min-height: 350px;
  }
}

.wow {
  visibility: hidden;
}
.lozad {
  min-height: 10px;
}
@media(min-width:1200px) {
  .offersMain .animatedTitle {
    transform: translate(30px, -20%);
    z-index: 10;
  }
  .sectionLayer .animatedTitle {
      position: absolute;
      transform: translate(0,-50%);
  }
  .sectionSimple.reverse .animatedTitle {
    text-align: left;
    min-width: 330px;
    right: 0;
  }
  .sectionGallery .animatedTitle {
    left: unset;
    right: 0;
    min-width: 220px;
    transform: translate(0, -60%);
  }
  .reverse.sectionSimple .sectionContent {
        width: calc(100% - 670px);
  }
}