.some i {
font-size: 20px;
}
footer {
background-color: #eeeeee;
padding: 50px 0;
}
footer .footer-cols {
display: flex;
flex-wrap: wrap;
margin: 0 -30px;
}
footer .footer-cols .footercol {
width: calc(100%/4);
padding: 0 20px;
}
footer .footer-cols .footercol.column-1 img {
height: 140px;
}
footer .footer-cols .footercol.column-2 ul {
column-count: 2;
}
footer .footer-cols .footercol h5 {
margin-bottom: 10px;
}
footer .footer-cols .footercol a, footer .footer-cols .footercol p {
font-size: 14px;
}
footer .footer-cols .footercol ul {
margin: 0;
}
footer .footer-cols .footercol ul li {
list-style-type: none;
}
footer .footer-cols .footercol ul li::before {
margin-right: 10px;
opacity: 0.5;
content: '';
border: solid black;
border-width: 0 2px 2px 0;
display: inline-block;
padding: 3px;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
.grid-container {
max-width: 1200px;
margin: 0 auto;
padding: 0 15px;
}
.btn {
padding: 15px 35px;
min-width: 150px;
font-weight: 600;
border-radius: 5px;
transition-timing-function: ease-in-out;
transition: 0.2s;
}
.btn.primary {
background-color: #0d9444;
color: #ffffff;
}
.btn.primary:hover {
background-color: #eeeeee;
color: #555;
}
header a {
transition: all 2s ease-in-out;
transition-timing-function: ease-in-out;
transition: 0.2s;
}
header a:hover {
color: #0d9444 !important;
}
.page-header {
display: none;
}
#main #content-wrap {
width: auto;
padding: 0;
max-width: 100%;
}
#main #content-wrap #primary {
width: auto;
}
.flexible-field-wrapper > section {
margin-bottom: 50px;
}
.flexible-field-wrapper > section.bg {
padding: 50px 0;
}
.flexible-field-wrapper > section:last-child {
margin-bottom: 0;
}
h1, h2, h3, h4, h5, p, a {
color: #244431;
} .variable-mg {
margin-top: 0 !important;
}
.variable-mg .grid-container h2 {
margin-bottom: 10px !important;
}
.variable-content {
position: relative;
z-index: 2;
background-size: cover;
background-position: center;
margin-left: auto;
margin-right: auto;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
margin-top: 50px;
}
.variable-content.lowpadding {
padding: 50px 0;
}
.variable-content.highpadding {
padding: 100px 0;
}
.variable-content.rounded {
border-radius: 0 0 200px 0;
}
.variable-content h1, .variable-content h2 {
margin-bottom: 30px;
}
.variable-content .full {
padding-left: 40px;
padding-right: 40px;
}
.variable-content .top-text {
padding: 0 0 20px;
width: 100%;
display: inline-block;
}
.variable-content .top-text.padding {
padding: 40px 0 20px;
}
.variable-content .inner-wrap {
display: flex;
flex-wrap: wrap;
width: 100%;
}
.variable-content .inner-wrap .single.bg {
height: 100%;
padding: 40px 30px;
box-sizing: border-box;
}
.variable-content .inner-wrap .single.bg p:last-child a {
margin-bottom: -1.5em;
display: table;
}
.variable-content .inner-wrap .single.bg p:last-child a:after {
bottom: 0 !important;
}
.variable-content .inner-wrap .single {
padding: 40px 0;
box-sizing: border-box;
position: relative;
overflow: hidden;
} .modal-container {
z-index: 3;
top: 0;
left: 0;
display: none;
margin-top: 0 !important;
width: 100%;
height: 100%;
}
.modal-container p {
display: none;
}
.modal-container.is-visible {
display: block;
}
.modal-container.is-visible .modal-container-overlay {
display: block;
opacity: 1;
}
.modal-container .modal-container-overlay {
position: fixed;
z-index: 100;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.3);
display: none;
opacity: 0;
}
.modal-container .modal-container-overlay .modal-bg-close {
position: absolute;
z-index: 1;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.modal-container .modal-container-overlay .iframe-wrapper {
max-width: 900px;
margin-left: auto;
margin-right: auto;
padding: 0 50px;
height: 100%;
display: flex;
align-items: center;
}
.modal-container .modal-container-overlay .iframe-wrapper .iframe-container {
float: none;
clear: both;
width: 100%;
position: relative;
padding-bottom: 53.2%;
padding-top: 25px;
height: 0;
-webkit-box-shadow: 0 0 80px -10px rgba(0, 0, 0, 0.8);
box-shadow: 0 0 80px -10px rgba(0, 0, 0, 0.8);
}
.modal-container .modal-container-overlay .iframe-wrapper .iframe-container iframe {
z-index: 1000;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.thumbnail-container {
position: relative;
cursor: pointer;
}
.thumbnail-container p {
margin-bottom: 0;
}
.thumbnail-container::after {
content: '';
visibility: hidden;
opacity: 0;
top: 0;
left: 0;
background: rgba(0, 0, 0, 0.4);
width: 100%;
height: 100%;
position: absolute;
transition: all 0.2s ease-in-out;
}
.thumbnail-container:hover > .playbtn, .thumbnail-container:hover::after {
visibility: visible;
opacity: 1;
}
.thumbnail-container .icon-play-btn:before {
content: "\e913";
}
.thumbnail-container .playbtn-container {
display: block;
z-index: 3;
position: absolute;
top: 50%;
left: 52%;
-webkit-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
font-size: 75px;
margin-top: 0 !important;
}
.thumbnail-container img.thumbnailimg {
display: flex;
object-fit: cover;
width: 100%;
height: 100%;
}  @media screen and (max-width: 1200px) {
.variable-content .inner-wrap.cols-4 .single {
width: calc(100% / 2);
padding-bottom: 30px;
}
.variable-content .top-text {
padding-bottom: 30px;
}
} @media screen and (max-width: 1050px) {
.variable-content .inner-wrap.cols-3 .single {
width: 100%;
padding-bottom: 30px;
}
.variable-content .inner-wrap.cols-2 .single {
width: 100%;
padding-bottom: 30px;
}
} @media screen and (max-width: 1024px) {
.variable-content .inner-wrap .videoheight {
width: 100%;
min-height: 300px;
margin-bottom: 20px;
}
} @media screen and (max-width: 992px) {
.variable-content.bgpadding {
padding: 50px 0;
}
.variable-content .inner-wrap div {
margin-top: 20px;
}
.variable-content .inner-wrap div:first-child {
margin-top: 0;
}
} @media screen and (max-width: 768px) {
.variable-content .inner-wrap .single .video {
top: 0;
}
.variable-content .inner-wrap.cols-8 div:first-child {
padding-right: 15px;
}
} @media screen and (max-width: 640px) { .grid-container {
padding-left: 30px;
padding-right: 30px;
}
.variable-content {
padding-top: 20px;
padding-bottom: 20px;
}
.variable-content .grid-container {
padding: 30px;
}
.variable-content .inner-wrap.cols-4 .single {
width: 100%;
}
.variable-content .top-text {
width: 100%;
}
}  section.hero_section.frontpage {
position: relative;
height: calc(100vh - 126px);
width: 100vw;
overflow: hidden;
margin-bottom: 50px;
}
section.hero_section.frontpage .overlay {
position: absolute;
top: 0;
background: rgba(0, 0, 0, 0.35); width: 100%;
height: 100%;
z-index: 2;
}
section.hero_section.frontpage .images {
display: flex;
height: 100%;
transform: translate3d(0, 0, 0);
-webkit-transition: all 0.2s ease;
position: relative;
z-index: 1;
}
section.hero_section.frontpage .images .image {
height: 100%;
width: 100%;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
object-fit: cover;
}
section.hero_section.frontpage .textbox {
z-index: 3;
position: absolute;
top: 60%;
left: 50%;
transform: translate(-50%, -50%);
color: white;
width: 1500px;
max-width: calc(100vw - 30px);
padding: 0 15px;
}
section.hero_section.frontpage .textbox h1 {
color: white;
font-size: 40px;
max-width: 600px;
}
section.hero_section.frontpage .textbox p {
color: white;
font-size: 18px;
max-width: 600px;
}
section.hero_section.frontpage .textbox .buttons {
margin-top: 50px;
max-width: 600px;
}
section.hero_section.frontpage .arrow {
z-index: 2;
position: absolute;
top: 50%;
transform: translateY(-50%);
cursor: pointer;
transition: transform 0.1s;
}
section.hero_section.frontpage .arrow.arrowleft {
left: 20px;
}
section.hero_section.frontpage .arrow.arrowleft .arrow-container .arrow-top {
transform: rotate(-45deg);
transform-origin: bottom left;
}
section.hero_section.frontpage .arrow.arrowleft .arrow-container .arrow-top:after {
right: 100%;
left: 0;
transition-delay: 0s;
}
section.hero_section.frontpage .arrow.arrowleft .arrow-container .arrow-bottom {
transform: rotate(45deg);
transform-origin: top left;
}
section.hero_section.frontpage .arrow.arrowleft .arrow-container .arrow-bottom:after {
right: 0;
left: 100%;
}
section.hero_section.frontpage .arrow.arrowleft .arrow-container:hover .arrow-top:after {
right: 0;
transition-delay: 0.15s;
}
section.hero_section.frontpage .arrow.arrowleft .arrow-container:hover .arrow-bottom:after {
left: 0;
transition-delay: 0s;
}
section.hero_section.frontpage .arrow.arrowright {
right: 20px;
}
section.hero_section.frontpage .arrow .arrow-container {
position: relative;
width: 40px;
height: 60px;
}
section.hero_section.frontpage .arrow .arrow-container .arrow-top, section.hero_section.frontpage .arrow .arrow-container .arrow-bottom {
background-color: white;
height: 4px;
position: absolute;
top: 50%;
width: 100%;
}
section.hero_section.frontpage .arrow .arrow-container .arrow-top:after, section.hero_section.frontpage .arrow .arrow-container .arrow-bottom:after {
background-color: rgba(0, 0, 0, 0.25);
content: '';
height: 100%;
position: absolute;
top: 0;
transition: all 0.15s;
}
section.hero_section.frontpage .arrow .arrow-container .arrow-top {
transform: rotate(45deg);
transform-origin: bottom right;
}
section.hero_section.frontpage .arrow .arrow-container .arrow-top:after {
left: 100%;
right: 0;
transition-delay: 0s;
}
section.hero_section.frontpage .arrow .arrow-container .arrow-bottom {
transform: rotate(-45deg);
transform-origin: top right;
}
section.hero_section.frontpage .arrow .arrow-container .arrow-bottom:after {
left: 0;
right: 100%;
transition-delay: 0.15s;
}
section.hero_section.frontpage .arrow .arrow-container:hover .arrow-top:after {
left: 0;
transition-delay: 0.15s;
}
section.hero_section.frontpage .arrow .arrow-container:hover .arrow-bottom:after {
right: 0;
transition-delay: 0s;
}
section.hero_section.subpage {
background-color: #fafafa;
}
section.hero_section.subpage .grid-container {
margin-top: -200px;
background-color: #fafafa;
position: relative;
z-index: 4;
}
section.hero_section.subpage .overlay {
position: absolute;
top: 0;
background: rgba(0, 0, 0, 0.15); width: 100%;
height: 100%;
z-index: 2;
display: none;
}
section.hero_section.subpage .images {
display: flex;
height: 100%;
overflow: hidden;
transform: translate3d(0, 0, 0);
-webkit-transition: all 0.2s ease;
position: relative;
z-index: 1;
}
section.hero_section.subpage .images .image {
height: 500px;
width: 100%;
max-height: 65vh;
background-position: center;
background-size: cover;
background-repeat: no-repeat;
object-fit: cover;
}
section.hero_section.subpage .textbox {
z-index: 3;
max-width: 750px;
text-align: center;
margin: 0 auto;
padding: 50px;
}
section.hero_section.subpage .textbox h1 {
font-size: 40px;
}
section.hero_section.subpage .textbox .buttons {
margin-top: 50px;
} .treatments-grid .headline {
text-align: center;
}
.treatments-grid .treatments-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
grid-gap: 30px 30px;
}
.treatments-grid .treatments-container .single-treatment {
width: calc(25% - 30px);
min-width: 250px;
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
position: relative;
}
.treatments-grid .treatments-container .single-treatment .image {
object-fit: cover;
aspect-ratio: 0.9;
}
.treatments-grid .treatments-container .single-treatment .single-treatment-content {
background: white;
padding: 15px;
padding-bottom: 60px;
}
.treatments-grid .treatments-container .single-treatment .single-treatment-content .btn {
position: absolute;
bottom: 0;
left: 0;
width: 100%;
text-align: center;
} .client-stories-grid {
color: #ffffff;
}
.client-stories-grid h2, .client-stories-grid h3, .client-stories-grid h4 {
color: #ffffff;
}
.client-stories-grid .headline {
text-align: center;
}
.client-stories-grid .client-stories-container {
max-width: 500px;
margin: 0 auto;
display: block;
}
.client-stories-grid .client-stories-container .slick-list {
padding: 0 !important;
}
.client-stories-grid .client-stories-container p, .client-stories-grid .client-stories-container i, .client-stories-grid .client-stories-container div {
color: #ffffff;
font-size: 16px;
font-weight: 700;
text-align: center;
}
.client-stories-grid .client-stories-container .single-client-story {
padding: 15px;
} .contact_form {
display: flex;
flex-wrap: wrap;
font-size: 18px;
}
.contact_form .leftside {
width: 50%;
position: relative;
}
.contact_form .leftside .overlay {
position: absolute;
top: 0;
background: rgba(0, 0, 0, 0.5); width: 100%;
height: 100%;
z-index: 2;
}
.contact_form .leftside img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 1;
}
.contact_form .leftside .contact_text {
max-width: 600px;
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
z-index: 3;
}
.contact_form .leftside .contact_text h1, .contact_form .leftside .contact_text h2, .contact_form .leftside .contact_text h3, .contact_form .leftside .contact_text h4, .contact_form .leftside .contact_text h5, .contact_form .leftside .contact_text p, .contact_form .leftside .contact_text a, .contact_form .leftside .contact_text span {
color: #ffffff;
}
.contact_form .rightside {
width: 50%;
position: relative;
}
.contact_form .rightside .contact_formular {
max-width: 80%;
padding: 50px 10%;
margin: 0 auto;
}
.contact_form .rightside .contact_formular div.wpforms-container-full .wpforms-form input.wpforms-field-medium, .contact_form .rightside .contact_formular div.wpforms-container-full .wpforms-form select.wpforms-field-medium, .contact_form .rightside .contact_formular div.wpforms-container-full .wpforms-form .wpforms-field-row.wpforms-field-medium {
max-width: unset;
}
.contact_form .rightside .contact_formular .wpforms-submit {
background-color: #0d9444 !important;
border-radius: 5px;
} .before-after-images {
padding-bottom: 50px;
}
.before-after-images .headline {
text-align: center;
}
.before-after-images .images-container .image-container {
display: flex;
flex-direction: column;
background-color: #fafafa;
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
padding: 15px;
}
.before-after-images .images-container .image-container .images {
display: flex;
flex-wrap: wrap;
}
.before-after-images .images-container .image-container .images .image {
position: relative;
width: 50%;
height: 250px;
}
.before-after-images .images-container .image-container .images .image:first-child {
padding-right: 5px;
}
.before-after-images .images-container .image-container .images .image:last-child {
padding-left: 5px;
}
.before-after-images .images-container .image-container .images .image img {
object-fit: cover;
height: 100%;
width: 100%;
}
.before-after-images .images-container .image-container .images .image .typeOfImage {
position: absolute;
bottom: -10px;
left: 50%;
transform: translateX(-50%);
background-color: #fafafa;
width: 70px;
text-align: center;
font-size: 18px;
padding: 3px 0;
}
.before-after-images .images-container .image-container .text {
padding-top: 15px;
max-width: 90%;
text-align: center;
margin: 0 auto;
} .tx-icons {
text-align: center;
}
.tx-icons .icons-container {
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 -15px;
}
.tx-icons .icons-container .icon-container {
width: calc(100% / 3 - 30px);
padding: 15px;
}
.tx-icons .icons-container .icon-container .icon img {
height: 80px;
}
.tx-icons .icons-container .icon-container .icon-headline {
margin-top: 15px;
font-weight: bold;
font-size: 18px;
}
.tx-icons .icons-container .icon-container .icon-text {
max-width: 80%;
margin: auto;
} .booking-section {
padding: 50px 0;
text-align: center;
width: 100vw;
}
.booking-section iframe {
width: 100vw;
margin: 0 auto;
display: block;
} .text-bg-center {
text-align: center;
}
.text-bg-center .textbox {
max-width: 750px;
width: 100%;
margin: 0 auto;
}
.text-bg-center .textbox .btn {
margin-top: 15px;
display: inline-block;
} section.price-list .price-item {
display: flex;
flex-direction: row;
border-bottom: 1px solid #eeeeee;
margin: 10px 0;
padding-bottom: 10px;
}
section.price-list .price-item .leftside {
width: 50%;
}
section.price-list .price-item .leftside p {
margin: 0;
}
section.price-list .price-item .leftside .treatment_headline {
font-weight: bold;
font-size: 16px;
}
section.price-list .price-item .leftside .treatment_text {
font-size: 14px;
}
section.price-list .price-item .rightside {
width: 50%;
text-align: right;
display: flex;
flex-direction: column;
justify-content: center;
} @media screen and (max-width: 480px) { .grid-container {
padding-left: 20px;
padding-right: 20px;
}
.variable-content .grid-container {
padding: 0;
}
.variable-content .grid-container .row {
margin: 0;
}
.variable-content .grid-container .inner-wrap .single {
padding: 20px 0;
}
}
#top-bar {
position: absolute;
top: 0;
left: 50%;
transform: translateX(-50%);
}
header {
box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
padding: 0px 0 10px;
}
header .col-1 {
max-width: unset;
}
a:focus {
outline: none !important;
}
.dropdown-menu .sub-menu {
border-top: 1px solid #0d9444;
}
#site-header.medium-header #site-navigation-wrap.center-menu #site-navigation .dropdown-menu > li.search-toggle-li {
display: none;
}
#site-header.medium-header #site-navigation-wrap #site-navigation {
max-width: 1200px;
width: 100%;
}
#site-header.medium-header #site-navigation-wrap .dropdown-menu > li > a {
padding: 5px 22px;
}
#site-header.medium-header #site-navigation-wrap .dropdown-menu > li.booking_menu {
position: absolute;
right: 0;
top: 50%;
transform: translateY(-50%);
}
#site-header.medium-header #site-navigation-wrap .dropdown-menu > li.booking_menu a {
font-weight: 500;
text-align: center;
border-radius: 5px;
color: #ffffff;
padding: 0 15px;
background: #0d9444;
}
#site-header.medium-header #site-navigation-wrap .dropdown-menu > li.booking_menu a:hover {
background-color: #eeeeee;
color: #555 !important;
}
.bottom-header-wrap {
position: relative;
z-index: 999;
}
@media only screen and (max-width: 992px) {
.treatments-grid .treatments-container .single-treatment {
width: calc(50% - 30px);
}
header {
padding: 0;
}
header .bottom-header-wrap {
position: absolute;
top: 50%;
right: 0px;
transform: translateY(-50%);
}
header .bottom-header-wrap .oceanwp-text, header .bottom-header-wrap .oceanwp-close-text {
display: none !important;
}
header .bottom-header-wrap #mobile-dropdown {
width: 100vw;
height: 100vh;
right: 0;
left: auto;
position: fixed;
top: 65px;
}
.contact_form .leftside, .contact_form .rightside {
width: 100%;
}
.contact_form .leftside img, .contact_form .rightside img {
position: absolute;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
}
.contact_form .leftside .contact_text, .contact_form .rightside .contact_text {
position: relative;
max-width: calc(100vw - 30px);
}
footer .footer-cols {
flex-direction: column;
}
footer .footer-cols .footercol {
width: fit-content;
margin: 0 auto;
display: block;
text-align: center;
padding: 0;
margin-bottom: 20px;
}
footer .footer-cols .footercol p {
margin-bottom: 0;
}
section.hero_section.subpage .textbox {
padding: 50px 0;
}
.footer-image-row {
width: 240px;
}
}
@media only screen and (max-width: 480px) {
.before-after-images .images-container .image-container .images .image {
height: 200px;
}
}
@media only screen and (max-width: 768px) {
.tx-icons .icons-container .icon-container {
width: calc(100% - 30px);
}
}
@media only screen and (max-width: 480px) {
.treatments-grid .treatments-container .single-treatment {
width: calc(100% - 30px);
}
}
.footer-image-row {
font-size: 13px;
display: flex;
align-items: center;
margin-bottom: 10px;
}
.footer-image-row img {
width: 50px;
margin-right: 10px;
}