/* ============================================================
   Astroid -> TemplateToaster
   Projekt: usedom-web.de
   ============================================================ */

body {
    margin: 0;
    background-color: transparent;
    background-image: url(/../images/background/page_sommer_2.webp);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: auto;
    background-attachment: fixed;
    background-clip: padding-box;
}
/* Kein Seitenhintergrund auf Smartphone und Tablet */
@media (max-width: 991.98px) {

    html,
    body,
    #ttr_page,
    #ttr_page_inner,
    #ttr_content_and_sidebar_container {
        background-image: none !important;
        background-attachment: scroll !important;
    }
}
/* weißer Hintergrund transparent Inhalt u. Seitenleiste */
#ttr_content_and_sidebar_container {
  background: rgba(255,255,255,0.87) !important;
  margin: 15px 0 15px 0 !important;
}

#ttr_content_margin {
  background-color: transparent !important; 
  background: none !important; 
}

#ttr_sidebar_right_margin {
 background-color: transparent !important; 
 background: none !important; 
}

.breadcrumb > li + li::before {
    content: "/";
    margin: 0 8px;
}
.breadcrumb a {
    color: #428BCA !important;
    text-decoration: none !important;
   transition: color .25s ease, padding-left .25s ease;
}

.breadcrumb a:hover,
.breadcrumb a:focus {
    color: #1f4e79 !important;
    padding-left: 2px;
}

/* ============================================================
   HEADER
   ============================================================ */

/* Inhalt */
/* Phocamaps */

.pmMarkerTitle {
  display: none !important;
}

.gm-style .gm-style-iw {
  font-weight: bold !important;
}
.gm-style .gm-style-iw a:hover {
color: #b41412 !important;
}

/* MENÜ */
/* ==========================================================
   Hauptmenü – animierte Dropdown-Pfeile
========================================================== */

/* TemplateToaster-Pfeilgrafik entfernen */
.ttr_menu_items_parent > .ttr_menu_items_parent_link_arrow {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    gap: .45rem;

    background-image: none !important;
    padding-right: 0 !important;
}

/* Chevron erzeugen */
.ttr_menu_items_parent > .ttr_menu_items_parent_link_arrow::after {
    content: "";
    display: inline-block;

    width: .42rem;
    height: .42rem;

    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;

    transform: translateY(-2px) rotate(45deg);
    transform-origin: center;

    transition: transform .25s ease;
}

/* Pfeil bei geöffnetem beziehungsweise berührtem Menü drehen */
.ttr_menu_items_parent:hover
> .ttr_menu_items_parent_link_arrow::after,

.ttr_menu_items_parent:focus-within
> .ttr_menu_items_parent_link_arrow::after,

.ttr_menu_items_parent.show
> .ttr_menu_items_parent_link_arrow::after,

.ttr_menu_items_parent.open
> .ttr_menu_items_parent_link_arrow::after {
    transform: translateY(2px) rotate(225deg);
}

/* ============================================================
  Inhalt
  =============================================================*/
/* -----------------------------------------------------------
   TemplateToaster-Listenformatierung im Inhaltsbereich zurücksetzen
----------------------------------------------------------- */

#ttr_content ul,
#ttr_content ol {
    text-indent: 0 !important;
    margin-left: 0;
    padding-left: 0;
}

#ttr_content ul li,
#ttr_content ol li {
    text-indent: 0 !important;
    margin-left: 0;
    padding-left: 0;
}

/* Technische Solidres-Listen ohne Aufzählungszeichen */
.sr-hub-shortcuts__list,
.sr-hub-shortcuts__list > li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    text-indent: 0 !important;
}
/* Redaktionelle Listen in Objekt- und Unterkunftsbeschreibungen */
#ttr_content .item-page ul,
#ttr_content .com-solidres-reservationasset ul,
#ttr_content .com-solidres-roomtype ul,
#ttr_content .promotion-list {
    list-style: disc outside;
    padding-left: 1.4rem;
    margin: 0.5rem 0 1rem;
}


#ttr_content .item-page ol,
#ttr_content .com-solidres-reservationasset ol,
#ttr_content .com-solidres-roomtype ol {
    list-style: decimal outside;
    padding-left: 1.4rem;
    margin: 0.5rem 0 1rem;
}

#ttr_content .item-page li,
#ttr_content .com-solidres-reservationasset li,
#ttr_content .com-solidres-roomtype li {
    margin-bottom: 0.3rem;
    padding-left: 0.15rem;
}
#ttr_content .item-page li,
#ttr_content .com-solidres-reservationasset li,
#ttr_content .com-solidres-roomtype li,
#ttr_content .promotion-list li {
    text-align: left !important;
}
@media (max-width: 767.98px) {

    #ttr_content .item-page ul,
    #ttr_content .item-page ol,
    #ttr_content .com-solidres-reservationasset ul,
    #ttr_content .com-solidres-roomtype ul,
    #ttr_content .promotion-list {
        padding-left: 1rem;
    }
}

/* Button Fewo-Seite */

.custom-file-label::before, .btn, .btn:focus {
  padding: 5px 10px 5px 10px !important;
}
/* Tabellen Preise */

/* 1008 */

	table.preise_1008 {
		width: 300px !important;
		border: 1px solid #999999 !important;
		padding: 2px !important;
		border-collapse: collapse !important;
		font-size: 8pt !important;
	}

	td.spalte_1_1008 {
	
		border: 1px solid #999999 !important;
		text-align: center !important;
	}
	tr.zeile_1_1008 {
		background: #FFFFFF !important;
	}

	tr.zeile_2_1008{
		background: #E6E6FF !important;
	}

/* 1017a */

	td.c3 {
		background-color: #99CCFF;
      font-size: 12px !important;
	}

	tr.c2 {
		background-color: #99CCFF;
      font-size: 12px !important;
	}

	tr.c1 {
		background-color: #FFFFFF;
      font-size: 12px !important;
	}

/* 1045a */
    	table.preise_45a {
		min-width: 300px;
		border: 1px solid #999999;
		padding: 5px 2px 5px 2px;
		border-collapse: collapse;
		font-size: 8pt;
		margin-left: 2px;
	}
	td.spalte_1_45a {
		
		border: 1px solid #999999;
		text-align: center;
		padding: 5px 2px 5px 2px;
	}
	td.spalte_2_45a {
		
		border: 1px solid #999999;
		text-align: center;
		padding: 5px 2px 5px 2px;
	}
	td.spalte_3_45a {
		
		border: 1px solid #999999;
		text-align: center;
		padding: 5px 2px 5px 2px;
	}
	tr.zeile_1_45a {
		background: #FFFFFF;
	}
	tr.zeile_2_45a {
		background: #E6E6FF;
	}

/* 1045b */
	table.preise_45b {
		min-width: 300px;
		border: 1px solid #999999;
		padding: 5px 2px 5px 2px;
		border-collapse: collapse;
		font-size: 8pt;
		margin-left: 2px;
	}
	td.spalte_1_45b {
		
		border: 1px solid #999999;
		text-align: center;
		padding: 5px 2px 5px 2px;
	}
	td.spalte_2_45b{
		
		border: 1px solid #999999;
		text-align: center;
		padding: 5px 2px 5px 2px;
	}
	td.spalte_3_45b {
		
		border: 1px solid #999999;
		text-align: center;
		padding: 5px 2px 5px 2px;
	}
	tr.zeile_1_45b {
		background: #FFFFFF;
	}
	tr.zeile_2_45b {
		background: #E6E6FF;
}

