/***************************************************
    MEDIA QUERIES for Mare Mons
    Author: WEB Marketing (www.wem.hr)
    Media: Screen
***************************************************/

.touch .gallery-slider { display: none; }
.touch .gallery-flex { display: block; }
.flex-direction-nav { display: block; margin: 0; padding: 0; }
.flex-direction-nav li:before { display: none; }

@media screen and (max-width: 1230px) and (min-width: 960px) {
#language { font-size: 12px; line-height: 18px; }
/*.slide-content { left: 30px !important; margin: 0 !important; }*/
#pageMessage { padding-left: 30px; padding-right: 30px; }

/*.wrap { width: 940px; }*/
.booking-main { padding-left: 10px; padding-right: 10px; }
/*.slide-content { padding-left: 257px; }*/

.bselect.select select,
.binput.input input { font-size: 12px; }
.inner .bselect.select select:first-child { width: 160px; }
.inner .bmselect.select select.bday,
.inner .bmselect.select select.bmonth,
.inner .bmselect.select select.byear { width: 70px; }

#pageHeader,
#pageContainer,
#pageMessage,
#secContainer,
#pageFooter, 
.booking { padding-left: 10px; padding-right: 10px; }

#menu > li { font-size: 13px; }
#menu > li > a { padding: 0 8px; }
#menu > li.sub > a { padding-right: 25px; }

.inner .bres { clear: both; }

}

@media screen and (max-width: 1100px) and (min-width: 960px) {
#language { font-size: 12px; line-height: 18px; }
/*.slide-content { left: 30px !important; margin: 0 !important; }*/
#pageMessage { padding-left: 30px; padding-right: 30px; }
}

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

    .home-intro {
        text-align: center;
        line-height: 1.6;
        font-size: 16px;
        margin: 0 auto 30px;
    }

    .home-slider {
        margin-top: -80px;
    }
/*.wrap { max-width: 728px; }*/
.tablet-hide { display: none; } 
.pc-hide { display: block; }

.tablet-c1  { width:   1.709401709401709% !important; }
.tablet-c2  { width:   5.982905982905982% !important; }
.tablet-c3  { width:  10.25641025641026% !important; }
.tablet-c4  { width:  14.52991452991453% !important; }
.tablet-c5  { width:  18.8034188034188% !important; }
.tablet-c6  { width:  23.07692307692307% !important; }
.tablet-c7  { width:  27.35042735042735% !important; }
.tablet-c8  { width:  31.62393162393162% !important; }
.tablet-c9  { width:  35.89743589743589% !important; }
.tablet-c10 { width:  40.17094017094017% !important; }
.tablet-c11 { width:  44.44444444444444% !important; }
.tablet-c12 { width:  48.71794871794871% !important; }
.tablet-c13 { width:  52.99145299145299% !important; }
.tablet-c14 { width:  57.26495726495726% !important; }
.tablet-c15 { width:  61.53846153846153% !important; }
.tablet-c16 { width:  65.8119658119658% !important; }
.tablet-c17 { width:  70.08547008547008% !important; }
.tablet-c18 { width:  74.35897435897435% !important; }
.tablet-c19 { width:  78.63247863247862% !important; }
.tablet-c20 { width:  82.9059829059829% !important; }
.tablet-c21 { width:  87.17948717948717% !important; }
.tablet-c22 { width:  91.45299145299144% !important; }
.tablet-c23 { width:  95.72649572649572% !important; }
.tablet-c24 { width: 100% !important; margin-right: 0 !important; }

/*** GRID - sub cols ***/
.col .col, 
.col .col .col   { margin-right: 2.564102564102564%; }
.col .tablet-c1  { width:   1.709401709401709%; }
.col .tablet-c2  { width:   5.982905982905982%; }
.col .tablet-c3  { width:  10.25641025641026%; }
.col .tablet-c4  { width:  14.52991452991453%; }
.col .tablet-c5  { width:  18.8034188034188%; }
.col .tablet-c6  { width:  23.07692307692307%; }
.col .tablet-c7  { width:  27.35042735042735%; }
.col .tablet-c8  { width:  31.62393162393162%; }
.col .tablet-c9  { width:  35.89743589743589%; }
.col .tablet-c10 { width:  40.17094017094017%; }
.col .tablet-c11 { width:  44.44444444444444%; }
.col .tablet-c12 { width:  48.71794871794871%; }
.col .tablet-c16 { width:  65.8119658119658%; }


