/* 
Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* Add your custom styles here */

/* ------ BOOKING FORM STYLES ------- */

table.tableizer-table {border: 1px solid #CCC; font-family: Arial, Helvetica, sans-serif; font-size: 12px; max-width:1280px !important; margin:0;} 
.tableizer-table td {padding: 4px; margin: 3px; border: 1px solid #ccc; text-align:center; background:#21303b; color: #FFF}
table.tableizer-table tbody tr:hover>td, table.tableizer-table tbody tr:hover>th {
	background:#21303b
}
.tableizer-table th {background-color: #21303b; color: #fff; font-weight: bold;}
.tableizer-table td.available{background-color:#556068; text-align:center; color:#fff; font-weight:bold; text-transform:uppercase;}
.tableizer-table td.busy{background-color:#e2e2e2; text-align:center; font-weight:bold; text-transform:uppercase;}
.tableizer-table tr td {border:1px solid #404040 !important;}
.tableizer-table tr td span.old { text-decoration:line-through }
tr.tableizer-firstrow {border:1px solid #404040; color: #556068 !important}
 table.tableizer-table tbody>tr:nth-child(odd)>th,  table.tableizer-table tbody tr th a {
	background-color: #21303b;
	color: #FFF !important;
 }
table.tableizer-table tbody>tr:nth-child(odd)>td {
	color: #556068 !important;
}
table.tableizer-table tbody>tr:nth-child(odd)>td.available {
	color: #FFF !important;
}
table.tableizer-table tbody>tr:nth-child(odd):hover>td {
	background-color: #21303b;	
	color: #FFF !important;
}
#content tr th{
font-size:15px;
color:#fff;
}

div.bookingForm {}

div.bookingForm p.info {
    text-align: center;
}

div.bookingForm p.errors {
    text-align: center;
    color: red;
}

div.bookingForm form {
    width: 700px;
    margin: 0px auto;
}

div.bookingForm form fieldset {
    border: 0;
    padding: 0;
}

div.bookingForm form p {
    display: block;

    margin-bottom: 0px !important;
    margin: 10px 0px;
}

 p:last-of-type {
	text-align: left !important;
}

form > p:last-of-type {
	text-align: center !important;
}

/*div.bookingForm form p label {
    display: inline-block;
    color: #888;
    line-height: 30px;
    width: 250px;
    font-size: 22px;
    text-align: left;
    margin-right: 20px;
}*/

div.bookingForm form p select, div.bookingForm form p input, div.bookingForm form p textarea {
    margin: 0;
    width: auto;
    height: 40px;
    /*line-height: 40px;*/
}

div.bookingForm form p select {
    display: inline;
    width: 258px;
    font-size:18px;
    border:1px solid #c4c4c4;
    padding-left:10px;
}

div.bookingForm form p input {
    background: none repeat scroll 0 0 #F9F9F9;
    border: 1px solid #c4c4c4;
    padding-left:10px;
}

div.bookingForm form p input:hover {
    background: none repeat scroll 0 0 #556068;
}

#content input:hover{color:white;}
#content input[type=submit]{background-color:#98abb9 !important;}
#content a:link, #content a:hover, #content a:visited{color:#404040;}

img.noslide{
display:none;
}





/* ---- DATEPICKER STYLES ------ */



table.jCalendar {
    border: 1px solid #000;
    background: #F3F3B3;
    border-collapse: separate;
    border-spacing: 2px;
    width: 100%;
}
table.jCalendar th {
    background: #F3F3B3;
    color: #000;
    font-weight: bold;
    padding: 3px 5px;
}

table.jCalendar td {
    background: #B1D281;
    color: #000;
    padding: 3px 5px;
    text-align: center;
}
table.jCalendar td.other-month {
    background: #779D83;
    color: #000;
}
table.jCalendar td.today {
    background: #666;
    color: #fff;
}
table.jCalendar td.selected {
    background: #f66;
    color: #fff;
}
table.jCalendar td.selected.dp-hover {
    background: #f33;
    color: #fff;
}
table.jCalendar td.dp-hover,
table.jCalendar tr.activeWeekHover td {
    background: #fff;
    color: #000;
}
table.jCalendar tr.selectedWeek td {
    background: #f66;
    color: #fff;
}
table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {
    background: #D6AD75;
    color: #000;
}
table.jCalendar td.unselectable,
table.jCalendar td.unselectable:hover,
table.jCalendar td.unselectable.dp-hover {
    background: #bbb;
    color: #888;
}

/* For the popup */

/* NOTE - you will probably want to style a.dp-choose-date - see how I did it in demo.css */

div.dp-popup {
    position: relative;
    background: #21303b;
    font-size: 14px;
    font-family: arial, sans-serif;
    padding: 2px;
    width: 350px;
    line-height: 1.2em;
    color:white;
}
div#dp-popup {
    position: absolute;
    z-index: 199;
}
div.dp-popup h2 {
    font-size: 12px;
    text-align: center;
    margin: 2px 0;
    padding: 0;
}
a#dp-close {
    font-size: 11px;
    padding: 4px 0;
    text-align: center;
    display: block;
}
a#dp-close:hover {
    text-decoration: underline;
}
div.dp-popup a {
    color: #fff;
    text-decoration: none;
    padding: 3px 2px 0;
}
div.dp-popup a:hover {
    color: #000 !important;
}
div.dp-popup div.dp-nav-prev {
    position: absolute;
    top: 2px;
    left: 4px;
    width: 100px;
}
div.dp-popup div.dp-nav-prev a {
    float: left;
}
/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
div.dp-popup div.dp-nav-prev a, div.dp-popup div.dp-nav-next a {
    cursor: pointer;
}
div.dp-popup div.dp-nav-prev a.disabled, div.dp-popup div.dp-nav-next a.disabled {
    cursor: default;
}
div.dp-popup div.dp-nav-next {
    position: absolute;
    top: 2px;
    right: 4px;
    width: 100px;
}
div.dp-popup div.dp-nav-next a {
    float: right;
}
div.dp-popup a.disabled {
    cursor: default;
    color: #aaa;
}
div.dp-popup td {
    cursor: pointer;
}
div.dp-popup td.disabled {
    cursor: default;
}

a.dp-choose-date {
    display: none;
}
#promobox{
position: fixed;
top:50%; 
right:0;
width:80px;
background-color:green;
color:white;
z-index:9999;
text-align:center;
margin-top:-131px;}

#whitebottom{
background-color:white;
width:100%;
color:green;
padding:20px 0;
text-transform:uppercase;
font-weight:bold;
}
#kwsection{
overflow:hidden;
}
.feedbacklogos{
clear: both;
    padding-top: 30px;
    max-width: 620px;
    margin: 0 auto;
    }