/* 1147 */

	table.preise_1147 {
		width: 300px;
		border: 1px solid #999999;
		padding: 2px;
		border-collapse: collapse;
		font-size: 8pt;
	}

	td.spalte_1_1147 {
		
		border: 1px solid #999999;
		text-align: center;
	}

	tr.zeile_1_1147 {
		background: #FFFFFF;
	}
    tr.zeile_2_1147 {
		background: #E6E6FF;
	}

/* Seite Sonderangebote */


.promotion-item h1,  
.promotion-item h1 a {
  font-size: 22px !important;
  font-family: "Roboto Slab","Arial" !important;
}
.promotion-item h1 a:hover {
  color: #df530a !important;
}


/* ============================================================
  Module Seitenleiste
  =============================================================*/
/* Wasser Modul */

.ttr_block .wasser {
padding-left: 6%;
} 

/* Buch Modul */ 

.ttr_block .buch {
padding: 16px;
color: #777777;
border: 1px solid rgb(221, 221, 221) !important;
} 

/* Login Modul */ 

.ttr_block.login {
background-color: #c0d1df;
padding: 12px;
color: #777777;
border: 1px solid rgb(221, 221, 221);
} 

input.checkin_module, input.checkout_module {
color: #777777;
font-size: 15px;
}

/* Modul Sonderangebote */

.promotion-item-module  .sonder {
border-bottom: 1px solid #000000 !important;
}
/* ============================================================
   SOLIDRES
   ============================================================ */
/* Suche ohne Datum */

.ttr_block.ohne_datum {
    background: #c0d1df !important;
    padding: 16px;
}
@media (min-width: 1200px){
#sr-advancedsearch-form-131 {
  display: flex;
  gap: 20px;
  align-items: center;
  flex-wrap: nowrap;
}
.ohne_datum .col-md-6.mb-3 {
  width: 190px !important;
    margin-bottom: 10px !important;
  } 
.ohne_datum .d-grid {
  width: 190px !important;
  margin-left: 10px !important;  
  margin-top: 4px !important; 
}
  }


/* Suche ohne Datum – Tablet */
@media (min-width:576px) and (max-width:1199.98px){

    .contenttopcolumn1 > .cell2.col-sm-6:has(.ohne_datum){
        width:100% !important;
        max-width:100% !important;
        flex:0 0 100% !important;
    }
}

h3.ttr_block_heading {
  font-weight: bold !important;
  margin: 10px 0px 0px 0px !important;
  line-height: 24px !important;
}


/* erweiterte Suche */
.ttr_block.erw_suche {
background-color: #c0d1df !important;
}

/* Solidres Carousel Startseite */

.row.solidres-module-asset h4, .row.solidres-module-asset p { 
  text-align: center;
  line-height: 16px;
  margin-top:20px!important;
}
.row.solidres-module-asset p{
  display: flex;
  justify-content: center;
}
.row.solidres-module-asset .carousel-inner {
  text-align: center;
}
.row.solidres-module-asset h4 {
  margin-top: 0px;
}
.carousel img {
background-color: #c0d1df;
  padding: 4px;
}
.carousel-control-prev-icon {
  font-size: 16px !important;
}
@media screen and (min-width: 750px){
.carousel-control-next {
  right:15px;
}
}
/* Solidres Suchergebnisse Liste */

.col-md-9 h3 a:hover {
  font-size: 22px !important;  
}

#search-results p{
  text-align: left;
}
.sortfilterbar-map {
  display:none;
}
.room_type_details img {
  max-width: 100%;
}
#solidres .room-type-row .inner {
  margin: 5px;
  font-size: 14px !important;
  color: #000;
  }

.badge.bg-success {
  background-color: #8cc14c !important;
  font-size: 14px !important;
  padding: 7px !important;
  }

 .tariff_val {
  display: none !important;
}

.dropdown-menu > li > a,
.dropdown-menu > li > span.separate {
    color: #000000 !important;
    padding: 10px 20px !important;
}

/*aublenden Objekt-Ausstattung */
#asset-desc .sr-facilities, #asset-desc h3 {
  display:none;
}

/* Solidres – Unterkunftsliste – Personen-Badge  */

.room-type-row .badge.bg-info,
.room-type-row .badge.bg-info:hover {
    background-color: rgb(172, 174, 174) !important;
    padding: 1em !important;
    margin-right: 5px;

    font-size: 12px;
    cursor: default !important;
    transform: none !important;
    transition: none !important;
}



/*  =========================================================
    FEWO ANSICHT OBJEKT 
    ========================================================= */
.reservation_asset_default h1 {
      font-size: 1.6rem;
    font-weight: 400;
    color: #2f6ea5;
    margin-bottom: 15px;
}
.reservation_asset_item .reservation_asset_subinfo {
  color:#757575 !important; 
}
/* Abstand Karten-Link */
.show_map {
  margin-left: 20px;
}

/* Abstand Ausstattung zur Beschreibung */
.roomtype_desc {
  margin-bottom: 20px;
}

/*  =========================================================
    FEWO ANSICHT Unterkunft
    ========================================================= */
/* Hintergrund */
div.even {
  background: #ffffff !important;
}


/* Farbe Austattungs-Icons */
svg[class*="sr-icon-"],
svg[class*="sr-icon-"] use {
    fill: #6a9fc4 !important;
    stroke: #6a9fc4 !important;
    color: #6a9fc4 !important;
}

/* Breite Anfrage  */
.modal-dialog.jviewport-width90 {
  width:40vw !important;
  max-width:600px !important;
  min-width:350px !important;
  margin: auto;
}

/* email ausblenden */
.email-32, .email-34, .email-36, .email-40, .email-41,.email-42, .email-61, .email-62, .email-63, .email-64, .email-82, .email-98, .email-106, .email-107, .email-111, .email-112,.email-113,.email-123, .email-124, .email-142, .email-143, .email-157, .email-158, .email-159, .email-163, .email-164 {
   display: none !important;

}
/* Button Kalender ausblenden */

#room_type_row_39 .load-calendar, 
#room_type_row_37 .load-calendar,
#room_type_row_51 .load-calendar, 
#room_type_row_52 .load-calendar,
#room_type_row_53 .load-calendar, 
#room_type_row_54 .load-calendar,
#room_type_row_55 .load-calendar, 
#room_type_row_56 .load-calendar,
#room_type_row_57 .load-calendar,#room_type_row_58 .load-calendar,
#room_type_row_65 .load-calendar,
#room_type_row_66 .load-calendar,
#room_type_row_67 .load-calendar,
#room_type_row_68 .load-calendar,
#room_type_row_71 .load-calendar,#room_type_row_72 .load-calendar,
#room_type_row_74 .load-calendar,
#room_type_row_75 .load-calendar,
#room_type_row_76 .load-calendar,
#room_type_row_77 .load-calendar,
#room_type_row_80 .load-calendar,
#room_type_row_82 .load-calendar,
#room_type_row_83 .load-calendar,
#room_type_row_84 .load-calendar,
#room_type_row_86 .load-calendar,
#room_type_row_87 .load-calendar,
#room_type_row_89 .load-calendar,
#room_type_row_90 .load-calendar,
#room_type_row_91 .load-calendar,
#room_type_row_92 .load-calendar,
#room_type_row_93 .load-calendar,
#room_type_row_94 .load-calendar,
#room_type_row_95 .load-calendar,
#room_type_row_96 .load-calendar,
#room_type_row_98 .load-calendar,
#room_type_row_99 .load-calendar,
#room_type_row_100 .load-calendar,
#room_type_row_103 .load-calendar,
#room_type_row_104 .load-calendar,
#room_type_row_106 .load-calendar,
#room_type_row_107 .load-calendar,
#room_type_row_108 .load-calendar,
#room_type_row_109 .load-calendar,
#room_type_row_110 .load-calendar,
#room_type_row_112 .load-calendar,
#room_type_row_113 .load-calendar,
#room_type_row_116 .load-calendar,
#room_type_row_117 .load-calendar,
#room_type_row_118 .load-calendar,
#room_type_row_119 .load-calendar,
#room_type_row_120 .load-calendar,
#room_type_row_123 .load-calendar,
#room_type_row_124 .load-calendar,
#room_type_row_137 .load-calendar,
#room_type_row_140 .load-calendar,
#room_type_row_141 .load-calendar,
#room_type_row_142 .load-calendar,
#room_type_row_143 .load-calendar,
#room_type_row_146 .load-calendar,
#room_type_row_147 .load-calendar,
#room_type_row_150 .load-calendar,
#room_type_row_154 .load-calendar,
#room_type_row_155 .load-calendar,
#room_type_row_156 .load-calendar,
#room_type_row_160 .load-calendar,
#room_type_row_161 .load-calendar,
#room_type_row_162 .load-calendar,
#room_type_row_163 .load-calendar,
#room_type_row_164 .load-calendar,
#room_type_row_168 .load-calendar,
#room_type_row_171 .load-calendar
{
  display: none;
}

