/*
Theme Name: Enfold Child
Description: A <a href='http://codex.wordpress.org/Child_Themes'>Child Theme</a> for the Enfold Wordpress Theme. If you plan to do a lot of file modifications we recommend to use this Theme instead of the original Theme. Updating will be much easier then.
Version: 1.0
Author: Kriesi
Author URI: http://www.kriesi.at
Template: enfold
*/



/*Add your own styles here:*/

/* --------------------------------------------------- HEADER MODIFICATIONS START --------------------------------------------------- */

/* Set the background color of the header to avoid flickering on mobile */
#top .header_bg {
    background: white !important;
    background-color: white !important;
}

/* Always show the divider between the navigation tabs and the social media icons */
#top .avia-menu.av_menu_icon_beside {
    border-color: rgb(187, 187, 187) !important;
}

/* Increase font size of header items for desktop & landscape tablet */
#top .av-main-nav li a {
    font-weight: 600 !important;
    font-size: 17px !important;
    padding-left: 17px !important;
    padding-right: 17px !important;
    letter-spacing: 0.5px !important;
    color: black !important;
}

/* Increase font size of social buttons for desktop & landscape tablet */
#top .social_bookmarks li a {
    font-size: 17px !important;
}

/* Adjust font size & border for sub menu for desktop & landscape tablet */
#top .av-main-nav ul li a {
    border-width: 0px 0px 0px 0px !important;
    font-weight: normal !important;
    font-size: 15px !important;
    letter-spacing: 0.7px !important;
    color: black !important;
    background-color: white !important;
    font-weight: 600 !important;
    border-top: 1px solid rgb(235, 235, 235) !important;
    border-left: 1px solid rgb(235, 235, 235) !important;
    border-right: 1px solid rgb(235, 235, 235) !important;
    -ms-transition: all 0.5s !important;
    -o-transition: all 0.5s !important;
    -moz-transition: all 0.5s !important;
    -webkit-transition: all 0.5s !important;
    transition: all 0.5s !important;
}

#top .av-main-nav ul li a:hover {
    background-color: rgb(235, 235, 235) !important;
}

/* Add white top border for first item of buger menu (was missing) */
.html_av-overlay-side #top #wrap_all .av-burger-overlay li:nth-child(1) {
    border-top-width: 1px !important;
    border-top-color: rgb(187, 187, 187) !important;
    border-top-style: solid !important;
}

/* Style of burger menu background */
#top .av-burger-overlay-scroll {
    background-color: white !important;
    box-shadow: 0px 0px 8px #282828 !important;
}

/* Hide the header border that seperates the menu items with the social links */
#top .av-main-nav-wrap {
    border: 0px !important;
    margin-right: 0px !important;
}

/* --------------------------------------------------- HEADER MODIFICATIONS END --------------------------------------------------- */

/* --------------------------------------------------- BOOKING MODULE MODIFICATIONS START --------------------------------------------------- */

/* Set max-width of booking module */
#top .wpbc_container {
    max-width: 1000px !important;
    margin: auto !important;
}

/* Hide the labels of the calendar and the time buttons container */
#top .wpbc_r_rangetime>label,
#top .wpbc_r_calendar>label {
    display: none !important;
}

/* Set vertical margin of the calendar and the time buttons container */
#top .wpbc_container_booking_form .wpbc__field:not(.wpbc__cal) {
    margin-top: 0.2em !important;
    margin-bottom: 0.2em !important;
}

/* Make sure that calendar aligns with time buttons container on desktop */
#top .wpbc_cal_container {
    margin-top: 10px !important;
}


/* Set inner padding of calendar */
#top .datepick-inline {
    padding: 10px !important;
    border-radius: 0px !important;
    /* Fix Safari specific bug of overlapping calendar when rotating device */
    overflow: hidden !important;
}

/* Change color of selected date */
#top .datepick-inline div.datepick-one-month .datepick td.datepick-current-day .wpbc-cell-box {
    background: #EB4C51 !important;
    border: 1px solid transparent !important;
    border-radius: 0px !important;
}

/* Change color of hovered date */
#top .datepick-inline div.datepick-one-month .datepick td.datepick-days-cell-over .wpbc-cell-box {
    background: #F38F92 !important;
    border: 1px solid transparent !important;
    border-radius: 0px !important;
}

/* Skew the dates */
#top .datepick-inline div.datepick-one-month .datepick td.datepick-days-cell {
    transform: skew(-18deg) !important;
    border-radius: 0px !important;
}

/* Set color of partially booked days to black */
#top .wpbc_timeslot_day_bg_as_available .datepick-inline .date2approve.timespartly:not(.check_in_time, .check_out_time) a {
    color: black !important;
}

/* Revert skew for date labels */
#top .datepick-inline div.datepick-one-month .datepick td.datepick-days-cell .wpbc-cell-box a,
#top .datepick-inline div.datepick-one-month .datepick td.datepick-days-cell .wpbc-cell-box span {
    transform: skew(18deg) !important;
}

