#HomePage .Page {
    margin-left: auto;
    margin-right: auto;
    width: 1200px;
}


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

#HomePage footer {
    margin-left: 0px;
}


/* ======= HEADER ======= */
        
#HomePageHeader {
    position: relative;
    width: 100%;
    min-width: 1200px;
    max-width: 1920px;
    margin: 0 auto;
    z-index: 3;
}

#HomePageHeader .Logo {
    position: absolute;
    top: 15px;
    left: 15px;
    padding: 10px 15px 7px 15px;
    background: url('images/TransparentBG_80proz.png');
    background: rgba(255,255,255,0.8);
}

#HomePageHeader #LoginDisplay {
    position: absolute;
    top: 15px;
    right: 15px;
    background: url('images/TransparentBG_80proz.png');
    background: rgba(255,255,255,0.8);
}

#HomePageHeader .LogonMenu {
    margin: 0px;
    padding: 0px;
}

#HomePageHeader .LogonMenu > li {
    height: 30px;
    line-height: 30px;
    border-right: none;
    margin-right: 0px; /* !!WICHTIG!! Überschreibt die -5px aus der Site.less (ansonsten erscheint horizontaler Scrollbalken,
                            weil #LoginDisplay auf 100% Breite gesetzt ist) */
}

#HomePageHeader .LogonMenu a:hover {
    text-decoration: underline;
}

#HomePageHeader .LogonMenu li.DropDown a:hover,
#HomePageHeader .LogonMenu li.DropDown div.Sub a {
    color: #4d4d4d;
    text-decoration: none;
}

#HomePageHeader .LogonMenu li.DropDown:hover > a {
    color: #4d4d4d;
    padding-top: 8px;
    padding-bottom: 10px;
}

#HomePageHeader .LogonMenu li.DropDown div.Sub a {
    font-weight: normal;
}

#HomePageHeader .LogonMenu li.DropDown div.Sub a:hover {
    color: #cc3f0e;
}

#HomePageHeader .LogonMenu li.DropDown div.Sub {
    top: 30px;
}

#HomePageHeader .LogonMenu .MenuButton {
    border: none;
    font-weight: bold;
    color: #FFF !important;
}

#HomePageHeader .LogonMenu .MenuButton.LoginButton,
#HomePageHeader .LogonMenu .MenuButton.AccountButton,
#HomePageHeader .LogonMenu .MenuButton.LimitationDisplay {
    background-color: #cc3f0e;
    /*margin-right: 1px;*/ /* Trennlinie zwischen Buttons */
}

#HomePageHeader .LogonMenu .MenuButton.RegistrationButton,
#HomePageHeader .LogonMenu .MenuButton.LogoffButton {
    background-color: #7E787A;
}

#HomePageHeader .LogonMenu .MenuButton.LimitationDisplay {
    font-weight: normal;
}

#HomePageHeader .LogonMenu .MenuButton a {
    color: #FFF;
    padding-left: 10px;
    padding-right: 10px;
}

#HomePageHeader .LogonMenu .Phone {
    background: url('/Sites/living4media/Resources/images/theme/icons/phone_full_11.png') no-repeat center left;
    margin: 0 0 0 3px;
}

#HomePageHeader .LogonMenu .Welcome {
    color: #4d4d4d;
}

#HomePageHeader .LogonMenu .LiveChat {
    padding: 0px 10px 0 5px;
}

#HomePageHeader .LogonMenu .LiveChat div a {
    font-weight:600;
}
#HomePageHeader .LogonMenu .IconLiveChat {
    margin-right: 5px;
    fill: #cc3f0e;
    stroke: none;
 }


/* "Mein Konto"-Dropdown */
/* Hinweis: Werte für "Domains"-Dropdown werden in Site.less gesetzt 
.LanguageFR .LogonMenu li.DropDown .Sub:not(.Domains),
.LanguagePL .LogonMenu li.DropDown .Sub:not(.Domains) {
    left: -40px;
}*/

.LanguageFR .LogonMenu li.DropDown .Sub:not(.Domains) ul li,
.LanguagePL .LogonMenu li.DropDown .Sub:not(.Domains) ul li {
    min-width: 150px;
}

/* ======= SUCHZEILE ======= */

#TopSearchContainer {
    z-index: 1;
    width: 720px;
    margin-left: -360px; /* Hälfte von width */
    top: 40%;
    left: 50%;
    text-align: center;
}

#TopSearchContainer form {
    width: 100%; /* muss gleiche Breite wie TopSearchContainer haben! (wegen Zentrierung) */
}