.ms-info p{text-align:center;}
div.ms-info{padding:0 5px;}

.wp-caption, .wp-caption img {
    max-width: 100% !important;
    padding:0;
}
.wp-caption p.wp-caption-text {
    font-size: 1.2em;
    line-height: 1.2em;
}

ul.img-list li{margin-bottom:80px !important;}
.tfw-calendar__logo, .calendar__footer{display:none;}
.tfw-calendar-app {margin:0 auto;}
/*mobile stuff begins here mobile stuff begins here mobile stuff begins here mobile stuff begins here mobile stuff begins here mobile stuff begins here mobile stuff begins here mobile stuff begins here  */

@media only screen and (max-width: 480px) {
body, #wrapper, #branding {width:100% !important; max-width:480px;}
#access .menu-header, div.menu, #colophon, #site-title, #site-info {
/*width:375px !important;*/
}
#logohere{width:100%}
#access{
display:none;
}
#content table {
    margin: 0;
    width: 100% !important;
}	
	div .quarter {
    width: 100%;
    float: left;
    margin-top: 0px;
	margin-bottom:4px;
}
.feedbacklogos{
clear: both;
    padding-bottom: 30px;
    max-width: 200px;
    margin: 0 auto;
    overflow: hidden;}
    #h1text {
    min-height: auto;
}
#wrapper{padding:0;}
#main{
width:100%;
}
#header{
background-color: #556068;
}
.mobilestars{display:block; position: relative; z-index: 999999; margin-left:auto; margin-right:auto; max-width:200px; margin-top: -30px; margin-bottom: 10px;}
body{min-width:0 !important;}
#container {
width:100% !important;
}
#branding{margin:0 !important;}
#branding img {
width:100% !important;
}
#site-description{
display:none;
}
h2, h3{
text-align:center;
}
/*#branding img{position:absolute; top:100px; left:100px;} trying to get the star rating to show on mobile*/
.qtranxs_language_chooser { list-style-type:none }
.qtranxs_language_chooser li { float:left; margin-right:5px }
#languages{background:#98abb9; width:100%;}
#langwidget{margin:0 auto; height:auto; overflow:hidden; display:block;}
.language-chooser a img{
    width: 30px;
    margin-right: 25px;
}
#content{
width:95%;
}
#content h2{    margin: 20px 0 !important; font-size: 0.7em; color:#404040;}
#content h2.oneblick, div.oneblick h2{font-size:1.3em;}
#logohere{background-repeat: no-repeat; background-position:center center;}
#logohere a{height:125px;
display:block;
}
.hentry{
margin-left:0px !important;
}
.ms-info p{font-size:1em; text-align:center;}
div.ms-info{padding:0 5px;font-size: 0.6em;}
div.bookingForm form p label {
    width: 258px;
    margin-right: 0px;
    margin-top:20px;
}
.page-id-193 p.info{
margin-top:20px;
}
#access{
width:100%;
}
#primary{
display:none;
}
#footer{
width:100%;
}
#site-generator {
float:left;
margin-top:5px;
}
#colophon {
width:100%;
padding:0;
}
.stitch img{max-width:280px;}
.stitch {
    padding: 10px;
    margin: 0px !important;
}
	#homeintro {
    padding: 0;
    margin-bottom: 20px;
}
	img.smashleys{
width:100%;
		margin:0 auto;
}
	#content tr td {
    padding: 0 !important;
    font-size:11px;
}
	#content tr th, #content thead th {
    line-height: 14px;
    padding: 0 2px;
    font-size:11px;
    font-weight:normal;
}
	.oneblick ul{
width:90%;}
#site-info{
max-width:250px;}  	
	
	.page h1 {
    margin: 10px !important;
	font-size: 1.3em;
}
	#homeintro p, .focus {
    font-size: 1em !important;
}
	