/* Style for the dot indicating that some slots are already booked */
#top .datepick-inline div.datepick-one-month .datepick .wpbc_time_dots {
    color: #EB4C51 !important;
    transform: skew(18deg) !important;
    margin-right: 9px !important;
    margin-top: 5px !important;
}

/* Hover and selection style for the dot indicating that some slots are already booked */
#top .datepick-inline div.datepick-one-month .datepick td.datepick-current-day .wpbc-cell-box .wpbc_time_dots,
#top .datepick-inline div.datepick-one-month .datepick td.datepick-days-cell-over .wpbc-cell-box .wpbc_time_dots,
#top .datepick-inline div.datepick-one-month .datepick td.datepick-current-day .wpbc-cell-box a,
#top .datepick-inline div.datepick-one-month .datepick td.datepick-days-cell-over .wpbc-cell-box a {
    color: white !important;
}

/* Style of time buttons */
#top .wpbc_times_selector div {
    border-width: 0px !important;
    border-radius: 0px !important;
    background: transparent !important;
    position: relative !important;
    margin: 10px !important;
    box-shadow: none !important;
    flex: 0 0 145px !important;
    /* Avoid that text is selectable inside of button */
    user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    cursor: pointer;
}

/* Add skewed background to time buttons */
#top .wpbc_times_selector div::before {
    content: '';
    position: absolute;
    background: white;
    box-shadow: 0 1px 5px 1px #00000014;
    transform: skew(-18deg);
    z-index: -1;
    inset: 0;
}

/* Style of the background of disabled time buttons */
#top .wpbc_times_selector div.wpbc_time_picker_disabled::before {
    background: repeating-linear-gradient(314deg, #e7e7e7, #e7e7e7 10px, #fff 10px, #fff 20px) !important
}

/* Style of the text of disabled time buttons */
#top .wpbc_times_selector div.wpbc_time_picker_disabled {
    color: #808080 !important;
    pointer-events: none !important;
}

/* Set highlight color of selected time button */
#top .wpbc_times_selector div.wpbc_time_selected::before {
    background: #EB4C51;
}

/* Set font weight of label of selected time button */
#top .wpbc_times_selector div.wpbc_time_selected {
    font-weight: bold !important;
}

/* Hide watermark */
#top .wpbc_calendar_wraper>div:last-of-type {
    display: none !important;
}

/* Style of step button */
#top .wpbc_button_light {
    border-width: 0px !important;
    border-radius: 0px !important;
    background: transparent !important;
    position: relative !important;
    font-weight: bold !important;
    color: white !important;
    box-shadow: none !important;
    width: 90%;
    max-width: 175px !important;
}


/* Add skewed background to step button */
#top .wpbc_button_light::before {
    content: '';
    position: absolute;
    background: #EB4C51;
    transform: skew(-18deg);
    z-index: -1;
    inset: 0;
    -ms-transition: box-shadow 0.3s !important;
    -o-transition: box-shadow 0.3s !important;
    -moz-transition: box-shadow 0.3s !important;
    -webkit-transition: box-shadow 0.3s !important;
    transition: box-shadow 0.3s !important;
}

/* Style the disabled step button */
#top .wpbc_button_light.disabled-step-button {
    opacity: 0.5 !important;
    pointer-events: none !important;
}

/* Hide seperator line */
.wpbc_wizard_step>hr {
    background: transparent !important;
}

/* Style of the error/success message */
#top .wpbc_fe_message {
    line-height: 30px !important;
}

/* Hide buttons in error/message showing logs */
#top .wpbc_fe_message_warning a,
#top .wpbc_fe_message_error a {
    display: none !important;
}

/* Style the input and textarea container */
#top .wpbc_r_name,
#top .wpbc_r_secondname,
#top .wpbc_r_email,
#top .wpbc_r_phone,
#top .wpbc_r_details,
#top .wpbc_text_captcha_container {
    position: relative;
}

/* Style the input and textarea */
#top .wpbc_wizard_step input,
#top .wpbc_wizard_step textarea {
    background: transparent !important;
    border-width: 0px !important;
    box-shadow: none !important;
    color: black !important;
    padding-left: 20px !important;
    padding-right: 20px !important;
}

/* Disable resize for the textarea */
#top .wpbc_wizard_step textarea {
    resize: none !important;
}

/* Add skewed background to input and textarea */
#top .wpbc_r_name::before,
#top .wpbc_r_secondname::before,
#top .wpbc_r_email::before,
#top .wpbc_r_phone::before,
#top .wpbc_r_details::before,
#top .wpbc_text_captcha_container::before {
    content: '';
    position: absolute;
    background: white;
    box-shadow: 0 1px 5px 1px #00000014;
    transform: skew(-18deg);
    z-index: -1;
    inset: 40px 0 20px 0;
}

/* Slightly inset label of input and textarea */
#top .wpbc__field>label {
    margin-left: 15px !important
}

/* Add skewed background to captcha */
#top .wpbc_text_captcha_container::before {
    content: '';
    position: absolute;
    background: white;
    box-shadow: 0 1px 5px 1px #00000014;
    transform: skew(-18deg);
    z-index: -1;
    height: 43px;
    width: 170px;
    top: 0;
    left: 0;
}