#TopSearchContainer .SearchInput {
    box-sizing: border-box;
    height: 55px; /*bei Änderung muss auch line-height im Conditional Comment für IE8 in der View (Homepage.cshtml) angepasst werden! */
    width: 500px;
    font-size: 20px;
    margin-right: -2px;
    vertical-align: bottom;
    float: none;
}

#TopSearchContainer .SearchInput,
#TopSearchContainer button.Top {
    border-color: #d2d1d2;
}

#TopSearchContainer button.Top {
    height: 55px;
    padding-left: 12px;
    padding-right: 12px;
    color: #cc3f0e;
    font-weight: normal;
}

#TopSearchContainer button.Top[type=submit] {
    width: 55px;
    background-image: url('images/search.png');
    background-repeat: no-repeat;
    background-position: center center;
}

#TopSearchContainer button.TopFilterToggler span {
    background-image: url('images/filter_down.png');
}

#TopSearchContainer .SearchFilters {
    left: 29%;
    text-align: left;
}

#AutosuggestContainer {
    margin-top: 0px;
}


/* ======= IMAGE-CONTAINER, SLIDER ======= */

#ImageContainer {
    overflow: hidden;
    width: auto; /* Angabe "auto" statt "100%" nötig, damit min-width funktioniert */
    min-width: 1200px; /* Minimale Breite begrenzen: Anpassung hier und im Script (setSliderSize-Funktion) nötig! */
    max-width: 1920px; /* Maximale Breite begrenzen: Anpassung hier und im Script (setSliderSize-Funktion) nötig! */
    min-height: 750px; /* Minimale Höhe begrenzen: Anpassung hier und im Script (setSliderSize-Funktion) nötig! Achtung, durch "overflow: hidden" wird Suchfilter-Menü evtl. abgeschnitten, falls Container zu klein!*/
    max-height: 1200px;
    margin: 0 auto;
    position: relative; /* ohne "relative" legt sich das Mouseover vom Overlaymenü auch über den Footer */
    /* border-bottom: 1px solid #a8a6a7; */
}

/* jssor slider arrow navigator skin css - MODIFIZIERT - EIGENE PFEILE! */
/*
.jssorl              (normal)
.jssorr              (normal)
.jssorl:hover        (normal mouseover)
.jssorr:hover        (normal mouseover)
.jssorldn            (mousedown)
.jssorrdn            (mousedown)
*/
.jssorl, .jssorr, .jssorldn, .jssorrdn
{
    position: absolute;
    cursor: pointer;
    display: block;
    background: url('images/jssor_arrows.png') center center no-repeat;
    overflow: hidden;
}

.jssorl { background-position: -2px 0px; }
.jssorr { background-position: -64px 0px; }
.jssorl:hover { background-position: -121px 0px; }
.jssorr:hover { background-position: -183px 0px; }
.jssorldn { background-position: -241px 0px; }
.jssorrdn { background-position: -303px 0px; }


/* --- SLIDES --- */
/* !! Please always specify width and height for caption (in css file or inline) */

#slider1_container {
    visibility: hidden; /*  erst später einblenden (s. Script) */
}

#slider1_container .ImageNo {
    position: absolute;
    height: 15px;
    bottom: 125px; /*bei Änderung auch Wert bei .NoTicker anpassen */
    right: 15px;
    font-size: 10px;
    font-family: Tahoma, Arial, Sans-Serif;
    color: #545051;
}

#slider1_container .ImageNo.NoTicker {
    bottom: 80px; /* wenn kein Ticker da ist, muss die Bildnr. weiter unten angezeigt werden */
}

#slider1_container .ImageNo a {
    text-decoration: none;
    background: url('images/TransparentBG_60proz.png');
    background: rgba(255,255,255,0.6);
    font-family: inherit;
    color: #545051;
    padding: 1px 3px;
}

/* -- Grundstyle für ALLE Folien -- */
#slider1_container .SlideText {
    position: absolute;
    width: 700px;
    height: 200px;
    top: 15%; /* abweichende Positionen können über YAML-Datei in Documents verwaltet werden! */
    left: 30%;
    font-family: "HelveticaNeueLT-Thin", Helvetica, sans-serif;
    font-size: 62px;
    color: #cc3f0e; /* default - Farben für die SlideTexte werden über den Dateinamen des Bannerbildes festgelegt (Suffix: orange / grey / white) */
    /*text-shadow: 0px 0px 5px rgba(255,255,255,1), -1px 0px 1px rgba(255,255,255,0.5), 1px 0px 1px rgba(255,255,255,0.5), 0px -1px 1px rgba(255,255,255,0.5), 0px 1px 1px rgba(255,255,255,0.5), 1px 1px 1px rgba(255,255,255,0.5), -1px -1px 1px rgba(255,255,255,0.5); */
}