.home h1{
display:none;
}
	div.bookingForm form {
    width: 300px;
}

body.page-template-page-booking .form-st .form-row{
    width:100%;
}
body.page-template-page-booking .form-st button {
    margin-top: 10px;
    width: 100%;
    margin-left: 0;
}
body.page-template-page-booking #main > .table-wrap {
    background: #fff;
    padding: 20px;
    margin: 20px;
}
/*mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here mobile stuff ends here */
	}
.home #content h2 {
    margin: 0px !important;
    font-size: 1.2em;
}
	.home div.master-slider-parent {
    background: #556068;
    margin-top: -9px;
}
	h3.oneblick {
    margin: 10px 0 10px 0 !important;
		font-size:1.5em;
		border-bottom:1px solid #c4c4c4; 
		border-top:1px solid #c4c4c4;
}

	#logohere {
    margin-bottom: 0px;
}
	.page-id-1045 h2 {display:none;}
	h2.post-title {display:none;}
	div.oneblick{border:0 !important;}
	.beschreibung p{font-size:1em;    padding: 0 5px;}
	ul.img-list li {
    display: inline-block;
    height: 280px; ;
    margin: 0 ;
    position: relative;
    width: 300px;
}
#main{}
#lust{padding:10px;}
#logohere h2{
    font-size: 25px;
    text-align: center;
    display:none;}
#logohere{/*width:100%;*/ height:90px;}
.labfoot {
    font-size: 1em;
    line-height: 1.1em;
    } 
.ms-tabs-template .ms-thumb-frame p {
    font-size: 8pt !important;}
.home .ms-tabs .ms-thumb {
    padding: 0px 20px !important;
    line-height:18px;
}

.quarter h3{
font-size:1em;
}
	div.oneblick{font-size:1.5em;}	
div.bookingForm p.info {
    text-align: justify;
    padding: 0 5px;
}
	#content input{
		font-size:1em;
	}
table.tableizer-table {
    margin-left: 0px !important;
}

div.bookingForm form p label {
    text-align: left;
}

#languages{
    width: 100%;
    }