/* Style of captcha text */
#top .wpbc_text_captcha_container .captcha_img {
    margin-bottom: 15px !important;
}

/* Style of invalid input warning/error message */
#top .wpbc_wizard_step .wpbc_front_end__message_container_right {
    position: absolute;
    bottom: -22px !important;
    font-weight: bold !important;
    font-size: 14px !important;
}

/* Style of thanking message after booking */
#top .wpbc_ty__container {
    border-width: 0px !important;
}

/* Style of "Add to Google Calendar" link after booking */
#top .wpbc_ty__container a {
    color: #EB4C51 !important
}

/* Style of message when no available times exist for selected date */
#top .wpbc_no_time_pickers {
    color: black !important;
    box-shadow: 0 1px 5px 1px #00000014 !important;
    background: white !important;
    border-width: 0px !important;
    border-radius: 0px !important;
}

/* --------------------------------------------------- BOOKING MODULE MODIFICATIONS END --------------------------------------------------- */

/* --------------------------------------------------- CONTACT FORM MODIFICATIONS START --------------------------------------------------- */

/* Style contact input and contact textarea container */
#top div.wpforms-container-full .wpforms-form .wpforms-field[data-field-id="1"],
#top div.wpforms-container-full .wpforms-form .wpforms-field[data-field-id="2"],
#top div.wpforms-container-full .wpforms-form .wpforms-field[data-field-id="3"],
#top div.wpforms-container-full .wpforms-form .wpforms-field[data-field-id="4"] {
    border: 2px solid #FFE1CC;
    transform: skewX(-18deg) !important;
    margin-bottom: 30px !important;
    margin-top: 0px !important;
    background-color: #FFF1E5 !important;
    padding: 0px 15px !important;
    overflow: visible !important;
    box-shadow: 2px 2px 6px #F3F3F3 !important;
}

/* Height of contact input container */
#top div.wpforms-container-full .wpforms-form .wpforms-field[data-field-id="1"],
#top div.wpforms-container-full .wpforms-form .wpforms-field[data-field-id="2"],
#top div.wpforms-container-full .wpforms-form .wpforms-field[data-field-id="3"] {
    height: 47px !important;
}

/* Height of contact textarea container */
#top div.wpforms-container-full .wpforms-form .wpforms-field[data-field-id="4"] {
    height: 90px !important;
}

/* Style contact input */
/* NB: we have to add the type of the input here, because otherwise the style of the checkbox (which is also an input) will also be changed */
#top div.wpforms-container-full .wpforms-form input[type="text"],
#top div.wpforms-container-full .wpforms-form input[type="email"] {
    color: black !important;
    background: transparent !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0px !important;
    height: 43px !important;
    transform: skewX(18deg) !important;
}

/* Style contact textarea */
#top div.wpforms-container-full .wpforms-form textarea {
    color: black !important;
    resize: none !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    margin: 0px !important;
    height: 86px !important;
    transform: skewX(18deg) !important;
}

/* Remove border when focussing input (because of skew) */
#top div.wpforms-container-full .wpforms-form input[type="text"]:focus,
#top div.wpforms-container-full .wpforms-form input[type="email"]:focus,
#top div.wpforms-container-full .wpforms-form textarea:focus {
    border: none !important;
    outline: none !important;
}

/* Style for the submit button contianer */
#top .wpforms-submit-container {
    width: 100% !important;
    max-width: 200px !important;
    transform: skewX(-18deg);
    background-color: #EB4C51;
    -ms-transition: box-shadow 0.3s !important;
    -o-transition: box-shadow 0.3s !important;
    -moz-transition: box-shadow 0.3s !important;
    -webkit-transition: box-shadow 0.3s !important;
    transition: box-shadow 0.3s !important;
}

/* Style for the submit button */
#top .wpforms-submit {
    background: transparent !important;
    width: 100% !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    border-radius: 0px !important;
    white-space: nowrap !important;
    transform: skewX(18deg);
    font-weight: 600 !important;
    font-size: 15px !important;
}

/* Hover animation for the submit button */
#top .wpforms-submit-container:hover {
    box-shadow: 10px 10px black !important;
    opacity: 1;
}

/* Remove border when focussing button (because of skew) */
#top .wpforms-submit,
#top .wpforms-submit:focus,
#top .wpforms-submit:active {
    border: none !important;
    outline: none !important;
}

/* ------ CONTACT INPUT AND TEXTAREA PLACEHOLDER START ------ */

/* Chrome and Safari */
.wpforms-container ::-webkit-input-placeholder {
    color: rgba(0, 0, 0, 0.8) !important;
}

/* Mozilla Firefox 4 to 18 */
.wpforms-container :-moz-placeholder {
    color: rgba(0, 0, 0, 0.8) !important;
}

/* Mozilla Firefox 19+ */
.wpforms-container ::-moz-placeholder {
    color: rgba(0, 0, 0, 0.8) !important;
}

