@import "jem.css";
@import "layout.css";
@import "menu.css";

/* fonts */

/* nunito-sans-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 200;
  src: url('../fonts/nunito-sans-v19-latin-200.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/nunito-sans-v19-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/nunito-sans-v19-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/nunito-sans-v19-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* nunito-sans-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Nunito Sans';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/nunito-sans-v19-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* Root */

:root {
  --cassiopeia-color-primary: #704214; /* #239acd; #003782 #607D8B */
  --cassiopeia-color-secondary: #ec713e; /* #ffc107 */
  --cassiopeia-color-link: #003782;
  --cassiopeia-color-hover: #424077;
  --link-color: #003782;
  --link-hover-color: #424077;

  --cassiopeia-font-family-body: 'Nunito Sans';
  --cassiopeia-font-family-headings: 'Nunito Sans';
  --cassiopeia-font-weight-headings: 300;
  --cassiopeia-font-weight-normal: 400;

  --body-font-family: var(--cassiopeia-font-family-body);
  --body-font-size: 1.125rem;
  --body-font-weight: 400;
  --body-line-height: 1.5;
  --body-color: #22262a;
  --body-bg: #fff;

  --overlay-menu-container: #fff;
  --overlay-menu-lines: #fff;
  --overlay-menu-background: #003782;
  --overlay-menu-overlaid-background: #fff;

  --spicy-card-color: #003782;

  --sepia-color: #704214;
  --sand-color: #eee9e3;

}

/* user.js */

.home .mod-menu .nav-item,
.booking .booking-link,
.com-content-category-blog__item.blog-item,
.category-desc .category-image,
.category-desc .fields-container,
.category-desc .category-text {
  opacity: 0;
  transform: translateY(45px);
  transition: transform 0.6s, opacity 0.9s;
}

/* Bootstrap */

body.site .btn-primary {
  background-color: var(--cassiopeia-color-secondary);
  border-color: var(--cassiopeia-color-secondary);
}

/* Typo */

h1, h2, h3, h4, h5, h6 {
  color: var(--cassiopeia-color-link);
}

b, strong, dt {
  color: var(--spicy-card-color);
}

* {
  hyphens: auto;
  hyphenate-limit-chars: 10 3 4;
}

/* Home */

body {
background: #704214;
  background: linear-gradient(120deg,rgba(112, 66, 20, 0) 1%, rgba(112, 66, 20, 0.16) 66%, rgba(112, 66, 20, 0.5) 100%);
}

body.site .home > .mod-menu.mod-list.nav {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(320px,1fr));
  gap: 3em;
  margin: 2em 0 4em 0;
  overflow: visible;
}

body.site .home > .mod-menu.mod-list.nav li {
  
}

body.site .home > .mod-menu.mod-list.nav a {
  position: relative;
  display: block;
}

body.site .home > .mod-menu.mod-list.nav img {
  border-radius: 0.25em;
  /* box-shadow: 10px 10px 15px 0 var(--sepia-color); */
  box-shadow: -1px 1px 1px rgba(112, 66, 20, 0.02),
  -5px 5px 4px rgba(112, 66, 20, 0.03),
  -12px 12px 9px rgba(112, 66, 20, 0.05),
  -20px 20px 15px rgba(112, 66, 20, 0.06),
  -32px 32px 24px rgba(112, 66, 20, 0.08);
}

body.site .home > .mod-menu.mod-list.nav .image-title {
  padding: 0;
  position: absolute;
  top: 0;
  right: 0;
  padding: 0.125em 0.75em;
  font-size: 1.75rem;
  line-height: 1.5;
  color: var(--cassiopeia-color-link);
  background: var(--body-bg);
  border-top-right-radius: 4px;
  border-bottom-left-radius: 4px;
  font-weight: 300;
}

body.site .home + .item-page-container,
body.site .item-page.contactform {
  background: var(--sand-color);
  padding: 1em 1em 2em 1em;
  margin-bottom: 4em;
  border-radius: 0.25em;
}

