body {margin-top: 100px; }

a,
a:hover,
a:active,
a:focus {
    color: #830808;
}

#header { }

#header .navbar-globalguest {
    background: #F8B321;
    border-color: #F9CE72;
    box-shadow: 0 0 10px #333;
}

#header .navbar-globalguest a {
    color: #333;
    font-size: 14px;
}

#header .navbar-globalguest a.navbar-brand {
    background: url(/graphics/gg_header.jpg) 0 0 no-repeat;
    text-indent: -9999px;
    overflow: hidden;
    height: 70px;
    width: 170px;
    background-position-x: -18px;
}

#header .navbar-globalguest a.navbar-brand small {
    display: none;
    font-size: 9px;
    font-weight: 700;
    text-align: center;
    text-indent: 0;
    text-transform: uppercase;
    position: absolute;
    top: 50px;
    width: 185px;
}

#header .navbar-text {
    margin-top: 30px;
    margin-bottom: 10px;
    text-shadow: 0 1px 0 #fff;
}

#header .navbar-nav > li > a {
    padding-top: 30px;
}

.navbar-globalguest .nav > li > a:hover, .nav > li > a:focus,
.navbar-globalguest .navbar-nav > .open > a,
.navbar-globalguest .navbar-nav > .open > a:hover,
.navbar-globalguest .navbar-nav > .open > a:focus {
    background-color: #F9CE72!important;
}

.navbar-toggle .icon-bar {
    background-color: #000;
}

#menu2,
#mini_login {
    float: right;
}

#core_content {
    background-color: #fff;
    margin-top: 150px;
    position: relative;
    padding-top: 20px;
    padding-bottom: 40px;
}

body.page.pages.display #core_content,
body.page.hosts.index #core_content,
body.page.hosts.page #core_content,
body.page.hosts.view #core_content,
body.page.offers.category #core_content,
body.page.offers.index #core_content,
body.page.offers.menuoffers #core_content,
body.page.offers.familyfriends #core_content,
body.page.offers.socialprograms #core_content {
    margin-top: 360px;
}

body.page.hosts.pictures #core_content,
body.page.hosts.picture #core_content,
body.page.hosts.map #core_content,
body.page.hosts.menucard #core_content,
body.page.hosts.menuoffers #core_content,
body.page.hosts.dates #core_content,
body.page.dates.view #core_content,
body.page.news #core_content,
body.page.events #core_content,
body.page.gourmets #core_content,
body.page.offers.view #core_content,
body.page.users.customer_care #core_content,
body.page.users.contact #core_content {
    margin-top: 150px!important;
}

body.page.reservations #core_content,
body.page.users #core_content {
    margin-top: 0 ;
}


#content {
  scroll-margin-top: 80px;
}

#overview h1 {
    font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
    text-align: center;
    text-transform: uppercase;
    border-bottom: 1px #eee solid;
    padding-bottom: 20px;
    margin-bottom: 20px;
    font-weight: 500;
}

h1.homepage {
    font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 42px;
    text-align: center;
    text-transform: uppercase;
    color: #fff;
    font-weight: 500;
    position: absolute;
    top: 60px;
    width: 100%;
    z-index: 1;
    text-shadow: 0 1px 3px #333
}

h1.homepage small {
    color: #fff;
}

.frontpage_image_grid {
    height: 150px;
    overflow: hidden;
    margin-bottom: 10px;
}

div.home #mod_cities a,
body.hosts_unavailable #mod_cities a {
    display: inline-block;
    width: 32%;
    margin-right: 1%;
}

/* Slideshow */
.carousel .caption {
    background-color: #000;
    height: 100px;
    width: 847px;
    opacity: .5;
    position: absolute;
}

#teaser_welcome .carousel .caption {
    height: 75px;
    top: 225px;
}

.promotionspace {
    margin-bottom: 20px;
}

.promotionspace300px .carousel .caption {
    height: 74px;
    top: 176px;
}