/* ============================================================
   SOLIDRES - Belegungskalender
   ============================================================ */

/* Tageszellen zentrieren */
.availability-calendar .row-month-day td {
    height: 46px;
    padding: 0 !important;
    text-align: center !important;
    vertical-align: middle !important;
    line-height: 46px;
}

/* Belegte Tage zentrieren */
.availability-calendar .row-month-day td > a {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: 46px !important;
    padding: 0 !important;
    line-height: 1 !important;
    box-sizing: border-box;
    text-decoration: none;
}

/* Heutigen Tag sauber ausrichten */
.availability-calendar .row-month-day td > .today {
    display: inline-block;
    line-height: normal;
}

/* Vergangene Tage grau */
.availability-calendar .row-month-day td.past,
.availability-calendar .row-month-day td.past > a {
    color: #999 !important;
}

/* Vergangene Buchungen nicht mehr farbig markieren */
.availability-calendar .row-month-day td.past.busy,
.availability-calendar .row-month-day td.past.busy > a {
    background: transparent !important;
    background-image: none !important;
    color: #999 !important;
}

/* An-/Abreise-Dreiecke bei vergangenen Buchungen ausblenden */
.availability-calendar .row-month-day td.past.busy::before,
.availability-calendar .row-month-day td.past.busy::after,
.availability-calendar .row-month-day td.past.busy > a::before,
.availability-calendar .row-month-day td.past.busy > a::after {
    display: none !important;
}
/* -----------------------------------------------------------
   Solidres Belegungskalender
   Belegte Tage sollen beim Hover unverändert bleiben.
   Die Hintergründe (voll, Anreise, Abreise) kommen von Solidres.
----------------------------------------------------------- */

.availability-calendar td.busy > a:hover,
.availability-calendar td.busy > a:focus {
    color: #000 !important;
    text-decoration: none !important;
    cursor: default;
}

/* UNVERBINDLICHE BUCHUNGSANFRAGE   
Doppelten Pflichtfeld-Stern verhindern */
label.required::after {
    content: none !important;
    display: none !important;
}
#solidres label.required .star {
    color: #c9302c;
    font-weight: bold;
}

/* ========================================= 
   ONLINE-BUCHUNG
  ==========================================  */
/* Solidres-Datepicker mit mehreren Monaten */
.ui-datepicker {
    width: auto !important;
}



/* ============================================================
   BOOTSTRAP MODALS - TemplateToaster-Korrektur
   ============================================================ */

#ttr_content .modal {
    display: none;
    overflow: hidden;
    position: fixed;
}

#ttr_content .modal.show {
    display: block;
    overflow-x: hidden;
    overflow-y: auto;
}

#ttr_content .modal-dialog {
    position: relative;
    width: auto;
    margin: 1.75rem auto;
    pointer-events: none;
}

#ttr_content .modal-content {
    position: relative;
    display: flex;
    flex-direction: column;
    pointer-events: auto;
}

/* Zugriffe */
.solidres-hits {
text-align: right !important;
}



/* Solidres Button Mehr Informationen ausblenden */
.toggle_more_desc
{
  display: none;
}

/* Sonderangebote */

/* Sonderangebote Modul */  
.sonder img {
  display: block !important;
  margin: auto !important;
  max-width: 100%;
}
.promotion-item .property_image {
  display: block !important;
  margin: 15px auto 15px auto !important;
  max-width: 100%;
}
.promotion-item h1 {
  margin-top: 10px !important;
  line-height: 24px !important;
}
/*
.promotion-item {
  margin-left: 2px;
}
*/
.promotion-item-module h3 {
  font-size: 14px !important;
  line-height: 18px;
  }

/* ============================================================
   SOLIDRES - Kartenansicht
   ============================================================ */

body.contentpane,
body.component-body,
.component-content {
    background: #000000 !important;
    background-image: none !important;
}
.gm-style .gm-style-iw-d h2 {
    font-size: 18px !important;
    color: #037fbb !important;
  }

.gm-style .gm-style-iw ul,
.gm-style .gm-style-iw li {
    list-style: none !important;
    list-style-image: none !important;
}

.gm-style .gm-style-iw li::marker {
    content: "" !important;
}


/* ============================================================
   Bootstrap / Solidres Dropdowns
   ============================================================ */

.navbar-nav,
.navbar-nav ul,
.navbar-nav li,
.dropdown-menu,
.dropdown-menu li {
    list-style: none !important;
    list-style-image: none !important;
}

.navbar-nav li::marker,
.dropdown-menu li::marker {
    content: "" !important;
}

/* ========================================================
    DASHBOARD PARTNER 
  ========================================================= */
/* Bootstrap-Caret wieder sichtbar machen */

.navbar .caret {
    display: inline-block;
    margin-left: .35rem;
    vertical-align: middle;
    width: 0;
    height: 0;
    border-top: .35em solid currentColor;
    border-right: .30em solid transparent;
    border-left: .30em solid transparent;
}
/*  Dropdown-Menü */

/* Menüfläche */
.navbar .dropdown-menu {
    min-width: 160px;
    padding: .35rem 0 !important;
    background: #fff !important;
    border: 1px solid #d8dde3 !important;
    border-radius: 4px !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, .12) !important;
}

/* Von TemplateToaster gesetzte Hintergründe entfernen */
.navbar .dropdown-menu > li {
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
}

/* Menüeinträge */
 .navbar .dropdown-menu .dropdown-item {
    display: block;
    width: 100%;
    padding: .5rem 1rem !important;
    margin: 0 !important;

    color: #333 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;

    text-indent: 0 !important;
    white-space: nowrap;
}

/* Hover und Tastaturfokus */
.navbar .dropdown-menu .dropdown-item:hover,
 .navbar .dropdown-menu .dropdown-item:focus {
    color: #fff !important;
    background: #078fc1 !important;
}

/* Aktueller beziehungsweise angeklickter Eintrag */
.navbar .dropdown-menu .dropdown-item.active,
.navbar .dropdown-menu .dropdown-item:active {
    color: #fff !important;
    background: #078fc1 !important;
}

/* ==========================================================
   HAUPTMENÜ – TEMPLATEToaster-Dropdown wiederherstellen
========================================================== */
@media (min-width: 768px) {
  
#nav_menu .ttr_menu_items_parent > .dropdown-menu {
    min-width: 220px;

    margin: 0 !important;
    padding: 0 !important;

    background-color: #e5e5e5 !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Einzelne Menüzeilen */
#nav_menu .dropdown-menu > li {
    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
}

