*,
*::before,
*::after {
box-sizing: border-box;
}
* {
margin: 0;
}
img,
picture,
video,
canvas,
svg {
display: block;
max-width: 100%;
}
input,
button,
textarea,
select {
font: inherit;
}
p,
h1,
h2,
h3,
h4,
h5,
h6 {
overflow-wrap: break-word;
} body {
font-family: "Manrope", sans-serif;
font-weight: 400;
font-size: 18px;
letter-spacing: 0;
line-height: 1.5;
-webkit-font-smoothing: antialiased;
}
.font-serif {
font-family: "Source Serif 4", serif;
}
.font-sans {
font-family: "Manrope", sans-serif;
}
.tracking-tight {
letter-spacing: -0.02em;
}
.heading-display-1 {
font-weight: 400;
font-size: 80px;
line-height: 90px;
}
.heading-display-2 {
font-weight: 400;
font-size: 80px;
line-height: 90px;
}
.heading-display-3 {
font-weight: 400;
font-size: 55px;
line-height: 70px;
}
.heading-display-4 {
font-weight: 400;
font-size: 40px;
line-height: 45px;
}
.heading-display-5 {
font-weight: 400;
font-size: 40px;
line-height: 45px;
}
.heading-serif-sm {
font-weight: 400;
font-size: 18px;
line-height: 28px;
}
.heading-sans-xl {
font-weight: 400;
font-size: 28px;
}
.heading-sans-lg {
font-weight: 400;
font-size: 18px;
}
.heading-sans-md {
font-weight: 400;
font-size: 18px;
}
.text-body {
font-weight: 400;
font-size: 18px;
}
.text-body-lg {
font-weight: 400;
font-size: 18px;
line-height: 28px;
}
.text-body-sm {
font-weight: 400;
font-size: 14px;
}
.text-body-sm-bold {
font-weight: 600;
font-size: 14px;
}
.sec-custom-spacer {
height: var(--spacer-height-mobile);
}
a {
color: black;
text-decoration: none;
transition: all 0.3s ease-in-out;
} .sr-only {
position: absolute !important;
width: 1px !important;
height: 1px !important;
padding: 0 !important;
margin: -1px !important;
overflow: hidden !important;
clip: rect(0, 0, 0, 0) !important;
white-space: nowrap !important;
border: 0 !important;
}
.text-left {
text-align: left;
}
.text-center {
text-align: center;
}
.text-right {
text-align: right;
} .container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
--bs-gutter-x: 40px;
}
.row {
--bs-gutter-x: 40px;
}
.g-0,
.gx-0 {
--bs-gutter-x: 0 !important;
}
.container-header {
max-width: 100%;
padding-bottom: 20px;
padding-top: 20px;
}
.header {
background: white;
height: 90px;
}
.header-content {
display: flex;
align-items: center;
justify-content: space-between;
height: 100%;
position: relative;
}
.header-logo .logo {
min-width: 50px;
width: 50px;
height: 50px;
}
.burger-menu {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
width: 41px;
height: 30px;
background: none;
border: none;
cursor: pointer;
padding: 0;
position: relative;
}
.burger-line {
width: 41px;
height: 1px;
background: black;
transition: all 0.3s ease;
position: absolute;
}
.burger-line:first-child {
top: 9px;
}
.burger-line:last-child {
bottom: 9px;
}
.burger-menu.active .burger-line:first-child {
transform: rotate(45deg);
top: 50%;
margin-top: -0.5px;
}
.burger-menu.active .burger-line:last-child {
transform: rotate(-45deg);
bottom: 50%;
margin-bottom: -0.5px;
}
.main-nav {
display: none;
position: fixed;
top: 90px;
left: 0;
width: 100%;
background: white;
z-index: 1000;
height: calc(100vh - 90px);
}
.main-nav.active {
display: block;
}
.nav-list {
display: flex;
flex-direction: column;
align-items: center;
gap: 32px;
list-style: none;
margin: 0;
padding: 12px;
}
.nav-link {
color: black;
font-family: "Source Serif 4", serif;
font-weight: 400;
font-size: 20px;
line-height: 28px;
display: flex;
align-items: center;
justify-content: center;
gap: 8px;
text-decoration: none;
text-align: center;
background: none;
border: none;
cursor: pointer;
}
.nav-link:hover,
.nav-link.nav-link-active {
font-weight: 700;
}
.search-link svg,
.lang-toggle svg {
flex-shrink: 0;
}
.lang-dropdown {
position: relative;
}
.lang-submenu {
display: none;
position: absolute;
top: 100%;
left: 50%;
transform: translateX(-50%);
background: white;
border: 1px solid #e5e5e5;
border-radius: 4px;
padding: 0;
min-width: 80px;
list-style: none;
margin: 10px 0 0 0;
z-index: 1001;
}
.lang-submenu.active {
display: block;
}
.lang-option {
display: block;
padding: 8px 20px;
font-family: "Source Serif 4", serif;
font-weight: 400;
font-size: 20px;
line-height: 28px;
text-decoration: none;
color: black;
text-align: center;
}
.lang-option:hover {
background: #f5f5f5;
} .footer {
text-align: center;
}
.footer-content {
border-top: 1px solid black;
padding: 40px 0 15px;
}
.footer-content a:hover {
font-weight: 700;
}
.footer-box-1 {
margin-bottom: 42px;
}
.footer-box-2,
.footer-box-3 {
display: none;
}
.footer-mobile-combined {
margin-bottom: 48px;
}
.footer-menu-mobile {
display: flex;
justify-content: space-between;
}
.footer-menu {
list-style: none;
margin: 0;
padding: 0;
}
.footer-menu li {
margin-bottom: 16px;
}
.footer-menu li:last-child {
margin-bottom: 0;
}
.footer-link {
color: black;
text-decoration: none;
}
.footer-link-mobile {
font-weight: 700;
}
.newsletter-form {
margin-left: auto;
margin-right: auto;
max-width: max(calc(100% - 60px), 260px);
}
.newsletter-label {
display: block;
margin-bottom: 16px;
}
.newsletter-input-group {
border-bottom: 1px solid black;
gap: 8px;
}
.newsletter-input {
border: none;
flex: 1;
min-width: 0;
padding: 8px 0;
outline: none;
}
.newsletter-input::placeholder {
color: #a3a3a3;
}
.newsletter-submit {
display: flex;
align-items: center;
justify-content: center;
border: none;
background: transparent;
cursor: pointer;
min-width: 50px;
padding: 0;
}
.footer-bottom {
margin-top: 55px;
}
.footer-logo {
margin-bottom: 35px;
}
.footer-logo-img {
height: auto;
width: 140px;
}
.footer-copyright {
font-size: 10px;
}
.sec-hero-slider {
padding-top: 60px;
}
.sec-hero-slide {
position: relative;
}
.sec-hero-slide-title {
letter-spacing: -0.02em;
text-align: center;
}
.sec-hero-slide-img {
position: relative;
z-index: -1;
margin-top: -40px;
}
.sec-hero-slide-img img {
width: 100%;
}
.sec-hero-content {
margin: 80px 0;
}
.sec-hero-content {
text-align: center;
}
.sec-hero-title {
margin-bottom: 30px;
}
.sec-hero-text {
margin-bottom: 30px;
}
.sec-hero-logo img {
width: 90px;
}
.cta {
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
border: 1px solid;
border-radius: 100px;
cursor: pointer;
font-family: "Manrope", sans-serif;
font-weight: 700;
font-size: 20px;
line-height: 28px;
min-width: 180px;
padding: 15px 20px;
text-align: center;
text-decoration: none;
vertical-align: middle;
transition: all 0.3s ease;
}
.cta-sm {
min-width: 130px;
}
.cta:focus {
outline: none;
}
.cta.cta-white {
color: white;
border-color: white;
background: transparent;
}
.cta.cta-white:hover {
color: black;
background: white;
border-color: white;
}
.cta.cta-black {
color: black;
border-color: black;
background: transparent;
}
.cta.cta-black:hover {
color: white;
background: #1d1655;
border-color: #1d1655;
}
.cta.cta-blue {
color: white;
background: #1d1655;
border-color: #1d1655;
}
.cta.cta-blue:hover {
color: black;
border-color: black;
background: transparent;
}
.cta.cta-blue-alt-hover:hover {
background: white;
}
@media (min-width: 992px) {
.sec-hero-slider {
padding-top: 110px;
}
.sec-hero-slide-img {
margin-top: -120px;
}
.sec-hero-content {
margin: 190px 0;
}
.sec-hero-title {
margin-bottom: 60px;
}
.sec-hero-text {
margin-bottom: 70px;
max-width: 830px;
}
.sec-hero-logo img {
width: 160px;
}
}
.sec-door-img {
border-radius: 40px;
display: block;
height: 400px;
object-fit: cover;
overflow: hidden;
transition: all 0.3s ease-in-out;
width: 100%;
}
.sec-door-img img {
height: 100%;
object-fit: cover;
width: 100%;
}
.sec-door-title {
margin-bottom: 20px;
}
.sec-door-text p {
margin-bottom: 30px;
}
.sec-door-text p:last-child {
margin-bottom: 0;
}
.sec-door-text p.lead {
font-size: 28px;
margin-bottom: 20px;
}
.sec-door-text p.lead:last-child {
margin-bottom: 0;
}
.sec-door-text p.lead.lead-desktop {
font-size: 18px;
}
.sec-door-text p.lead.lead-desktop:last-child {
margin-bottom: 0;
}
.sec-door-cta {
margin-top: 24px;
text-align: center;
}
@media (min-width: 992px) {
.sec-door-content {
padding-bottom: 20px;
}
.sec-door-content-pt-50 {
padding-bottom: 25%;
}
.sec-door-content-pt-50 {
padding-bottom: 50%;
}
.sec-door-img {
height: auto;
}
.sec-door-img img {
transition: all 0.3s ease-in-out;
}
.sec-door-img:hover img {
scale: 1.05;
}
.sec-door-img.sec-door-img-hover-rounded-200:hover {
border-radius: 200px;
}
.sec-door-img.sec-door-img-hover-arch-top:hover {
border-radius: 400px 400px 40px 40px;
}
.sec-door-img.sec-door-img-hover-rounded-initial:hover {
border-radius: 40px;
}
.sec-door-title {
margin-bottom: 70px;
}
.sec-door-text p.lead,
.sec-door-text p.lead.lead-desktop {
font-size: 40px;
line-height: 45px;
}
.sec-door-text p {
margin-bottom: 50px;
}
.sec-door-text p:last-child {
margin-bottom: 0;
}
.sec-door-text p strong {
font-size: 20px;
}
.sec-door-cta {
margin-top: 100px;
text-align: left;
}
}
.sec-booking-form .row {
--bs-gutter-x: 20px;
}
.sec-booking-intro {
margin-bottom: 40px;
margin-left: -5px;
margin-right: -5px;
text-align: center;
}
.sec-booking-title {
margin-bottom: 10px;
}
.sec-booking-form {
background-image: url(//www.boutique-hotel.gr/wp-content/themes/boutique-hotel/images/booking-form-bg.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
padding: 60px 10px 80px;
position: relative;
}
.sec-booking-bg-none .sec-booking-form {
background: none;
}
.sec-booking-form::before {
content: "";
background: #0000004d;
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
.sec-booking-bg-none .sec-booking-form::before {
display: none;
}
.container-booking {
position: relative;
}
.sec-booking-input {
display: flex;
flex-direction: column;
margin-bottom: 30px;
position: relative;
}
.sec-booking-input .sr-only {
bottom: 0;
}
.sec-booking-input label {
color: white;
font-size: 12px;
margin: 0 0 10px 10px;
text-transform: uppercase;
}
.sec-booking-bg-none .sec-booking-input label {
color: black;
}
.sec-booking-select-wrapper {
position: relative;
}
.sec-booking-select-wrapper select {
appearance: none;
-webkit-appearance: none;
-moz-appearance: none;
outline: none;
background: white;
border: 1px solid black;
border-radius: 10px;
color: black;
cursor: pointer;
font-size: 18px;
line-height: 1;
padding: 15px 10px;
width: 100%;
}
.sec-booking-select-wrapper svg {
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
}
.sec-booking-select-wrapper select[disabled] ~ svg {
opacity: 0.2;
}
.custom-select-wrapper {
position: relative;
}
.custom-select-display {
position: relative;
display: flex;
align-items: center;
justify-content: space-between;
background: white;
border: 1px solid black;
border-radius: 10px;
color: black;
cursor: pointer;
font-size: 18px;
line-height: 1;
padding: 15px 10px;
width: 100%;
}
.custom-select-display.disabled {
opacity: 0.2;
}
.custom-select-value {
flex: 1;
}
.custom-select-display svg {
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
}
.custom-select-dropdown {
display: none;
position: absolute;
top: calc(100% + 10px);
left: 0;
width: 100%;
max-height: 600px;
background: white;
border: 1px solid #000000;
border-radius: 10px;
padding: 20px;
z-index: 1000;
}
.custom-select-dropdown.active {
display: block;
}
.custom-select-option {
cursor: pointer;
font-weight: 400;
font-size: 18px;
line-height: 32px;
letter-spacing: 0%;
transition: font-weight 0.2s ease;
}
.custom-select-option:hover,
.custom-select-option.active {
font-weight: 700;
}
.sec-booking-date-wrapper {
position: relative;
background: white;
border: 1px solid black;
border-radius: 10px;
padding: 15px 10px;
width: 100%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: space-between;
}
.sec-booking-date-display {
font-size: 18px;
line-height: 1;
color: black;
flex: 1;
}
.sec-booking-date-wrapper svg {
position: absolute;
right: 15px;
top: 50%;
transform: translateY(-50%);
}
.sec-booking-cta {
margin-top: 10px;
text-align: center;
}
.sec-booking-cta .cta {
min-width: 205px;
}
.sec-booking-form-fieldset-title {
display: block;
font-size: 18px;
margin-bottom: 26px;
margin-left: 10px;
}
.sec-booking-form-fieldset-toggle {
display: inline-flex;
align-items: center;
justify-content: center;
background: transparent;
border: none;
border-radius: 0;
cursor: pointer;
height: 35px;
min-width: 35px;
padding: 0;
text-align: center;
text-decoration: none;
vertical-align: middle;
transform: rotate(180deg);
}
.sec-booking-form-fieldset-toggle-open {
transform: rotate(0);
}
@media (min-width: 992px) {
.container-booking {
max-width: 1540px;
}
.container-destinations {
max-width: 1540px;
}
.container-destination {
max-width: 1500px;
}
.container-journal {
max-width: 1260px;
}
.container-breadcrumbs {
max-width: 1400px;
}
.sec-booking {
background-image: url(//www.boutique-hotel.gr/wp-content/themes/boutique-hotel/images/booking-form-bg.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
border-radius: 100px;
margin-left: auto;
margin-right: auto;
max-width: 1660px;
padding: 250px 0 350px;
position: relative;
}
.sec-booking-bg-none {
background: none;
border-radius: 0;
}
.sec-booking::before {
content: "";
background: #0000004d;
border-radius: 100px;
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
.sec-booking-bg-none::before {
display: none;
}
.sec-booking-title {
margin-bottom: 50px;
}
.sec-booking-intro {
color: white;
margin-bottom: 60px;
margin-left: 0;
margin-right: 0;
}
.sec-booking-form {
background: none;
padding: 0;
}
.sec-booking-form::before {
background: none;
}
.sec-booking-input {
margin-bottom: 0;
}
.sec-booking-input label {
margin: 0 0 20px 20px;
}
.sec-booking-select-wrapper svg {
right: 20px;
}
.sec-booking-date-wrapper svg {
right: 20px;
}
.sec-booking-select-wrapper select {
padding: 20px;
}
.sec-booking-date-wrapper {
padding: 20px;
}
.custom-select-display {
padding: 20px;
}
.sec-booking-form .row {
--bs-gutter-x: 16px;
}
.sec-booking-form-col--sm {
max-width: 186px;
}
.sec-booking-form-col--md {
max-width: 216px;
}
.sec-booking-form-col--lg {
max-width: 246px;
}
.sec-booking-form-col--xl {
max-width: 300px;
}
.sec-booking-cta .cta {
min-width: 180px;
}
.sec-booking-form-fieldset-title {
display: flex;
align-items: center;
justify-content: space-between;
font-size: 30px;
line-height: 45px;
margin-bottom: 40px;
margin-left: 20px;
}
}
.sec-slider-title {
margin-bottom: 10px;
margin-left: -5px;
margin-right: -5px;
}
.sec-slider-subtitle {
font-size: 18px;
}
.sec-slider-intro {
margin-bottom: 40px;
text-align: center;
}
.sec-slider-item {
display: flex;
flex-direction: column;
}
.sec-slider-item-img {
margin-bottom: 20px;
}
.sec-slider-item-img img {
border-radius: 40px;
min-height: 230px;
width: 100%;
}
.sec-slider-item-title {
font-size: 28px;
margin-bottom: 10px;
}
.sec-slider-item-subtitle {
font-weight: 600;
font-size: 14px;
margin-bottom: 20px;
}
.sec-slider-item-text {
margin-bottom: 40px;
overflow: hidden;
position: relative;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.sec-slider-item-cta {
text-align: center;
}
.swiper-pagination {
padding-bottom: 25px;
position: static !important;
text-align: center;
}
.sec-slider-pagination {
margin-top: 40px;
}
.swiper-pagination .swiper-pagination-bullet {
background: black;
height: 10px;
width: 10px;
margin: 0 20px !important;
opacity: 1;
position: relative;
transition: all 0.5s ease-in-out;
}
.swiper-pagination .swiper-pagination-bullet::before {
content: "";
background: white;
border: 1px solid black;
border-radius: 50%;
display: block;
height: 30px;
width: 30px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-25%, -25%);
opacity: 0;
transition: all 0.5s ease-in-out;
}
.swiper-pagination .swiper-pagination-bullet-active {
background: white;
transform: translate(-5px, -5px);
}
.swiper-pagination .swiper-pagination-bullet-active::before {
transform: translate(calc(-50% + 5px), calc(-50% + 5px));
opacity: 1;
}
@media (min-width: 992px) {
.container-about {
max-width: 1400px;
}
.container-slider {
max-width: 1507px;
}
.sec-slider-title {
margin-bottom: 50px;
}
.sec-slider-subtitle {
font-size: 40px;
line-height: 45px;
}
.sec-slider-intro {
margin-bottom: 130px;
}
.sec-slider-item {
flex-direction: row;
}
.sec-slider-item-img {
flex: 0 0 63%;
max-width: 63%;
margin-bottom: 0;
margin-right: 4%;
}
.sec-slider-item-img {
min-height: 0;
}
.sec-slider-item-content {
padding-top: 90px;
}
.sec-slider-item-title {
margin-bottom: 30px;
font-size: 40px;
line-height: 45px;
}
.sec-slider-item-subtitle {
margin-bottom: 45px;
}
.sec-slider-item-text {
margin-bottom: 110px;
min-height: 81px;
}
.sec-slider-item-cta {
text-align: left;
}
.sec-slider-pagination {
margin-top: 75px;
}
.swiper-pagination .swiper-pagination-bullet::before {
height: 40px;
width: 40px;
}
}
.sec-tabs-intro {
margin-bottom: 60px;
text-align: center;
}
.sec-tabs-title {
margin-bottom: 10px;
}
.sec-tabs-btns {
display: flex;
align-items: stretch;
gap: 20px;
}
.sec-tabs .sec-tabs-btns {
margin-bottom: 50px;
}
.sec-tab-btn {
background: none;
border: none;
border-bottom: 1px solid black;
color: black;
cursor: pointer;
font-weight: 400;
font-size: 18px;
padding: 0 10px 10px;
text-align: center;
}
.sec-tab-btn:hover {
border-width: 3px;
}
.sec-tab-btn.sec-tab-btn-active {
border-width: 3px;
}
.sec-tabs-btns .sec-tab-btn {
flex: 1;
}
.sec-tabs-content {
display: none;
}
.sec-tabs-content-in-stories {
overflow: hidden;
}
.sec-tabs-content-active {
display: block;
}
.maps-slider-wrapper {
margin-left: -20px;
margin-right: -20px;
}
.maps-slider-slide-img {
width: 100%;
}
.maps-slider-slide-title span {
position: absolute;
bottom: 28px;
left: 50%;
transform: translateX(-50%);
font-size: 28px;
text-align: center;
width: 100%;
}
.maps-slider-navigation {
position: absolute;
bottom: 28px;
display: flex;
align-items: center;
justify-content: space-between;
height: 38px;
width: 100%;
padding: 0 20px;
}
.maps-slider-navigation-btn {
border: none;
background: none;
cursor: pointer;
position: absolute;
top: 50%;
height: 38px;
padding: 0;
z-index: 1;
}
.maps-slider-navigation-btn.maps-slider-prev {
left: 0;
transform: translate(20px, -50%);
}
.maps-slider-navigation-btn.maps-slider-next {
right: 0;
transform: translate(-20px, -50%);
}
@media (min-width: 576px) {
.maps-slider-wrapper {
margin-left: 0;
margin-right: 0;
}
}
@media (min-width: 992px) {
.sec-tabs-intro {
margin-bottom: 110px;
}
.sec-tabs-title {
margin-bottom: 50px;
}
.sec-tabs-btns {
gap: 40px;
}
.sec-tabs .sec-tabs-btns {
margin-bottom: 100px;
}
.sec-tab-btn {
font-size: 40px;
line-height: 45px;
padding-bottom: 20px;
}
.sec-tabs-content-map svg {
height: auto;
}
}
.sec-banner {
color: white;
background-image: url(//www.boutique-hotel.gr/wp-content/themes/boutique-hotel/images/sec-banner-img.jpg);
background-position: center;
background-repeat: no-repeat;
background-size: cover;
padding: 40px 0 75px;
text-align: center;
position: relative;
}
.sec-banner::before {
content: "";
background: #00000033;
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
.container-banner {
position: relative;
}
.sec-banner-title {
margin-bottom: 350px;
}
.sec-banner-slogan .sec-banner-slogan-item {
display: block;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
width: 100%;
opacity: 0;
}
@keyframes fadeInOut {
0% {
opacity: 0;
}
4.17% {
opacity: 1;
}
25% {
opacity: 1;
}
33.33% {
opacity: 0;
}
100% {
opacity: 0;
}
}
@media (min-width: 992px) {
.sec-banner {
border-radius: 40px;
margin-left: auto;
margin-right: auto;
max-width: 1660px;
overflow: hidden;
padding: 110px 0 130px;
}
.sec-banner-title {
margin-bottom: 600px;
}
}
.sec-social {
text-align: center;
}
.sec-social-title {
margin-bottom: 35px;
}
.sec-social-links {
gap: 60px;
}
.sec-social-links a:hover svg path {
fill: #1d1655;
}
.sec-social-links a svg path {
transition: all 0.3s ease-in-out;
}
.sec-social-links svg {
height: 65px;
width: auto;
}
@media (min-width: 992px) {
.sec-social-title {
margin-bottom: 80px;
}
.sec-social-links {
gap: 105px;
}
.sec-social-links svg {
height: auto;
}
}
[data-region].active {
cursor: pointer;
fill: #f4c189;
}
[data-region][data-region-url].active {
fill: initial;
}
.card {
display: flex;
flex-direction: column;
margin-bottom: 60px;
position: relative;
}
.journal-card {
margin-bottom: 100px;
}
.card-img-wrapper {
border-radius: 40px;
margin-bottom: 20px;
order: -1;
overflow: hidden;
}
.card-img {
height: 400px;
object-fit: cover;
width: 100%;
}
.card-img-rounded-wrapper {
border-radius: 300px;
}
.card-meta {
display: block;
font-size: 14px;
margin-bottom: 23px;
position: relative;
text-decoration: underline;
z-index: 1;
}
.card-title {
display: block;
font-size: 28px;
margin-bottom: 16px;
}
.journal-card-title {
margin-bottom: 0;
}
.card-title::before {
content: "";
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
@media (min-width: 575px) {
.card-img {
height: auto;
}
.journal-card-img {
height: 750px;
}
}
@media (min-width: 992px) {
.card {
margin-bottom: 150px;
}
.journal-card {
margin-bottom: 100px;
}
.card-img-wrapper {
margin-bottom: 50px;
}
.card-img {
transition: all 0.5s ease-in-out;
}
.card-meta:hover {
font-weight: 600;
}
.card-title {
font-size: 40px;
line-height: 45px;
margin-bottom: 25px;
transition: all 0.5s ease-in-out;
}
.journal-card-title {
margin-bottom: 0;
}
.card-title:hover {
margin-bottom: 35px;
margin-top: -10px;
}
.journal-card-title:hover {
margin-bottom: 0;
margin-top: 0;
}
.card-title:hover ~ .card-img-wrapper .card-img {
transform: scale(1.15);
}
.card-title:hover ~ .card-img-wrapper .card-img.journal-card-img {
transform: scale(1.05);
}
}
.sec-blog-slider-intro {
margin-bottom: 20px;
text-align: center;
}
.sec-blog-slider-alt .sec-blog-slider-intro {
margin-bottom: 40px;
}
.sec-blog-slider-alt .sec-blog-slider-title {
margin-left: -5px;
margin-right: -5px;
}
.sec-blog-slider-subtitle {
margin-top: 10px;
}
.sec-blog-slider .swiper-slide {
position: relative;
}
.sec-blog-slider-item-img {
border-radius: 40px;
margin-bottom: 12px;
overflow: hidden;
}
.sec-blog-slider-alt .sec-blog-slider-item-img {
margin-bottom: 20px;
}
.sec-blog-slider-item-img-rounded {
border-radius: 300px;
}
.sec-blog-slider-item-img img {
min-height: 230px;
height: auto;
width: 100%;
}
.sec-blog-slider-item-cat {
display: block;
font-size: 14px;
margin-bottom: 10px;
position: relative;
text-decoration: underline;
z-index: 1;
}
.sec-blog-slider-alt .sec-blog-slider-item-cat {
font-weight: 600;
margin-bottom: 0;
margin-top: 10px;
text-decoration: none;
}
.sec-blog-slider-item-title {
display: block;
font-size: 28px;
}
.sec-blog-slider-item-title::before {
content: "";
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
.sec-blog-slider-pagination {
margin: 30px 0;
padding-bottom: 25px;
}
.sec-blog-slider .cta {
min-width: 220px;
}
.sec-program-text {
margin-bottom: 50px;
}
.sec-program-text p {
margin-bottom: 30px;
}
.sec-program-text p:last-child {
margin-bottom: 0;
}
.sec-program-text p strong {
font-size: 20px;
}
@media (min-width: 992px) {
.sec-program .row {
max-width: 1340px;
}
.sec-program-text {
margin-bottom: 70px;
max-width: 570px;
}
.sec-program-text:last-child {
margin-bottom: 0;
}
}
@media (min-width: 992px) {
.sec-blog-slider {
overflow: hidden;
}
.sec-blog-slider-subtitle {
font-size: 40px;
line-height: 45px;
margin-top: 50px;
}
.sec-blog-slider .swiper {
overflow: visible;
}
.sec-blog-slider .swiper-wrapper {
align-items: center;
}
.container-blog-slider {
max-width: 1500px;
}
.sec-blog-slider-intro {
margin-bottom: 80px;
}
.sec-blog-slider-alt .sec-blog-slider-intro {
margin-bottom: 110px;
}
.sec-blog-slider-alt .sec-blog-slider-title {
margin-left: 0;
margin-right: 0;
}
.sec-blog-slider .swiper-slide {
display: flex;
justify-content: center;
width: min(60vw, 1100px);
scale: 1;
transition: all 0.3s ease-in-out;
}
.sec-blog-slider-alt .swiper-slide {
width: min(55vw, 930px);
}
.sec-collection-single-slider .swiper-slide {
width: min(70vw, 1170px);
}
.sec-blog-slider .swiper-slide:not(.swiper-slide-active) {
scale: 0.75;
}
.sec-blog-slider-alt .swiper-slide:not(.swiper-slide-active) {
scale: 0.8;
}
.sec-blog-slider-item-img {
margin-bottom: 0;
}
.sec-blog-slider-alt .sec-blog-slider-item-img {
margin-bottom: 50px;
}
.sec-collection-single-slider .sec-blog-slider-item-img {
margin-bottom: 0;
}
.swiper-slide .sec-blog-slider-item-content {
margin-left: min(3.75vw, 64px);
max-width: 450px;
}
.sec-blog-slider-alt .sec-blog-slider-item-content {
margin-left: 0;
max-width: 100%;
text-align: center;
}
.sec-blog-slider-item-cat {
font-size: 20px;
margin-bottom: 24px;
}
.sec-blog-slider-alt .sec-blog-slider-item-cat {
font-size: 14px;
margin-top: 30px;
}
.sec-blog-slider-item-cat:hover {
color: #1d1655;
}
.sec-blog-slider-item-title {
font-size: 40px;
line-height: 45px;
}
.sec-blog-slider-item-title:hover {
color: #1d1655;
}
.sec-blog-slider-nav {
margin-top: 150px;
}
.sec-blog-slider-alt .sec-blog-slider-pagination {
margin-top: 70px;
}
.sec-blog-slider .cta {
min-width: 205px;
}
.sec-blog-slider-nav-btn {
border: none;
background: none;
cursor: pointer;
display: flex;
align-items: center;
padding: 0;
z-index: 1;
}
}
.booking-card-col {
margin-bottom: 80px;
}
.booking-card-img {
margin-bottom: 20px;
}
.booking-card-img img {
border-radius: 40px;
min-height: 230px;
width: 100%;
object-fit: cover;
}
.booking-card-title {
font-size: 28px;
font-weight: 400;
margin-bottom: 7px;
}
.booking-card-subtitle {
font-weight: 600;
font-size: 14px;
line-height: 20px;
margin-bottom: 30px;
}
.booking-card-text {
margin-bottom: 20px;
min-height: 81px;
overflow: hidden;
position: relative;
display: -webkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
}
.booking-card-actions {
display: flex;
align-items: center;
justify-content: space-between;
}
.booking-card-actions-text {
font-size: 20px;
font-weight: 700;
line-height: 28px;
}
.booking-card-cta {
min-width: 150px;
width: 150px;
}
.pagination {
display: flex;
align-items: center;
justify-content: flex-start;
gap: 20px;
}
.pagination a {
display: flex;
align-items: center;
justify-content: center;
border-radius: 50%;
font-size: 18px;
line-height: 1;
height: 34px;
width: 34px;
text-align: center;
}
.pagination a:hover {
font-weight: 700;
}
.pagination a.active {
background: #1d1655;
border: 1px solid #1d1655;
color: white;
font-size: 30px;
font-weight: 400;
height: 68px;
min-width: 68px;
width: 68px;
}
@media (min-width: 992px) {
.booking-card-col {
margin-bottom: 150px;
}
.booking-card {
display: flex;
flex-direction: column;
height: 100%;
}
.booking-card-img {
margin-bottom: 40px;
}
.booking-card-img img {
min-height: 300px;
}
.booking-card-content {
padding-left: 20px;
padding-right: 19px;
padding-left: 19px;
padding-right: 19px;
}
.booking-card-title {
font-size: 40px;
line-height: 45px;
margin-bottom: 20px;
}
.booking-card-subtitle {
margin-bottom: 40px;
}
.booking-card-text {
margin-bottom: 50px;
}
.booking-card-actions {
margin-top: auto;
padding-left: 20px;
padding-right: 19px;
}
.booking-card-actions-text {
font-size: 25px;
font-weight: 800;
}
.pagination {
justify-content: center;
}
.pagination a {
font-size: 18px;
line-height: 1;
height: 44px;
width: 44px;
}
.pagination a.active {
background: white;
border-color: black;
color: black;
height: 80px;
min-width: 80px;
width: 80px;
}
}
.breadcrumb {
display: flex;
align-items: center;
gap: 10px;
font-size: 14px;
}
.breadcrumb a {
color: #0000004d;
}
.breadcrumb a:hover {
color: #000000;
}
.breadcrumb-last-item {
font-weight: 600;
}
.sharing-tool-btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 17px;
background: transparent;
border: none;
border-radius: 0;
cursor: pointer;
font-family: "Source Serif 4", serif;
font-weight: 400;
font-size: 14px;
line-height: 28px;
min-width: 140px;
padding: 0;
text-align: center;
text-decoration: underline;
vertical-align: middle;
transition: all 0.3s ease;
}
.sharing-tool-btn:hover {
font-weight: 600;
}
.collection-review-stars {
display: flex;
justify-content: center;
gap: 3px;
}
.collection-review-stars svg {
width: 22px;
}
.sec-slider-play-btn {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
cursor: pointer;
width: 40px;
display: flex;
align-items: center;
justify-content: center;
}
.collection-lead-text {
display: block;
font-size: 40px;
font-weight: 400;
line-height: 45px;
}
.sec-single-collection-text {
margin-bottom: 110px;
}
.sec-single-collection-text p {
margin-bottom: 15px;
}
.sec-single-collection-text p:last-child {
margin-bottom: 0;
}
.widget {
margin-bottom: 80px;
}
.widget:last-child {
margin-bottom: 0;
}
.widget-reservation {
padding: 0 10px;
}
.widget-contact .widget-contact-list {
padding: 0 30px;
}
.widget.widget-key-features {
margin-bottom: 60px;
max-width: 240px;
}
.widget .row {
--bs-gutter-x: 20px;
}
.widget .cta {
width: 100%;
}
.widget-title {
font-weight: 400;
font-size: 28px;
margin-bottom: 30px;
} .widget .sec-booking-input label {
color: black;
margin: 0 0 13px 10px;
}
.widget-map img {
border-radius: 40px;
height: 230px;
margin-bottom: 40px;
object-fit: cover;
width: 100%;
}
.widget-contact-list {
gap: 20px;
margin-bottom: 60px;
}
.widget-key-features .widget-contact-list {
gap: 0;
}
.widget-key-features .widget-contact-list-item {
font-size: 18px;
margin-bottom: 20px;
min-height: 0;
}
.widget-contact-list:last-child {
margin-bottom: 0;
}
.widget-contact-list-item {
font-size: 14px;
gap: 20px;
min-height: 30px;
position: relative;
}
.widget-contact-list-item a {
display: block;
}
.widget-contact-list-item a::before {
content: "";
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
}
a.is-underlined {
text-decoration: underline;
}
a.is-underlined:hover {
font-weight: 600;
}
.widget-contact-list-item-icon {
display: flex;
align-items: center;
justify-content: center;
min-width: 30px;
min-height: 30px;
width: 30px;
}
.widget-contact-list-item-icon svg {
max-height: 40px;
}
@media (min-width: 992px) {
.collection-review-stars svg {
width: 29px;
}
.sec-slider-play-btn {
width: 140px;
}
.sec-slider-play-btn:hover {
opacity: 0.75;
}
.collection-lead-text {
font-size: 90px;
line-height: 100px;
}
.widget {
margin-bottom: 110px;
}
.widget-reservation {
padding: 0;
}
.widget-contact .widget-contact-list {
padding: 0;
}
.widget .cta {
width: auto;
}
.widget-title {
font-size: 40px;
line-height: 45px;
margin-bottom: 50px;
}
.widget-contact .widget-title {
margin-bottom: 45px;
} .widget .sec-booking-input label {
margin: 0 0 18px 28px;
}
.widget-map img {
height: 260px;
margin-bottom: 70px;
}
.widget-contact {
padding-bottom: 60px;
}
.widget-contact .widget-contact-list-social {
gap: 35px;
}
.widget-contact-list-item {
font-size: 20px;
}
.widget-contact-list-item-sm {
font-size: 18px;
}
.widget.widget-key-features {
max-width: 800px;
}
.widget-key-features .widget-contact-list-item {
font-size: 20px;
margin-bottom: 10px;
min-height: 40px;
}
.widget-key-features .widget-contact-list-item-icon {
min-height: 40px;
}
.widget-contact-list-item a:hover {
font-weight: 600;
}
}
.dest-intro-heading {
position: relative;
}
.dest-intro-img {
margin-top: -30px;
border-radius: 1000px 1000px 0 0;
padding-bottom: 135%;
overflow: hidden;
position: relative;
}
.dest-intro-img img {
width: 100%;
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
object-position: left bottom;
object-fit: cover;
transform: scale(1.1);
transition: all 0.3s ease-in-out;
z-index: -1;
}
.text-area p {
margin-bottom: 30px;
}
.text-area p:last-child {
margin-bottom: 0;
}
.dest-intro-text p strong {
font-size: 20px;
font-weight: 700;
}
.badge {
display: flex;
align-items: center;
justify-content: center;
background: #d9d9d9;
border-radius: 50%;
font-family: "Source Serif 4", serif;
font-weight: 400;
font-size: 10px;
height: 64px;
min-height: 64px;
min-width: 64px;
width: 64px;
padding: 0 15px;
text-align: center;
}
.search-badge {
position: absolute;
right: 94px;
top: 0;
z-index: 1;
}
.contact-form {
display: flex;
flex-direction: column;
gap: 30px;
margin: 0 auto;
max-width: 700px;
}
.contact-form-input {
position: relative;
}
.contact-form-input label {
line-height: 1.5;
transform-origin: left top;
}
.contact-form-input.shrunk label,
.contact-form.invalid .contact-form-input label {
transform: translateY(-35px) scale(0.625);
}
.contact-form-input-default {
display: flex;
align-items: stretch;
height: 70px;
font-weight: 400;
font-size: 18px;
padding-top: 10px;
}
.contact-form-input-default label {
position: absolute;
left: 0;
top: 35px;
pointer-events: none;
transition: all 0.3s ease-in-out;
}
.contact-form-input input[type="text"],
.contact-form-input input[type="email"],
.contact-form-input input[type="password"] {
border: none;
border-bottom: 1px solid black;
border-radius: 0;
display: block;
min-width: 0;
outline: none;
padding: 0;
width: 100%;
}
.contact-form-input-textarea {
display: flex;
align-items: stretch;
height: 190px;
font-size: 18px;
line-height: 60px;
}
.contact-form-input-textarea label {
position: absolute;
left: 0;
top: 35px;
pointer-events: none;
transition: all 0.3s ease-in-out;
}
.contact-form-input textarea {
border: none;
display: block;
font-weight: 400;
font-size: 18px;
line-height: 60px;
min-width: 0;
outline: none;
padding: 10px 0 0;
width: 100%;
background-image: linear-gradient(
transparent 69px,
black 69px,
black 70px,
transparent 70px,
transparent 129px,
black 129px,
black 130px,
transparent 130px,
transparent 189px,
black 189px,
black 190px,
transparent 190px
);
resize: none;
}
.contact-form-checkboxes {
display: flex;
flex-direction: column;
gap: 20px;
margin: 30px 10px;
}
.contact-form-checkbox {
display: flex;
align-items: center;
gap: 13px;
}
.contact-form-checkbox-box {
border: 1px solid #473636;
display: block;
height: 36px;
min-height: 36px;
min-width: 36px;
width: 36px;
}
.contact-form-checkbox label {
font-size: 14px;
font-weight: 400;
padding-right: 10px;
}
.contact-form-checkbox input:checked + .contact-form-checkbox-box {
background: black;
border-color: black;
}
@media (min-width: 992px) {
.dest-intro-img {
border-radius: 100% 100% 0 0;
margin-top: 0;
padding-bottom: 82%;
}
.dest-intro-img:hover img {
transform: scale(1.2);
}
.badge {
font-size: 14px;
height: 128px;
min-height: 128px;
min-width: 128px;
width: 128px;
padding: 30px;
}
.search-badge {
right: 110px;
top: calc(100% + 60px);
transform: none;
z-index: 1;
}
.contact-form {
gap: 80px;
}
.contact-form-input.shrunk label,
.contact-form.invalid .contact-form-input label {
transform: scale(0.375);
}
.contact-form-input-default {
font-size: 40px;
line-height: 45px;
}
.contact-form-input-default label {
top: 0;
}
.contact-form-input-textarea {
font-size: 40px;
line-height: 45px;
}
.contact-form-input-textarea label {
top: 0;
}
.contact-form-checkboxes {
gap: 30px;
margin: -20px 0 20px;
}
.contact-form-checkbox {
gap: 22px;
}
.contact-form-checkbox-box {
height: 30px;
min-height: 30px;
min-width: 30px;
width: 30px;
}
.contact-form-checkbox label {
cursor: pointer;
font-size: 12px;
padding-right: 0;
transition: all 0.3s ease-in-out;
}
.contact-form-checkbox label:hover {
font-weight: 600;
}
}
@media (min-width: 992px) {
.sec-custom-spacer {
height: var(--spacer-height-desktop);
}
.text-lg-left {
text-align: left;
}
.text-lg-center {
text-align: center;
}
.text-lg-right {
text-align: right;
}
.header {
height: auto;
}
.header-logo .logo {
min-width: 70px;
width: 70px;
height: 70px;
}
.burger-menu {
display: none;
}
.main-nav {
display: flex;
justify-content: flex-end;
position: static;
height: auto;
background: none;
flex: 1;
margin-left: auto;
}
.nav-list {
display: flex;
flex-direction: row;
align-items: center;
padding: 0;
gap: 20px;
justify-content: flex-end;
width: 100%;
}
.nav-list li {
margin-bottom: 0;
}
.nav-link {
font-size: 18px;
}
.lang-submenu {
left: 0;
transform: none;
min-width: 60px;
}
.heading-display-1 {
font-size: 200px;
line-height: 1;
}
.heading-display-2 {
font-size: 200px;
line-height: 1;
}
.heading-display-3 {
font-size: 110px;
line-height: 1;
}
.heading-display-4 {
font-size: 80px;
line-height: 1;
}
.heading-display-5 {
font-size: 60px;
line-height: 75px;
}
.heading-serif-sm {
font-size: 20px;
line-height: 28px;
}
.heading-sans-xl {
font-weight: 300;
font-size: 60px;
line-height: 67px;
}
.heading-sans-lg {
font-size: 40px;
line-height: 45px;
}
.heading-sans-md {
font-size: 30px;
line-height: 45px;
}
.text-body {
font-size: 18px;
}
.text-body-lg {
font-size: 20px;
line-height: 28px;
}
.text-body-sm {
font-size: 14px;
}
.text-body-sm-bold {
font-size: 14px;
}
.footer {
text-align: left;
}
.footer-content {
padding: 75px 0 55px;
}
.footer-box-2,
.footer-box-3 {
display: block;
}
.footer-mobile-combined {
display: none;
}
.newsletter-form {
margin-bottom: 0;
margin-right: 0;
max-width: 380px;
}
.footer-bottom {
margin-top: 60px;
}
.footer-logo {
margin-bottom: 0;
margin-right: 125px;
}
.footer-copyright {
font-size: 14px;
text-align: left;
}
}
@media (min-width: 1400px) {
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm,
.container {
max-width: 1440px;
}
.container-xxl {
max-width: 1640px;
}
.container-header {
max-width: 1540px;
padding-bottom: 40px;
padding-top: 40px;
}
.container-footer {
max-width: 1540px;
}
.container-destinations {
max-width: 1540px;
}
.container-destination {
max-width: 1500px;
}
.container-journal {
max-width: 1260px;
}
.container-booking-cards .row {
--bs-gutter-x: 90px;
}
.container-breadcrumbs {
max-width: 1400px;
}
.container-tabs {
max-width: 1540px;
}
.container-about {
max-width: 1400px;
}
.container-booking {
max-width: 1540px;
}
.container-slider {
max-width: 1517px;
}
.container-blog-slider {
max-width: 1500px;
}
.search-link {
margin: 0 70px;
}
.heading-display-1 {
font-size: 300px;
}
.heading-display-2 {
font-size: 200px;
}
.heading-display-3 {
font-size: 150px;
}
.sec-banner-slogan.heading-display-3 {
font-size: 200px;
}
.page-intro-heading.heading-display-3 {
font-size: 200px;
}
.page-intro-text {
max-width: 1000px;
}
.heading-display-4 {
font-size: 85px;
line-height: 95px;
}
.heading-display-5 {
font-size: 80px;
line-height: 100px;
}
.heading-sans-xl {
font-size: 80px;
line-height: 90px;
}
.nav-list {
gap: 30px;
}
.row-cards {
--bs-gutter-x: 110px;
}
.row-journal-cards {
--bs-gutter-x: 120px;
}
.sidebar {
max-width: 420px;
}
.sec-single-collection-text {
max-width: 800px;
}
.widget.widget-key-features {
margin-bottom: 0;
}
} .checkin-error-tooltip {
position: absolute;
top: 100%;
left: 0;
background: #ff3b30;
color: #fff;
padding: 6px 10px;
border-radius: 4px;
font-size: 12px;
margin-top: 6px;
white-space: nowrap;
z-index: 9999;
box-shadow: 0 2px 6px rgba(0,0,0,0.15);
opacity: 0;
pointer-events: none;
transform: translateY(-5px);
transition: opacity .2s ease, transform .2s ease;
} .checkin-error-tooltip.show {
opacity: 1;
pointer-events: auto;
transform: translateY(0);
}