.promotionspace360px.promotionspaceEvents img {
    width: 100%;
}

.promotionspace360px.promotionspaceEvents .carousel .caption {
    width: 360px!important;
    margin-top: 200px;
}

.promotionspace360px.promotionspaceEvents .caption_content {
    top: 200px;
    width: 360px;
}

#teaser_welcome .carousel .caption_content {
    position: relative;
    color: #fff;
    padding: 10px;
    top: 225px;
    width: 847px;
}

#teaser_welcome .carousel .caption_content p {
    font-size: 16px;
}

#teaser_welcome .carousel .caption_content p > em {
    font-size: 18px;
    font-weight: 700;
}

.carousel .caption_content {
    position: relative;
    color: #fff;
    padding: 10px;
    top: 176px;
}

#News_Details_HostList h3 {
    margin-top: 0;
}
#News_Details_HostList img,
.citypage-details img,
.cuisinepage-details img {
    margin-bottom: 10px;
}

.btn-icon {
    background-repeat: no-repeat;
    background-position: 5px 50%;
    background-size: 20px;
    text-indent: 20px;
}
.googlemaps {
    background-image: url(/graphics/icons/icon-google-maps.png);
}

.applemaps {
    background-image: url(/graphics/icons/icon-apple-maps.png);
}

/* Footer */
#footer {
	background-color: #333;
	color: #aaa;
	padding-top: 20px;
    margin-top: 20px;
}

#footer a {
	color: #F8B321;
}

#footer hr { border-color: #666; }
#copyright { margin: 20px 0; font-size: 80%; }

#footer .fa-lg { font-size: 1.28em !important }

/* Header Image */

.header-image {
    background: url(/graphics/content/showcase_bg.jpg) 50% 50% no-repeat;
    background-size: 100%;
    height: 400px;
    position: absolute;
    top: 0;
    width: 100%;
}

.header-image.restaurant_one {
    background-image: url(/graphics/content/bar4_1280.jpg);
}
.header-image.restaurant_two {
    background-image: url(/graphics/content/restaurant_2_1920.jpg);
}
.header-image.restaurant_three {
    background-image: url(/graphics/content/restaurant_3_1280.jpg);
    background-position: 50% 76%;
}
.header-image.restaurant_four {
    background-image: url(/graphics/content/restaurant_4_1280.jpg);
}
.header-image.restaurant_five {
    background-image: url(/graphics/content/restaurant_5_1280.jpg);
    background-position: 50% 68%;
}
.header-image.restaurant_six {
    background-image: url(/graphics/content/restaurant_6_1280.jpg);
}
.header-image.restaurant_seven {
    background-image: url(/graphics/content/resort_1920.jpg);
}
.header-image.food_one {
    background-image: url(/graphics/content/food_1_1920.jpg);
}
.header-image.food_two {
    background-image: url(/graphics/content/food_2_1280.jpg);
}
.header-image.food_three {
    background-image: url(/graphics/content/soup_1920.jpg);
}
.header-image.food_four {
    background-image: url(/graphics/content/meal_1920.jpg);
}

body.hosts.view .header-image,
body.hosts.menucard .header-image,
body.hosts.menuoffers .header-image,
body.hosts.dates .header-image,
body.hosts.map .header-image,
body.hosts.pictures .header-image,
body.hosts.picture .header-image  {
    background-image: url(/graphics/content/showcase_bg.jpg) !important;
}

/* Quick Search */

#mod_quickSearch {
    margin-top: 250px;
}

#mod_quickSearch .main-search  {
    background-color: rgba(62, 63, 58, 0.7);
    border: 1px #666 solid;
    color: #fff;
}

#mod_quickSearch .main-search .row {
    margin-bottom: 10px;
}

#mod_quickSearch .main-search label {
    display: block;
    font-weight: normal;
}


#mod_quickSearch .main-search .form-group {
    width: 100%;
}

