@media only screen and (max-width: 1440px) {
    
    .row { width: 1200px; margin: 0 auto; }
}

/* =ipad =1024 
------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 1024px){

:root {
    --font-norm: 15px;
    --font-h1: 30px;
    --font-h2: 26px;
    --font-h3: 21px;
    --font-h4: 18px;
    --font-small: 13px;
    --gutter: 10px;
}    
    
.column, .columns {padding: 0 10px;}
    
.row { width: 100% !important; margin: 0 !important; padding: 0px 10px; overflow: hidden; }

#menu-freisteller {grid-template-columns: repeat(5, 1fr);}    
    
/* Navigation & Header Menu */
    
.itemnumber {position: absolute; float: right; z-index: 999; top: 30px;width: 20px;}

#newnavigation{display: none;}
#mobile-menu-button, #mobile-menu-button-close {background: var(--color-blue-dark); padding: 5px 10px; color: white; border-radius: 2px;}
#layer-menu {display:none;}
#close-menu {float: right; position: relative; right: 15px; top: 20px;}


.nav ul{margin: 13px 0 40px 0;}

img.logo { left: 10px; margin: 5px 0 15px 0; height: 60px !important;}
    
/* maps */
iframe{max-width: 1024px;}

/* home */

.welcome{padding: 0 15px 10px 0;}
.special_offer{width: 100%;padding: 0 15px 10px 0;}

table{width: 100%;margin: 20px 0;}
.table_container{width: 100%;margin: 20px 0 50px 0;}
table a.button{float: none; max-width: 50px; font-size: 13px;margin: 10px auto;padding: 3px 0;}

div.pagination div.centered{width: 320px;}

iframe{max-width: 768px;}

/* Widgets */
.widget_search input{max-width: 300px; font-size: 12px;text-overflow: ellipsis;padding-right: 30px;}
.widget_distance_30top {top: 0 !important;}

/* WooCommerce */
#free-delivery {display:none;}
a.shopbutton {font-size: 12px;}

/* room intro */

.offer {left:5px !important;right: 5px !important;bottom:5px !important;font-size: 18px !important;padding: 5px 5px !important; }
.offer::before{left: 15px !important; top: -30px !important; } 
    
.offer-large {bottom:15px;}
.offer-large p {font-size: var(--font-small); line-height: 1.0;}
.offer-large-button {font-size: var(--font-small);}
    
.glide__arrow{font-size: 28px !important;}
.glide__arrow--left{left:0em !important}
.glide__arrow--right{right:0em !important}
    

h2.woocommerce-loop-product__title {font-size: 13px !important;}  
li.product.type-product p {font-size: 12px !important;margin-bottom: 0px;}  

/* blog */
.entry ul li,.entry ol li{width: auto;height: auto;margin: 0 0 5px 0;} 
    
    #prefooter {padding: 0 10px;}

}

/* =ipad =768 
------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 767px){
    
:root {
    --font-norm: 15px;
}
    
.grid-3-1 {grid-template-columns: repeat(2, 1fr);grid-gap: 10px;}
.grid-3-3 {;grid-gap: 10px;}
.grid-2-2 {grid-template-columns: repeat(2, 1fr);grid-column-gap: 10px;grid-row-gap: 10px;margin: 0 10px;}

.mobileoff {display: none !important;}
    
.desktop-only {display: none !important;}
.mobile-only {display: block !important;}
    
header#navigation {min-height: 100%; height: auto;}
    
/* Navigation */
    
header nav {
    height: 100%;
  width: 0;
  position: fixed; /* Stay in place */
  z-index: 5; /* Sit on top */
  right: 0;
  top: 0;
  background-color: rgba(0,0,0, 0.4); /* Black w/opacity */
  overflow-x: hidden; /* Disable horizontal scroll */
  transition: 0.2s; /* 0.5 second transition effect to slide in or slide down the overlay (height or width, depending on reveal) */
}
    
header nav #container {width: 95vw; background: white; float: right; padding: 10px 30px; height: 100%;margin-bottom:0;}
    
