@charset "UTF-8";
/* CSS Document */

/* Typo */
body{font-family: 'Encode Sans';font-size: 1em;}
html, body {height: 100%;}
h1, h2, h3, h4, h5, h6{font-family: "Encode Sans"}
h1 {font-size: 2em;}
h2 {font-size: 1.6em;}
h3 {font-size: 1.3em;}
h4 {font-size: 1.1em;}
h5 {font-size: 1em;}
h1.einzelhead{font-size: 1.6em; font-weight: bold;}
/* medium */
@media print, screen and (min-width: 40em) {
h1 {font-size: 2.5em;}
h2 {font-size: 2.1em;}
h3 {font-size: 1.7em;}
h4 {font-size: 1.5em;}
h5 {font-size: 1.2em;}
h1.einzelhead{font-size: 2em; font-weight: normal;}
}
/* large */
@media print, screen and (min-width: 64em) {
    .homehead { font-size: 3.2em; margin-bottom: 0.7em;}
}

/* Hintergrundfarben */
body {background-color: #627f7b;}
.navi, .homecontent{background-color: #ed6b6a;}
.header{background-color: #def7f3;}
.listcontent, .listteaser {background-color: #873953;}
.pagecontent{background-color: #fff;}
.cookbgr{background-color: #01514f;}

/* Schriftfarben */
.header, .listcontent, .footer{color: #fff;}

.pagecontent h1, h2,h3, h4, h5 { color: #873953;}
.listcontent h1, .listcontent h2, .listcontent h3, .listcontent h4, .listcontent h5 { color: #fff;}
.listteaser h1, .listteaser h2, .listteaser h3, .listteaser h4, .listteaser h5 { color: #fff;}
.listcontent a {color: #fff;}
a { color: #873953;}
a:hover { color: #003136;}

/* Header */
.header {height: 80px;}
.header .cell {padding-top: 5px;}
.tName {padding: 8px 0 0 20px; font-size: 1.2em;font-weight: 700;line-height: 120%;}
.langlink {padding-top: 8px;}
.langlink a{font-weight: 700; color: #ccc;}
.langlink a:hover {color: #fff;}
.arrowlink {border: 4px solid #ccc; font-size: 0; line-height: 0; height: 0; padding: 0; margin: 0; position: relative; bottom: 5px;}
.arrowlink {border-top-color: transparent; border-right-color: transparent; border-bottom-color: transparent;}
.langswitch {background-color: #ed6b6a; font-size: 0.8em; border: none; color: #fff; padding: 8px; border-radius:50%; font-weight: bold; margin-top: 25px;}
.langswitchmob {background-color: #fff; font-size: 0.7em; border: none; color: #ed6b6a; padding: 8px; border-radius:50%; font-weight: bold;}

/* Navileiste */
.navi {height: 38px; border-bottom: 1px solid #990026; position: sticky; top: 0; z-index: 999;}

div.navbox{border-color: #000;}
div:hover.navbox{background-color: #333; height: 30px; color: #fff; border-color: #fff;}
.arrowmenu {border: 4px solid #000 inherit; font-size: 0; line-height: 0; height: 0; padding: 0; margin: 0 0 0 5px; position: relative; bottom: 3px;}
.arrowmenu {border-left-color: transparent; border-right-color: transparent; border-bottom-color: transparent;}

nav{height: 38px;}
nav a {color: #003136;}
nav .sub {background-color: #def7f3;}
dropdown.menu > li.is-active > a {color: #fff !important; }
nav li a:hover {color: #fff; background: #008278;}
nav li a:active {color: #000;}
.dropdown.menu > li.is-dropdown-submenu-parent > a::after {border-top-color: #990026;}
.dropdown.menu > li.is-dropdown-submenu-item > a::after {border-top-color: #990026;}
.title-bar { padding: .25rem .5rem;}


/* Navileiste mobil */
.menu-icon::after {position: absolute; top: 0; left: 0;height: 3px; background: #fff; -webkit-box-shadow: 0 7px 0 #fff, 0 14px 0 #fff; box-shadow: 0 7px 0 #fff, 0 14px 0 #fff;}
.title-bar {background: none; color: #000;}
.title-bar .menu-icon {margin-left: 0; margin-right: 0.5rem;}
.title-bar-title{color: #fff;}
.top-bar, .top-bar ul{background-color: #abfef1;}
.top-bar{max-width: 300px;}
.menumob-left, .menumob-right {display: inline; width: 50%}
.menumob-right {text-align: right;}
ul.mobiles-menu {font-weight: bold;}
ul.mobiles-menu a {color: #003136;}

/* Content */
.listcontent h1, .pagecontent h1{position: relative; top: -10px;}
table, tbody {border: none;}
td {vertical-align: top;}
.listcontent a:hover{color: #54DF1B;}
.listteaser{padding: 2em 0 1em 0; color: #fff;}
.listteaser p {margin-top: 1em;}
.pagecontent a:hover{color: #006F66;}
.listenteaser {padding: 12px 0 15px 0; font-weight: 700;}
.listcontent tr { border-top: 1px solid #fff; padding: 10px 0 20px 0; background:  #990026;}
.pagecontent tr { border-top: 2px solid #990026; padding: 10px 0 20px 0; background:  #fff;}
.listcontent td h2 {color: #fff;}
td a{color: inherit;}
.tabbild  {width: 230px;}
.tabbild img {width: 200px;}
img.iconbild {width: 80px; margin-left: 10px;}
h4.brcr {padding-top: 8px;}
.smallbox, .medibox {width: 100%;}
a.anchor { display: block; height: 1px; overflow: hidden; position: relative; top: -40px; visibility: hidden; }
.preis {font-size: 1.7em; color: #990026; font-weight: bold; }
a.verkauf, input.verkauf, .verkauf {background-color:#990026;  color: #fff; font-weight: 700;}
a:hover.verkauf {background-color: #E66838; color: #fff;}
a.vorschau {background-color:#0E277B;  color: #fff; font-weight: 700;}
a:hover.vorschau {background-color: #4965c1; color: #fff;}
.kaufpad {margin-top: 20px;}
.fragefeld, .antwortfeld {border-top: 2px solid #990026; padding-top: 0.8em; padding-bottom: 0.8em; }
.fragefeld {color: #990026; font-weight: 700; padding-right: 1.5em;}
.textbanner {padding: 12px 15px 0 0;}
.kurzinfobox {background-color: #ddd; padding-top: 0.6em; padding-bottom: 0.6em; margin-bottom: 1em;}
.kurzinfobox h4 {font-weight: bold; color: #fff;}
.kurzinfobox div p {margin-bottom: 0.3em;}
.kurzinfobox div img {margin-top: 8px;}
.klein{font-size: 0.8rem;}

.sbboard img{width: 67px; height: 90px; float: left; margin-right: 10px;}
.sbboard {background-color: #fff; font-size: 12px;}
.sbboard div {padding-top: 12px;}
.sbboardtitel h3{color: #fff;}
/* medium */
@media print, screen and (min-width: 40em) {
 .preis {font-size: 2.5em; }
}

/* Homepage */
.homehead {font-size: 1.8em; margin-bottom: 1em; font-family: 'Encode Sans Condensed'; font-weight: bold;}
.intro h2, .intro h3, .intro h4 {color: #fff; font-weight: bold;}
.homeboxhum { background-color: #575d86;}
.homeboxvet {background-color: #b46234;}
.homeboxaka { background-color: #873953;}
.homeboxmemb {background-color: #8D6D56;}
.homeboxhum, .homeboxvet, .homeboxaka, .homeboxmemb { padding: 1.5em; margin: 2em 0 1em 0; border-radius: 1em; box-shadow: 10px 10px 7px #c94949;}
.homeboxhum h3, .homeboxvet h3, .homeboxaka h3, .homeboxmemb h3 {font-size: 1.3em; color: #fff; font-weight: bold;}
img.iconbox  {width: 60px; height: 60px; margin: 7px 20px 10px 0;}
h2.homeboxtitel {font-size: 1.75em; font-weight: bold; color: #fff; margin-top: 0;}
.hlinkbtn {text-align: left; background-color: #2B53A0;}
a:hover.hlinkbtn {color: #000; background-color: #a0bcf7;}
.vlinkbtn {text-align: left; background-color: #ED6939;}
a:hover.vlinkbtn {color: #000; background-color: #f7b29b;}
.elinkbtn {text-align: left; background-color: #990026;}
a:hover.elinkbtn {color: #000; background-color: #fcc2cc;}
.slinkbtn {text-align: left; background-color: #76553d;}
a:hover.slinkbtn {color: #000; background-color: #e3c7b3;}
.homeboxhum .button, .homeboxvet .button, .homeboxaka .button, .homeboxmemb .button {margin-bottom: 0.3rem; pading: 0.6rem; font-weight: bold;}
.homeboxhum ul, .homeboxvet ul, .homeboxaka ul, .homeboxmem ul {margin: 0 0 0 0.5em;}
.linkbtnbox {margin-bottom: 1em;}
.homeboxmemb a {color: #fff;}
.hvideobox {margin-bottom: 1em;}
.ismall {font-weight: normal; font-size: 0.8em;}

/* small */
/* Startseite small */
.homebgr {background-image: url('/assets/img/homegrafik.jpg'); background-position: calc(50% - 100px) -100px; background-repeat: no-repeat; background-size: 1000px  
500px;}
.hometitel h1{font-size: 1.8em; padding-bottom: 2em;}
.hometext h2, .hometext h3{font-size: 1.15em;}
.listcontent, .pagecontent {min-height: 400px; padding: 2em 0 1em 0;}

/* medium */
@media print, screen and (min-width: 40em) {
 h2.homeboxtitel {font-size: 2em;  margin-top: 0.5em;}   
img.iconbox  {width: 80px; height: 80px; margin: 0 40px 20px 0;}
h2.homeboxtitel { margin-top: 0.5em;}
.homehead {font-family: "Encode Sans"; font-size: 2.2em;}
.homebgr {background-image: url('/assets/img/homegrafik.jpg'); background-position: center -90px; background-repeat: no-repeat; background-size: 1600px 800px;}
.hometitel h1{font-size: 1.8em; padding-bottom: 1em;}
.hometext h2, .hometext h3{font-size: 1.3em;}
}
/* large */
@media print, screen and (min-width: 64em) {
.homehead { font-size: 3.2em; margin-bottom: 0.7em;}
.initially-hidden {display: none;}
.homebgr {background-image: url('/assets/img/homegrafik.jpg'); background-position: center -250px; background-repeat: no-repeat; background-size: 2800px 1400px;}
.hometitel h1{font-size: 2.6em; padding-bottom: 3em;}
.hometext h2, .hometext h3{font-size: 1.5em;}
.listcontent, .pagecontent {min-height: 700px; padding: 2em 0 1em 0;}
}

/* Accordion */
.accordion {backgrond: none; margin-top: 3em;}
.accordion-title {font-size: 1em; border: none; border-top: 1px solid #ed6b6a;  color: #873953; padding: 1.1rem 2.5rem 1.1rem 1rem; font-weight: bold;}
.accordion-content {font-size: 1em;}
.accordion-title a, .accordion-title a:active  {color: #873953;}
.accordion-item a {color: #873953;}

/* Footer */
.footer{margin-top: 30px;}
.footer a{color: #fff;}
.footlogo{width: 90px; height: 28px;} 

/* Cookiebanner */
#cookiepopup {text-align: center; background-color: #2e3990; color: #fff; position: fixed; bottom: 0; z-index: 9999; font-size:14px; line-height:20px; padding: 20px; width: 100%;}
#cookiepopup a {color: cyan;}

#cookiepopup.hidden {display: none;}

/* Overlay Galerie */
.galkomm {margin-bottom: 1em; font-size: 0.75em; color: #666;}
#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    display: none;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    z-index: 9999;
    color: #fff;
}

#overlay img {
    max-width: 90%;
    max-height: 80%;
}