/*** NAVIGATION ***/
#navigation { display: none; }

body { padding-top: 80px; }
#pageHeader { position: fixed; top: 0; left: 0; width: 100%; height: 80px; z-index: 5000; background: url(../images/css/body-bg.jpg) repeat 0 0; }
#logo { margin-left: 70px; width: 160px; height: 45px; padding-top: 15px; }
#logo a { width: 160px; height: 45px; background-image: url(../images/css/logo-mob.png); }

#pageHeader .wrap { position: relative; padding: 0; }
.menu-switch { position: absolute; top: 8px; left: 0; width: 60px; height: 60px; overflow: hidden; text-indent: -9999px; background: url(../images/css/mob-menu-switch.png) no-repeat 0 0; cursor: pointer; }
.menu-open .menu-switch { background-position: 0 -60px; }

    .mob-nav {
        position: fixed;
        top: 0;
        left: 0;
        width: 260px;
        height: auto;
        min-height: 100%;
        height: 100%;
        overflow-y: auto;
        padding: 10px;
        background: rgba(23, 48, 97, 1);
        z-index: 9999;
        display: none;
    }

#mobmenu { margin: 0; padding: 0 0 10px; width: 100%; }
#mobmenu ul { margin: 0; padding: 0; }
#mobmenu li { padding: 0; font-family: open_sansbold; text-transform: uppercase; }
#mobmenu a { display: block; text-decoration: none; color: #fff; line-height: normal; padding: 15px 10px; min-height: 50px; }
#mobmenu .sub > a { position: relative; padding-right: 46px; }
#mobmenu .sub > a span { position: absolute; top: 5px; right: 0; width: 36px; height: 36px; background: url(../images/css/mob-menu-arrow.png) no-repeat 0 0; }
#mobmenu .open > a span { background-position: 0 -36px; }

    #mobmenu > li {
        background: rgba(23, 48, 97, 1);
        margin-bottom: 1px;
    }
#mobmenu > li:last-child { margin-bottom: 0; }

#mobmenu > li.open, 
#mobmenu > li.on { background: #1b75bb; }

#mobmenu ul li.open, 
#mobmenu ul li.on { background: #272727; }

#mobmenu ul ul li.open, 
#mobmenu ul ul li.on { background: #242424; }

#mobmenu ul { display: none; padding: 0 10px 10px 10px; }
#mobmenu .open > ul { display: block; }

body { overflow: hidden; }
.menu-open .wrap { position: relative; left: 260px; margin-left: 0; }
.menu-open #pageHeader { z-index: 9998; }
.menu-open .mob-nav { display: block; }

