@charset "UTF-8";
a.icon.button {
margin: 0 3px !important;
}

body#hund nav a.active i.fa-solid, body#pferd nav a.active i.fa-solid, body#alpaka nav a.active i.fa-kit {
color: white;
}

.suchergebnis .datumsstempel {
font-size: .8em !important;
}

figcaption .meta {
color: gray;
}

figure {
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}

.bildergalerie_seite, .bildergalerie {
margin-top: 1em !important;
}

a, a:hover, a:active {
color: #703b7b !important;
}
footer a, footer a:hover, footer a:active {
color: white !important;
}


.kontaktleiste {
padding-top: 0 !important;
padding-bottom: 0 !important;
}

.five.item.main.menu {
margin-bottom: 0;
}

div.ui.bildergalerie {
margin-bottom: 1em;
}

footer.ui.grid {
background-color: #eee;
}

figure#hundekoerper, figure#pferdekoerper {
margin: 1em 2px;
}

h2.produkte {
margin-top: 2em !important;
}

footer.violet.footer.segment {
margin-top: 2em;
}
 
footer a {
color: white;
}


/* style für suchfeld TODO überarbeiten */
.ui.transparent.input>input[type=search]:focus {
width: 15em;
background-color: white !important;
// border-bottom: 1px dotted black !important;
}
form button#suchstart.ui.circular {
display: none;
}
input[type=search]:focus + button#suchstart.ui.circular {
display: block;
}
button#suchstart.ui.circular:focus {
display: block;
}

.ui.transparent.input>input[type=search]:focus::placeholder {
color: white !important;
}
button#suchstart.ui.mini.basic, button#suchstart.ui.mini.basic:hover {
box-shadow: 0 0 0 0px transparent inset,0 0 0 0 rgba(34,36,38,.15) inset;
}
button#suchstart.ui.mini.basic:hover {
display: block;
background-color: #6e368c !important;
color: white !important;
}
/* ENDE style für suchfeld */


/* SchriftBildWort: Style für responsive Bilder */
/* Bilder definierbar durch: */
/* horizontalen Anteil an umgebender Textspalte */
/* oder durch vertikalen Anteil an Viewporthöhe */
/* oder durch Anzahl an Zeilen, die sie umfließen sollen */
/* plus freigestellte, rechtsbündige Bilder */
/* */
.ui.ganzbreit.image, .ui.ganzbreit.images .image, .ui.ganzbreit.images img, .ui.ganzbreit.images svg {
width: 100%;
height: auto;
}
.ui.viertelbreit.image, .ui.viertelbreit.images .image, .ui.viertelbreit.images img, .ui.viertelbreit.images svg {
width: 25%;
height: auto;
}
.ui.drittelbreit.image, .ui.drittelbreit.images .image, .ui.drittelbreit.images img, .ui.drittelbreit.images svg {
width: 33.33333%;
height: auto;
}
.ui.halbbreit.image, .ui.halbbreit.images .image, .ui.halbbreit.images img, .ui.halbbreit.images svg {
width: 50%;
height: auto;
}
.ui.zweidrittelbreit.image, .ui.zweidrittelbreit.images .image, .ui.zweidrittelbreit.images img, .ui.zweidrittelbreit.images svg {
width: 66.66666%;
height: auto;
}
.ui.dreiviertelbreit.image, .ui.dreiviertelbreit.images .image, .ui.dreiviertelbreit.images img, .ui.dreiviertelbreit.images svg {
width: 75%;
height: auto;
}
.ui.ganzhoch.image, .ui.ganzhoch.images .image, .ui.ganzhoch.images img, .ui.ganzhoch.images svg {
width: auto;
height: 100vh;
}
.ui.viertelhoch.image, .ui.viertelhoch.images .image, .ui.viertelhoch.images img, .ui.viertelhoch.images svg {
width: auto;
height: 25vh;
}
.ui.drittelhoch.image, .ui.drittelhoch.images .image, .ui.drittelhoch.images img, .ui.drittelhoch.images svg {
width: auto;
height: 33.33333vh;
}
.ui.halbhoch.image, .ui.halbhoch.images .image, .ui.halbhoch.images img, .ui.halbhoch.images svg {
width: auto;
height: 50vh;
}
.ui.zweidrittelhoch.image, .ui.zweidrittelhoch.images .image, .ui.zweidrittelhoch.images img, .ui.zweidrittelhoch.images svg {
width: auto;
height: 66.66666vh;
}
.ui.dreiviertelhoch.image, .ui.dreiviertelhoch.images .image, .ui.dreiviertelhoch.images img, .ui.dreiviertelhoch.images svg {
width: auto;
height: 75vh;
}
.ui.einzeilig.image, .ui.einzeilig.images .image, .ui.einzeilig.images img, .ui.einzeilig.images svg {
width: auto;
height: 1.25em;
}
.ui.zweizeilig.image, .ui.zweizeilig.images .image, .ui.zweizeilig.images img, .ui.zweizeilig.images svg {
width: auto;
height: 2.5em;
}
.ui.dreizeilig.image, .ui.dreizeilig.images .image, .ui.dreizeilig.images img, .ui.dreizeilig.images svg {
width: auto;
height: 3.75em;
}
.ui.vierzeilig.image, .ui.vierzeilig.images .image, .ui.vierzeilig.images img, .ui.vierzeilig.images svg {
width: auto;
height: 5em;
}
.ui.fuenfzeilig.image, .ui.fuenfzeilig.images .image, .ui.fuenfzeilig.images img, .ui.fuenfzeilig.images svg {
width: auto;
height: 6.25em;
}
.ui.sechszeilig.image, .ui.sechszeilig.images .image, .ui.sechszeilig.images img, .ui.sechszeilig.images svg {
width: auto;
height: 7.5em;
}
.ui.siebenzeilig.image, .ui.siebenzeilig.images .image, .ui.siebenzeilig.images img, .ui.siebenzeilig.images svg {
width: auto;
height: 8.75em;
}
.ui.achtzeilig.image, .ui.achtzeilig.images .image, .ui.achtzeilig.images img, .ui.achtzeilig.images svg {
width: auto;
height: 10em;
}
.ui.neunzeilig.image, .ui.neunzeilig.images .image, .ui.neunzeilig.images img, .ui.neunzeilig.images svg {
width: auto;
height: 11.25em;
}
.ui.zehnzeilig.image, .ui.zehnzeilig.images .image, .ui.zehnzeilig.images img, .ui.zehnzeilig.images svg {
width: auto;
height: 12.5em;
}
.ui.elfzeilig.image, .ui.elfzeilig.images .image, .ui.elfzeilig.images img, .ui.elfzeilig.images svg {
width: auto;
height: 13.75em;
}
.ui.zwoelfzeilig.image, .ui.zwoelfzeilig.images .image, .ui.zwoelfzeilig.images img, .ui.zwoelfzeilig.images svg {
width: auto;
height: 15em;
}
.ui.right.aligned.image, .ui.right.aligned.images .image, .ui.right.aligned.images img, .ui.right aligned.images svg {
right: 0px;
margin-right: 0;
margin-left: auto;
}
/* ENDE SchriftBildWort: Style für responsive Bilder */