/* Links im Untermenü */
/* ==========================================================
   HAUPTMENÜ – TEMPLATEToaster-Dropdown
========================================================== */

#nav_menu .dropdown-menu > li > a {
    display: block;
    width: 100%;

    margin: 0 !important;
    padding: 13px 20px !important;

    color: #111 !important;
    background: transparent !important;

    border: 0 !important;
    border-radius: 0 !important;

    font-family: inherit;
    font-size: 16px;
    line-height: 1.25;

    text-decoration: none !important;
}

/* Hover und Tastaturfokus */
#nav_menu .dropdown-menu > li > a:hover,
#nav_menu .dropdown-menu > li > a:focus {
    color: #f5b400 !important;
    background-color: #078fc1 !important;
}
}
/* ==========================================================
   Rezeption – Suchfeld
========================================================== */

.sr-frontdesk__search {
    position: relative;
}

.sr-frontdesk__search-icon {
    position: absolute !important;
    top: 50% !important;
    left: .75rem !important;
    z-index: 2;

    transform: translateY(-50%) !important;
    line-height: 1 !important;
    color: #6c757d;

    pointer-events: none;
}

.sr-frontdesk__search-icon::before {
    position: static !important;
    margin: 0 !important;
    font-size: .9rem;
}

.sr-frontdesk__search input[type="search"] {
    padding-left: 2.2rem !important;
}


 /* Inhalt Kästen anpassen */
.sr-hub-shortcut__link {
gap: .5rem !important;
}
/* Partner-Dashboard: unnötige Objektfilter ausblenden */
#adminForm .js-stools {
    display: none !important;
}
/* Allgemein */
/* Objektbearbeitung: Felder wieder etwas ruhiger darstellen */
#adminForm .form-control,
#adminForm .form-select,
#adminForm select {
    min-height: 34px;
    padding: 5px 8px;
    font-size: 13px;
}
#adminForm label {
    display: block;
    margin-bottom: 3px;
    line-height: 1.25;
}
#adminForm .control-group,
#adminForm .mb-3 {
    margin-bottom: 7px;
}
button.choices__button_joomla {
    position: relative !important;
    display: inline-block !important;

    width: 12px !important;
    height: 14px !important;
    min-width: 0 !important;

    margin-left: 4px !important;
    padding: 0 !important;

    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;

    overflow: hidden !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
}

button.choices__button_joomla::before {
    content: "×" !important;
    position: absolute !important;
    inset: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    color: #fff !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    margin-bottom: 6px;
}
/* Kategorienlabel + Name ausgeblendet */
/* Komplette Zeile „Kategoriename“ ausblenden */
#jform_category_name-lbl,
#jform_category_name {
    display: none !important;
}
/* Pflichtfeld-Markierung beim Kategorienfeld ausblenden */
joomla-field-fancy-select.required:has(#jform_category_id)::after {
    content: none !important;
    display: none !important;
}

 /* Ausblenden Felder Frontend Objekt - Veröffentlichung */
.control-group:has(#jform_rating) {
    display: none !important;
}
.control-group:has(#jform_params_show_facilities) {
    display: none !important;
}
.control-group:has(#jform_params_show_policies) {
    display: none !important;
}.control-group:has(#jform_params_show_inline_checkavailability_form0) {
    display: none !important;
}
.control-group:has(#jform_params_show_unavailable_roomtype) {
    display: none !important
  }
.control-label hr {
  opacity: 0.25 !important;
  margin: 5px 0 5px 0 !important;
}
/* Reiter Objekte Social Media ausblenden */
#sr-property > div:nth-child(1) > button:nth-child(5) {
  display: none !important;
}

 /* Ausblenden Felder Frontend Unterkunft - Veröffentlichung */
.control-group:has(#jform_params_show_smoking_option) {
  display: none !important;
}
.control-group:has(#jform_params_show_guest_option) {
  display: none !important;
}
.control-group:has(#jform_params_show_number_remaining_rooms) {
  display: none !important;
}
.control-group:has(#jform_params_show_more_info_button1) {
  display: none !important;
}
.control-group:has(#jform_params_is_exclusive0) {
  display: none !important;
}
.control-group:has(#jform_params_skip_room_form1) {
  display: none !important;
}
/* Reiter Unterkünfte Social Media ausblenden */
#sr-roomtype > div:nth-child(1) > button:nth-child(6) {
  display: none !important;
}

/* ========================================================
    DASHBOARD GÄSTE
  ========================================================= */
#adminForm {
  background: #fff;
}



/* ============================================================
   FOOTER
   ============================================================ */

#first ul.ttr_menu_items > li {
    display: block !important;
    float: none !important;
    clear: both;
    width: 100%;
}

/* Footer-Inhalte vertikal ausrichten */
#ttr_footer_top_for_widgets .footer-widget-area_fixed {
    align-items: flex-start;
}

/* Linke und rechte Menüs etwas nach unten */
#first,
#third {
    padding-top: 42px;
}

/* Mittlerer Bereich */
#second {
    padding-top: 20px;
    padding-bottom: 40px;
}

/* Linkes Menü einrücken */
#first .navbar-nav {
    padding-left: 100px;
    ;
}
#leftfooterarea ul {
  font-size: 18px !important;
}

/* Rechtes Menü einrücken */
#third .navbar-nav {
   margin-top: 20px;
}

#first .navbar-nav > li {
    margin-bottom: 5px;
}

#first .navbar-nav > li:last-child {
    margin-bottom: 0;
}



/* -----------------------------------------------------------
   Footer-Menüs: Schrift und Abstände wie im Original
----------------------------------------------------------- */

#first .ttr_menu_items_parent_link,
#first .ttr_menu_items_parent_link_active,
#third .ttr_menu_items_parent_link,
#third .ttr_menu_items_parent_link_active {
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.25 !important;
}

/* Footer: Vermietermenü kompakt untereinander */
#first ul.navbar-nav {
    display: flex !important;
    flex-direction: column !important;
    justify-content: flex-start !important;
    align-items: flex-start !important;
    gap: 8px !important;

    height: auto !important;
    min-height: 0 !important;
}

#first ul.navbar-nav > li {
    display: block !important;
    flex: 0 0 auto !important;

    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;
}

#first ul.navbar-nav > li > a {
    display: block !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1.3 !important;
}

#first .horiz_separator {
    display: none !important;
}
@media (min-width: 768px) {

        #first #leftfooterarea ul.navbar-nav > li:only-child > a {
        padding-top: 16px !important;
    }

}


