:root {
    --content-font-size: 18px;
    --font-sans: Raleway, "Helvetica Neue", sans-serif;
    --color-primary-text: #ffffff;
    --content-width: 1120px;
    /*--factor: 0.9rem;*/
    /*--container-width: 1600px;*/
    /*--content-width: 1120px;*/
    /*--ghost-accent-color: #2465C8;*/
    /*--color-darker-gray: #333;*/
    /*--color-light-gray: #666;*/
    /*--color-gray: #999;*/
    /*--color-light-blue: #0070f3;*/
    /*--color-blue: #0050b3;*/
    /*--color-dark-blue: #003063;*/
    /*--color-white: #fff;*/
    /*--color-black: #000;*/
    /*--v-theme-background: gray;*/
}



.svg-container svg{ fill: white }

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-weight: normal;
    font-style: normal;
    scroll-behavior: smooth;
}


a {
    color: var(--color-primary-text) !important;
}

p {
    margin: 0 0 20px 0;
}

.is-body {
    margin-top: 100px;
}

@media (max-width: 600px) {
    .is-body {
        margin-top: 60px;
    }
}

.page-template .gh-article-header {
    margin-block: 4px 32px;
}

.gh-article-title {
    font-size: calc(1vw + 1.5rem);
}

.gh-article-image {
    grid-column: main;
}

.gh-content :is(hr,blockquote,iframe) {
    margin-top: calc(48px* 1) !important;
    position: relative;
}

.gh-navigation-logo img {
    max-height: 50px;
}


.v-btn--variant-elevated, .v-btn--variant-flat {
    background: var(--ghost-accent-color) !important;
    color: var(--color-white) !important;
}

/* grid style Higlight */

.gh-header.is-highlight .gh-header-middle {
    grid-column: 12 / span 5;
}

.gh-header.is-highlight .gh-header-left {
    grid-column: span 11;
}

/* is-sticky-transparent
   see: partials/components/navigation.vue
*/

.is-sticky-transparent:not(.is-open) {
    background-color: rgba(0, 0, 0) !important;
}

.is-sticky-transparent{
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    top: 0;
    z-index: 9999;
}
/* See: default.hbs script onscroll */
.is-sticky-transparent.sticky {
    background-color: rgba(0, 0, 0, 0.50) !important;
    position: fixed;
    top: 0;
    width: 100%;
    transform: translateY(-5px);
    transition: transform 800ms ease, background 800ms ease;
    -webkit-transition: transform 800ms ease, background 800ms ease;
}

.gh-article-header {
    margin: 0;
}

.gh-viewport > .gh-main {
    /*margin-top: 64px;*/
}

.gh-navigation {
    color: var(--color-white);
    font-weight: 700;
    font-size: larger;
    height: 100px;
}

.gh-navigation :is(.gh-navigation-logo,a:not(.gh-button),.gh-icon-button) {
    color: var(--color-white);
}

@media (max-width: 767px) {
    .gh-burger {
        display: flex;
    }
    .gh-navigation {
        color: var(--color-black);
        font-size: x-large;
    }
}


@media (max-width: 767px) {
    #gh-navigation .nav a {
        font-size: 32px !important;
    }
}




.gh-navigation-actions {
    background-color: transparent;
}

.gh-navigation :is(.gh-navigation-logo,a:not(.gh-button),.gh-icon-button) :not(.is-fixed) {
    color: var(--color-white);
}

.gh-navigation:is(.is-fixed) {
    color: var(--color-white);
    /*color: black;*/
}

.v-window__controls button {
    color: white;
    font-size: 1.5rem;
    background: var(--background-color);
}

.gh-card-wrapper {
   padding: 1rem;
    /*background-color: var(--color-white);*/
}

.gh-navigation-inner {
    max-width: var(--container-width);
}

.gh-container-inner {
    grid-template-columns: repeat(1, 1fr);
}

/*Dialog*/
.v-card--variant-elevated, .v-card--variant-flat {
    background: var(--color-white);
}


.btn-booking a:link, .btn-booking a:visited {
    background-color: var(--ghost-accent-color);
    border-radius: 10px;
    color: white;
    padding: 5px 15px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
}

.btn-booking a:hover, .btn-booking a:active {
   opacity: 0.8;
}

img {
    border-radius: 5px;
}

.page-booking .gh-article-title.is-title {
    display: none;
}

.gh-header.is-highlight .gh-header-middle .gh-card .gh-card-excerpt, .gh-header.is-highlight .gh-header-middle .gh-card:last-child .gh-card-image {
    display: block;
}

.top-image {
    background-size: cover;
    height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.top-image div {
    color:  black;
    font-size: 64px;
    font-weight: 400;
    margin: 20px;
}

.tag-top-features .top-image div {
    color: var(--color-white);
}

.top-text {
    font-size: 1.5em;
    color: var(--color-white);
    height: inherit;
    display: flex;
    align-items: center;
    justify-content: center;
}

#responsemsg {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: xx-large;
    height: auto;
    margin-top: 5rem;
}