#mod_quickSearch .main-search .form-group .form-control {
    width: 100%;
}

#mod_quickSearch_Mobile .panel {
    background-color: #333;
}

#mod_quickSearch_Mobile label {
    display: none;
}

#mod_quickSearch_Mobile input, select {
    margin-bottom: 5px;
}

#mod_quickSearch_Mobile form.navbar-form {
    border: 0 none;
    box-shadow: unset;
    margin-top: 0;
    margin-bottom: 0;
}

#mod_quickSearch_Mobile form.navbar-form #booking_date_day,
#mod_quickSearch_Mobile form.navbar-form #booking_date_month {
    display: inline-block;
}
/*
#booking_date_day,
#booking_date_month {
    width: 50%!important;
}*/

#mod_searchResult h3 {
    font-size: 18px;
    margin-top: 10px;
    margin-bottom: 10px;
}

#mod_quickSearch button.startsearch {
    margin-top: 0;
}


/* Lists areas */

.list h3 {
    margin-top: 0;
    font-size: 22px;
}

.gridwrapper {
    margin-bottom: 30px;
    padding-bottom: 10px;
    border-bottom: 1px #eee solid;
}

.gridboxtext {
    height: 200px;
    overflow: hidden;
}

#host_list .image {
    max-width: 160px;
    height: 160px;
    overflow: hidden;
}

#offer_list .img-wrapper {
    background: url(/graphics/placeholders/300/no_pic.jpg) 0 0 no-repeat;
    background-size: 100%;
    display: block;
    width: 263px;
    height: 174px;
    overflow: hidden;
    margin-bottom: 10px;
}

#offer_list .img-wrapper a {
    display: block;
    width: 263px;
    height: 174px;
}

#offer_list .offerCategory.position_absolute {
    padding-top: 15px;
    margin-left: -10px;
}

#offer_list .category_label {
    font-size: 100%;
    vertical-align: -10%
}

#offer .thumbnail > a {
    background: url(/graphics/placeholders/300/no_pic.jpg) 0 0 no-repeat;
    background-size: 100%;
    height: 168px;
    display: block;
    overflow: hidden;
}

.offer.thumbnail {
    height: 342px;
}

#offer-content .img-wrapper,
#date-content .img-wrapper {
    display: block;
    background: url(/graphics/placeholders/300/no_pic.jpg) 0 0 no-repeat;
    background-size: 100%;
    min-height: 300px;
    margin-bottom: 20px;
}

#offer .event.thumbnail div.caption {
    height: 140px;
}

#offer .event.thumbnail div.caption > h3 {
    margin: 5px 0;
}

.city-wrapper .caption {
    height: 100px;
    overflow: hidden;
}

.content-details img {
    width: auto!important;
    height: auto!important;
    max-width: 100%!important;
}

/* Hosts area */
body.page.hosts.view #sidebar {
    position: relative;
    top: -270px;
}

body.page.offers.view #sidebar,
body.page.hosts.menucard #sidebar,
body.page.hosts.menuoffers #sidebar,
body.page.hosts.familyfriends #sidebar,
body.page.hosts.map #sidebar,
body.page.hosts.dates #sidebar,
body.page.dates.view #sidebar,
body.page.hosts.pictures #sidebar,
body.page.hosts.picture #sidebar {
    position: relative;
    top: -82px;
}

h2.menu-category,
h2.host {
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    margin-top: 20px;
    padding-bottom: 10px;
    border-bottom: 2px #ddd dotted;

}

#sidebar h3,
div.menu-title {
    font-size: 14px;
    font-weight: 700;
}

div#details.host h3 {
    font-size: 18px;
}

.nav-tabs a:focus {
    background-color: #fff!important;
}

/* Booking Form */
input.btn-block.fa-lg[type="submit"],
input.btn-block.fa-lg[type="reset"],
input.btn-block.fa-lg[type="button"] {
    white-space: normal;
    line-height: 125%;

}