@media (max-width: 767.98px) {

    /* Footer-Spalten untereinander */
    #ttr_footer_top_for_widgets .footer-widget-area_fixed {
        display: block !important;
    }

    #first,
    #second,
    #third {
        display: block !important;
        width: 100% !important;
        min-height: 0 !important;
        height: auto !important;

        margin: 0 !important;
        padding: 18px 15px !important;

        text-align: center !important;
        overflow: visible !important;
    }

    /* Hamburger ausblenden */
    #first .navbar-header,
    #third .navbar-header,
    #first .navbar-toggle,
    #third .navbar-toggle {
        display: none !important;
    }

    /* Menüs dauerhaft öffnen */
    #leftfooterarea,
    #rightfooterarea,
    #leftfooterarea.collapse,
    #rightfooterarea.collapse {
        display: block !important;
        visibility: visible !important;

        width: 100% !important;
        height: auto !important;
        max-height: none !important;

        margin: 0 !important;
        padding: 0 !important;
        position: static !important;
        overflow: visible !important;
    }

    /* TemplateToaster-/Bootstrap-Einrückungen zurücksetzen */
    #first nav,
    #third nav,
    #first .container-fluid,
    #third .container-fluid {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Beide Menüs mobil zentrieren */
    #first ul.navbar-nav,
    #third ul.navbar-nav {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: flex-start !important;

        width: 100% !important;
        height: auto !important;

        margin: 0 !important;
        padding: 0 !important;
        gap: 6px !important;

        transform: none !important;
        position: static !important;
    }

    #first ul.navbar-nav > li,
    #third ul.navbar-nav > li {
        display: block !important;
        width: 100% !important;

        margin: 0 !important;
        padding: 0 !important;

        text-align: center !important;
        position: static !important;
        left: auto !important;
    }

    #first ul.navbar-nav > li > a,
    #third ul.navbar-nav > li > a {
        display: inline-block !important;
        width: auto !important;

        margin: 0 !important;
        padding: 2px 0 !important;

        text-align: center !important;
    }

    #first .horiz_separator,
    #third .horiz_separator {
        display: none !important;
    }

  
      /* Hellblaue Hintergründe der Footer-Menüs entfernen */
    #first,
    #third,
    #leftfooterarea,
    #rightfooterarea,
    #first ul.navbar-nav,
    #third ul.navbar-nav,
    #first ul.navbar-nav > li,
    #third ul.navbar-nav > li,
    #first ul.navbar-nav > li > a,
    #third ul.navbar-nav > li > a {
        background: transparent !important;
        background-color: transparent !important;
    }
      #first,
    #second {
        border-bottom: 1px solid rgba(255, 255, 255, 0.35);
    }

    #first,
    #second,
    #third {
        padding-top: 18px !important;
        padding-bottom: 18px !important;
    }
}

/* =========================================================
   MOBILES HAUPTMENÜ
   Bootstrap 5 / TemplateToaster
   ========================================================= */
@media only screen and (max-width: 575px) {

    /* Menü über die gesamte verfügbare Breite */
    #ttr_menu,
    #ttr_menu nav,
    #ttr_menu_inner_in,
    #navigationmenu,
    #nav_menu {
        width: 100% !important;
        margin: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        box-sizing: border-box;
    }

    /* Hamburgerbereich: linksbündig statt zentriert */
    #ttr_menu .navbar-header {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        width: 100% !important;
        min-height: 56px;
        padding-left: 12px !important;
        box-sizing: border-box;
    }

    /* Hamburger in allen Zuständen stabil halten */
    #ttr_menu #nav-expander,
    #ttr_menu #nav-expander:hover,
    #ttr_menu #nav-expander:focus,
    #ttr_menu #nav-expander:active {
        position: static !important;
        float: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 44px !important;
        height: 44px !important;
        margin: 0 !important;
        padding: 10px !important;

        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
        transform: none !important;
        outline: none !important;
    }

    /* Bei der TT-Option „Hamburgermenü“ nur das Symbol anzeigen */
    #ttr_menu #nav-expander .ttr_menu_button_text {
        display: none !important;
    }

    #ttr_menu #nav-expander .ttr_menu_toggle_button {
        display: block !important;
        width: 24px !important;
        height: 19px !important;
        margin: 0 !important;
    }

    /* Drei gleichmäßige Hamburgerlinien */
    #ttr_menu #nav-expander .icon-bar,
    #ttr_menu #nav-expander:hover .icon-bar,
    #ttr_menu #nav-expander:focus .icon-bar,
    #ttr_menu #nav-expander:active .icon-bar {
        display: block !important;
        width: 24px !important;
        height: 3px !important;
        margin: 0 0 5px 0 !important;

        border: 0 !important;
        background: #ffffff !important;
        box-shadow: none !important;
    }

    #ttr_menu #nav-expander .icon-bar:last-child {
        margin-bottom: 0 !important;
    }

    /* Hauptmenü */
    #ttr_menu ul.ttr_menu_items {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #ttr_menu ul.ttr_menu_items > li {
        float: none !important;
        display: block !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Einheitliche Höhe und vertikale Ausrichtung */
    #ttr_menu ul.ttr_menu_items > li > a,
    #ttr_menu ul.ttr_menu_items > li > span.separator {
        float: none !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-height: 48px !important;
        height: 48px !important;
        margin: 0 !important;
        padding: 0 38px 0 16px !important;

        line-height: 1.2 !important;
        text-align: center !important;
        box-sizing: border-box !important;

        /* Trennlinie nur im Hauptmenü */
        border-bottom: 1px solid rgba(70, 145, 206, 0.35) !important;
    }

    /* Der Pfeil bleibt rechts, der Text optisch mittig */
    #ttr_menu ul.ttr_menu_items > li >
    .ttr_menu_items_parent_link_arrow,
    #ttr_menu ul.ttr_menu_items > li >
    .ttr_menu_items_parent_link_active_arrow {
        background-position: right 16px center !important;
        background-repeat: no-repeat !important;
    }

    /* Untermenü im mobilen Dokumentfluss */
    #ttr_menu ul.child.dropdown-menu {
        position: static !important;
        float: none !important;
        display: none;
        width: 100% !important;
        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        box-shadow: none !important;
    }

    #ttr_menu li.show > ul.child.dropdown-menu,
    #ttr_menu li.open > ul.child.dropdown-menu {
        display: block !important;
    }

    #ttr_menu ul.child.dropdown-menu > li {
        display: block !important;
        width: 100% !important;
        height: auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    #ttr_menu ul.child.dropdown-menu > li > a,
    #ttr_menu ul.child.dropdown-menu > li > span {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        width: 100% !important;
        min-width: 0 !important;
        min-height: 48px !important;
        height: 48px !important;
        margin: 0 !important;
        padding: 0 16px !important;

        line-height: 1.2 !important;
        text-align: center !important;
        box-sizing: border-box !important;

        border-bottom: 1px solid rgba(50, 90, 125, 0.22) !important;
    }

    /* Letzte Linie eines geöffneten Untermenüs entfernen */
    #ttr_menu ul.child.dropdown-menu > li:last-child > a,
    #ttr_menu ul.child.dropdown-menu > li:last-child > span {
        border-bottom: 0 !important;
    }

    /* TT-HR-Linien nur im Hauptmenü ausblenden.
       Footer und Inhaltsbereich bleiben unberührt. */
       #ttr_footer .horiz_separator {
       display: none !important;
}
  /* Gestrichelte TT-Menürahmen im Footer entfernen */
.footer_partner .ttr_menu_items > li,
.footer_partner .ttr_menu_items > li > a,
.footer_partner .ttr_menu_items > li > span {
    border: none !important;
}
}

/* ============================================================
   Sonderangebote mobil
   Wettermodul unter den Angeboten anzeigen
   ============================================================ */
@media (max-width: 767.98px) {

    /* Nur der Seitencontainer mit einer Sonderangebotsliste */
    #ttr_content_and_sidebar_container:has(.promotion-list) {
        display: flex !important;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
    }

    /* Angebotsbereich über die gesamte Breite */
    #ttr_content_and_sidebar_container:has(.promotion-list)
    > #ttr_content {
        display: block !important;
        float: none !important;
        clear: both !important;

        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;

        margin-left: 0 !important;
        margin-right: 0 !important;
        order: 1;
    }
       .promotion-item {
		padding-bottom: 20px;
	}
    /* Wetter-Seitenleiste unter die Angebote setzen */
    #ttr_content_and_sidebar_container:has(.promotion-list)
    > #ttr_sidebar_right {
        display: block !important;
        float: none !important;
        clear: both !important;
        position: static !important;

        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;

        margin: 0 !important;
        order: 2;
    }

    /* Innere Sidebar-Breiten zurücksetzen */
    #ttr_content_and_sidebar_container:has(.promotion-list)
    #ttr_sidebar_right_margin,
    #ttr_content_and_sidebar_container:has(.promotion-list)
    .ttr_sidebar_right_padding {
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        box-sizing: border-box !important;
    }

    /* Wettermodul mittig unter den Angeboten */
    #ttr_content_and_sidebar_container:has(.promotion-list)
    .ttr_block.wetter {
    float: none !important;
    width: 100% !important;
}
}
/* ============================================================
   Solidres Inline-Datepicker (Mobil)
   Verhindert Klicks auf darunterliegende Elemente
   Nicht entfernen!
   ============================================================ */