a.closebtn {font-size: 36px; text-align: right; display: block;}

ul#main-nav {padding-top: 25px;}
ul#main-nav > li {display: block;padding: 0; margin: 0; font-size: 18px; border-bottom: 1px solid var(--grey-lightest);}
ul#main-nav > li a {display: block; margin: 5px 0;}
ul#main-nav > li a:hover {border-bottom: 2px solid white;}
ul#main-nav i {display: inline-block; width: 20px; color: var(--green); text-align: center; margin-right: 10px;}
ul#main-nav li.menu-item-has-children > a::after {content: '\eaa0'; float: right; margin-right: 10px; font-family: "IcoFont"; justify-content: end; }    
ul#main-nav li.img-menu  {border: 0;}

ul#main-nav li.img-menu a {display: flex; background: #f9f9f9; align-items: center; margin-bottom: 3px; border:0; padding: 0;}
ul#main-nav li.img-menu a::after {margin-left: auto;display: inline-block;}
ul#main-nav li.img-menu img {object-fit: cover; height: 50px; width: 90px;border-radius: none; margin-right: 15px; display: inline-block;}
ul#main-nav li.img-menu .sub-menu {display: none !important;}
ul#main-nav li.normal-menu .sub-menu {display: block; margin-left: 0;}
ul#main-nav li.normal-menu .sub-menu a {margin: 0;}

ul#main-nav li.current_page_item {border-bottom: none;}
    
ul#main-nav li ul {display: none; font-size: 15px; }
ul#main-nav > li:hover > ul {
    text-align: left;
    display:block;
    position: relative;
    margin: 0;
    top: 0;
    left: 0;
    float: none;
    background: white;
    width: auto;
    padding: 0px 25px;
    box-shadow: none;
    border-top: none;
    transition: 1s 1s;
    z-index: 3;
    background: white;
    transition-delay:1s;
}
    
ul#main-nav li ul li {display: block;}
ul#main-nav li ul li a {padding: 5px !important;}
    
ul#main-nav > li.mega-menu > ul {column-count: 1; padding: 0px 0; text-align: left;}
ul#main-nav > li.mega-menu > ul > li > a {font-weight: 600;}
ul#main-nav li.mega-menu li  {display: block; margin-left: 0;}
ul#main-nav li.mega-menu ul li ul  {display: none;}
ul#main-nav li.mega-menu ul li:active ul  {display: block;}


    


header .search-container input[type="search"] {width: 100%;}
header .search-container button[type="submit"] {float: right; margin-right: 10px;}
  
    
/* home */
#button-filter-show {display:block;}
#sidebar-filter {display: none;}    

/* WooCommerce: Product Catalogue */
li.product.type-product {padding: 5px !important; margin-top: 15px !important;}
h2.woocommerce-loop-product__title {font-size: 12px !important;}  
li.product.type-product p {font-size: 12px !important;margin-bottom: 0px;}  
h2.woocommerce-products-header__title {font-size: 28px;}

/* WooCommerce: Product Page */
h1.product_title {font-size: 18px !important;}
.summary p {margin: 10px 0;}
.grid-container-2 {
grid-template-columns: repeat(1, 1fr);}
.product {margin-top: 20px !important}
.woocommerce-tabs ul.tabs li{font-size: 12px; padding: 5px 10px !important;}

.offer-large {bottom:10px;}
#supporter .arrow img {transform: rotate(90deg);}
#supporter .arrow {margin: 30px;}

/* =iphone =580
------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 580px){
    
:root {
    --font-norm: 15px;
    --font-h1: 28px;
    --font-h2: 24px;
    --font-h3: 22px;
    --font-h4: 18px;
    --font-h5: 16px;
    --font-h6: 13px;
    --font-small: 11px;
    --font-smallest: 10px;
    --gutter: 5px;
    --padding-add: 10px;
}

.nomobile {display: none !important;}
.mobile-only {display: block;}
.column, .columns{padding: 0 !important;}
    
#header-wrapper {padding: 0px 15px;}
    
    
.row.collapse { margin: 0; padding: 0; }

/* Grids --*/
.grid-6-1, .grid-5-1, .grid-4-1, .grid-3-1, .grid-2-1 {grid-template-columns: repeat(1, 1fr);}
.grid-6-2, .grid-5-2,.grid-4-2, .grid-3-2, .grid-1-2 {grid-template-columns: repeat(2, 1fr); grid-gap: 10px;}
.grid-6-3, .grid-5-3, .grid-4-3 {grid-template-columns: repeat(3, 1fr);}
.grid-container-4-4 {grid-gap: 10px;}
.nine.columns .grid-3-2 {margin: 0;}
    
