/**
* Theme Name: fluesterton
*Template: wp-bootstrap-starter
*/
@import url('../wp-bootstrap-starter/style.css');

body { font-family: 'Comic Neue', Helvetica, Arial, sans-serif; font-size: 1.2em; line-height: 1.6em; color: #2a2a2a;  }

.widget { border-top: 0px; list-style-type: none;}

#page { padding: 0;}

a:hover { text-decoration: none;}

@media screen and (min-width: 790px) {
	body { font-size: 1.2em;} 
}

/** ################################ header ################################# */

header#masthead { background: #fff;}

#page { background: #efe5de url(https://fluesterton-tierkommunikation.de/wp-content/uploads/2021/01/hg.png)}

header#masthead { background: #5b4f45 url(https://fluesterton-tierkommunikation.de/wp-content/uploads/2021/01/hg.png); box-shadow: 0px 0px 20px #4B4139; padding-bottom: 30px }

.site-header .container { max-width: 1150px; }

.headerlinks { display: none; position: absolute;  width: 250px; margin: 0 30px -30px -70px; z-index: 700; }

#headeradresse ul, #headeradresse ul li { margin: 0; padding: 0; font-size: 1em}
.head-adresse { float: right; padding-top: 15px; width: 100%; margin-right: 0px; }
.brand-text { display: inline-block; }
p.head-name  { color: #fff; margin: 0; padding-right: 30px; font-size: 1.3em; }
p.head-name img { width: 80%; max-width: 300px; padding-bottom: 6px; margin-left: -10px }
p.head-mail  { margin: 0.4em 0 0 -7px }
p.head-mail a  { color: #fff; font-size: 0.9em; padding: 10px 10px 7px 10px; border-radius: 5px; transition: 0.3s; }
p.head-mail a:hover  { background: #C0AA9A; }
p.head-tel  { text-align: center; padding-top: 1.0em; margin-bottom: 0.2em}
p.head-tel a  { color: #fff; font-size: 1.2em; padding: 10px 20px 7px 20px; border-radius: 5px; transition: 0.3s}
p.head-tel a:hover { background: #C0AA9A;}

#content.site-content { padding-bottom: 80px; padding-top: 0; 
}
.site-content .container {  margin-top: -20px; background: #fff; box-shadow: 0px 0px 20px #4B4139; border: 2px solid #fff; border-radius: 10px}
#headerbild ul { padding: 0; margin: 0 -15px; }
#headerbild ul img { border-top-left-radius: 10px; border-top-right-radius: 10px;}

@media screen and (min-width: 590px) {
	p.head-name img { width: 80%; max-width: 320px; }
		p.head-tel  { float: right; text-align: right; padding-top: 0em; margin-top: -1.7em}
}
@media screen and (min-width: 616px) {
		p.head-tel  { padding-top: 6.2em; margin-top: 0em}
}
@media screen and (min-width: 694px) {
		p.head-tel  { padding-top: 6.2em; margin-top: 0em}
}
@media screen and (min-width: 770px) {
.headerlinks { display: block; width: 130px; margin: 0 30px -30px -20px; } 
.head-adresse { padding: 10px 0 10px 0;  width: calc(100% - 120px); }
	p.head-name img { max-width: 290px; }
p.head-tel  { float: right; text-align: right; padding-top: 5.3em; }
}

@media screen and (min-width: 991px) {
.headerlinks { width: 170px; margin: 0 30px -30px -20px; } 
.head-adresse { padding: 10px 0 20px 0; width: calc(100% - 180px);}
p.head-tel  { padding-top: 5.0em; }
}
@media screen and (min-width: 1200px) { 
	header#masthead { height: 250px; box-shadow: 0px 0px 20px #4B4139; }
.headerlinks { width: 250px; margin: 0 30px -30px -70px; } 
.head-adresse { padding: 10px 0 0px 0; width: calc(100% - 220px); font-size: 1.1em; }
	p.head-tel  {font-size: 1.1em; padding-top: 4.4em; }
.site-content .container {  margin-top: -70px; background: #fff; box-shadow: 0px 0px 20px #4B4139; border: 2px solid #fff; border-radius: 10px; padding: 0 60px}
#headerbild ul { padding: 0; margin: 0 -60px; }
#headerbild ul img { border-top-left-radius: 10px; border-top-right-radius: 10px;}
}  

/** ################################ /header ################################# */


/** ################################ content ################################# */


.crellyslider > .cs-slides > .cs-slide { border-top-right-radius: 10px; border-top-left-radius: 10px}
.crellyslider > .cs-controls > .cs-next { background: rgba(000,000,000,0.5) url("https://fluesterton-tierkommunikation.de/wp-content/uploads/2021/01/pfeil-rechts-weiss.png") no-repeat 14px 5px; background-size: 10px; border-radius: 5px; right: 30px; }
.crellyslider > .cs-controls > .cs-previous { background: rgba(000,000,000,0.5) url("https://fluesterton-tierkommunikation.de/wp-content/uploads/2021/01/pfeil-links-weiss.png") no-repeat 12px 5px; background-size: 10px; border-radius: 5px; right: 30px; }

h1 { color: #4f3125; font-family: Satisfy, 'Comic Neue', Helvetica, Arial, sans-serif; font-size: 2.5em; text-align: center; }
.mitteliste ul{  max-width: 700px; margin: 0 auto}
.drittelbild { width: 100%; margin-bottom: 15px}
.halbbild { width: 100%; margin-bottom: 15px}
.hzwei, h2 { text-align: center; font-size: 1.7em; color: #4f3125; font-family: Satisfy; margin: 1.5em 0 0.75em 0}

.tgvierer .kc_text_block { background: #f7f2ef}
.tgvierer p { text-align: center; margin-bottom: 0.5em}
.tgvierer h3 { text-align: center; padding: 0 10px; margin: 0.75em 0 0 0}
.tgvierer h3 a { color: #2a2a2a}
.tgvierer .kc_text_block ul { margin: 0; padding: 10px 0 5px 30px}
.tgvierer .kc_text_block ul li { font-size: 0.8em; line-height: 1.4em}

.kasten { background: #f7f2ef; padding: 10px 20px; font-size: 0.9em; line-height: 1.8em; margin-bottom: 20px  }
.kasten h4 { font-size: 1.2em; text-align: center}

.checkbox a { color: #2a2a2a;}

.senden { text-align: center; }
.senden input.btn { padding: 10px 40px;background: #5B4F45; color: #fff; font-size: 1.0em; border-radius: 5px; margin-top: 10px }
.senden input.btn:hover { background: #C1AB9B; }

.alert-success { border: none; background: none; font-weight: bold; padding: 60px 10px}

.kontakt { overflow: hidden; }
.kontakt h2 { font-size: 2em; border-bottom: 1px solid #5A4E44; width: 90%; margin: 1em auto}
.kontakt .kontaktadresse h4 { text-align: left; font-size: 1.6em}
.kontakt .kontaktadresse p { font-size: 1.2em}

.kontaktemail a { color: #2a2a2a; font-size: 1.2em}
.kontaktemail a:hover { background: #C1AB9B; color: #2a2a2a; padding: 10px; border-radius: 3px}

.kundenstimmen { font-style: italic; font-size:0.9em; background: #f7f2ef; padding: 25px; margin-bottom: 40px }
.kundenstimmen p { margin-bottom: 0.5em; line-height: 1.4em}

.impressum h3 { font-size: 1.3em}
.impressum h5 { font-size: 1.1em; margin-bottom: 0.5em}
.impressum a { color: #2a2a2a}

@media screen and (min-width: 550px) {
	.drittelbild { width: 30%}
	.halbbild { width: 48%; margin-bottom: 10px; margin-top: 0.5em}
}

@media screen and (min-width: 770px) {
.kasten { background: #f7f2ef; padding: 10px 30px; font-size: 0.8em; line-height: 1.8em; margin-bottom: 20px  }
.kasten h4 { font-size: 1.2em; text-align: center}
}

/** ################################ /content ################################# */

/** ################################ footer ################################# */



div#footer-widget {background: #c1ab9b url(https://fluesterton-tierkommunikation.de/wp-content/uploads/2021/01/hg.png); box-shadow: 0px -1px 2px #897d73; padding: 30px 0 20px 0;  }

.footerlinks { text-align: center}
.footerlinks img { width: 70%; min-width: 190px; max-width: 240px; padding-bottom: 20px}

.footermitte, .footerrechts { padding-top: 0px; max-width: 240px; margin: 0 auto; font-size: 1.2em}
.footerschriftzug{ margin: 0 0 0.5em 0 }
.footerschriftzug img {height: 2em; margin: 0 0 0 0   }
.footermitte h4, .footerrechts h4 { font-size: 1.4em; border-bottom: 1px solid #5B4F45; padding-bottom: 5px; width: 100%; margin-top: 0;}
.footerrechts h4 { padding-top: 1.8em}
.footermitte h5, .footerrechts h5 { font-size: 1.2em; line-height: 1.4em; margin-top: 1em}
.footermitte h5 a, .footerrechts h5 a { color: #24292e; }
.footermitte h5 a:hover, .footerrechts h5 a:hover { background: #5B4F45; color: #fff; padding: 10px; margin-left: -10px; border-radius: 3px }

@media screen and (min-width: 380px) {.footermitte, .footerrechts { padding-top: 0px; max-width: 300px;font-size: 1.1em}
}

@media screen and (min-width: 768px) {.footermitte, .footerrechts { padding-top: 0px; max-width: 600px;}
}
@media screen and (min-width: 1019px) {.footermitte, .footerrechts { font-size: 1.0em }
}

@media screen and (min-width: 1200px) {
	.footermitte, .footerrechts { padding-top: 15px; font-size: 1.1em}
.footermitte h4, .footerrechts h4 { width: 90%}
}


.subfooter { background: #5b4f45 url(https://fluesterton-tierkommunikation.de/wp-content/uploads/2021/01/hg.png); padding: 20px 21px 30px 21px;}





#sub-footer ul li ul { padding: 0;  }
#sub-footer ul li ul#menu-impressum li { float: left;  }
#sub-footer ul li ul#menu-impressum li a { display: inline-block; width: auto; color: #ccc }
#sub-footer ul li ul#menu-impressum li a:hover { background: none }
#sub-footer ul li ul#menu-impressum { display: inline-block;  }

/** ################################ /footer ################################# */



@media screen and (min-width: 500px) { }  
@media screen and (min-width: 44.375em) { }  /**  >= 710px */
@media screen and (min-width: 769px) { }  
@media screen and (min-width: 56.875em) { }  /**  >= 910px */
@media screen and (min-width: 61.5625em) {  }  /**  >= 985px */