/* Internet Explorer 10-11 */
.wpforms-container :-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.8) !important;
}

/* Microsoft Edge */
.wpforms-container ::-ms-input-placeholder {
    color: rgba(0, 0, 0, 0.8) !important;
}

/* ------ CONTACT INPUT AND TEXTAREA PLACEHOLDER END ------ */


/* Style GDPR label container */
#top div.wpforms-container-full .wpforms-form .wpforms-field-gdpr-checkbox {
    padding: 5px 0px !important;
    margin-bottom: 30px !important;
}

/* Style GDPR label */
#top div.wpforms-container-full .wpforms-form .wpforms-field-gdpr-checkbox ul li .wpforms-field-label-inline,
#top div.wpforms-container-full .wpforms-form .wpforms-field-gdpr-checkbox ul li .wpforms-field-label-inline .wpforms-required-label {
    font-size: 15px !important;
    color: black !important;
    font-weight: normal !important;
}


/* Style contact field on error */
#top div.wpforms-container-full .wpforms-form .wpforms-has-error,
#top div.wpforms-container-full .wpforms-form .wpforms-has-error {
    border-color: #EB4C51 !important;
}

/* Style contact field error message */
#top div.wpforms-container-full .wpforms-form label.wpforms-error,
#top div.wpforms-container-full .wpforms-form em.wpforms-error {
    margin-top: 5px !important;
    color: #EB4C51 !important;
    font-size: 14px !important;
    font-weight: 600 !important;

}

/* Skew the contact field error message back (excluding GDPR label) */
#top div.wpforms-container-full .wpforms-field:not(.wpforms-field-gdpr-checkbox) em.wpforms-error {
    transform: skewX(18deg) !important;
}

/* Style contact field suggestion link */
#top div.wpforms-container-full .wpforms-form label.wpforms-error .mailcheck-suggestion {
    color: black !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    transform: skewX(18deg) !important;
}

/* Style contact success message */
#top .wpforms-confirmation-container-full {
    background: #E0FFC7 !important;
    border: 2px solid rgb(126, 214, 104);
    transform: skewX(-18deg) !important;
}

/* Style contact confirmation container */
#top .wpforms-confirmation-container-full p {
    color: black !important;
    transform: skewX(18deg) !important;
}

/* Style contact form submit spinner */
#top .wpforms-submit-spinner {
    position: absolute !important;
    right: 20px !important;
    top: 7px !important;
    transform: skewX(18deg) !important;
}

/* -------------------------------------------------------- MISC START -------------------------------------------------------- */

body {
    /* No important so that it can be overwritten */
    font-size: 17px;
}

#top .section-title h2,
#top .section-title h1 {
    font-weight: 900 !important;
    font-style: italic !important;
    font-family: 'inter-flex' !important;
    color: black !important;
    font-size: clamp(24px, 5.5vw, 36px) !important;
    margin-top: 20px !important;
    margin-bottom: 10px !important;
    text-wrap: balance !important;
}

/* Style for the container of the button pair */
#top .button-pair-container {
    display: flex !important;
    justify-content: center !important;
}

/* Style for the buttons of the button pair */
#top .button-pair-container a {
    width: calc(47% - 15px) !important;
    max-width: 250px !important;
    padding-left: 15px !important;
    padding-right: 15px !important;
    border-radius: 0px !important;
    white-space: nowrap !important;
    transform: skewX(-18deg);
    -ms-transition: box-shadow 0.3s !important;
    -o-transition: box-shadow 0.3s !important;
    -moz-transition: box-shadow 0.3s !important;
    -webkit-transition: box-shadow 0.3s !important;
    transition: box-shadow 0.3s !important;
}

/* Style for the button text of the button pair */
#top .button-pair-container span {
    display: inline-block;
    transform: skewX(18deg);
    font-weight: 600 !important;
    margin-left: 3px !important;
    margin-right: 3px !important;
    font-size: 15px !important;
}

/* Hover animation for the buttons in the button pair */
#top .button-pair-container a:hover {
    box-shadow: 10px 10px black !important;
    opacity: 1;
}

/* Style for title of share buttons */
#top .share-buttons-container .av-share-link-description {
    font-weight: 700 !important;
    font-size: clamp(18px, 4vw, 22px) !important;
    text-transform: none !important;
    text-align: center !important;
    margin-bottom: 25px !important;
}

/* Hide share button tool tip */
#top .share-buttons-container .avia-related-tooltip {
    display: none !important;
}

/* Show overflow of share buttons list */
#top .share-buttons-container .av-share-box-list {
    overflow: visible;
}

/* Resize share buttons */
#top .share-buttons-container .av-share-box ul li {
    border-left-style: none !important;
    display: inline-flex !important;
    vertical-align: middle !important;
}

/* Style for share buttons */
#top .share-buttons-container .av-share-link a {
    padding: 8px 0px 0px 0px !important;
    width: 55px !important;
    height: 50px !important;
    border-radius: 0px !important;
    font-size: 16px !important;
    transform: skew(-18deg) !important;
    -ms-transition: box-shadow 0.3s !important;
    -o-transition: box-shadow 0.3s !important;
    -moz-transition: box-shadow 0.3s !important;
    -webkit-transition: box-shadow 0.3s !important;
    transition: box-shadow 0.3s !important;
}