.grid-padding-200, .grid-padding-300, .grid-padding-100, .grid-padding-50 {padding: 0 10px;}
    
.merge-1-2_3 {grid-column: auto;}
.merge-2-3_3 {grid-column: auto;}

.columns-1-2, .columns-3-2, .columns-4-2 {column-count: 2;} 
.columns-4-1, .columns-3-1, .columns-2-1 {column-count: 1;} 

#breaker .simple-slider-1 {max-height: 450px;}
#breaker .container {
    
    padding: 0px;
}
    
#hero-home {height: 400px; }
#hero-home img {height: 400px; object-fit: cover;width: 100%;}
#hero-home .bottom-centered {position: absolute;bottom: 40px;left: 50%; width: 100%; padding: 0 20px; transform: translate(-50%, 0%);}
    
#room-hero {max-height: 45vh; }
#room-hero img {height: 45vh;}
#room-hero h1 {font-size: 38px;}
    
.mobileslide {width: 100% !important; overflow: scroll; display: block; white-space:nowrap; overflow-scrolling: touch; scroll-snap-type: x mandatory; scrollbar-width: none;}
.mobileslide > div {width: 80vw !important; display: inline-block; overflow-wrap: break-word; white-space: normal;scroll-snap-align: center;  scroll-snap-stop: always;}
    
#menu-freisteller {grid-template-columns: repeat(3, 1fr);}
#menu-freisteller img {width: 80px;}
    
#infobox {grid-template-columns: repeat(1, 1fr);grid-gap: 0px;}
#infobox .image {min-height: 200px;}
#infobox .left-arrow {padding: 20px;}
    
.button4 {padding: 5px 10px;}
    
#beige, #block {padding: 25px var(--padding-add);}
    
    #app {padding-left: -10px; padding-right: -10px;}

.room_intro .bottom-left {position: absolute;bottom: 0px;left: 7px;}
.room_intro h3 {font-size: 18px; margin: 7px 0; }
.room_intro .gradient {background: linear-gradient(rgba(0, 0, 0, 0.0)60%, rgba(0, 0, 0, 0.6) 100%);}
.room_intro ul#featured_list {padding: 7px;}
    
#katalog-tile {border: 1px solid var(--color-grey-lighter); padding: 10px;}

.image-1 {
    display: block;
    width: 70%; /* First image 50% width */
    position: relative;
    left: none; /* Position it at the top */
    top: 50px;
    z-index: 2;
}
img.image-1  {object-fit: cover; width: 70vw; height: 35vh;}

.image-2 {
    width: 80%; /* Second image 30% width */
}

.image-3 {
    width: 65%; /* Third image 40% width */
    position: relative;
    right: 0;
    bottom: 10%;
    left: 35%;
}   
img.image-3  {object-fit: cover; height: 30vh;}
   
.handwritten-box {font-size: 28px; width: 55%;left: -20px;}
.handwritten-box::after {
  content: '';
  position: relative;
    display: block;
  width: 120px; /* Adjust size as needed */
  height: 30px;
  background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 50"><path d="M0,1.94C.14,1.46.43.49.57,0c3.2,0,6.14,1.47,9.18,2.32,31.78,8.52,65.12,13.34,97.97,9.27-.93-2.7-1.82-5.4-2.7-8.11,3.23-2.29,7.19-.55,10.76-.3,7.23,1.24,14.56,1.62,21.88,1.6,2.37.36,2.83,3.18,1.07,4.58-8.03,6.38-17.59,10.4-26.63,15.12-1.5-2.37-2.35-5.07-3.22-7.72-29.3,3.78-59.2.81-87.79-6.13C13.9,8.41,5.53,7.51,0,1.94Z" fill="black" stroke="none" /></svg>') no-repeat;
  background-size: contain;
  bottom: -10px;
  left: 50%;
  transform: rotate(10deg);
}
    