#details .logo-wrapper {
    width: 100px;
    height: 100px;
    overflow: hidden;
    margin-right: 10px;
}

#details .logo-wrapper img {
    width: 100%;
    vertical-align: baseline;
}

#details .titleAppendix {

}

.panel-body dl.dl-horizontal dt { width: 60px; }
.panel-body dl.dl-horizontal dd { margin-left: 70px; }

#detailsNav { margin-top: 20px; margin-bottom: 20px; }

.image_strip {
    margin-bottom: 10px;
    position: relative;
    top: -230px;
    height: 200px;
    white-space: nowrap;
}

.image_strip .img-wrapper {
    display: inline-block;
    width: 280px;
    height: 190px;
    overflow: hidden;
}

.image_strip .img-wrapper a {
    display: block;
    width: 280px;
    height: 190px;
    overflow: hidden;
}

/* Image Gallery */

#masonry {
  column-count: 2;
  column-gap: 1em;
}

@media(min-width: 30em) {
  #masonry {
    column-count: 3;
    column-gap: 1em;
  }
}

@media(min-width: 40em) {
  #masonry {
    column-count: 4;
    column-gap: 1em;
  }
}

@media(min-width: 60em) {
  #masonry {
    column-count: 4;
    column-gap: 1em;
  }
}

@media(min-width: 75em) {
  #masonry {
    column-count: 4;
    column-gap: 1em;
  }
}

#masonry .item {
  background-color: none;
  display: inline-block;
  margin: 0 0 1em 0;
  width: 100%;
  cursor: pointer;
}

#masonry .item img {
  max-width: 100%;
  height: auto;
  width: 100%;
  margin-bottom: -4px;

  /*idk why but this fix stuff*/
}

#masonry .item.active {
  animation-name: active-in;
  animation-duration: 0.7s;
  animation-fill-mode: forwards;
  animation-direction: alternate;
}

#masonry .item.active:before {
  content: "+";
  transform: rotate(45deg);
  font-size: 48px;
  color: white;
  position: absolute;
  top: 20px;
  right: 20px;
  background-color:rgba(0,0,0,0.85);
  border-radius: 50%;
  width:48px;
  height:48px;
  text-align:center;
  line-height:48px;
  z-index:12;
}

#masonry .item.active img {
  animation-name: active-in-img;
  animation-duration: 0.7s;
  animation-fill-mode: forwards;
  animation-direction: alternate;
}


@keyframes active-in {
  0% {
    opacity:1;
    background-color:white;
  }

  50% {
    opacity:0;
    background-color:rgba(0,0,0,0.90);
  }

  100% {
    opacity: 1;
    position:fixed;
    top:0;
    left:0;
    right:0;
    bottom:0;
    background-color:rgba(0,0,0,0.90);
  }
}

@keyframes active-in-img {
  0% {
    opacity:1;
    transform:translate(0%, 0%);
    top: 0;
    left: 0;
    max-width: 100%;
  }
  49% {
    opacity:0;
    transform: translate(0%, -50%);
  }
  50% {
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -100%);
  }
  100% {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  max-width: 90%;
  width: auto;
  max-height: 95vh;
  opacity:1;
  }
}

/* Promotion space */
.carousel-control,
.carousel-control.left,
.carousel-control.right {
    background: none;
}


/* Modules */
#mod_contact {
    max-width: 300px;
}

button#order small {
    font-size: 75%;
}

#recaptcha_image { margin-bottom: 10px;}
#recaptcha_response_field { width: 300px;}

.form-group label { margin-right: 10px; }
.input-radio-inline,
.checkbox-inline {
    display: inline-block;
    margin: 0 5px 0 0 !important;
    vertical-align: middle;
    }

.form-group-radio span {
    margin-right: 10px;
}


#mod_loader {
    background: rgb(255, 255, 255) none repeat scroll 0% 0%;
    opacity: 0.8;
    width: 100%;
    text-align: center;
    height: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    padding: 300px;
    font-size: 30px;
    z-index: 9999;
}