body.site .home + .item-page-container .com-content-article__body,
body.site .item-page.contactform > .com-content-article__body {
  max-width: 750px;
}

/* Layout */

.container-component > :first-child, 
container-sidebar-left > :first-child,
.container-sidebar-right > :first-child,
.container-component > * + *,
.container-sidebar-left > * + *,
.container-sidebar-right > * + * {
  margin-top: 3em;
}

.grid-child.container-nav {
  padding: 0.75em 0 1.25em 0;
}

.container-header .mod-menu > li:after,
.container-header .metismenu > li > a:after,
.container-header .metismenu > li > button:before {
  /* display: none; */
}

.container-header .mod-menu.booking > li:after {
  display: none;
}

.container-header .mod-menu.booking > li + li {
  margin: 0;
}

.container-header .navbar-brand .brand-logo img {
  max-height: 100px;
  width: auto;
  max-width: none;
}

.menu .metismenu.mod-menu {
  gap: 2em;
}

.mod-menu.metismenu .metismenu-item a {
  font-size: 1.125rem;
  font-weight: 600;
  /* color: var(--cassiopeia-color-link); */
  /* background: var(--body-bg); */
  padding: 0.125em 0;
  /* border-bottom: 1px solid currentColor; */
  border-radius: 0;
  text-decoration-thickness: 1px!important;
  text-transform: uppercase;
}

.mod-menu.booking.mod-list li {
  padding: 0;
}

.mod-menu.booking .nav-item a,
.booking.no-card .booking-link a.dr-flex,
.mod-menu.mod-menu_dropdown-metismenu .nav-item a.dr-flex {
  color: var(--cassiopeia-color-link);
  font-size: 1.125rem;
  line-height: 1.5;
  padding: 0.125em 0.75em;
  border: 1px solid transparent;
  border-radius: 0.25em;
  display: block;
}

.mod-menu.booking {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 2px;
}

.mod-menu.booking .nav-item a.phone {
  border-right: 0;
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  background-color: var(--body-bg);
}

.mod-menu.booking .nav-item a.email,
.mod-menu.booking .nav-item a[data-micromodal-trigger] {
  border-radius: 0;
  background-color: var(--body-bg);
}