/* Room --*/    
    
#room > #hero img {height: 300px;}
#room > #hero .centered {position: absolute; top: 50%; left: 50%; width: 95%; transform: translate(-50%, -50%);}
#room > #hero a.button3 {font-size: 12px;}    
    
#sidebar #beratung, #sidebar #karte {padding: 10px 60px 10px 10px; border-radius: 5px;}
#sidebar a.button {font-size: 10px; padding: 5px;}
#sidebar p {margin-bottom: 10px; font-size: 13px; text-shadow: 0px 0px 5px rgba(0,0,0,1);}
#sidebar h3 {font-weight: bold;}
    
.widget_distance_30top {text-align: left;}
#corona {font-size: 10px; padding: 5px !important;}
#corona .close {cursor: pointer;position: absolute;top: 2px;right: 10px;width: 20px;opacity: 0.5;}
iframe{max-width: 520px;}
    
#breaker .container {padding: 20px;
}
#breaker .image {
  order: -1;
}

    
#newsletter img.icon {width: 50px; margin-right: 20px;}
#prefooter {grid-template-columns: repeat(2, 1fr);grid-column-gap: 10px;grid-row-gap: 10px;margin: 10px;} 
#prefooter .widget {font-size: 11px; margin-bottom: 0;}
#prefooter .widget img.size-thumbnail {width: 55px; margin-right: 10px;}
    
ul#payment {text-align: center; margin: 15px 0;}
ul#payment li {margin: 0 5px 5px 0;}
ul#payment img {width: 65px; border-radius: 3px;}
    
#pretty {height: 400px;  text-align: left;margin-bottom: 20px; position: relative; display: block; overflow: hidden;}
#pretty img {object-fit: cover; height: 100%; display: block;}
#pretty #content {left: 0px;transform: translate(0, -50%);}
#pretty #content .row {width: 100%; padding-left: 20px;}
#pretty #content .row p {margin-bottom: 0px;}

#pretty h1 { margin-bottom: 20px; font-weight: bold;}

a.widgetbutton {padding: 3px;margin: 0;display: block;font-size: var(--font-small);}

ul.columns-2 {column-count: 1;}
    
#gallery #image-boxx .card .container {width: 80vw;}
    
/* Anderes Thema --*/
#produkte {width: 100% !important; overflow: scroll; white-space:nowrap;}
#produkte #produktkatalog-widget {width: 180px !important; display: inline-block; overflow-wrap: break-word; white-space: normal; margin: 5px 0px;}
      
.hs {grid-auto-columns: calc(50% - var(--gutter) * 2);}
    
    form.mailpoet_form.mailpoet_form_form.mailpoet_form_shortcode {padding: 0;}
    #mailpoet_form_4 input {padding: 10px !important;}
    
/* WooCommerce --*/
input#coupon_code {width: 100px !important;}
.wc-tab h2 {margin-bottom: 0 !important;}
.woocommerce-billing-fields__field-wrapper input.input-text  {padding: 7px !important;}
label {font-size: var(--font-small);}
label.checkbox.woocommerce-form__label.woocommerce-form__label-for-checkbox {font-size:10px; line-height:1.0;}
.woocommerce table.shop_table {text-align: left !important;}
.product-thumbnail {display: block !important;flex-basis: 50% !important;}
.item-name a{font-size: 17px !important;}
table.shop_table.shop_table_responsive tr td{text-align: left !important;}
#sticky-wrapper img.attachment-woocommerce_thumbnail.size-woocommerce_thumbnail {width: 80px !important;}
.shop_table td::before, td.product-name::before {display: none;}
.product-name {text-align: left;}    
#sticky-wrapper #beratung {display:none !important;}
#sticky-wrapper .eight.columns, #sticky-wrapper .four.columns {padding: 0 !important;}
.welcome img {display: block;width: 100%;margin-bottom: 20px;}
    a.single_photo_button {font-size: 16px;}