div.bookingForm form p label > span.opt {
    bottom: 9px !important;
}
/*phones in landscape*/
@media only screen and (min-device-width: 480px) and (max-device-width:768px) {
#logohere, .body, #wrapper, #container, #header{width:100%;}
#access{display:none;}
body{min-width:auto !important;}
#colophon{width:auto;}
#h1text {display:none;}
#logohere{background-position:center center; background-repeat:no;}
.mobilestars {
    display: block;
    width: 200px;
    margin: 0 auto;
    position: relative;
    top: -25px;
}
#branding{margin-top:-20px !important;}
}

/* iPad in Landscape */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
#wrapper, #branding, #branding img, #main,#colophon{max-width:1024px !important;}
#container{width:100% !important}
#wrapper{margin:0 !important;padding:0 !important;}
#logonav{height:100px !important;}
#access{width:100% !important;}
/*.menu-header ul {font-size: 1.5em !important}*/
#logohere{
    margin-bottom: 20px;
    }
#access a {
    padding: 0 17px;
}    
}
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape) { 
body{min-width:auto !important;}
#logohere {
    width: 100% !important;
    background-position: center center !important;
} 
#access{width:100%; min-width:auto !important;}
#tel_us {
    width: 140px;
    background-position-x: -43px;
}
#branding img {
    left: 165px;
}
}
/* desktops smaller than 1280px wide*/
@media all
and (min-width : 1024px)
and (max-width : 1280px){
#logohere {width:100% !important; background-position:center center !important;}
#access{width:100% !important;}

}
@media only screen and (min-device-width: 1024px) and (orientation: portrait){
#wrapper, #branding, #branding img, #main, #container, #colophon {
    max-width: 1024px !important;
}
}
/* iPad Pro in Portrait */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
#wrapper, #branding, #branding img, #main, #container,#colophon{max-width:1024px;}
#wrapper{margin:0 !important;padding:0 !important;}
/*#access{display:none;}*/
#logohere a{font-size:2.9em !important;}
body{min-width:auto !important;}
}
@media only screen and (min-device-width: 768px) and (orientation: portrait){
#wrapper, #branding, #branding img, #main, #container, #colophon {
    max-width: 768px;
}
.labfoot {
    font-size: 26px !important;
}
.mobilestars {
    display: block;
    width: 200px;
    margin: 0 auto;
    position: relative;
    top: -25px;
}
#branding{margin-top:-20px !important;}
}
/* ipad either way*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)  { 
#logohere h2{font-size:1.1em !important;}
table.tableizer-table{margin-left:0 !important;}
}
/*ipad mini in landscape*/
@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px) 
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2)  { 
#access a {
    padding: 0 9px;
}
.ms-info, .ms-info p{
font-size:1.5em !important;
font-weight:bold;
}
}

#content input[type=submit]{background-color:#98abb9 !important;}

/* new booking form */



.booking-holder * {
    box-sizing: border-box;
}
.booking-holder p.info {
    text-align: center !important;
}
div.bookingForm .booking-holder form {
    width: 1000px;
    max-width: 100%;
}
.booking-holder .col-left {
    float: left;
    width: 23%;
    text-align: right;
}
.booking-holder .col-right {
    float: right;
     width: 73%;
}
.custom-radio span {
    display: block;
    color: #333333;
    text-align: center;
}
.booking-holder .row {
    margin: 0 -15px;
}
.radio-col {
    float: left;
    width: 25%;
    padding: 15px;
}
.row-label {
    font-weight: normal;
    font-size: 24px;
    line-height: 29px;
    color: #333333;
    display: block;
    padding-top: 15px;
}
.booking-holder img {
    max-width: 100%;
    height: auto;
}
.radio-col input {
    width: 1px;
    height: 1px;
    margin: 0;
    visibility: hidden;
    opacity: 0;
}
.custom-radio {
    display: block;
    cursor: pointer;
}
.custom-radio .img {
    position: relative;
    display: block;
    border-radius: 4px;
    border: 2px solid transparent;
    line-height: 0;
}
.custom-radio .img img {
    border-radius: 2px;
}
.checked .img {
    border: 2px solid #219653;
    
}
.custom-radio span.ck {
    display: none;
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    margin-left: -20px;
    margin-top: -20px;
    background: url("images/checked.png") no-repeat;
}
.checked.custom-radio span.ck {
    display: block;
}
.custom-radio .title {
    font-size: 24px;
    line-height: 29px;
    margin-top: 20px;
    margin-bottom: 4px;
}
.custom-radio .capacity {
    font-size: 16px;
    line-height: 19px;
}
.property-row .row-label {
    padding-top: 75px;
}