/* Solidres-Datepicker über nachfolgenden Menüs anzeigen */
@media (max-width: 767.98px) {

    body:has(.checkinoutform .datepicker_inline[style=""]) 
    .checkinoutform,

    body:has(.checkinoutform .datepicker_inline[style*="display: block"])
    .checkinoutform {
        position: relative !important;
        z-index: 999999 !important;
    }

    .checkinoutform,
    .checkinoutform .inner,
    .checkinoutform .row,
    .checkinoutform .col-md-6 {
        overflow: visible !important;
    }

    .checkinoutform .datepicker_inline,
    .checkinoutform .ui-datepicker-inline {
        z-index: 1000000 !important;
        pointer-events: auto !important;
    }
}

/* ============================================================
   Solidres – Sortierleiste
   ============================================================ */

.sortbar-md .navbar-collapse {
    display: block !important;
}

.sortbar-md .navbar-nav {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
}

@media (max-width: 991.98px) {

    .sortbar-md > .navbar-toggler {
        display: none !important;
    }

    .sortbar-md #hub-search-navbar {
        display: block !important;
        visibility: visible !important;
        height: auto !important;
    }

    .sortbar-md .navbar-nav {
        display: block !important;
        width: 100%;
        margin: 0 !important;
    }

    .sortbar-md .nav-item {
        width: 100%;
    }

    .sortbar-md .nav-link,
    .sortbar-md .dropdown-toggle {
        display: block;
        width: 100%;
        text-align: left !important;
    }

    .sortbar-md .dropdown-menu {
        position: absolute !important;
        left: 0 !important;
        right: auto !important;
        width: auto !important;
        min-width: 100% !important;
        z-index: 10000 !important;
    }
}

/* ============================================================
   Solidres – Auswahlliste optisch verbessern
   ============================================================ */


/* ------------------------------------------------------------
   2. Pagination in allen Ansichten zentrieren
   ------------------------------------------------------------ */

#ttr_content .pagination,
#ttr_content ul.pagination {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap;
    width: 100%;
    margin: 24px auto 10px !important;
    padding-left: 0 !important;
    text-align: center !important;
}

/* Falls Joomla einen zusätzlichen Pagination-Container ausgibt */
#ttr_content .pagination__wrapper,
#ttr_content .pagination-wrapper,
#ttr_content .pagination-container {
    display: flex;
    justify-content: center;
    width: 100%;
    text-align: center;
}


/* ============================================================
   Solidres – Listenansicht mobil zentrieren
   ============================================================ */

@media (max-width: 767.98px) {

    /* Gesamter Unterkunftseintrag */
    #ttr_content .asset-row-list {
        display: block !important;
        width: 100%;
        margin-left: 0 !important;
        margin-right: 0 !important;
        margin-bottom: 28px !important;
        text-align: center;
    }

    /* Beide Bootstrap-Spalten auf volle Breite */
    #ttr_content .asset-row-list > .col-md-3,
    #ttr_content .asset-row-list > .col-md-9 {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        float: none !important;
        margin: 0 auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: center !important;
    }

    /* Bild-Link zentrieren */
    #ttr_content .asset-row-list .room_type_details {
        display: block !important;
        width: fit-content;
        max-width: 100%;
        margin: 0 auto 6px !important;
    }

    /* Bild selbst zentrieren */
    #ttr_content .asset-row-list .room_type_details img {
        display: block !important;
        float: none !important;
        max-width: 100%;
        height: auto;
        margin: 0 auto !important;
    }

    /* Überschrift zentrieren */
    #ttr_content .asset-row-list h3 {
        margin: 5px auto 8px !important;
        padding: 0 8px;
        text-align: center !important;
        line-height: 1.25;
    }

    #ttr_content .asset-row-list h3 a {
        display: inline-block;
        text-align: center !important;
    }

    /* Adresse, Kartenlink und Entfernung zentrieren */
    #ttr_content .asset-row-list .reservation-asset-location {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 3px;
        margin-bottom: 12px;
        text-align: center;
    }

    #ttr_content .asset-row-list .reservation-asset-address,
    #ttr_content .asset-row-list .reservation-asset-map,
    #ttr_content .asset-row-list .reservation-asset-distance {
        display: block;
        margin: 0;
        text-align: center;
    }

    /* Gästezahl und Unterkunftsname zentrieren */
    #ttr_content .asset-row-list .room-type-row {
        display: block !important;
        width: 100%;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    #ttr_content .asset-row-list .room-type-row .col-md-12 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }

    #ttr_content .asset-row-list .room-type-row .inner {
        display: flex !important;
        justify-content: center !important;
        align-items: center;
        gap: 5px;
        width: 100%;
        text-align: center !important;
    }
    #ttr_content .asset-row-list {
        position: relative;
        margin-bottom: 24px !important;
        padding-bottom: 18px !important;
    }

    #ttr_content .asset-row-list::after {
        content: "";
        display: block;
        width: 80%;
        max-width: 320px;
        margin: 16px auto 0;
        border-bottom: 1px solid #d8d8d8;
    }

    /* Nach der letzten Unterkunft keine Linie mehr */
    #ttr_content .asset-row-list:last-of-type::after {
        display: none;
    }

  
    /* Pagination */
    #ttr_content .pagination,
    #ttr_content ul.pagination {
        display: flex !important;
        justify-content: center !important;
        flex-wrap: wrap;
        width: 100%;
        margin: 28px auto 18px !important;
        padding-left: 0 !important;
    }
}

/* ============================================================
   Solidres – Listenansicht Desktop
   ============================================================ */

@media (min-width: 768px) {

    #ttr_content .asset-row-list {
        align-items: flex-start;
        margin: 0 0 18px !important;
        padding: 0 0 18px !important;
        border-bottom: 1px solid #dedede;
    }

    /* Bei der letzten Unterkunft keine Trennlinie */
    #ttr_content .asset-row-list:last-of-type {
        border-bottom: 0;
    }

    /* Bild */
    #ttr_content .asset-row-list > .col-md-3 {
        padding-right: 12px;
    }

    #ttr_content .asset-row-list .room_type_details {
        display: block;
    }

    #ttr_content .asset-row-list .room_type_details img {
        display: block;
        width: 100%;
        height: auto;
        margin: 0;
    }

    /* Textbereich */
    #ttr_content .asset-row-list > .col-md-9 {
        padding-left: 12px;
    }

    #ttr_content .asset-row-list h3 {
        margin-top: 2px;
        margin-bottom: 8px;
        line-height: 1.25;
    }

    #ttr_content .asset-row-list .reservation-asset-location {
        display: flex;
        flex-wrap: wrap;
        align-items: baseline;
        gap: 4px 18px;
        margin-bottom: 12px;
    }

    #ttr_content .asset-row-list .reservation-asset-address,
    #ttr_content .asset-row-list .reservation-asset-map,
    #ttr_content .asset-row-list .reservation-asset-distance {
        margin: 0;
    }

    #ttr_content .asset-row-list .room-type-row .inner {
        display: flex;
        align-items: center;
        gap: 7px;
    }
}