.woocommerce .information-table {-webkit-column-count: 1; -moz-column-count:1; column-count: 1;}
.woocommerce #preis-informationen .sideinfo, .woocommerce #preis-informationen .sideinfo .woocommerce-price-suffix {font-size: 10px !important;}
.woocommerce div.product div.summary {padding: 10px;}
nav.woocommerce-breadcrumb {font-size:9px !important; margin-bottom: 0px !important;}
    .woocommerce #versandoptionen h5 {font-size: 13px;}
    .woocommerce #versandoptionen div {padding: 10px; border-radius: 3px;}
    .woocommerce #versandoptionen div span {font-size: 10px; line-height: 1.2;}
    .woocommerce #versandoptionen {grid-gap: 10px; margin: 0;}
    .woocommerce form.cart {margin-bottom: 0px !important;}
    .woocommerce hr {margin-bottom: 0px;}
li.product h2.woocommerce-loop-product__title, li.product p, li.product .price, li.product .label-sustainable, li.product .label-notavailable {padding-left: 5px !important; padding-right: 5px;}  
.woocommerce h1.product_title {font-size: var(--font-h4) !important;}
    .woocommerce .woocommerce-product-details__short-description p {font-size: var(--font-norm) !important; font-weight: normal;}
    
    .woocommerce #gesamt {display: block;}
    .woocommerce #gesamt .mengenrechner, .woocommerce #gesamt .gesamtsumme {font-size: var(--font-small);}
    
/* Suche */    

    #search .grid.grid-4-2 {grid-gap: 5px;}
    #search-result {padding: 5px;}
    #search-result h4 {font-size: 13px; margin: 7px 0;}
    
    
/* Produktkatalog */

#produktkatalog {padding: 0; margin:0;}
#produktkatalog h4 {font-size: var(--font-small);}
#produktkatalog .beschreibung ,#produktkatalog p {font-size: 11px !important;}
#produktkatalog .priceinfo {font-size: 13px !important;}
#produktkatalog .uvpinfo, #produktkatalog-widget .uvpinfo {text-align: right; font-size: 10px;margin:0; padding:0; color: var(--color-grey-main);}
#produktkatalog .priceinfo b, #produktkatalog-widget .priceinfo b {font-size: 18px;}
    
#produktkatalog .rabatt, #produktkatalog-widget .rabatt{
    position: absolute;
    top: 7px;
    right:0px;
    background: var(--color-red-main);
    padding:2px 3px;
    font-weight: 600;
    color: white;
    font-size: 11px;}    
    
#produktkatalog-widget {border: 0px solid #e8e8e8; display: inline-block; margin: 0px;
    border: 1px solid rgba(79,79,79,0.1);
	position:relative;
}
    
    .widget_search input{max-width: 200px; font-size: 12px;
    text-overflow: ellipsis;padding-right: 30px;}
    
#supporter ul li::before {left: 10px;}
#supporter {text-align: left;}
#supporter ul li {padding-left: 0px; margin-bottom: 3px; list-style: none; display: inline-block;}

/* WooCommerce: Product Catalogue */
ul li.product-category {margin: 5px 0 !important; }
ul li.product-category h2.woocommerce-loop-category__title {font-size: var(--font-h6);}
h2 .count {font-weight: normal; color: var(--color-grey-light);}

li.product.type-product {padding: 0 !important; margin-top: 0px !important;}
li.product.type-product img {padding: 0 !important; margin-bottom: 5px !important;}
    li.product.type-product:hover {box-shadow: none;}
h2.woocommerce-loop-product__title {font-size: 12px !important;}
li.product.type-product:hover h2.woocommerce-loop-product__title {text-decoration: underline;}
li.product.type-product p {font-size: 12px !important;margin-bottom: 0px;}  
h2.woocommerce-products-header__title {font-size: 28px;}
    .onsale {font-size: 12px !important;}
    

