/*==== B A S I S ==============================================*/

* { -webkit-box-sizing: inherit; box-sizing: inherit; background-repeat: no-repeat; }
html { -webkit-box-sizing: border-box; box-sizing: border-box; }

body { font-family: 'Source Sans Pro', sans-serif; color: #000000; background:#ffffff; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; }

.breite { width: 90%; max-width: 1340px; margin: 0 auto; }

.label { display: inline-block; min-width: 5em; }
.center { text-align: center; }
.upper { text-transform: uppercase; letter-spacing: 0.02em; }
.italic { font-style: italic; }
.hiddenmobile { display: none; }

iframe { border: 0; }

input, textarea, select { font-size: 1em; }
input[type="submit"], .wk-button, .cookie input.accept[type="submit"] { background-color: #89997E; color: #fff; }
input[type="submit"]:hover, input[type="submit"]:active, .wk-button:hover, .wk-button:active, .cookie input.accept[type="submit"]:hover, .cookie input.accept[type="submit"]:active { background-color: #57664E; }

.sitemap ul { padding: 0; }

a { color: #57664E; }

.wk-list { padding: 0; list-style: none; }
.wk-list li { padding-left: 1.5em; background: url(../img/li.svg) left .1em/1.2em no-repeat; }

figure.left {float: left; max-width: 40%; margin: 0 1.5em 0 0;}
figure.right {float: right; max-width: 40%; margin: 0 0 0 1.5em;}

/*==== H E A D E R ============================================*/

header { background: #F1F1F1; }
header .breite { padding: 1em 0; }

#menueToggle { background: url(../img/menu.svg) center/cover no-repeat; position: absolute; top: 2em; right: 5%; width: 60px; height: 60px; z-index: 1000; cursor: pointer; }
#menueToggle.close { background: url(../img/close.svg) center/cover no-repeat; }

#logo { margin: 1em 80px 1em 0; display: inline-block; }
#logo img { display: block; width: 250px; }

nav.wk-horizontal .nav { background: transparent; font-size: 1.3333em; font-weight: 600; }
nav.wk-horizontal .nav li { position: relative; }
nav.wk-horizontal .nav li::after { display: block; content: ""; position: absolute; left: 1em; bottom: .3em; right: 1em; height: 2px; }
nav.wk-horizontal .nav li.active { color: #8A9A7E; }
nav.wk-horizontal .nav li.active::after { background: #8A9A7E !important; }
nav.wk-horizontal .nav li:hover { background: transparent; }
nav.wk-horizontal .nav li:hover::after { background: #000000; }

/*==== C O N T E N T ==========================================*/

.slider-block { background: #89997E; color: #FFFFFF; padding: 1em 0; font-size: 1.3333em; font-weight: 600; }
.startslider div { padding: 10px; }
.startslider div img { height: 180px; }

main .breite { padding: 2em 0 3em; }

h1 { color: #56634C; font-weight: 600; }
h1 small { display: block; color: #292929; }

.vorteile { margin-top: 2em; background: #E1E1DE; color: #56634C; padding: 1em; -webkit-hyphens: none; -ms-hyphens: none; hyphens: none; }

.zesu-block { background: url(../../../images/content/pferd-auf-wiese.jpg) center/cover no-repeat; }
.zesu-block .breite { padding: 3.5em 0; }
.zesu-block .box { background: rgba(137, 153, 126, .9); color: #FFFFFF; max-width: 600px; padding: 1.5em; }
.zesu-block .box .wk-button { background: #FFFFFF; color: #89997E; }
.zesu-block .box .wk-button:hover { color: #57664E; }

.contact-block { font-size: 1.3333em; }
.contact-block .breite { padding: 2.5em 0; }
.contact-block h2 { color: #8A9A7E; }

/*==== F O O T E R ============================================*/

footer { background: #57664E; color: #ffffff; font-size: 1.3333em; }
footer .breite { padding: 3em 0 4em; }

footer a { color: inherit; }

footer .nav { padding: 0; }
footer .nav li { display: inline-block; margin-right: .7em; }
footer .nav li:last-of-type { margin-right: 0; }
footer .nav li a { text-decoration: none; }
footer .nav li a:hover { color: #E1E1DE }

/* GoTop-Link */
#gotop { position: fixed; bottom: 10px; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); z-index: 1000; width: 40px; height: 40px; background: #ffffff url("../img/top-link.svg") no-repeat center/cover; -webkit-box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); box-shadow: 0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19); }


/* ==== M E D I A  Q U E R I E S ==============================*/

@media only screen and (min-width: 568px){}

@media only screen and (min-width: 768px){
    #menueToggle { display: none; }
    .hiddenmobile { display: block; }

    figure.left { float: left; margin: 0 1.5em 0 0; max-width: 40%; }
    figure.right { float: right; margin: 0 0 0 1.5em; max-width: 40%; }
    .startslider div img { height: 240px; }
    
    .zesu-block .breite { height: 760px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
}

@media only screen and (min-width: 1024px){
    header .breite { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; }
    header .breite::after { display: none; }

    #logo { margin: 0; }

    .startslider div img { height: 380px; }
    
    #content { padding-right: 2em; }
    
    .contact-block .wk-flex { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; }
    .contact-block .wk-flex div { width: 50%; }
    
    #sidebar figure { margin-top: 7em; }
    footer .down { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; }
}

@media only screen and (min-width: 1280px){}