#content .booking-holder input[type="text"], #content .booking-holder input[type="password"], #content .booking-holder input[type="email"], #content .booking-holder input[type="url"], #content .booking-holder input[type="number"], #content .booking-holder textarea {
    background: #FFFFFF;
    border: 1px solid #404040;
    box-sizing: border-box;
    border-radius: 2px;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    padding: 10px 16px;
    width: 100%;
    height: 56px;
    max-width: 100%;
    font-weight: 500;
    font-size: 24px;
    line-height: 30px;
    color: #404040;
    margin-bottom: 8px;
    font-family: "Helvetica Neue", Arial, Helvetica, "Nimbus Sans L", sans-serif;

}
div.bookingForm .booking-holder form  label {
    font-weight: normal;
    font-size: 18px;
    line-height: 21px;
    color: #333333;
    display: block;
    width: 100%;
    text-align: left;
    margin-bottom: 7px;
}
.date-row .col {
    float: left;
    width: 50%;
    padding: 0 15px;
    max-width: 285px;
}
.date-row .col2 {
    float: right;
}
.date-row .row {
    max-width: 600px;
}
.entry-content .booking-holder fieldset {
    margin-bottom: 3px
}
.booking-holder form select {
    background: #FFFFFF;
    border: 1px solid #404040;
    box-sizing: border-box;
    border-radius: 2px;
    box-shadow: none;
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    padding: 10px 16px;
    width: 100%;
    height: 56px;
     font-weight: 500;
    font-size: 24px;
    line-height: 30px;
    color: #404040;
    margin-bottom: 8px;
}
.booking-holder form .persons-nr select {
    max-width: 112px;
}

.persons-nr .col {
    float: left;
    width: 50%;
    padding: 0 15px;
}
.persons-nr .col1 {
    max-width: 198px;
}
.booking-holder label.inline-label {
    display: inline-block !important;
    width: auto !important;
    font-weight: normal !important;
    font-size: 24px !important;
    line-height: 29px !important;
    color: #333333 !important;
    vertical-align: top !important;
    padding-top: 15px !important;
    margin-right: 23px !important;
}
.entry-content .booking-holder fieldset.date-row {
    margin-bottom: 43px;
}
.entry-content .booking-holder fieldset.persons-nr {
    margin-bottom: 36px;
}
.error-notification {
    border: 4px solid #FF5C5C;
    box-sizing: border-box;
    border-radius: 2px;
    padding: 20px 20px 5px 50px;
    width: 73%;
    margin-left: 27%;
    background: url("images/notification_important.png") 12px 15px no-repeat #fff;
    margin-bottom: 44px;
}
.error-header .error {
    font-style: normal;
    font-weight: normal;
    font-size: 14px !important;
    line-height: 17px !important;
    color: #FF5C5C !important;
}