/* Hover animation for the share buttons */
#top .share-buttons-container .av-share-link a:hover {
    box-shadow: 6px 6px black !important;
    opacity: 1;
}

/* Style for share button labels */
#top .share-buttons-container .av-share-link a::before {
    transform: skew(18deg) !important;
    display: inline-block !important;
}

/* Skew for the scroll back to top button */
#top #scroll-top-link {
    transform: skew(-18deg) !important;
    border: 2px solid #FFE1CC !important;
    background-color: #FFF1E5 !important;
}

/* Reset skew for the icon of the scroll back to top button */
#top #scroll-top-link svg {
    transform: skew(18deg) !important;
}

/* Hover animation for the share buttons */
#top #scroll-top-link:hover {
    box-shadow: 6px 6px black !important;
    opacity: 1;
    border: 2px solid #FFE1CC !important;
    background-color: #FFF1E5 !important;
}

/* Style for social header and footer button containers */
#top .avia_social_iconfont,
#top .social_bookmarks {
    overflow: visible !important;
}

/* Style for social header and footer buttons */
#top .avia_social_iconfont a {
    transform: skew(-18deg) !important;
    border-radius: 0px !important;
}

/* Style for social header and footer button labels */
#top .avia_social_iconfont a::before {
    transform: skew(18deg) !important;
    display: inline-block !important;
}

/* Style of animated number */
#top .animated-number-container span {
    font-weight: 900 !important;
    font-style: italic !important;
    font-family: 'inter-flex' !important;
    color: #EB4C51 !important;
}

/* Style of animated number caption */
#top .animated-number-container p {
    font-weight: bold !important;
    font-size: 17px !important;
}

/* -------------------------------------------------------- MISC END -------------------------------------------------------- */

/* --------------------------------------------------- LANDING SECTION START --------------------------------------------------- */

/* Style for the title of the landing section */
#top .landing-title-container h1 {
    font-weight: 900 !important;
    font-style: italic !important;
    font-family: 'inter-flex' !important;
    text-align: left !important;
    letter-spacing: 3px !important;
    overflow: visible;
}

/* Remove visual border bug for the title due to the visible overflow */
#top .landing-title-container h1 span {
    border: 0px transparent !important;
}

/* Style for the subtitle of the landing section */
#top .landing-title-container p {
    font-weight: 600 !important;
    text-align: left !important;
}

/* Style for the image of the landing section */
#top .landing-image-container img {
    max-height: 775px !important;
    max-width: none !important;
    width: auto !important;
    /* Hides title tooltip */
    pointer-events: none !important;
}

/* --------------------------------------------------- LANDING SECTION END --------------------------------------------------- */

/* --------------------------------------------------- ICONBOX SECTION START --------------------------------------------------- */

/* Style for the iconbox */
#top .iconbox-container .iconbox_content {
    padding: 40px 20px 15px 20px !important;
    transform: skewX(-18deg) !important;
    background-color: #fff1e5 !important;
    border: 2px solid #ffe1cc;
    box-shadow: 2px 2px 6px #F3F3F3 !important;
    width: 100% !important;
}

/* Undo the skew for the content of the iconbox */
#top .iconbox-container .iconbox_icon svg,
#top .iconbox-container .iconbox_content_title,
#top .iconbox-container .iconbox_content_container {
    transform: skewX(18deg) !important;
}

/* Style for the iconbox title */
#top .iconbox-container .iconbox_content_title {
    font-weight: 700 !important;
    font-size: clamp(18px, 4vw, 22px) !important;
    text-transform: none !important;
}

/* Ensure that the iconbox text does not break on single words in the next line */
#top .iconbox-container .iconbox_content_container {
    text-wrap: balance !important;
}

/* Move icon of iconbox slightly to the left */
#top .iconbox-container .iconbox_icon {
    padding: 12px 10% !important;
    border-radius: 0px !important;
    left: 40% !important;
    font-size: 24px !important;
}

/* --------------------------------------------------- ICONBOX SECTION END --------------------------------------------------- */

/* --------------------------------------------------- ABOUT ME SECTION END --------------------------------------------------- */

/* Style for the image of the about me section */
#top .about-me-image-container img {
    /* Hides title tooltip */
    pointer-events: none !important;
}

/* --------------------------------------------------- ABOUT ME SECTION END --------------------------------------------------- */


/* --------------------------------------------------- INDIVIDUAL PLAN SECTION START --------------------------------------------------- */

/* Style for the image of the individual plan section */
#top .individual-plan-image-container img {
    /* Hides title tooltip */
    pointer-events: none !important;
}

/* Remove bottom margin of image of the individual plan section */
#top .individual-plan-image-wrapper {
    margin-bottom: 0px !important;
}

/* --------------------------------------------------- INDIVIDUAL PLAN SECTION END --------------------------------------------------- */