.mod-menu.booking .nav-item a.dr-flex {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

@media (width <= 991px) {
  .mod-menu.booking {
    justify-content: center;
    position: fixed;
    top: 1em;
    right: 4em;
    z-index: 1002;
  }
}

.mod-menu.booking .nav-item a .p-2,
.mod-menu .metismenu-item a .p-2 {
  padding: 0!important;
}

.mod-menu.booking .micromodal__close {
  content: url("../images/close-white.svg");
}

.container-header {
  background-color: var(--cassiopeia-color-link);
  background: linear-gradient(45deg, hsla(215, 100%, 25%, 1) 0%, hsla(215, 100%, 25%, 1) 33%, hsla(215, 100%, 25%, 0) 100%);
}

@media (width <= 479px) {
  .container-header {
    padding: 2.75em 0 0 0.35em;
  }
  body.site .micromodal__container {
    margin: 50px 0 auto 0;
  }
}

/* Position bottom a | various */

dl {
  display: grid;
  grid-template: auto / auto 1fr;
  column-gap: 0.5em;
  }

.card-body dl > dd {
  display: flex;
  gap: 0.5em;
}

dl > dd > div {
  color: var(--spicy-card-color);
  background: var(--body-bg);
  border-radius: 0.25em;
  padding: 0 0.25em;
}

/* Footer */

.footer .mod-menu.mod-list {
  display: flex;
  gap: 1em;
  flex-direction: row;
  text-transform: uppercase;
}

.footer .mod-menu.mod-list li {
  padding: 0;
}

/* Booking menu item */

.mod-menu.booking .nav-item a.dr-flex,
.mod-menu.mod-menu_dropdown-metismenu .nav-item a.dr-flex,
.booking.no-card .booking-link a.dr-flex {
  display: block;
  color: var(--body-bg);
  background-color: var(--cassiopeia-color-link);
  border: 1px solid var(--cassiopeia-color-link);
  font-weight: 600;
}

.mod-menu.booking .nav-item a.dr-flex {
  color: #ffc107;
  Text-transform: uppercase;
  background-color: var(--cassiopeia-color-link);
  border: 1px solid transparent;
  border-left: 0;
}

.mod-menu.booking .nav-item a.email .p-2,
.mod-menu.booking .nav-item a.dr-flex .p-2 {
  margin-right: 0.5em;
}

.booking.no-card .booking-link {
  text-align: center;
  margin: 2em 0 3em 0;
}

.booking.no-card .booking-link a.dr-flex {
  color: var(--body-bg);
  display: inline-block;
  text-decoration: none;
  font-size: 1.5rem;
  background: var(--cassiopeia-color-secondary);
  border-color: var(--cassiopeia-color-secondary);
  animation: pulse 2s infinite 1s cubic-bezier(0.25, 0, 0, 1);
  box-shadow: 0 0 0 0 var(--cassiopeia-color-secondary);
}

@keyframes pulse {
  to {
    box-shadow: 0 0 0 18px rgba(255, 255, 255, 0);
  }
}

/* Osm module */

.osmodul .leaflet-tile-container.leaflet-zoom-animated img {
  /* filter: brightness(66%) contrast(400%) grayscale(100%); */
}

/* Bottom-a card */

.grid-child.container-bottom-a {
  margin: 6em 0 3em 0;
  gap: 3em;
}

.card,
.bottom-a.card {
  border-color: var(--spicy-card-color);
  background: linear-gradient(135deg, hsla(215, 100%, 25%, 0.85) 0%, hsla(215, 100%, 25%, 0.75) 33%, hsla(215, 100%, 25%, 0.15) 100%);
  border: 0;
}

h3.card-header,
.bottom-a.card .card-header {
  color: var(--body-bg);
  background-color: var(--spicy-card-color);
  border-bottom: 0;
}

.card-body,
.card-body a {
  color: var(--body-bg);
}

.card-body b,
.card-body strong,
.card-body dt {
  color: var(--body-bg);
}

/* Bottom-b card */

.grid-child.container-bottom-b {
  margin: 0 0 3em 0;
  gap: 3em;
}


/* Services */

.subcategory_title {
  position: relative;
  font-family: var(--spicy-font-family-headings);
  font-weight: var(--spicy-font-weight-headings);
  font-size: 1.375rem;
  color: var(--body-color);
  margin-top: 0;
  padding: 0;
  margin: 7em 0 1em 0;
  line-height: 1.2;
}

.subcategory_accordion.blog-items {
  display: grid;
  grid-template-columns: repeat(auto-fit,minmax(320px,1fr));
  gap: 1em;
  margin: 1em 0 6em 0;
}

.subcategory_title + .subcategory_accordion.blog-items {
  position: relative;
  padding: 1em 2em;
  margin: 3em 0 5em 0;
  border-radius: 24px;
}

.subcategory_accordion.blog-items > .blog-item {
  padding: 0;
  background: var(--sand-color);
  border-radius: 0.25em;
  box-shadow: -1px 1px 1px rgba(112, 66, 20, 0.02), -5px 5px 4px rgba(112, 66, 20, 0.03), -12px 12px 9px rgba(112, 66, 20, 0.05), -20px 20px 15px rgba(112, 66, 20, 0.06), -32px 32px 24px rgba(112, 66, 20, 0.08);
}

.subcategory_accordion.blog-items > .blog-item > .item-content {
  padding: 1em;
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
}

.subcategory_accordion.blog-items > .blog-item > .item-content .micromodal-slide.is-open {
  /* flex-basis: 100%; */
}

.micromodal-slide.is-open ul {
  padding-left: 0;
  margin-left: 0.5rem;
  display: inline-block;
  text-align: left;
}

.micromodal-slide.is-open li {
  list-style-type: '›';
  padding-inline-start: 0.5rem;
}

.subcategory_accordion.blog-items > .blog-item > .item-content.trigger {
  cursor: pointer;
}

.subcategory_card {
  margin-bottom: 2em;
}

@media (width >= 576px) {
  .subcategory_card {
    display: flex;
    gap: 2em;
  }
}

.subcategory_card .subcategory_desc {
  margin: 2em 0;
  padding: 1em;
  background: var(--sand-color);
  border-radius: 0.25em;
  width: 100%;
}

.subcategory_card .subcategory_desc p {
  max-width: 750px;
}

.subcategory_card .subcategory_image {
  
}

.subcategory_card .subcategory_image img {
  width: 84px;
  max-width: none;
}

.subcategory_title {
  color: var(--cassiopeia-color-link);
  font-family: var(--cassiopeia-font-family-headings);
  font-weight: var(--cassiopeia-font-weight-headings);
}

.subcategory_accordion.blog-items .blog-item .item-content > span.p-2,
.subcategory_accordion.blog-items .blog-item .page-header > h2 {
  font-size: 1.375rem;
  color: var(--cassiopeia-color-link);
}

.subcategory_accordion.blog-items .blog-item .trigger .page-header > h2 {
  text-decoration: underline;
  text-decoration-thickness: 1.5px;
  text-underline-offset: 0.3em;
  line-height: 1.5;
}

.subcategory_accordion.blog-items .blog-item .item-content > span.p-2 {
  padding: 0.25rem!important;
}

/* About us */

body.site.about .items-leading {
  margin: 8em 0;
}

body.site.about .blog-items[class*=" columns-"] {
  grid-gap: 3em;
}

body.site.about .slideshow-category .fotorama {
  border-radius: 0.25em;
  box-shadow: -1px 1px 1px rgba(112, 66, 20, 0.02),
  -5px 5px 4px rgba(112, 66, 20, 0.03),
  -12px 12px 9px rgba(112, 66, 20, 0.05),
  -20px 20px 15px rgba(112, 66, 20, 0.06),
  -32px 32px 24px rgba(112, 66, 20, 0.08);
}

body.site.about main .blog-item {
  border-radius: 0.25em;
  box-shadow: -1px 1px 1px rgba(112, 66, 20, 0.02),
  -5px 5px 4px rgba(112, 66, 20, 0.03),
  -12px 12px 9px rgba(112, 66, 20, 0.05),
  -20px 20px 15px rgba(112, 66, 20, 0.06),
  -32px 32px 24px rgba(112, 66, 20, 0.08);
  max-width: 280px;
  margin: 0 auto;
}

body.site.about main .item-content {
  padding: 1em;
}

body.site.about main h2 {
  line-height: 1.125;
}

body.site[style="overflow: hidden;"] .loadin {
  transition: 0s;
}

body.site[style="overflow: hidden;"] .loadin.loaded {
  transform: none!important;
}

body.site .item-content button[data-micromodal-trigger] {
  color: var(--cassiopeia-color-link);
  padding: 0.125em 0.5em;
  margin: 1em 0;
  border: 1.5px solid var(--cassiopeia-color-link);
  border-radius: 0.25em;
  background: transparent;
}

body.site .item-content button[data-micromodal-trigger]:hover {
  color: var(--template-text-light);
  background: var(--cassiopeia-color-link);
}

body.site .item-content .micromodal__overlay .micromodal__container {
  max-width: 960px;
  background: var(--sand-color);
}

@media (max-width: 992px) {
  body.site .item-content .micromodal__overlay .micromodal__container {
    max-width: calc(100% - 32px);
  }
}

body.site .item-content .micromodal__overlay .modal-content {
  background: var(--sand-color);
  padding: 1em;
  border-radius: 0.25em;
  max-height: calc( 100vh - 120px );
  overflow: auto;
}

@supports (display:grid) {
  @media (width >= 576px) {
    .blog-items.columns-4 {
      grid-template-columns: 1fr 1fr 1fr;
    }

    blog-items.items-leading.columns-4 {
      grid-template-columns: 1fr 1fr;

    }
  }
}

/* Office */

body.site.office main img {
  border-radius: 0.25em;
}

body.site.office .category-image img {
  border-radius: 0.25em;
  box-shadow: -1px 1px 1px rgba(112, 66, 20, 0.02),
  -5px 5px 4px rgba(112, 66, 20, 0.03),
  -12px 12px 9px rgba(112, 66, 20, 0.05),
  -20px 20px 15px rgba(112, 66, 20, 0.06),
  -32px 32px 24px rgba(112, 66, 20, 0.08);
}

body.site.office .field-entry.slideshow {
  padding: 1em;
  background: var(--sand-color);
  border-radius: 0.25em;
}

/* About us & Office */

body.site .category-desc > img {
  border-radius: 0.25em;
}

body.site.services .category-desc,
body.site.about .category-desc,
body.site.office .category-desc {
  display: grid;
  grid-template-columns: 480px 1fr;
  column-gap: 5em;
  margin-bottom: 5em;
}


body.site .category-desc .slideshow-category .fotorama__nav--dots {
  position: absolute;
  bottom: 0;
}

.category-text {
  margin-top: 2.5em;
  padding: 1em;
  background: var(--sand-color);
  border-radius: 0.25em;
}

@media (max-width: 991.98px) {
  body.site.services .category-desc,
  body.site.about .category-desc,
  body.site.office .category-desc {
    display: block;
    margin-bottom: 2em;
  }

  .category-image {
    margin-bottom: 2em;
  }

  .category-image img {
    width: 100%;
    max-width: none;
  }

  .category-text {
    margin-top: 0;
  }
}

/* JoomGallery */

#system-message-container {
  display: none;
}