div.bookingForm form .error-notification p {
    margin-top: 0 !important;
    margin-bottom: 15px !important;
    font-style: normal;
    font-weight: normal;
    font-size: 16px;
    line-height: 19px;
    color: #333333;
}
.error-header {
    padding-bottom: 8px;
}
.error-footer {
    border-top: 1px solid #C4C4C4;
     padding-top: 24px
    
}
#content .error-footer h3 {
    font-weight: bold;
    font-size: 16px;
    line-height: 20px;
    margin-bottom: 16px;
    color: #219653;
}
.advice-left {
    float: left;
    width: 48%;
}
.advice-right {
    float: right;
    width: 48%;
    text-align: right;
    padding-top: 47px;
}
.clear {
    clear: both;
}
div.bookingForm form .error-notification p.call-text {
    font-weight: normal;
    font-size: 14px;
    line-height: 17px;
    margin-bottom: 8px !important;
}
div.bookingForm form .error-notification p.call-number {
    font-weight: normal;
    font-size: 18px;
    line-height: 24px;
}
.costs-box {
    border-radius: 2px;
    padding: 20px 95px 24px 95px;
    width: 73%;
    margin-left: 27%;
    background: url("images/bg-shape.png") 12px center no-repeat #fff;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.15);
    margin-bottom: 44px;
}
.costs-header {
    border-bottom: 1px solid #98ABB9;
}
.costs-box .left {
    float: left;
    width: 35%;
}
.costs-box .right {
    float: left;
    width: 65%;
}
.costs-row {
    padding: 10px 0;
    text-align: right;
}
.costs-header .total {
   font-weight: 500;
    font-size: 28px;
    line-height: 34px;
    color: #333333;
}
.costs-header .tax {
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    color: #333333;
}
.costs-box .left {
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 21px;
}
.book-box {
     border-radius: 2px;
    padding: 40px 40px 5px 40px;
    width: 73%;
    margin-left: 27%;
    background: #fff;
    box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.15);
}
.book-box .content-holder {
    max-width: 421px;
    margin: 0 auto;
}
.total-text {
    padding-top: 10px;
    display: block;
}
.costs-header {
    padding: 4px 0;
    margin-bottom: 11px;
}
.costs-box .right {
    font-style: normal;
    font-weight: normal;
    font-size: 18px;
    line-height: 21px;
}
.costs-box .right strong {
    font-size: 22px;
    line-height: 27px;
}
#content .right-heading {
    margin-left: 27%;
    font-weight: normal;
    font-size: 32px;
    line-height: 36px;
    color: #404040;
    margin-bottom: 30px;
    margin-top: 57px;
}
.book-box .form-row {
    margin-bottom: 17px;
}
#content .book-box h3 {
    font-weight: normal;
    font-size: 24px;
    line-height: 29px;
    color: #333333;
}
#content .booking-holder .book-box input[type="text"], #content .booking-holder .book-box input[type="password"], #content .booking-holder .book-box input[type="email"], #content .booking-holder .book-box input[type="url"], #content .booking-holder .book-box input[type="number"], #content .booking-holder .book-box textarea, .booking-holder form .book-box select {
    font-size: 18px;
    border: 1px solid #888888;
}
#content .booking-holder .book-box input[type="text"]:focus, #content .booking-holder .book-box input[type="password"]:focus, #content .booking-holder .book-box input[type="email"]:focus, #content .booking-holder .book-box input[type="url"]:focus, #content .booking-holder .book-box input[type="number"]:focus, #content .booking-holder .book-box textarea:focus, .booking-holder form .book-box select:focus {
    outline: none;
    border: 1px solid #219653;
}
.form-row label span {
    font-size: 14px;
}
.form-row .inline-box {
    display: inline-block;
    width: 32%;
    padding-top: 10px;
}
.cupon-row .inline-box {
  display: block;
  float: left;
  width: 40%;
}
.cupon-row {
  padding-top: 33px;
  padding-bottom: 29px;
}
.cupon-row .inline-box.second {
  width: 60%;
}
.cc {
  display: inline-block;
  padding-top: 15px;
}
#content .book-box input[type="submit"] {
    height: 54px;
    background: #21303B !important;
    border-radius: 2px;
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    width: 100%;
    border: none;
    color: #fff;
}
.book-box .info {
   font-weight: normal;
  font-size: 16px;
  line-height: 24px;
  text-align: center;
  color: #333333;
  max-width: 515px;
  margin: 0 auto 30px !important;
}
#content .inline-box input[type="radio"] {
  margin-bottom: 0;
  margin-right: 12px;
}
.book-box ::-webkit-input-placeholder { /* Edge */
color: rgba(51, 51, 51, 0.56);
opacity: 1
}

.book-box :-ms-input-placeholder { /* Internet Explorer 10-11 */
color: rgba(51, 51, 51, 0.56);
opacity: 1
}

.book-box ::placeholder {
color: rgba(51, 51, 51, 0.56);
opacity: 1
}
.hide-d, .booking-holder label.hide-d {
  display: none !important;
}
.hide-m {
  display: block;
}
div.bookingForm .booking-holder form label.cc {
  font-size: 16px
}
.mc-display__data--secondary, .mc-display__data--primary {
  background: #556068 !important
}
 .mc-display__day {
  background: #21303b !important
 }
 .mc-date {
  vertical-align: middle;
 }
 .mc-table__weekday, .mc-footer__section {
  color: #779D83; 
 }