/* --------------------------------------------------- GROUP CLASSES SECTION START --------------------------------------------------- */

/* Style for the image of the group classes section */
#top .group-classes-image-container img {
    /* Hides title tooltip */
    pointer-events: none !important;
}

/* Remove bottom margin of image of the group classes section */
#top .group-classes-image-wrapper {
    margin-bottom: 0px !important;
}

/* --------------------------------------------------- GROUP CLASSES SECTION END --------------------------------------------------- */

/* ---------------------------------------------------CLASSES SECTION START --------------------------------------------------- */


/* Style for classes list item */
.classes-list-container li {
    margin-bottom: 35px !important;
    margin-left: 5px !important;
    margin-right: 5px !important;
}

/* Style for content wrapper of classes list item */
.classes-list-container .iconlist_content_wrap {
    overflow: visible;
    width: 100% !important;
}

/* Stlye for header of classes list item */
.classes-list-container .entry-content-header {
    background: #EB4C51 !important;
    transform: skew(-18deg) !important;
    font-weight: bold !important;
    padding-left: 2.35em !important;
    padding-right: 0.5em !important;
    box-shadow: 0 1px 5px 1px #00000014;
}

/* Style for header content of classes list item */
.classes-list-container .entry-content-header>div {
    line-height: 1.65em !important;
    vertical-align: middle !important;
    transform: skew(18deg) !important;
    color: white !important;
}

/* Style of text container of classes list item */
.classes-list-container .iconlist_content {
    background: white !important;
    margin: 0 1.7em !important;
    box-shadow: 0 1px 5px 1px #00000014;
}

/* Style of text of classes list item */
.classes-list-container .iconlist_content p {
    color: black !important;
    margin-top: 0px !important;
    padding: 0.25em 0.65em !important;
}

/* Style for icon container of classes list item */
.classes-list-container .iconlist_icon {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    border-radius: 0px !important;
    width: 2em !important;
    height: 1.65em !important;
    line-height: 1.65em !important;
}

/* Style for icon of classes list item */
.classes-list-container .iconlist_icon svg {
    color: white !important;
    fill: white !important;
    margin-top: 0.3em !important;
}

/* --------------------------------------------------- CLASSES SECTION END --------------------------------------------------- */

/* ---------------------------- SMARTPHONE PORTRAIT & SMARTPHONE LANDSCAPE & TABLET PORTRAIT START ---------------------------- */

@media only screen and (max-width: 989px) {

    /* ----- HEADER START ----- */

    /* Make the header sticky */
    .responsive #top #wrap_all #header {
        position: fixed !important;
        box-shadow: 0 2px 1px rgba(0, 0, 0, .1)
    }

    /* ----- HEADER END ----- */

    /* ----- ICONBOX SECTION START ----- */

    /* Style for the iconbox */
    #top .iconbox-container {
        padding-left: 7% !important;
        padding-right: 7% !important;
        margin-top: 45px !important;
    }

    /* Reduce space between text and iconboxes */
    #top #iconbox-section .av-equal-height-column-flextable {
        margin: 0px !important;
    }

    /* ----- ICONBOX SECTION END ----- */

    /* ----- LANDING SECTION START ----- */

    /* Style for the title and subtitle of the landing section */
    #top .landing-title-container h1,
    #top .landing-title-container p {
        text-align: center !important;
    }

    /* Style for the image container of the landing section */
    #top .landing-image-container .avia-image-overlay-wrap {
        display: flex !important;
        justify-content: center !important;
        align-items: flex-start !important;
    }

    /* Style for the image of the landing section */
    #top .landing-image-container img {
        height: auto !important;
    }

    /* Hide the overflow of the image in the landing section */
    #top .landing-container {
        overflow: hidden;
    }

    /* ----- LANDING SECTION END ----- */


    /* ----- ABOUT ME SECTION START ----- */


    /* Style for the image of the about me section */
    #top .about-me-image-container .avia-image-overlay-wrap {
        /* Necessary to take max-width and not max-height */
        max-width: 550px !important;
        min-width: 150px !important;
    }

    /* ----- ABOUT ME SECTION END ----- */


    /* ----- INDIVIDUAL PLAN SECTION START ----- */

    /* Style for the image of the individual plan section */
    #top .individual-plan-image-container .avia-image-overlay-wrap {
        /* Necessary to take max-width and not max-height */
        max-width: 550px !important;
        min-width: 150px !important;
    }

    /* ----- INDIVIDUAL PLAN SECTION END ----- */

    
    /* ----- GROUP CLASSES SECTION START ----- */

    /* Style for the image of the group classes section */
    #top .group-classes-image-container .avia-image-overlay-wrap {
        /* Necessary to take max-width and not max-height */
        max-width: 550px !important;
        min-width: 150px !important;
    }

    /* ----- IGROUP CLASSES SECTION END ----- */

    /* ----- BOOKING MODULE START ----- */

    /* Align time buttons in center */
    #top .wpbc_times_selector {
        justify-content: center !important;
    }

    /* ----- BOOKING MODULE END ----- */
}

