@charset "utf-8";
/* CSS Document */

/*
####################################################
## Template by buntsucht WEB DESIGN & DEVELOPMENT ##
####################################################
*/

body {margin: 0; padding: 0; font-family: 'Arial', sans-serif;}
body.gdpr-backdrop-effect {position: relative; top: -80px;}

.montseratt {font-family: 'Montserrat', sans-serif;}
.satisfy {font-family: 'Satisfy', cursive; font-size: 30px; color: #91c080;}

h1, h2, h3, h4, h5, h6 {margin: 0 0 50px 0; word-spacing: 2px; letter-spacing: 2px; font-family: 'Montserrat', sans-serif; color: #2d2d2d; font-weight: 500;}
h1 {font-size: 22px;}
h2 {font-size: 20px;}
h3 {font-size: 18px;}
h4 {font-size: 16px;}

p {line-height: 1.625; color: #5b5b5b; font-size: 16px; margin: 0 0 50px 0;}
p:last-child {margin: 0;}
ul {margin: 0 0 50px 0;}
li {font-size: 16px; line-height: 1.625; color: #5b5b5b; list-style-type: none;}
ol {list-style-type: lower-latin; margin-left: -20px;}
hr {height: 1px; border: 0; color: #5b5b5b; background-color: #5b5b5b; margin: 50px 0 50px 0;}
img {width: 100%; display: block; height: auto; border: 0;}
.smal-font {font-size: 12px;}
.clearer {content: ""; display: table; clear: both;}

.bild800 {max-width: 800px; margin: 0 auto 50px auto;}
.bild600 {max-width: 600px; margin: 0 auto 50px auto;}
.preis {padding: 4px 8px; border: 1px #91c080 solid; border-radius: 4px;}
.contentslider {max-width: 450px; margin: 0 auto 50px auto;}
.contentslider-breit {max-width: 675px; margin: 0 auto 50px auto;}
.green-btn {padding: 8px 12px; color: #ffffff!important; background-color: #91c080; border-radius: 4px; text-decoration: none;}
.green-btn:hover {background-color: #7eaa6e; text-decoration: none!important;}


/*Menu*/
.navi-master {width: 100%; position: fixed; top: 0; left: 0; background-color: #ffffff; z-index: 1000;}
.navi-inner {width: 100%; max-width: 1200px; margin: 0 auto; text-align: center; position: relative;}

.navi {display: table; margin: 0 auto; padding: 25px 0;}
.navi ul {list-style-type: none; padding: 0; margin: 0;}
.navi ul li {float: left; padding: 5px 0px; border-bottom: 1px transparent solid; position: relative; margin-left: 30px; color: #2d2d2d; font-size: 16px; text-transform: uppercase; font-family: 'Montserrat', sans-serif;}
.navi ul li:first-child {margin-left: 0;}
.navi ul li:hover {border-bottom: 1px #91c080 solid; color: #91c080;}
.navi ul li a {color: #2d2d2d; text-decoration: none; font-size: 16px; font-family: 'Montserrat', sans-serif;}
.navi ul li ul li {float: none; margin-left: 0; position: relative; font-size: 16px;}
.navi ul li ul li a {font-size: 16px; text-transform: none!important; color: #ffffff!important;}
.navi ul li ul, .navi ul li ul li ul {display: none; background-color: #91c080; padding: 5px 10px;}
.navi ul li ul {border: 1px #ffffff solid; box-sizing: border-box;}
.navi ul li:hover ul {display: block; position: absolute; top: 35px; left: 0px; border-top: 1px transparent solid; width: 230px;}
.navi ul li:hover ul li {border-top: 1px #e4e4e5 solid;} .navi ul li:hover ul li:first-child {border-top: none;}
.navi ul li:hover ul li ul {display: none;}
.navi ul li ul li:hover ul {display: block; position: absolute; top: 0; left: 100%; border-left: 4px transparent solid; border-top: 0;}
.navi ul li ul li:hover ul li ul {display: none;}
.navi ul li ul li ul li:hover ul {display: block;}

.separator::after, ul li ul li.deeper > a::after, ul li ul li ul li.deeper > a::after {font-family: 'FontAwesome'; content: "\f107"; color: #2d2d2d; margin-left: 5px;}
.navi ul li.deeper > a::after {font-family: 'FontAwesome'; content: "\f107"; color: #91c080; margin-left: 5px;}
.navi ul li ul li:hover {border-bottom: 1px #91c080 solid; color: #91c080;}
.navi ul li.active {border-bottom: 1px #91c080 solid; color: #91c080;}
.navi ul li.active a {color: #91c080;}
.navi ul li.active ul li a {color: #2d2d2d;}
.navi ul li.active ul li.active a {color: #06696c!important;}

.mob-nav-btn {display: none;}

@media screen and (max-width: 995px){
.navi {display: none;}
.mob-nav-btn {margin: 0 auto; display: table; cursor: pointer;}
.mob-nav-btn .fa {font-size: 36px; color: #5b5b5b; padding: 20px 0;}
}

/* mobile Navigation */
.mob-nav-hg {position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(91,91,91,0.95); z-index: 1010; display: none;}
.mob-nav-inner {width: 60%; margin: 0 auto; padding: 5% 0;}
.mob-nav-inner .fa {font-size: 36px; color: #ffffff; margin: 0 auto; display: table; cursor: pointer;}
.mob-nav {display: table; margin: 30px auto; text-align: center;}
.mob-nav a {font-weight: bold; color: #91c080; margin-bottom: 10px; text-decoration: none; font-size: 20px;}
.mob-nav ul li ul li a {font-weight: bold; color: #c3e5b6; margin-bottom: 10px; text-decoration: none; font-size: 20px;}
.mob-nav ul {margin-left: -40px; margin-bottom: 0px;}
.mob-nav ul li.active a, .mob-nav ul li.active ul li.deeper a {color: #c3e5b6;}
.mob-nav a:hover {color: #ffffff; text-decoration: underline;}
.display_on {display: block;}
.mob-nav .separator {color: #91c080; font-size: 20px; font-weight: bold;}
.mob-nav .separator::after {color: #ffffff;}

/* Header */
.header {width: 100%; margin-top: 80px;}
.header-inner {width: 100%; max-width: 1200px; margin: 0 auto; position: relative; background-image: url("../../../images/headers/header.jpg"); background-repeat: no-repeat; background-position: top center; background-size: 1200 320;}
.header-box {width: 60%; max-width: 250px; margin: 0 auto;}
.brand-box {width: 90%; max-width: 200px; margin: 0 auto; box-sizing: border-box; background-color: #ffffff; border-bottom-left-radius: 8px; border-bottom-right-radius: 8px; padding: 50px 0 35px 0;}
.brand {width: 80%; max-width: 140px; margin: 0 auto;}
.dogtraining {width: 100%; max-width: 250px; margin: 30px 0 50px 0;}

/* Content */
.content {width: 94%; max-width: 1200px; margin: 0 auto; background-color: #f6f7f2; box-sizing: border-box; padding: 80px 0;}
.content-inner {width: 94%; max-width: 960px; margin: 0 auto; color: #5b5b5b;}

.content-inner li::before {font-family: 'FontAwesome'; content: "\f00c"; color: #91c080; margin-right: 25px; margin-left: -40px;}
.content-inner ol li {list-style-type: decimal;}
.content-inner ol li::before {content: ""; margin-right: auto!important; margin-left: auto!important;}
.content-inner a {color: #91c080; text-decoration: none;}
.content-inner a:hover {color: #5b5b5b; text-decoration: underline;}

/* 3 Boxen */
.box3 {width: 31.2499998%; max-width: 300px; float: left; margin-left: 3.12499998%;}
.box3:first-child {margin-left: 0;}

.box3 a.boxbtn {background-color: #024e57; color: #ffffff; padding: 8px 15px; margin: -20px auto 0 auto; display: table; text-decoration: none; transform: rotate(-4deg); font-weight: bold;}
.box3 a.boxbtn:hover {background-color: #91c080;}

@media screen and (max-width: 605px){
.box3 {width: 100%; float: none; margin-left: auto; margin-right: auto; margin-bottom: 30px; max-width: 600px;}
.box3:first-child {margin-left: auto;}
}

/* 2 Boxen */
.box2 {width: 47.5%; max-width: 570px; float: left; margin-left: 5%; margin-bottom: 50px;}
.box2:first-child {margin-left: 0;}

@media screen and (max-width: 680px){
.box2 {width: 100%; float: none; max-width: 800px; margin-left: auto; margin-right: auto;}
.box2:first-child {margin-left: auto; margin-bottom: 20px!important;}
}

.footer {width: 100%; margin: 40px 0;}
.footer-inner {width: 100%; max-width: 1200px; margin: 0 auto; background-color: #91c080; padding: 20px 15px; box-sizing: border-box; position: relative;}
.footer-inner a.fbtn {background-color: #7eaa6e; color: #ffffff; padding: 4px 8px 3px 8px; text-decoration: none; font-size: 14px; border-radius: 4px;}
.footer-inner a.fbtn:hover {background-color: #024e57;}
.facebook {width: 100%; max-width: 34px; position: absolute; right: 15px; top: 13px;}

.last-line {width: 100%; margin: 40px 0; text-align: center; font-size: 12px;}

@media screen and (max-width: 418px){
.footer-inner a.fbtn {display: table; margin: 0 auto 10px auto;}
.facebook {position: relative; right: auto; top: auto; margin: 0 auto;}
}

/* Zusatz */
.gassibox {width: 50%; max-width: 600px; margin: 0 auto 50px auto;}
.gassi1, .gassi2 {width: 50%; max-width: 300px; float: left;}
.gassi1 img {max-width: 140px; margin: 0 auto;}
.gassi2 {text-align: center; padding-top: 15%;}
.gassi2 a::after {font-family: 'FontAwesome'; content: "\f138"; margin-left: 10px;}
.gassi2 a:hover {text-decoration: none!important;}

@media screen and (max-width: 760px){
.gassi1, .gassi2 {width: 100%; max-width: none; float: none;}
}

/* Formmailer */
.formmailer {width: 100%!important; max-width: 600px; margin: 0 auto 50px auto;}
.formmailer .ff_elem {width: 100%!important; min-width: 100%!important; border: 0; background-color: #ffffff; font-family: 'Arial', sans-serif; font-size: 16px; color: #5b5b5b; margin-bottom: 10px; box-sizing: border-box; padding: 15px 10px;}
.formmailer .checkbox input.ff_elem {width: 8px; min-width: 8px!important; float: left; margin-right: 10px; margin-left: -4px; max-width: 20px; background-color: transparent!important;}
.formmailer button.bfSubmitButton {float: left!important; margin: 30px 0 50px 0; border: 0; background-color: #5b5b5b; color: #ffffff; padding: 12px 8px; cursor: pointer;}
.formmailer button.bfSubmitButton:hover {background-color: #91c080;}
.formmailer span button.btn-primary {width: 20px!important; min-width: 20px!important; height: 20px!important; line-height: 20px!important; padding: 0!important; display: table; cursor: pointer; background-color: #5b5b5b!important;}
.formmailer span button.btn-primary::before {font-family: 'FontAwesome'; content: "\f021"; color: #ffffff;}
.formmailer span button.btn-primary:hover {background-color: #ffffff!important;}
.formmailer span button.btn-primary:hover::before {color: #5b5b5b;}

@media screen and (max-width: 335px){
.formmailer label.checkbox {font-size: 12px;}
}
@media screen and (max-width: 622px){
.breaker1 {display: none;}
}


/* Kundenstimmen */
.kundenstimmen ul {margin: 0 0 0 -40px; width: 100%; max-width: 1200px; display: flex; flex-wrap: wrap; justify-content: center;}
.kundenstimmen li::before {content: ""; margin-left: 0; margin-right: 0;}
.kundenstimmen li {margin: 0 20px 40px 20px; width: 280px; box-sizing: border-box; padding: 0 0 20px 0; border: 3px #06696c solid;}
.ks-titel {box-sizing: border-box; padding: 10px; background-color: #06696c; color: #ffffff; height: 75px;}
.ks-inner {width: 90%; margin: 10px auto;}
.ks-bild {width: 100%; height: 250px; background-position: center center; background-size: cover;}
.ks-introtext {margin: 10px 0 50px 0; font-size: 15px;}


/* Blog */
.column-1 {background-color: #fffff9; padding: 20px; box-sizing: border-box; margin: 40px 0; position: relative; border-bottom: 1px #044e57 solid;}
.muted {margin: 0; padding: 10px 20px; box-sizing: border-box; background-color: #06696c; color: #ffffff; position: absolute; top: 0; left: 0; width: 100%;}
.muted::after {content: ""; display: table; clear: left;}
.muted .hits, .muted .create {float: left; margin-left: 0;}
.muted .create::after {content: "|"; margin: 0 7px 0 3px;}
.column-1 h1 {margin: 60px 0 40px 0;}
.column-1 .readmore .btn {padding: 8px 12px; color: #ffffff!important; background-color: #91c080; border-radius: 4px; text-decoration: none;}
.column-1 .readmore .btn:hover {background-color: #7eaa6e; text-decoration: none!important;}
.column-1 .pull-left {float: left; max-width: 200px; margin: 60px 20px 20px 0; height: 225px; overflow-y: hidden;}
.pull-none {max-width: 600px; margin: 0 auto 60px auto;}
@media screen and (max-width: 760px){
.column-1 .pull-left {float: none; max-width: 300px; height: 338px; margin: 60px auto 40px auto;}
}
@media screen and (max-width: 385px){
.column-1 .pull-left {height: auto;}
}


/* YouTube Video */
.youtube {width: 100%; max-width: 800px; margin: 0 auto 40px auto;}

/* Google Maps */
.google-map {width: 100%; height: 450px; position: relative; background-image: url("../../../images/elemente/googlemaps-hg.jpg"); background-position: center center; background-size: cover; margin: 0 auto 40px auto;}
.ds-hinweis {color: #fff; text-align: center; position: absolute; top: 44%; transform: translateX(-50%); left: 50%; width: 90%;}
.aktivate {cursor: pointer;}


.cadre_bouton .btn_close {margin: 5px 0 0 0!important;}

/* Galerie */
.galerie {margin-bottom: 60px;}

/*###################
#### Formmailer #####
###################*/
.formmailer {width: 100%; max-width: 600px; margin: 0 auto;}
.formmailer h2 {display: none;}
.formmailer .formResponsive input.rsform-input-box {width: 100%; line-height: 50px; height: 50px; font-size: 18px; margin-bottom: 15px; box-sizing: border-box; padding: 0 10px; border: 0; border-radius: 0; font-family: 'Arial', sans-serif; background-color: #fff;}
.formmailer .formResponsive textarea {width: 100%; font-size: 18px; margin-bottom: 15px; box-sizing: border-box; padding: 20px 10px; font-family: 'Arial', sans-serif; height: 150px; border: 0; border-radius: 0; background-color: #fff;}
.formmailer .formDescription, .form-md h2 {display: none;}
.formmailer .formBody img {width: 50%; max-width: 120px;}
.formmailer .formResponsive input.rsform-captcha-box {width: 50%; max-width: 200px; line-height: 36px; height: 36px;}
.formmailer .formResponsive .rsform-submit-button[type="submit"], .formmailer .rsform-captcha-refresh-button {margin: 40px 0 0 0; background-color: #91c080; color: #fff; font-size: 18px; border-radius: 0px; text-shadow: 0px 0px 0px rgba(0,0,0,0); box-shadow: 0px 0px 0px rgba(0,0,0,0); border: 0; font-family: 'Arial', sans-serif;}
.formmailer .formResponsive .rsform-submit-button[type="submit"] {padding: 10px 18px; margin-bottom: 40px;}
.formmailer .rsform-captcha-refresh-button {padding: 10px 10px 10px 10px; position: relative; top: 2px;}
.formmailer .formResponsive .rsform-submit-button[type="submit"]:hover, .formmailer .rsform-captcha-refresh-button:hover {background-color: #2d2d2d; color: #fff;}
.formmailer .formResponsive select.rsform-select-box {line-height: 50px; height: 50px; font-size: 18px; width: 100%; background-color: #fff; color: #555; padding: 0 10px; box-sizing: border-box; font-family: 'Arial', sans-serif; margin-bottom: 15px;}
.formmailer .rsform-block-sicherheitscode .formControlLabel {background-color: #fff; padding: 5px; display: table; margin-bottom: 15px;}
.rsform-block-name label, .rsform-block-telefon label, .rsform-block-e-mail label, .rsform-block-nachricht label {display: none;}
#system-message-container {display: none;}
.formmailer .formControlLabel {display: none!important;}
.formmailer .formControls {margin-left: 0!important;}
.formmailer .rsform-block {margin-bottom: 0!important;}
.formmailer p {font-size: 14px;}
.formmailer a {color: #2d2d2d; text-decoration: none;}
.formmailer a:hover {color: #91c080;}

::placeholder {color: #2d2d2d; opacity: 1;}
:-ms-input-placeholder {color: #2d2d2d;}
::-ms-input-placeholder {color: #2d2d2d;}