#slider1_container .SlideText.White,
#slider1_container .SlideText.White a {
    color: #fff;
}

#slider1_container .SlideText.Grey,
#slider1_container .SlideText.Grey a {
    color: #545051;
}

#slider1_container .SlideText a {
    text-decoration: none;
    font-family: inherit;
}

#slider1_container .SlideText div.Subline {
    font-size: 21px;
    font-family: inherit;
    line-height: 1.2em;
    margin-top: 5px;
}

/* ============== OVERLAY-CONTAINER ============== */
/* (enthält Overlay-Navigation und Ticker) */

.OverlayContainer {
    display: none;
    position: absolute;
    bottom: 0;
    width: 100%;
}

/* ------- OVERLAY-NAVIGATION ------- */

.OverlayNavigation {
    position: relative; /* Bezugspunkt für die Popup-Menüs */
    background: url('images/TransparentBG_80proz.png');
    background: rgba(255,255,255,0.8);
}

.OverlayNavigation .Page {
    margin: 0px auto;
    background: none;
}

.OverlayNavigation a {
    font-family: "HelveticaNeueLT-Thin", Helvetica, sans-serif;
    text-decoration: none;
    color: #474747;
}

.OverlayNavigation a:hover {
    color: #cc3f0e;
}

.OverlayNavigation h3,
.OverlayNavigation h3 a {
    font-family: "HelveticaNeueLT-Thin", Helvetica, sans-serif;
    font-size: 25px;
    line-height: 1.5em;
    color: #cc3f0e;
    padding: 0px;
    margin-top: 14px;
    margin-bottom: 0px; /* so lassen! (wenn man hier einen größeren Wert nimmt, verrutscht die Stile-Menüspalte (.Columns)) */ 
}

.OverlayNavigation .Row {
    float: left;
    width: 265px;
    height: 60px;
    padding-left: 30px; /* bei Änderung auch margin-left von PopupMenuLayer anpassen! */
    border-right: 1px solid #A8A6A7;
    background: none; /* Fallback für Browser, die rgba nicht können */
    background: rgba(255,255,255,0.0);
}

.OverlayNavigation .Row:first-child {
    border-left: 1px solid #A8A6A7;
}

/* nur sinnvoll, wenn OverlayMenu mit "click" statt mouseenter geöffnet wird
.OverlayNavigation .Row:hover {
    background: #FFFFFF;
    -webkit-transition: 0.5s ease 0.2s;
    -moz-transition: 0.5s ease 0.2s;
    -o-transition: 0.5s ease 0.2s;
    transition: 0.5s ease 0.2s;
} */

.OverlayNavigation ul {
    margin-top: 10px;
    margin-bottom: 30px; /* bei Änderung muss auch margin-bottom beim Accordion-Menü (.OverlayNavigation ul#Accordion) angepasst werden! */
    padding: 0;
    list-style: none;
}

.OverlayNavigation div.Columns ul {
    width: 48%;
    display: inline-block; /* geht erst ab IE 10 */
    vertical-align: top;
}

.OverlayNavigation a.More {
    text-decoration: underline;
    font-style: italic;
}

.OverlayNavigation li {
    display: block;
    line-height: 1.4em;
    font-size: 16px;
}

.OverlayNavigation li:before {
    content: "› ";
    color: #cc3f0e;
    font-size: 12px;
    font-weight: bold;
}

.OverlayNavigation li.NoListBullet:before,
.OverlayNavigation ul.NoListBullet > li:before {
    content: "";
}

/* ------- POPUP-MENÜS ------- */

/* nur sinnvoll, wenn OverlayMenu mit "click" statt mouseenter geöffnet wird
.OverlayNavigation .Row.PopupMenu {
    cursor: pointer;
} */

.OverlayNavigation .Row.PopupMenu div.PopupMenuLayer {
    display: none;
    position: absolute;
    cursor: default;
    bottom: 0px;
    margin-left: -31px; /* links an zugehöriger Row ausrichten, ein Pixel zusätzlich wegen Rand*/
    width: 235px;
    background: #FFF;
    border: 1px solid #A8A6A7;
    border-bottom: none;
    padding: 0 30px 0px 30px;
    z-index: 4;
}