/* ---------------------------- SMARTPHONE PORTRAIT & SMARTPHONE LANDSCAPE & TABLET PORTRAIT END ---------------------------- */

/* ------------------------------------- SMARTPHONE PORTRAIT & SMARTPHONE LANDSCAPE START ------------------------------------- */

@media only screen and (max-width: 767px) {

    /* ----- HEADER START ----- */

    /* Height of sticky header */
    .responsive #top #header_main>.container .main_menu .av-main-nav>li>a,
    .responsive #top #wrap_all .av-logo-container,
    .responsive #top #wrap_all .main_menu,
    .responsive #top .logo {
        height: 65px !important;
        line-height: 65px !important
    }

    /* Max height of logo in sticky header */
    .responsive .logo img {
        max-height: 45px !important;
    }

    /* Top padding making space for the header on the landing section */
    #top .landing-container .av-section-cont-open {
        padding-top: 125px !important;
    }

    /* ----- HEADER END ----- */

    /* ----- MISC START ----- */

    #top .animated-number-container {
        margin-top: 20px !important;
    }

    /* ----- MISC END ----- */

    /* ----- BOOKING START ----- */
    /* Style of message when no available times exist for selected date */
    #top .wpbc_no_time_pickers {
        margin: 0px !important
    }

    /* ----- BOOKING END ----- */
}

/* ------------------------------------- SMARTPHONE PORTRAIT & SMARTPHONE LANDSCAPE START ------------------------------------- */

/* --------------------------------------------------- SMARTPHONE PORTRAIT START --------------------------------------------------- */

@media only screen and (max-width: 479px) {
    /* ----- MISC START ----- */

    /* Style for the buttons in the button pair */
    #top .button-pair-container a {
        min-width: 100px !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
    }

    /* Style for the buttons in the button pair */
    #top .button-pair-container a:first-child {
        margin-right: 20px !important;
    }

    /* Hide icon of the buttons in the button pair for smartphone portrait */
    #top .button-pair-container a span:first-child {
        display: none !important;
        margin: 0px !important;
    }

    /* margin of share icons */
    #top .share-buttons-container .av-share-box ul li {
        width: 25% !important;
        justify-content: center !important;
    }

    /* margin of share icons */
    #top .share-buttons-container .av-share-link a {
        margin: 0px 5px 0px 5px !important;
    }


    /* ----- MISC END ----- */

    /* ----- LANDING SECTION START ----- */

    /* Font size for the title of the landing section */
    #top .landing-title-container h1 {
        font-size: clamp(25px, 8vw, 45px) !important;
    }

    /* Max height of the image container of the landing section */
    #top .landing-image-container .avia-image-overlay-wrap {
        max-height: 300px !important;
    }

    /* Width of the image of the landing section */
    #top .landing-image-container img {
        min-width: max(100%, 350px) !important;
        max-width: none !important;
        margin-right: 2% !important;
    }

    /* ----- LANDING SECTION END ----- */
}

/* --------------------------------------------------- SMARTPHONE PORTRAIT END --------------------------------------------------- */


/* --------------------------------------------------- SMARTPHONE LANDSCAPE START --------------------------------------------------- */

@media only screen and (min-width: 480px) and (max-width: 767px) {
    /* ----- MISC START ----- */

    /* margin of share icons */
    #top .share-buttons-container .av-share-link a {
        margin: 0px 20px 0px 20px !important;
    }

    /* ----- MISC END ----- */


    /* ----- LANDING SECTION START ----- */

    /* Font size for the title of the landing section */
    #top .landing-title-container h1 {
        font-size: clamp(40px, 8.5vw, 60px) !important;
    }

    /* Max height of the image container of the landing section */
    #top .landing-image-container .avia-image-overlay-wrap {
        max-height: 400px !important;
    }

    /* Width of the image of the landing section */
    #top .landing-image-container img {
        min-width: max(95%, 450px) !important;
        max-width: none !important;
        margin-right: 1% !important;
    }

    /* ----- LANDING SECTION END ----- */
}

/* --------------------------------------------------- SMARTPHONE LANDSCAPE START --------------------------------------------------- */


/* --------------------------------------------------- TABLET PORTRAIT START --------------------------------------------------- */