#language { position: static; font-size: 12px; }
#language li { margin: 0; padding: 0; border: 0; float: none; }
.language  { position: absolute; top: 0; right: 0; width: 60px; height: 60px; margin: 0; padding: 0; z-index: 5000; font-size: 12px; overflow: visible; border: 0; }
.language .switch { display: block; width: 60px; height: 60px; overflow: hidden; padding: 0; line-height: 60px; cursor: pointer; position: relative; text-align: center; color: #fff !important; }
.language .switch span {
    position: absolute;
    bottom: 10px;
    left: 50%;
    margin-left: -5px;
    width: 10px;
    height: 6px;
    overflow: hidden;
    background: url(../images/css/menu-arrow-hover.png) no-repeat 0 0;
}
.language.open { height: auto; color: #000!important; }
    .language.open .switch {
        background-color: #fff;
        color: #000 !important;
    }

.language .panel { display: none; position: absolute; top: 60px; right: 0; font-size: 12px; }
.language.open .panel { display: block; }
.language ul { float: none; display: block; padding: 0; border-top: 1px solid #c9c9c9; }
.language ul li { float: none !important; display: block !important; border: 0 !important; border-bottom: 1px solid #c9c9c9 !important; margin: 0 !important; padding: 0 !important; background-color: #fff; background-repeat: no-repeat; background-position: 5px 50%; }
.language ul a { display: block; padding: 7px 14px 7px 24px; text-decoration: none; color: #173061!important; }
.language ul a:hover { color: #d4a97d !important; text-decoration: underline; }
.language li.active { display: none !important; }
.language ul li#hr { background-image: url(../images/css/hr.png); }
.language ul li#en { background-image: url(../images/css/en.png); }
.language ul li#de { background-image: url(../images/css/de.png); }
.language ul li#it { background-image: url(../images/css/it.png); }
.language ul li#ru { background-image: url(../images/css/ru.png); }

/*** BOOKING ***/
.booking { background: #d9c04f; }
.booking .wrap { height: auto; background: #d9c04f; }
.booking-main { position: static; background: 0; padding-top: 0 !important; padding-bottom: 0 !important; }

.booking .switch { padding: 12px 0; line-height: normal; cursor: pointer; text-align: center; margin: 0; }
.booking .switch:after { display: inline-block; content:""; width: 10px; height: 6px; overflow: hidden; background: url(../images/css/menu-arrow.png) no-repeat 0 0; margin: 0 0 0 5px; vertical-align: middle; }

.booking .panel { padding: 0 0 20px; display: none; }
.booking.open .panel { display: block; }

.inner .bselect.select,
.inner .booking-cols,
.inner .bcheck { float: none; width: 100%; clear: both; margin-right: 0; margin-bottom: 20px; }
.inner .bmselect { clear: both; overflow: hidden; }
.inner .bmselect.select,
.inner .booking-cols { margin-top: 0; }
.inner .bcheck { border: 0; padding: 0; margin: 20px 0; }
.inner .bselect.select select:first-child { width: 100%; }
.inner .bmselect.select select.bday { width: 32%; }
.inner .bmselect.select select.bmonth { width: 32%; margin: 0 2%; }
.inner .bmselect.select select.byear { width: 32%; }
.inner .booking-cols .bselect.select,
.inner .booking-cols .binput.input { float: none; clear: both; width: 100%; }

/*** GLOBAL & Typ ***/
h1 { margin-bottom: 30px; }
h2, h3, h4, h4, h5, h6 { margin-top: 30px; margin-bottom: 15px; }
p, ul, ol, blockquote { margin-top: 20px; margin-bottom: 20px; }
p + ul, 
p + ol { margin: -10px 0 20px 0; }
blockquote { padding: 0; }
hr { margin: 30px 0; }
.table-wrapper-outer { margin: 20px 0; }
.video-wrapper, 
.googlemaps-wrapper { margin-top: 20px; margin-bottom: 20px; padding: 20px; width: 100% !important; }
.media-left, 
.media-right, 
.media-center { display: block; float: none; margin-left: 0; margin-right: 0; width: 100% !important; }

.intro, 
.content, 
.side-content, 
.content-footer, 
.gallery { margin-bottom: 30px; }
.content-footer { margin-top: 30px; } 

/*** LAYOUT ***/
#pageHeader,
#pageContainer,
#secContainer,
#pageMessage,
#pageFooter, 
.booking { padding-right: 20px; padding-left: 20px; }
#pageContainer { padding-bottom: 50px; }
.path { margin-bottom: 40px; }
.print { display: none; }
.share-header { margin-top: -20px; margin-bottom: 30px;  }
.share-footer { margin-top: 30px; padding-top: 0; border-top: 0; }
#impressum p { float: none !important; }
#pageMessage { font-size: 24px; line-height: 30px; padding-top: 100px; padding-bottom: 100px; }
#pageFooter h3 { margin-top: 10px !important; }
.contact-info { left: 250px; top: 10px; font-size: 15px; }

/*** Display flex slider, hide default gallery ***/
.gallery-slider { display: none !important; }
.gallery-flex { display: block !important; }

/*** HOME ***/
    .slide-image, .header-video {
        height: auto;
    }

        .slide-image img{
            height: 400px;
            object-fit: cover;
        }
    .slide-content {
        position: static !important;
        margin: 0 !important;
        font-size: 16px;
        transform: none;
        background: rgba(23, 48, 97, 1);
        width: 100%;
        max-width: none;
        padding: 10px;
        font-family: open_sansregular;
    }
    .slide-content h2 a {
        font-size: 24px;
        line-height: 32px;
    }
    .flex-control-paging {
        bottom: -30px;
        right: 50%;
        transform: translateX(50%);
    }

        .flex-control-paging li {
            padding: 5px;
        }

    .page-home #pageContainer {
        padding-top: 30px;
    }
.home-box:nth-child(3n) { margin-right: 0; }
.home-box:nth-child(3n+1) { clear: left; }

.home-content { margin-bottom: -30px !important; }
.home-box { margin-bottom: 30px !important; }

.home-box img, .sec-image img { display: block; max-width: none; width: 100%; }

.sec-box { margin-bottom: 20px; }
.sec-box:nth-child(2n),
.footer-box:nth-child(2n) { margin-right: 0; }

/*** FORMS ***/
.form { margin-bottom: 30px; }
.form-warning { margin-bottom: 30px; }
.errorMessage { padding-bottom: 30px; margin-bottom: 30px; }
.form-feedback { margin-bottom: 30px; }

/*** Cookie ***/
#CookieWarning #iewarning { width: 100%; padding-left: 20px; padding-right: 20px; }
#ie-container { width: 768px !important; }

}

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

	
/*.wrap { max-width: 460px; }*/
.mob-hide { display: none; }
.grid-show, 
.grid-hide, 
.grid-overlay { display: none !important; }

.mob-c1  { width:   1.709401709401709% !important; }
.mob-c2  { width:   5.982905982905982% !important; }
.mob-c3  { width:  10.25641025641026% !important; }
.mob-c4  { width:  14.52991452991453% !important; }
.mob-c5  { width:  18.8034188034188% !important; }
.mob-c6  { width:  23.07692307692307% !important; }
.mob-c7  { width:  27.35042735042735% !important; }
.mob-c8  { width:  31.62393162393162% !important; }
.mob-c9  { width:  35.89743589743589% !important; }
.mob-c10 { width:  40.17094017094017% !important; }
.mob-c11 { width:  44.44444444444444% !important; }
.mob-c12 { width:  48.71794871794871% !important; }
.mob-c13 { width:  52.99145299145299% !important; }
.mob-c14 { width:  57.26495726495726% !important; }
.mob-c15 { width:  61.53846153846153% !important; }
.mob-c16 { width:  65.8119658119658% !important; }
.mob-c17 { width:  70.08547008547008% !important; }
.mob-c18 { width:  74.35897435897435% !important; }
.mob-c19 { width:  78.63247863247862% !important; }
.mob-c20 { width:  82.9059829059829% !important; }
.mob-c21 { width:  87.17948717948717% !important; }
.mob-c22 { width:  91.45299145299144% !important; }
.mob-c23 { width:  95.72649572649572% !important; }
.mob-c24 { width: 100% !important; margin-right: 0 !important; }

/*** GRID - sub cols ***/
.col .col, 
.col .col .col{ margin-right: 2.564102564102564%; }
.col .mob-c1  { width:   1.709401709401709%; }
.col .mob-c2  { width:   5.982905982905982%; }
.col .mob-c3  { width:  10.25641025641026%; }
.col .mob-c4  { width:  14.52991452991453%; }
.col .mob-c5  { width:  18.8034188034188%; }
.col .mob-c6  { width:  23.07692307692307%; }
.col .mob-c7  { width:  27.35042735042735%; }
.col .mob-c8  { width:  31.62393162393162%; }
.col .mob-c9  { width:  35.89743589743589%; }
.col .mob-c10 { width:  40.17094017094017%; }
.col .mob-c11 { width:  44.44444444444444%; }
.col .mob-c12 { width:  48.71794871794871%; }

/*** GLOBAL & Typ ***/
h1 { margin-bottom: 20px; }
h2, h3, h4, h4, h5, h6 { margin-top: 30px; margin-bottom: 20px; }
h1 { font-size: 2.285em; }
h2 { font-size: 1.85em; }
h3 { font-size: 1.715em; }
h4 { font-size: 1.5em; }
h5 { font-size: 1.285em; }
h6 { font-size: 1.14em; }
p, ul, ol, blockquote { margin-top: 20px; margin-bottom: 20px; }
p + ul, 
p + ol { margin: -10px 0 20px 0; }
blockquote { padding: 0; }
hr { margin: 20px 0; }
.table-wrapper-outer { margin: 20px 0; }
.video-wrapper, 
.googlemaps-wrapper { margin-top: 20px; margin-bottom: 20px; padding: 10px; }

.intro, 
.content, 
.side-content, 
.content-footer, 
.gallery { margin-bottom: 20px; }
.content-footer { margin-top: 20px; }

.gallery-flex .img_v img { max-height: 320px; }

/*** LAYOUT ***/
#pageHeader,
#pageContainer,
#secContainer,
#pageMessage,
#pageFooter, 
.booking { padding-right: 10px; padding-left: 10px; }
#pageContainer { padding-bottom: 40px; }
.path { margin-bottom: 30px; }
.share-header { margin-top: -10px; margin-bottom: 20px;  }
.share-footer { margin-top: 30px; }
.path { display: none; }
#pageMessage { font-size: 24px; line-height: 30px; padding-top: 50px; padding-bottom: 50px; margin-top: 30px; }
#pageFooter h3 { margin-top: 0 !important; }
.contact-info { display: none; }
.testimonial { margin-bottom: 20px; }
.testimonial blockquote { margin-bottom: 10px; }
.details { margin-top: 5px; }
.home-subheading { font-size: 24px; }

/*** CONTENT ***/
#impressum p { display: block; float: none; }
#impressum #copyright { margin: 0 0 10px; }
#development { line-height: 1.5em; }
#development span { display: block; }
#development .divider { display: none; }

/*** HOME ***/
    .slide-content {
        position: static !important;
        margin: 0 !important;
        width: 100%;
        max-width: none;
        padding: 10px;
        font-family: open_sansregular;
    }
.slide-content h2 { font-size: 16px; line-height: 21px; }
    .flex-control-paging {
        bottom: -30px;
        right: 50%;
        transform: translateX(50%);
    }

.page-home #pageContainer { padding-top: 20px; }
.home-content { margin-bottom: -20px !important; }
.home-box { margin-right: 0; margin-bottom: 20px !important; float: none; display: block; width: 100% !important; }

.footer-box { margin-bottom: 20px; }
.footer-box:last-child { margin-bottom: 0; }

/*** FORMS ***/
.form { margin-bottom: 20px; }

.form-warning { margin-bottom: 20px; }
.errorMessage { margin-bottom: 20px; padding-bottom: 20px; }

.date-select select { width: 100%; margin-right: 0; margin-bottom: 10px; float: none; display: block; }
.date-select select.select_year { margin-right: 0; margin-bottom: 0; }

.captchaWrapper .req { bottom: 78px; }

.form-submit { float: none; display: block; width: 100%; }
.form-submit a,
.form-submit input { width: 100%; padding: 0 20px; text-align: center; }

.input, 
.select, 
.radio, 
.checkbox, 
.textarea, 
.captchaWrapper { margin-bottom: 20px; }
.captchaWrapper, 
.checkbox, 
.radio { padding-bottom: 20px; }
.form-warning { margin-bottom: 20px; }
.errorMessage { margin-bottom: 20px; padding-bottom: 20px; }

.terms { padding: 20px; }

.captchaWrapper { padding-left: 0; padding-bottom: 55px; }
.captchaImageWrapper { float: none; display: block; margin-left: 0; margin-bottom: 4px; padding-bottom: 22px; background-position: 0 -200px; }
.captcha-image-link { position: absolute; left: 0; bottom: 25px; }
.captchaInput { float: none; display: block; }
.captchaInput label { margin-top: 0; }

/*** Cookie ***/
#CookieWarning #iewarning { width: 100%; padding-left: 10px; padding-right: 10px; }
#ie-container { width: 100% !important; padding: 85px 0 0 0 !important; background-position: 50% 0 !important; }
#iewarning h3 { font-size: 16px !important; }

}

#pageHeader {
    position: fixed;
    width: 100%;
    /*height: 141px;*/
    z-index: 9999;
    background: rgba(23, 48, 97, 1);
    transition: all 0.3s ease;
}




#navigation {
    /*position: fixed;*/
    width: 100%;
    /*margin-top: 141px;*/
    background: #fff;
}

.page-header-fixed #pageHeader {
    height: auto;
}

@media screen and (max-width: 959px) {
    .page-header-fixed #pageHeader {
        height: 75px;
    }
}

.page-header-fixed #navigation {
    /*margin-top: 100px;*/
}

.page-home #pageHeader,
.page-home #navigation {
    background: transparent;
}

.page-header-fixed .page-home #pageHeader {
    background: rgba(23, 48, 97, 0.89);
} 
/*@media screen and (max-width: 959px) {
.page-home #pageHeader,
.page-home #navigation {
    background: rgba(23, 48, 97, 0.7);
}
}*/
.page-home #pageContainer {
    margin-top: 50px;
}

.page-default #pageContainer, .page-form-default #pageContainer {
    padding-top: 240px;
}

@media screen and (max-width: 959px) {
    #pageHeader {
        height: 80px;
    }


    .page-default #pageContainer, .page-form-default #pageContainer {
        padding-top: 15px;
    }
}