ul#featured_list {list-style:none; font-size: 10px; margin-left: 0px; }
ul#featured_list li:before {margin-right: 5px; height: 6px; width: 10px; top: 1px; position: relative;}
a ul#featured_list li {margin-top: 2px;}  
    
#redbox input {width: 49%;display: inline-block;}
#redbox button {width: 49%;font-size: 12px;display: inline-block;}

#katalog p {font-size: 12px !important;}   
#katalog h3 {font-size: 16px !important;}
    
#room-beratung {margin-bottom: 50px; padding: 20px 0; text-align: center;}
#room-beratung a.button {font-size: 15px; display: inline-block;}
#room-beratung img {float: none; max-width: 250px; margin: 0; }    
#room-beratung p {font-size: 12px;}

.top p, ul#misc, .nav ul{display: none;}
.top p.slide{display: block;}

h1 {margin: 15px auto;}

.offer-large-teaser {display: none;}
.offer-large {left: 5px; bottom: 8px;}
.offer-large-title {padding: 4px 8px;}
.offer-large-button {margin-bottom: 0px;}
    .offer-large p {display: none;}

.grid-3-1 .item-thumb img {object-fit: cover; height: 70vw; width: 100vw;}

.grid-3-2 .item-thumb {margin: 0; padding: 0;}
.grid-3-2 .item-thumb .offer-large {position: relative; left: 0;}
.grid-3-2 .item-thumb .offer-large p, .grid-3-2 .item-thumb .offer-large .offer-large-button {display: none;}

#homepage-lower-bar-desktop {display: none;}
#homepage-lower-bar-mobile {display: block; grid-row: ; grid-column: 1 / 3; background: red; background: var(--color-blue-dark); padding: 10px 20px; color: white;}


/* room intro */
.handwritten-box-down {font-size: 24px; transform: none;}
.handwritten-box-down {width: 100%; display: block; top: 0; margin-bottom: 15px;}
    
    
.offer {font-size: 14px !important;padding: 3px 3px;}
.offer::before{left: 15px;top: -29px;}   
    
#service_listing:nth-of-type(even) .entry {order: 2;}
#service_listing:nth-of-type(even) .image {order: 1;}
      
#content-header {padding: 0 10px;}

.img_center {padding: 0; margin:0;}

/* room */
div.pagination div.centered{max-width: 320px;}
dl dd{width: 100%;}

    
    
/* footer */
.footer h4{margin: 20px 0 10px 0;}
ul.room-menu li a{margin: 10px;font-size: 11px;padding-bottom: 5px;}

}

/* =iphone =320
------------------------------------------------------------------------------------------*/
@media only screen and (max-width: 320px){
    
:root {
    --font-norm: 14px;
    --font-h1: 20px;
    --font-h2: 18px;
    --font-h3: 16px;
    --font-small: 11px;
}

.grid-3-1 .item-thumb img {object-fit: cover; height: 300px;}    

.front-category {font-size: 11px !important;}
.fab {display: none;}
#produktkatalog {margin:0px !important; box-shadow:none!important;}

/* maps */
iframe{max-width: 320px;}

.top p, ul#misc,.nav ul{display: none;}
.top p.slide{display: block;}

h1 {margin: 10px auto;}

.offer-large-teaser {display: none !important;}
.offer-large-button {display: none !Important;}

/* room intro */

.img_center {padding: 0; margin:0;}

/* blog */
.entry{float: left;width: 100%;padding: 25px 10px 10px 10px;    background-color: #fff;}
.entry ul li,.entry ol li{width: auto;height: auto;margin: 0 0 5px 15px;}

/*pagination links */
div.pagination a{width: 16px;margin: 0px 5px 0 0;padding: 4px 0;}
div.pagination span{width: 16px;height: 16px;}
#produktkatalog .priceinfo {font-size: 12px !important;}

.reply input{clear: both;width: 220px;}
.reply textarea{clear: both;width: 260px}

dl dt{display: none;}
}