@media only screen and (min-width: 768px) and (max-width: 989px) {

    /* ----- HEADER START ----- */

    /* Height of sticky header */
    .responsive #top #header_main>.container .main_menu .av-main-nav>li>a,
    .responsive #top #wrap_all .av-logo-container,
    .responsive #top #wrap_all .main_menu,
    .responsive #top .logo {
        height: 90px !important;
        line-height: 90px !important
    }

    /* Max height of logo in sticky header */
    .responsive .logo img {
        max-height: 70px !important;
    }

    /* Align header logo in center */
    #top #header .logo a {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    /* Top padding making space for the header on the landing section */
    #top .landing-container .av-section-cont-open {
        padding-top: 150px !important;
    }

    /* ----- HEADER END ----- */

    /* ----- MISC START ----- */

    /* margin of share icons */
    #top .share-buttons-container .av-share-link a {
        margin: 0px 25px 0px 25px !important;
    }

    /* ----- MISC END ----- */

    /* ----- LANDING SECTION START ----- */

    /* Font size for the title of the landing section */
    #top .landing-title-container h1 {
        font-size: clamp(48px, 7.5vw, 67px) !important;
    }

    /* Max height of the image container of the landing section */
    #top .landing-image-container .avia-image-overlay-wrap {
        max-height: 450px !important;
    }

    /* Width of the image of the landing section */
    #top .landing-image-container img {
        width: 80% !important;
    }

    /* ----- LANDING SECTION END ----- */

    /* ----- BOOKING MODULE START ----- */

    /* Add horizontal spacing between inputs on the same line for desktop */
    .wpbc_wizard_step2 .wpbc__field {
        padding: 0 !important;
        margin-right: 3% !important;
    }

    /* Remove spacing for last element */
    .wpbc_wizard_step2 .wpbc__field:last-child {
        margin-right: 0 !important;
    }

    /* ----- BOOKING MODULE END ----- */
}

/* --------------------------------------------------- TABLET PORTRAIT END --------------------------------------------------- */


/* --------------------------------------------------- TABLET LANDSCAPE AND DESKTOP START --------------------------------------------------- */

@media only screen and (min-width: 990px) {

    /* ----- HEADER START ----- */

    /* Max height of logo in sticky header */
    .responsive .logo img {
        max-height: 60px !important;
    }

    /* Align header logo in center */
    #top #header .logo a {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    /* Bring sub menu closer to navigation item */
    #top .sub-menu {
        margin-top: -20px !important;
    }

    /* add underline of currently selected header menu item */
    #top .main_menu ul:first-child>li.current-menu-item>a .avia-menu-text {
        color: #EB4C51 !important;
    }

    /* ----- HEADER END ----- */

    /* ----- MISC START ----- */

    /* margin of share icons */
    #top .share-buttons-container .av-share-link a {
        margin: 0px 10px 0px 10px !important;
    }

    /* ----- MISC END ----- */

    /* ----- LANDING SECTION START ----- */

    /* Font size of the title of the landing section */
    #top .landing-title-container h1 {
        font-size: clamp(48px, 4.5vw, 67px) !important;
    }

    /* Height of the image of the landing section */
    #top .landing-image-container img {
        height: max(550px, calc(96.5vh - 110px)) !important;
        margin-left: 10px !important;
    }

    /* Align the content of the landing section to the bottom */
    #top .landing-container main {
        vertical-align: bottom !important;
    }

    /* ----- LANDING SECTION END ----- */

    /* ----- ICONBOX SECTION START ----- */

    /* Ensure that all iconboxes have the same height */
    #top #iconbox-section .av-equal-height-column-flextable {
        display: flex !important;
        margin: 0px !important;
    }

    /* Ensure that all iconboxes have the same height */
    #top #iconbox-section .av-equal-height-column-flextable .av_one_third {
        display: flex !important;
        flex: 1 !important;
        flex-direction: column !important;
        margin-top: 30px !important;
        margin-bottom: 10px !important;
    }

    /* Ensure that all iconboxes have the same height */
    #top .iconbox-container {
        display: flex !important;
        flex: 1 !important;
    }

    /* ----- ICONBOX SECTION END ----- */

    /* ----- ABOUT ME SECTION START ----- */

    /* Style for the image container of the about me section */
    #top .about-me-image-container .avia-image-overlay-wrap {
        display: flex !important;
        justify-content: flex-end !important;
        align-items: flex-start !important;
    }

    /* Height of the image of the about me section */
    #top .about-me-image-container img {
        height: 625px !important;
        max-width: none !important;
        width: auto !important;
    }

    /* ----- ABOUT ME SECTION END ----- */

    /* ----- INDIVIDUAL PLAN SECTION START ----- */

    /* Height of the image of the individual plan section */
    #top .individual-plan-image-container img {
        height: 625px !important;
        max-width: none !important;
        width: auto !important;
    }

    /* ----- INDIVIDUAL PLAN SECTION END ----- */

    /* ----- GROUP CLASSES SECTION START ----- */

    /* Height of the image of the group classes section */
    #top .group-classes-image-container img {
        height: 675px !important;
        max-width: none !important;
        width: auto !important;
    }

    /* ----- GROUP CLASSES SECTION END ----- */

    /* ----- BOOKING MODULE START ----- */

    /* Add horizontal spacing between inputs on the same line for desktop */
    .wpbc_wizard_step2 .wpbc__field {
        padding: 0 !important;
        margin-right: 3% !important;
    }

    /* Remove spacing for last element */
    .wpbc_wizard_step2 .wpbc__field:last-child {
        margin-right: 0 !important;
    }

    /* Hover animation for the submit button */
    #top .wpbc_button_light:hover::before {
        box-shadow: 10px 10px black !important;
        opacity: 1;
    }

    /* ----- BOOKING MODULE END ----- */

}

/* --------------------------------------------------- TABLET LANDSCAPE AND DESKTOP END --------------------------------------------------- */