@media only screen and (max-width: 1100px) {
#content {
    padding: 0 15px;
  }
}
@media only screen and (max-width: 767px) {
  .hide-m {
    display: none !important;
  }
  .hide-d, .booking-holder label.hide-d {
    display: block !important;
  }
  .booking-holder label.inline-label {
    padding-top: 0 !important
  }
  .entry-content .booking-holder fieldset {
    margin-bottom: 3px;
  }
  .entry-content .booking-holder fieldset.date-row {
    margin-bottom: 23px;
  }
  .entry-content .booking-holder fieldset.persons-nr {
      margin-bottom: 23px;
  }

  .booking-holder label.inline-label, .row-label {
    font-size: 22px !important;
  }

  .booking-holder .col-left, .booking-holder .col-right {
      width: 100%;
      float: none;
  }
  .booking-holder .col-left {
    text-align: left;
  }
  .property-row .row-label {
    padding-top: 0px;
    display: block;
  }
  .radio-col {
      width: 50%;
  }
  .custom-radio .title {
      font-size: 22px;
      line-height: 26px;
      margin-top: 12px;
      margin-bottom: 4px;
  }
  .radio-col {
    padding-bottom: 0
  }
  
  .booking-holder form select, #content .booking-holder input[type="text"], #content .booking-holder input[type="password"], #content .booking-holder input[type="email"], #content .booking-holder input[type="url"], #content .booking-holder input[type="number"], #content .booking-holder textarea {
    height: 46px;
    font-size: 18px;
  }
  .row-label {
    padding-top: 0;
    padding-bottom: 15px;
  }
  .property-row .row-label {
    padding-bottom: 0
  }
  div.bookingForm .booking-holder form label {
    font-size: 16px;
  }
  .error-notification, .book-box {
    width: 100%;
    margin-left: 0
  }
  .advice-left, .advice-right {
      float: none;
      width: 100%;
  }
  .advice-right {
    text-align: left;
    padding-top: 15px;
  }
  .costs-box {
    width: 100%;
    margin-left: 0;
    padding: 20px 20px 24px 50px
  }
  .costs-box .left, .costs-box .right {
    float: none;
    width: 100%;
    text-align: left;
  }
  .costs-header .total {
    font-size: 26px;
  }
  .costs-box .right {
    font-size: 16px;
  }
  .costs-box .right strong {
    font-size: 20px;
  }
  #content .right-heading {
    text-align: left;
    font-size: 30px;
  }
  #content .book-box h3 {
    text-align: left;
  }
  #content .book-box h3 {
    font-size: 21px;
    line-height: 27px;
  }
  .book-box {
    padding: 40px 30px 5px 30px
  }
  #content .booking-holder .book-box input[type="text"], #content .booking-holder .book-box input[type="password"], #content .booking-holder .book-box input[type="email"], #content .booking-holder .book-box input[type="url"], #content .booking-holder .book-box input[type="number"], #content .booking-holder .book-box textarea, .booking-holder form .book-box select {
    font-size: 16px;
  }
  .cupon-row .inline-box, .cupon-row .inline-box.second {
      display: block;
      float: none;
      width: 100%;
  }
  .cupon-row {
    padding-top: 0;
    padding-bottom: 5px;
  }
  .booking-holder h2, .booking-holder h3 {
    text-align: left;
  }
}

/* end new booking form */








/* strip elements */