/* =====================================================
                  Gesamter Slider 
   =====================================================  */
/* Jede Unterkunft als senkrechte Flexbox */
.uw-roomtype-slider .uw-roomtype-slider__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* Titel zentrieren und für zwei Zeilen Platz reservieren */
.uw-roomtype-slider .uw-roomtype-slider__title {
    width: 100%;
    min-height: 58px;
    margin: 16px 0 12px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    text-align: center;
    line-height: 1.25;
}

/* Buttonbereich sicher zentrieren */
.uw-roomtype-slider .uw-roomtype-slider__button-wrap {
    display: flex !important;
    justify-content: center !important;
    align-items: center;
    width: 100%;
    margin: 0 !important;
    padding: 0 !important;
    text-align: center !important;
}

/* Button nicht strecken */
.uw-roomtype-slider .uw-roomtype-slider__button-wrap > a.btn {
    display: inline-flex;
    width: auto;
    margin: 0 auto;
}

@media (max-width: 767.98px) {
    .uw-roomtype-slider .uw-roomtype-slider__title {
        min-height: 0;
    }

    .uw-roomtype-slider .uw-roomtype-slider__item {
        margin-bottom: 30px;
    }
}
/* Solidres-Unterkunftsansicht: Bildslider mobil zentrieren */
@media (max-width: 767.98px) {

    .roomtype_name + .row .col-md-4 > .carousel {
        width: min(400px, 95%);
        margin: 0 auto 20px;
    }

    .roomtype_name + .row .col-md-4 > .carousel img {
        width: 100%;
        height: auto;
        display: block;
    }
  
    .roomtype_name {
        text-align: center;
        margin-bottom: 10px;
    }

    .roomtype_name .badge {
        margin-right: 8px;
    }
}

/* Suche ohne Datum nur auf Tablet verbreitern */
@media (min-width:576px) and (max-width:1199.98px){

    .contenttopcolumn1 > .cell2.col-md-6.col-lg-6:has(.ohne_datum){
        width:100% !important;
        max-width:100% !important;
        flex:0 0 100% !important;
    }

}

/* =========================================================
   Usedom Web UI – Solidres Datepicker
   Bereich: Solidres-Suchmodul
   Version: 2.1 – Feinschliff
   Datum: 2026-07
   ========================================================= */

/* ---------------------------------------------------------
   Grundcontainer
   --------------------------------------------------------- */

.checkin_datepicker_inline_module,
.checkout_datepicker_inline_module {
    position: relative;
    width: 100%;
    z-index: 1000;
}

/* ---------------------------------------------------------
   Kalenderfenster
   --------------------------------------------------------- */

.checkin_datepicker_inline_module .ui-datepicker,
.checkout_datepicker_inline_module .ui-datepicker {
    width: 360px;
    max-width: 100%;
    padding: 12px;
    border: 1px solid #d9dee3;
    border-radius: 12px;
    background: #fff;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.16);
    box-sizing: border-box;
    font-size: 15px;
}

/* ---------------------------------------------------------
   Kopfbereich
   --------------------------------------------------------- */

.checkin_datepicker_inline_module .ui-datepicker-header,
.checkout_datepicker_inline_module .ui-datepicker-header {
    position: relative;
    min-height: 40px;
    padding: 6px 44px;
    border: 0;
    border-radius: 8px;
    background: #f4f6f8;
    box-sizing: border-box;
}

/* Monat und Jahr */

.checkin_datepicker_inline_module .ui-datepicker-title,
.checkout_datepicker_inline_module .ui-datepicker-title {
    margin: 0;
    line-height: 28px;
    text-align: center;
    font-size: 17px;
    font-weight: 600;
    color: #263238;
}

/* ---------------------------------------------------------
   Monatsnavigation
   --------------------------------------------------------- */

.checkin_datepicker_inline_module .ui-datepicker-prev,
.checkin_datepicker_inline_module .ui-datepicker-next,
.checkout_datepicker_inline_module .ui-datepicker-prev,
.checkout_datepicker_inline_module .ui-datepicker-next {
    position: absolute;
    top: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    margin: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    cursor: pointer;
    box-sizing: border-box;
    transition:
        background-color 0.15s ease,
        box-shadow 0.15s ease;
}

.checkin_datepicker_inline_module .ui-datepicker-prev,
.checkout_datepicker_inline_module .ui-datepicker-prev {
    left: 4px;
}

.checkin_datepicker_inline_module .ui-datepicker-next,
.checkout_datepicker_inline_module .ui-datepicker-next {
    right: 4px;
}

.checkin_datepicker_inline_module .ui-datepicker-prev:not(.ui-state-disabled):hover,
.checkin_datepicker_inline_module .ui-datepicker-next:not(.ui-state-disabled):hover,
.checkout_datepicker_inline_module .ui-datepicker-prev:not(.ui-state-disabled):hover,
.checkout_datepicker_inline_module .ui-datepicker-next:not(.ui-state-disabled):hover {
    background: #e7edf3;
}

/* Originale jQuery-UI-Symbole ausblenden */

.checkin_datepicker_inline_module .ui-datepicker-prev span,
.checkin_datepicker_inline_module .ui-datepicker-next span,
.checkout_datepicker_inline_module .ui-datepicker-prev span,
.checkout_datepicker_inline_module .ui-datepicker-next span {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}

/*
 * Eigene Chevron-Pfeile.
 * Keine zusätzliche Icon-Schrift erforderlich.
 */

.checkin_datepicker_inline_module .ui-datepicker-prev::after,
.checkin_datepicker_inline_module .ui-datepicker-next::after,
.checkout_datepicker_inline_module .ui-datepicker-prev::after,
.checkout_datepicker_inline_module .ui-datepicker-next::after {
    content: "";
    width: 9px;
    height: 9px;
    border-top: 2px solid #263238;
    border-right: 2px solid #263238;
    box-sizing: border-box;
}

.checkin_datepicker_inline_module .ui-datepicker-prev::after,
.checkout_datepicker_inline_module .ui-datepicker-prev::after {
    transform: rotate(-135deg);
    margin-left: 4px;
}

.checkin_datepicker_inline_module .ui-datepicker-next::after,
.checkout_datepicker_inline_module .ui-datepicker-next::after {
    transform: rotate(45deg);
    margin-right: 4px;
}

/* Deaktivierte Navigation */

.checkin_datepicker_inline_module .ui-datepicker-prev.ui-state-disabled,
.checkin_datepicker_inline_module .ui-datepicker-next.ui-state-disabled,
.checkout_datepicker_inline_module .ui-datepicker-prev.ui-state-disabled,
.checkout_datepicker_inline_module .ui-datepicker-next.ui-state-disabled {
    opacity: 0.28;
    cursor: default;
    pointer-events: none;
}

/* Tastaturfokus */

.checkin_datepicker_inline_module .ui-datepicker-prev:focus-visible,
.checkin_datepicker_inline_module .ui-datepicker-next:focus-visible,
.checkout_datepicker_inline_module .ui-datepicker-prev:focus-visible,
.checkout_datepicker_inline_module .ui-datepicker-next:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.25);
}

/* ---------------------------------------------------------
   Kalendertabelle
   --------------------------------------------------------- */

.checkin_datepicker_inline_module .ui-datepicker-calendar,
.checkout_datepicker_inline_module .ui-datepicker-calendar {
    width: 100%;
    margin: 7px 0 0;
    border-collapse: separate;
    border-spacing: 2px;
    table-layout: fixed;
}

/* Wochentage */