.simple-list-group {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

.simple-list-group-item {
    font-size: 125%;
}

.simple-list-group-item a {
    display: block;
    padding: 10px 0;
    border-bottom: 1px solid #f8f5f0
}

.error-message {
    color: #a20000;
}



.position_absolute {
    position: absolute;
    height: 1px;
}

body.cake_error_view,
body.cake_error_index {  }

body.cake_error_view .header-image,
body.cake_error_index .header-image { display: none;  }

body.cake_error_view #core_content,
body.cake_error_index #core_content { margin-top: 0 !important; }

body.cake_error_view #content,
body.cake_error_index #content { padding: 0; }

body.cake_error_view #sidebar,
body.cake_error_index #sidebar { top: initial!important; }

body.hosts_index #sidebar.col-xs-12 > div {
    float: left;
}

body.hosts_index #sidebar.col-md-4 > div {
    float: right;
}

.cake_error_view .error { color: #a20000; }

pre.cake-error {
    position: relative;
    z-index: 99999;
}


table.cake-sql-log {
    margin: 0 100px;
    border: 2px #ddd solid;
    font-size: 12px;
}
table.cake-sql-log tr td,
table.cake-sql-log tr th {
    border: 1px #ddd solid;
    padding: 3px;
    background: #eee;
}



.overflowhidden {
    overflow: hidden;
}

.nowordbreak {
    white-space: nowrap;
}

.nomargin {
    margin: 0;
}

.marginbottom5px {
    margin-bottom: 5px;
}


@media (max-width:499px){

    #menu2,
    #mini_login {
        float: none;
    }

    #menu2 .dropdown-header,
    #mini_login .dropdown-header {
        color: #fff;
    }

    div.home #mod_cities a,
    body.hosts_unavailable #mod_cities a {
        display: inline-block;
        width: auto;
        margin-right: 0;
    }

    h1.homepage {
        top: 80px;
        font-size: 22px;
    }

    #overview h1 {
        font-size: 22px;
        margin: 0;
    }

    h2 {
        font-size: 18px;
        margin: 5px 0;
    }

    .header-image {
        height: 200px;
    }
    #core_content {
        margin-top: 200px!important;
    }

    body #sidebar.col-xs-12 {
        top: 0!important;
        margin-top: 20px;
    }

    #host_list .host-wrapper div.image {
        width: auto;
        max-width: none;
    }

    #host_list .col-xs-12 div.image {
        width: 100%;
        margin-bottom: 10px;
    }

    #host_list .col-xs-12 div.image img {
        width: 100%;
    }

    .page.hosts #details >.clearfix > .position_absolute {
        position: inherit;
    }

    .image_strip {
        top: -100px;
        height: 200px;
    }

    .image_strip .img-wrapper {
        display: inline-block;
        width: 33%;
        max-height: 80px;
        overflow: hidden;
    }


}
@media (min-width: 500px) and (max-width: 767px) {
    div.home #mod_cities a,
    body.hosts_unavailable #mod_cities a {
        display: inline-block;
        clear: both;
        width: auto;
        margin-right: 0;
    }
}

@media (min-width: 768px) and (max-width: 991px) {
    .navbar-collapse.collapse {
        display: none !important;
    }
    .navbar-collapse.collapse.in {
        display: block !important;
    }
    .navbar-header .collapse, .navbar-toggle {
        display:block !important;
    }
    .navbar-header {
        float:none;
    }

    #menu2,
    #mini_login {
        float: none;
    }

    #menu2 .dropdown-header,
    #mini_login .dropdown-header {
        color: #fff;
    }

    div.home #mod_cities a,
    body.hosts_unavailable #mod_cities a {
        display: inline-block;
        width: auto;
        margin-right: 0;
    }
}

#searchTextField::placeholder { color: #718096 !important; font-style: italic;  }