.StripeElement {
    background-color: white;
    padding: 8px 12px;
    border-radius: 0;
    border: 1px solid #eee;
    box-shadow: 0 1px 3px 0 #e6ebf1;
    -webkit-transition: box-shadow 150ms ease;
    transition: box-shadow 150ms ease;
}
.StripeElement--focus {
    box-shadow: 0 1px 3px 0 #cfd7df;
}
.StripeElement--invalid {
    border-color: #fa755a;
}
.StripeElement--webkit-autofill {
    background-color: #fefde5 !important;
}
.form-st {
    max-width: 650px;
    margin-top: 25px;
    box-shadow: 3px 4px 19px 0px rgba(0,0,0,0.1);
    padding: 20px;
    box-sizing: border-box;
    border: 1px solid #ececec;
}
.form-st .form-row{
    width: 420px;
    display: inline-block;
    vertical-align: top;
}
.form-st button {
    margin-left: 30px;
    border: 1px solid #556068;
    background: #556068;
    color: #fff;
    padding: 12px 20px;
    width: 150px;
    font-size: 16px;
    font-weight: bold;
    cursor: pointer;
    vertical-align: top;
}
.form-st button:hover {
    border: 1px solid #21303B;
    background: #21303B;
}
label.st_lbl {
    display: block;
    border-bottom: 1px solid #eee;
    margin-bottom: 15px;
    padding-bottom: 15px;
    font-size: 16px;
    color: #556068;
}
span.err_crd {
    color: red;
    font-size: 20px;
    text-align: center;
    display: block;
    margin: 0 auto;
    width: 400px;
    border: 1px solid red;
    padding: 10px;
}
div.bookingForm form p label {
    position: relative;
}
div.bookingForm form p label > span.opt{
    font-size: 13px;
    line-height: 10px;
}
.spinner,
.spinner:before,
.spinner:after {
  border-radius: 50%;
}
.spinner {
  color: #ffffff;
  font-size: 22px;
  text-indent: -99999px;
  margin: 0px auto;
  position: relative;
  width: 20px;
  height: 20px;
  box-shadow: inset 0 0 0 2px;
  -webkit-transform: translateZ(0);
  -ms-transform: translateZ(0);
  transform: translateZ(0);
}
.spinner:before,
.spinner:after {
  position: absolute;
  content: "";
}
.spinner:before {
  width: 10.4px;
  height: 20.4px;
  
  border-radius: 20.4px 0 0 20.4px;
  top: -0.2px;
  left: -0.2px;
  -webkit-transform-origin: 10.4px 10.2px;
  transform-origin: 10.4px 10.2px;
  -webkit-animation: loading 2s infinite ease 1.5s;
  animation: loading 2s infinite ease 1.5s;
}
.spinner:after {
  width: 10.4px;
  height: 10.2px;
  
  border-radius: 0 10.2px 10.2px 0;
  top: -0.1px;
  left: 10.2px;
  -webkit-transform-origin: 0px 10.2px;
  transform-origin: 0px 10.2px;
  -webkit-animation: loading 2s infinite ease;
  animation: loading 2s infinite ease;
}

@-webkit-keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}
@keyframes loading {
  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

/* Animated form */


.hidden {
  display: none;
}

@keyframes field-in {
  0% {
    opacity: 0;
    transform: translateY(8px) scale(0.95);
  }
  100% {
    opacity: 1;
    transform: translateY(0px) scale(1);
  }
}

@keyframes form-in {
  0% {
    opacity: 0;
    transform: scale(0.98);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}


/* end stripe elements */

/* ------------------------------------------------------------------
   2026-09-07 - payment / enquiry page (page id 4876, /anfrage/) on mobile.

   This page renders from inc/booking-process.php, which functions.php
   require_once's, so its body class is page-template-default - NOT
   page-template-page-booking. Every responsive override above that is
   scoped to body.page-template-page-booking therefore never reached it,
   which is why the card row stayed 420px wide and the page scrolled
   sideways on a phone.

   It must live HERE and not in that file's own <style> block: LiteSpeed's
   CSS optimisation serves that inline block in the HTML but it does not
   survive into the DOM, so rules placed there are silently inert.
   ------------------------------------------------------------------ */
.page-id-4876 .table-wrap,
.page-id-4876 table,
.page-id-4876 table td { box-sizing: border-box; }
.page-id-4876 table { table-layout: fixed; word-wrap: break-word; }
.page-id-4876 #card-element,
.page-id-4876 .StripeElement,
.page-id-4876 .form-st { max-width: 100%; }

@media only screen and (max-width: 768px) {
    .page-id-4876 .table-wrap { margin: 8px; padding: 10px; }
    .page-id-4876 table td { padding-left: 6px; padding-right: 6px; }
    .page-id-4876 .tt td { width: auto; }
    .page-id-4876 .tt td:first-child { width: 38%; }
    .page-id-4876 .tt td:last-child { width: 24%; }

    .page-id-4876 .form-st { padding: 12px; }
    .page-id-4876 .form-st .form-row { width: 100%; display: block; }
    .page-id-4876 .form-st button { width: 100%; margin-left: 0; margin-top: 12px; }
}