a.lightgallery-item {
  text-decoration: none;
}

body.site .lg-backdrop {
  background-color: var(--body-bg);
}

body.site .lg-counter,
body.site .lg-toolbar .lg-icon,
body.site .lg-next,
body.site .lg-prev,
body.site .lg-sub-html {
  color: var(--cassiopeia-color-link);
}

body.site .lg-next:hover,
body.site .lg-prev:hover {
  color: var(--cassiopeia-color-link);
}

body.site .lg-next,
body.site .lg-prev {
  background-color: var(--body-bg);
}

/* Rd Gallery custom arrows */

body.site .blog-item {
  /* overflow: visible; */
}

body.site .fotorama__dot {
  border: 1.5px solid var(--cassiopeia-color-link);
  box-sizing: content-box;
  width: 5px;
  height: 5px;
  position: relative;
  top: 11.5px;
  left: 5.5px;
  border-radius: 7px;
}

body.site .fotorama__nav__frame.fotorama__active .fotorama__dot {
  border-width: 4px;
}

.fotorama-container {
  
}

.fotorama__custom__nav {
  position: relative;
}

.fotorama__custom__arr {
  position: absolute;
  width: 32px;
  height: 32px;
  top: calc( 50% - 32px);
  transform: translate3d(0,0,0);
}

.fotorama__custom__arr--prev {
  /* left: -64px; */
  left: 0;
}

.fotorama__custom__arr--next {
  /* right: -64px; */
  right: 0;
}

.fotorama__custom__arr { background: url(../../../../../media/plg_fields_rdgallery/css/fotorama@2x-bw.png) 0 0/96px 160px no-repeat; cursor: pointer; }
.fotorama__custom__arr--next { background-position: -32px 0; }

@media (max-width: 1024px) { .fotorama__custom__arr--prev { left: -32px; } .fotorama__custom__arr--next { right: -32px; } }
@media (max-width: 768px) { .fotorama__custom__arr { display: none; } }

/* mod qlform */

.qlformContainer.qlform .invalid {
  color: #ffc87d;
}

/* error */

body.site.error_site .card-body a {
  color: initial;
}