/* ------- ACCORDION-MENÜ ------- */

.OverlayNavigation ul#Accordion {
    margin-bottom: 14px; /* überschreibt die 30px von den normalen OverlayMenu-Rows;
                           muss zusammen mit dem margin-bottom von ".OverlayNavigation #Accordion li ul"
                           diese 30px -1px ergeben, damit der Text unten bündig ist */
}

.OverlayNavigation #Accordion li ul {
    display: none;
    margin-top: 0;
    margin-bottom: 15px; /* überschreibt die 30px von den normalen OverlayMenu-Rows;
                            muss zusammen mit dem margin-bottom von ".OverlayNavigation ul#Accordion"
                            diese 30px -1px ergeben, damit der Text unten bündig ist */
}

.OverlayNavigation #Accordion h4 {
    margin: 0;
    margin-bottom: 10px;
    padding-bottom: 5px;
    border-bottom: 1px solid #A8A6A7;
    font-size: 16px;
    cursor: pointer;
}

.OverlayNavigation #Accordion h4:hover a {
    color: #cc3f0e;
}

.OverlayNavigation #Accordion li.Open h4 {
    cursor: default;
}

.OverlayNavigation #Accordion li.Open h4:hover a,
.OverlayNavigation #Accordion li.Open h4 a:hover {
    color: #545051;
    cursor: default;
}

.OverlayNavigation #Accordion h4 a:hover {
    text-decoration: none;
}

.OverlayNavigation #Accordion h4 a:after {
    content: '\00BB'; /* >> */
    float: right;
    font-size: 20px;
    color: #cc3f0e; /* orange */
}

.OverlayNavigation #Accordion li.Open h4 a:after {
    color: #474747; /* grau */
}

/*
.OverlayNavigation #Accordion li.Open h4 a:after {
    content: '\00BB';
    float: right;
    font-size: 20px;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    position: relative;
    left: 8px;
    top: 8px;
}
*/

/* Schriftgröße für Accordion-Unterpunkte */
/*
.OverlayNavigation #Accordion > li > ul > li {
    font-size: 14px;
}
*/

/* ------- TICKER (AKTUELLE THEMEN) ------- */

.OverlayTicker {
    width: 100%;
    height: 45px;
    overflow: hidden;
    white-space: nowrap; /* damit zu lange TickerEntries-Liste nicht unter den TickerTitle rutscht */
    background: url('images/TransparentBG-black_55proz.png');
    background: rgba(0,0,0, 0.55);
}

.OverlayTicker div,
.OverlayTicker a,
.OverlayTicker strong,
.OverlayTicker em {
    font-family: "HelveticaNeueLT-Thin", Helvetica, sans-serif;
    font-size: 16px;
    color: #FFF;
}

.OverlayTicker div.TickerTitle {
    float: left;
    font-size: 18px;
    background-color: #cc3f0e;
    padding: 0 20px;
    height: 45px;
    line-height: 45px;
}

.OverlayTicker ul.TickerEntries {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

.OverlayTicker ul.TickerEntries li {
    display: inline-block;
    margin: 0;
    padding: 0 15px;
    height: 45px;
    line-height: 45px;
    background-color: transparent;
    -webkit-transition: 0.5s ease 0.2s; /* Transition von hover-Zustand zu normal (=dieser) */
    -moz-transition: 0.5s ease 0.2s;
    -o-transition: 0.5s ease 0.2s;
    transition: 0.5s ease 0.2s;
}

.OverlayTicker ul.TickerEntries li.Highlighted {
    background-color: #7E787A;
    -webkit-transition: 1s ease 0s; /* Transition von Normal-Zustand zu Highlighted (=dieser) */
    -moz-transition: 1s ease 0s;
    -o-transition: 1s ease 0s;
    transition: 1s ease 0s;
}

.OverlayTicker ul.TickerEntries li:hover {
    background-color: #545051 !important;
    -webkit-transition: 0.5s ease 0.2s; /* Transition von Normal-Zustand zu hover (=dieser) */
    -moz-transition: 0.5s ease 0.2s;
    -o-transition: 0.5s ease 0.2s;
    transition: 0.5s ease 0.2s;
}

.OverlayTicker ul.TickerEntries li a {
    text-decoration: none;
}

.OverlayTicker ul.TickerEntries li:before {
    content: "› ";
    color: #FFF;
    font-size: 12px;
}