.geo-container {
    padding-right: 14px;
}

/* Search menu */
#booking_date_day.form-control {
    padding-left: 10px;
    padding-right: 0px;

}
@media (max-width: 1199px) {
    .geo-container .col-xs-6 {
        padding-right: 2px !important; 
    }

    #mod_quickSearch { /* Make search box a bit larger then container div */
        margin-left: -14px;
        margin-right: -14px;
    }
    
    #mod_quickSearch .form-control {
        padding-left: 12px;
        padding-right: 0px;
    }
    #booking_date_day.form-control {
        padding-left: 4px;
        padding-right: 0px;
    }
    #mod_quickSearch .col-sm-1, #mod_quickSearch .col-sm-2, #mod_quickSearch .col-sm-3, #mod_quickSearch .col-sm-4 {
        padding-left: 6px;
        padding-right: 6px;
    }
    
}

@media (min-width: 992px) and (max-width: 1199px) {
    .geo-container .col-xs-6 {
        padding-right: 0px !important; 
    }

    #mod_quickSearch .form-control {
        padding-left: 16px;
        padding-right: 0px;
    }
    #booking_date_day.form-control {
        padding-left: 10px;
        padding-right: 0px;
    }
    #mod_quickSearch .col-sm-1, #mod_quickSearch .col-sm-2, #mod_quickSearch .col-sm-3, #mod_quickSearch .col-sm-4 {
        padding-left: 9px;
        padding-right: 9px;
    }
}
@media (max-width: 767px) {
    .geo-container .col-xs-6 {
        padding-right: 0px !important; 
    }

    #mod_quickSearch .col-sm-1, #mod_quickSearch .col-sm-2, #mod_quickSearch .col-sm-3, #mod_quickSearch .col-sm-4 {
        padding-left: 16px;
        padding-right: 16px;
    }
    
}
#mod_quickSearch select.form-control {
    -webkit-appearance: caret; /* seems to fix the select styling bug in chrome */
}


/* mobile xs
@media (min-width: 576px) and (max-width: 768px) {
    #mod_quickSearch .form-control {
        padding: 12px 6px;
    }
    #mod_quickSearch .col-sm-1, #mod_quickSearch .col-sm-2, #mod_quickSearch .col-sm-3, #mod_quickSearch .col-sm-4 {
        padding-left: 9px;
        padding-right: 9px;
    }
}

@media (max-width: 575px) {

    #mod_quickSearch .col-sm-1, #mod_quickSearch .col-sm-2, #mod_quickSearch .col-sm-3, #mod_quickSearch .col-sm-4 {
        padding-left: 16px;
        padding-right: 16px;
    }
    /*body.page.pages.display #core_content, body.page.hosts.index #core_content, 
    body.page.hosts.page #core_content, body.page.hosts.view #core_content, 
    body.page.offers.category #core_content, body.page.offers.index #core_content, 
    body.page.offers.menuoffers #core_content, body.page.offers.familyfriends #core_content, 
    body.page.offers.socialprograms #core_content */
    /*
    body.page.pages.display #core_content {
        margin-top: 600px !important;
    }
    
    body.page.pages.display .header-image {
        height: 600px !important;
        background-size: cover;
    }
}
*/


/* Tabs scrollbar */

#detailsNav {
    overflow-x: auto;        /* horizontales Scrollen aktivieren */
    overflow-y: hidden;      /* vertikales Scrollen verhindern */
    white-space: nowrap;     /* keine Zeilenumbrüche */
}

#detailsNav .nav-tabs {
    display: inline-flex;    /* horizontale Ausrichtung */
    flex-wrap: nowrap;       /* kein Umbruch */
}

#detailsNav .nav-tabs li {
    float: none;             /* float verhindern */
    display: inline-block;   /* inline-block für horizontale Tabs */
}

#detailsNav .nav-tabs li a {
    white-space: nowrap;     /* Text nicht umbrechen */
}