.checkin_datepicker_inline_module .ui-datepicker-calendar th,
.checkout_datepicker_inline_module .ui-datepicker-calendar th {
    height: 32px;
    padding: 3px 0;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
    color: #65717c;
}

/* Tageszellen */

.checkin_datepicker_inline_module .ui-datepicker-calendar td,
.checkout_datepicker_inline_module .ui-datepicker-calendar td {
    height: 42px;
    padding: 0;
    border: 0;
    text-align: center;
    vertical-align: middle;
}

/* Tagesflächen */

.checkin_datepicker_inline_module .ui-datepicker-calendar td a,
.checkin_datepicker_inline_module .ui-datepicker-calendar td span,
.checkout_datepicker_inline_module .ui-datepicker-calendar td a,
.checkout_datepicker_inline_module .ui-datepicker-calendar td span {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: auto;
    padding: 0;
    border: 2px solid transparent;
    border-radius: 50%;
    background: transparent;
    box-sizing: border-box;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    transition:
        background-color 0.15s ease,
        border-color 0.15s ease,
        color 0.15s ease;
}

/* Buchbare Tage */

.checkin_datepicker_inline_module .ui-datepicker-calendar td.bookable a,
.checkout_datepicker_inline_module .ui-datepicker-calendar td.bookable a {
    color: #263238;
    font-weight: 500;
}

/* Hover nur für auswählbare Tage */

.checkin_datepicker_inline_module .ui-datepicker-calendar td.bookable a:hover,
.checkout_datepicker_inline_module .ui-datepicker-calendar td.bookable a:hover {
    background: #e8f1fb;
    color: #0d6efd;
}

/* Tastaturfokus auf einem Tag */

.checkin_datepicker_inline_module .ui-datepicker-calendar td a:focus-visible,
.checkout_datepicker_inline_module .ui-datepicker-calendar td a:focus-visible {
    outline: 0;
    border-color: #0d6efd;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.2);
}

/* Heutiger Tag */

.checkin_datepicker_inline_module .ui-datepicker-calendar .ui-state-highlight,
.checkout_datepicker_inline_module .ui-datepicker-calendar .ui-state-highlight {
    border-color: #0d6efd;
    background: #fff;
    color: #0d6efd;
    font-weight: 600;
}

/* Ausgewählter Tag */

.checkin_datepicker_inline_module .ui-datepicker-calendar .ui-state-active,
.checkout_datepicker_inline_module .ui-datepicker-calendar .ui-state-active {
    border-color: #428bca;
    background: #428bca;
    color: #fffffff !important;
    font-weight: 700;
}

/* Heute und gleichzeitig ausgewählt */

.checkin_datepicker_inline_module
    .ui-datepicker-calendar
    .ui-state-highlight.ui-state-active,
.checkout_datepicker_inline_module
    .ui-datepicker-calendar
    .ui-state-highlight.ui-state-active {
    border-color: #0d6efd;
    background: #0d6efd;
    color: #fff;
}

/* Nicht auswählbare Tage */

.checkin_datepicker_inline_module .ui-datepicker-unselectable span,
.checkout_datepicker_inline_module .ui-datepicker-unselectable span {
    color: #a7afb7;
    opacity: 0.65;
}

/* Tage benachbarter Monate */

.checkin_datepicker_inline_module .ui-datepicker-other-month,
.checkout_datepicker_inline_module .ui-datepicker-other-month {
    opacity: 0.4;
}

/* ---------------------------------------------------------
   Unterer Bereich
   --------------------------------------------------------- */

.checkin_datepicker_inline_module .ui-datepicker-buttonpane,
.checkout_datepicker_inline_module .ui-datepicker-buttonpane {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    margin: 8px 0 0;
    padding: 8px 0 0;
    border-top: 1px solid #e4e8ec;
    background: transparent;
}

/* Heute-Schaltfläche */

.checkin_datepicker_inline_module .ui-datepicker-current,
.checkout_datepicker_inline_module .ui-datepicker-current {
    float: none;
    min-height: 36px;
    margin: 0;
    padding: 6px 14px;
    border: 1px solid #cbd2d9;
    border-radius: 7px;
    background: #fff;
    color: #263238;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
    transition:
        border-color 0.15s ease,
        background-color 0.15s ease,
        color 0.15s ease,
        box-shadow 0.15s ease;
}

.checkin_datepicker_inline_module .ui-datepicker-current:hover,
.checkout_datepicker_inline_module .ui-datepicker-current:hover {
    border-color: #0d6efd;
    background: #e8f1fb;
    color: #0d6efd;
}

.checkin_datepicker_inline_module .ui-datepicker-current:focus-visible,
.checkout_datepicker_inline_module .ui-datepicker-current:focus-visible {
    outline: 0;
    border-color: #0d6efd;
    box-shadow: 0 0 0 3px rgba(13, 110, 253, 0.2);
}

/* =========================================================
   Smartphone
   ========================================================= */

@media (max-width: 575.98px) {
    .checkin_datepicker_inline_module .ui-datepicker,
    .checkout_datepicker_inline_module .ui-datepicker {
        width: 100%;
        max-width: none;
        padding: 10px 8px;
        border-radius: 10px;
        font-size: 16px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-header,
    .checkout_datepicker_inline_module .ui-datepicker-header {
        min-height: 42px;
        padding: 5px 46px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-title,
    .checkout_datepicker_inline_module .ui-datepicker-title {
        line-height: 30px;
        font-size: 18px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-prev,
    .checkin_datepicker_inline_module .ui-datepicker-next,
    .checkout_datepicker_inline_module .ui-datepicker-prev,
    .checkout_datepicker_inline_module .ui-datepicker-next {
        top: 3px;
        width: 36px;
        height: 36px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-calendar,
    .checkout_datepicker_inline_module .ui-datepicker-calendar {
        margin-top: 5px;
        border-spacing: 1px 3px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-calendar th,
    .checkout_datepicker_inline_module .ui-datepicker-calendar th {
        height: 32px;
        padding: 2px 0;
        font-size: 12px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-calendar td,
    .checkout_datepicker_inline_module .ui-datepicker-calendar td {
        height: 44px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-calendar td a,
    .checkin_datepicker_inline_module .ui-datepicker-calendar td span,
    .checkout_datepicker_inline_module .ui-datepicker-calendar td a,
    .checkout_datepicker_inline_module .ui-datepicker-calendar td span {
        width: 42px;
        height: 42px;
        font-size: 16px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-buttonpane,
    .checkout_datepicker_inline_module .ui-datepicker-buttonpane {
        margin-top: 6px;
        padding-top: 7px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-current,
    .checkout_datepicker_inline_module .ui-datepicker-current {
        min-height: 40px;
        padding: 7px 16px;
        font-size: 15px;
    }
}

/* Sehr schmale Smartphones */

@media (max-width: 380px) {
    .checkin_datepicker_inline_module .ui-datepicker-calendar td,
    .checkout_datepicker_inline_module .ui-datepicker-calendar td {
        height: 40px;
    }

    .checkin_datepicker_inline_module .ui-datepicker-calendar td a,
    .checkin_datepicker_inline_module .ui-datepicker-calendar td span,
    .checkout_datepicker_inline_module .ui-datepicker-calendar td a,
    .checkout_datepicker_inline_module .ui-datepicker-calendar td span {
        width: 38px;
        height: 38px;
        font-size: 15px;
    }
}

/* Bewegungen reduzieren, wenn im Betriebssystem gewünscht */

@media (prefers-reduced-motion: reduce) {
    .checkin_datepicker_inline_module *,
    .checkout_datepicker_inline_module * {
        transition: none !important;
    }
}