/* CSS Document 
Theme Name: SVVS
Author: EDB
Version: 1.0
*/
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,address,cite,code,del,dfn,em,img,ins,q,small,strong,sub,sup,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td{border:0;margin:0;padding:0}article,aside,figure,figure img,figcaption,hgroup,footer,header,nav,section,video,object{display:block}a img{border:0}figure,figure img{padding: 0; margin: 0;}
@font-face {font-family: 'Roboto Condensed';
    src: url('fonts/RobotoCondensed-Bold.woff2') format('woff2'),
        url('fonts/RobotoCondensed-Bold.woff') format('woff');
    font-weight: bold;    font-style: normal;}

@font-face {font-family: 'Roboto';
	src: url('fonts/Roboto-Bold.woff2') format('woff2'),
        url('fonts/Roboto-Bold.woff') format('woff');
    font-weight: bold;    font-style: normal;}

@font-face {    font-family: 'Roboto';
    src: url('fonts/Roboto-Regular.woff2') format('woff2'),
        url('fonts/Roboto-Regular.woff') format('woff');
    font-weight: normal;    font-style: normal;}

html{width: 100%;  overflow-x: hidden !important;height: auto;}
body{font-family: 'Roboto'; font-size:16px; font-weight: 400; color: #363636;  width: 100%;  font-variant-ligatures: none;}
*{box-sizing: border-box;}
.text-center{text-align: center;}
.text-right{text-align: left;}
.text-left{text-align: left;}
.clear{clear: both;}
figure{width: 100%; height: auto; position: relative; display: inline-block; text-align: center;}
strong{font-weight: 700;}
p{margin-bottom: 15px; line-height: 1.4em; text-align: justify;}
a{cursor: pointer; text-decoration: none;}
h1{font-family: 'Roboto'; color: #706f6f; font-weight: 700; font-size: 1.3em; position: relative; margin-bottom: 30px;}
h2{}
h3{margin-bottom: 20px; padding: 10px 15px; border-left: 2px solid #870d20;}
h4{}
h5{margin-bottom: 10px;}
h6{}
.row, main, .footer-widget{width: 100%; margin: 0 auto; padding: 0 10px; position: relative;}
ul{list-style: none;}
html::before {
    content: ' ';
    display: block;
    background-image: url(images/luftbild-goerlitz.jpg);
    background-position: center;
    background-size: cover;
    height: 100vh; width: 100vw;
    top: 0; bottom: 0; left: 0; right: 0;
    position: fixed;
    z-index: -10; 
}

/* Schrift */
main span.rot{color: #870d20; font-weight: 700;}
main span.grau{color: #706f6f; font-weight: 700;}


/* HEADER */
header{padding-top: 30px; background: #fff; position: relative;}

header .header-container{width: 100%; height: auto; position: relative; display: inline-block; padding-bottom: 10px;}
header .logo{width: 30%; height: auto; display: inline-block; float: left;}
header .logo img{width: 100%; height: auto;}
.headimage {width: 100%; height: 170px; background-size: cover; background-position: top center; position: relative; display: block; background-repeat: no-repeat;}
.headimage::after{content:""; position: absolute; left: 0; right: 0; top: 0; bottom: 0; width: 100%; height: 170px; background: url(images/bg_overlay_black.png);}
.slogan{color: #fff; font-size: 1.2em; padding-bottom: 15px; text-shadow: 2px 3px 2px rgba(0,0,0,0.65); z-index: 10; text-align: center; position: relative; margin: 0 auto; width: 100%; padding-top: 12%;}


/* NAVIGATION */
nav.main-navigation{display: none; font-family: 'Roboto'; color: #6c6667; font-weight: 400;}
header .mobil-nav ul li a {font-family: 'Roboto'; color: #6c6667; font-weight: 400;}
header .mobil-nav {  display: none; position: fixed;  top: 0px;  right: -100%;  width: 80%;  height: 100%;  background-color:rgba(231,231,231,1.00);	padding: 70px 0px 10px 0px;	z-index: 9991;  transition: left 0.3s ease, opacity 0.3s ease;  opacity: 0;}
header .mobil-nav.active {  right: 0;display: inherit;	opacity: 1;}
header .mobil-nav ul li a{	padding: 7px 20px;	width: 100%;	height: auto;	display: inline-block;}	
header .mobil-nav ul li:hover a{	background: #870d20;	color: #fff;}
header .mobil-nav ul li.menu-item-has-children li a, header .mobil-nav ul.submenu li:hover a{color: #870d20; background: #fff;}
header .mobil-nav ul > li.current_page_item a, header .mobil-nav ul li.current-page-parent{color: #870d20; background: #fff;}
header .mobil-nav ul li ul.sub-menu li.current-menu-item a {color: #870d20;}	
header .hamburger {  display: block;  position: absolute;  top: 0px;  right: 20px;  cursor: pointer;  z-index: 9999;	color: #870d20;	font-weight: bold; font-size: 1.5em;}
header .close-icon {  display: none;  position: absolute;  top: 0px;  right: 20px;  cursor: pointer;  z-index: 9999; color: #870d20;}
header .mobil-nav.active .hamburger {  display: none;}
header .mobil-nav.active .close-icon {  display: block;	color: #870d20;}
.mobil-menu .menu-item-has-children > a::after {  content: '+';  float: right;color: #870d20;;	font-weight: bold;}
.mobil-menu .menu-item-has-children.active > a::after {  content: '-';	color: #870d20;	font-weight: bold;}
.mobil-menu .sub-menu {  display: none;  opacity: 0;  transition: opacity 0.3s ease; }
.mobil-menu .menu-item-has-children.active > .sub-menu {  display: block;  opacity: 1; }

/* CONTENT */

.wrap{width: 100%; height: auto; position: relative; clear: both; }
.wrap .background{width: 100%; position: relative;  background: url(images/bg_overlay_white.png) ; padding: 70px 0;}


main a{color: #870d20;}
main ul{margin-left: 15px; margin-bottom: 10px;}



main .wp-block-group{margin-bottom: 30px; border-radius: 20px; background:rgba(255,255,255,0.8); padding: 30px 30px; overflow: hidden;}
main .wp-block-image{}
main .wp-block-image img{width: 100% !important; height: auto !important;}

main .contact-white{background: #fff; border-radius: 10px; padding: 30px 15px;}

/* Leistungen */
section.leistungen, section.teams{background:url(images/bg_leistungen.jpg) no-repeat; background-size: cover;  position: relative; padding: 45px 5px 30px 5px; width: 100%; display: inline-block; }
section.teams{background:url(images/bg_team.jpg) no-repeat; background-size: cover;}
section.teams{ position: relative; padding: 45px 5px 0 5px; width: 100%; display: inline-block; margin-bottom: 200px;}
section.leistungen .col-30, section.teams .col-30, section.leistungen .col-50, section.numbers .col-30{width: 100%; float: left; text-align: center;}
section.leistungen .col-10{display: none;}
section.leistungen .leistung, section.teams .team{width: 95%; margin: 0 auto; display: inline-block; position: relative; }
section.leistungen .leistung figure, section.teams .team figure{text-align: center; width: 100%; background: #fff; position: relative; z-index: 2; display: inline-block; border: 2px solid #870d20; border-top-left-radius: 10px; border-top-right-radius: 10px; overflow: hidden;}
section.leistungen .leistung figure img, section.teams .team figure img{width: 100%; height: auto;margin: 0 auto;}
section.leistungen .leistung figure img{max-height: 240px;}
section.leistungen .leistung .text-wrap, section.teams .team .text-wrap{border: 2px solid #939393; padding: 40px 10px 30px 10px; width: 90%; margin: 0 auto; position: relative; margin-top: -10px; margin-bottom:30px; text-align: center; background: #fff; -webkit-box-shadow: 0px 14px 12px -6px rgba(0,0,0,0.5); 
box-shadow: 0px 14px 12px -6px rgba(0,0,0,0.5);  border-bottom-left-radius: 10px; border-bottom-right-radius: 10px;}
section.leistungen .leistung .text-wrap p, section.teams .team .text-wrap p{text-align: center !important;}
section.teams .team .text-wrap p.titel{color: #363636;}
section.leistungen .leistung .text-wrap h5, section.teams .team .text-wrap h5{color: #870d20; font-weight: 700; font-size: 1.1em;}
section.leistungen .leistung .text-wrap p, section.teams .team .text-wrap p{color: #706f6f;}
section.leistungen .leistung a{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; text-indent: 200%; white-space: nowrap; font-size: 0; opacity: 0;}

section.numbers{width: 100%; clear: both; background:rgba(240,240,240,1.00); padding: 30px 0;}
section.numbers .grey{border-radius: 15px; background: #fff; height: auto; width: 100%; display: inline-block; padding: 30px 0;}
section.numbers p.zahl{font-size: 1.8em; color: #870d20; font-weight: 700;}
section.numbers p{text-align: center !important;}

/* Bilder */
.image-right, .image-left{overflow: hidden; margin: 0;}
.image-right{border-top-right-radius: 20px; border-bottom-right-radius: 20px;}
.image-left{border-top-left-radius: 20px; border-bottom-left-radius: 20px;}
.wp-block-column:not(.image-left) p:last-child{margin-bottom: 0;}

/* Kontaktbereich */
.kontaktarea{width: 100%; background: url(images/bg_kontakt02.jpg) no-repeat left center; background-size: cover; display: inline-block; position: relative; padding: 30px 0; margin:  -5px 0 200px 0;  -webkit-box-shadow: 0px 9px 5px -3px rgba(0,0,0,0.57);-moz-box-shadow: 0px 9px 5px -3px rgba(0,0,0,0.57); box-shadow: 0px 9px 5px -3px rgba(0,0,0,0.57);}
.kontaktarea::after{content: ""; width: 40%; height: 10px; background: #870d20; display: inline-block; right: 0; bottom: -5px; position: absolute;}
.kontaktarea h4{color: #870d20; font-size: 1.2em;}
.kontaktarea p.contact{background: #939393; color: #fff;display: inline-block; padding: 7px 15px; font-weight: 700; font-size: 1.1em; border-radius: 5px;}
.kontaktarea p span.button:first-child{  margin-right: 20px;}
.kontaktarea p span.button a{background: #870d20; color: #fff; display: inline-block; padding: 7px 10px;}
.kontakarea::after{content: ""; background:url(images/bg_overlay_white.png); width: 100%; height: 130px; position: absolute; left: 0; bottom: 0; display: block;}

/* FOOTER */
footer{background: #870d20; width: 100%; border-top: 2px solid #fff; color: #fff; position: relative;-webkit-box-shadow: 0px -9px 5px -3px rgba(0,0,0,0.57);
-moz-box-shadow: 0px -9px 5px -3px rgba(0,0,0,0.57);box-shadow: 0px -9px 5px -3px rgba(0,0,0,0.57);}
footer .logo{background: #fff; margin: 0 auto; max-width: 300px; height: auto; padding: 20px 10px; position: relative;}
footer .logo img{width: 100%; height: auto;}
footer .logo::before, footer .logo::after{z-index: -1; position: absolute; content: ""; bottom: 15px; left: 10px; width: 50%; top: 90%; max-width:330px; background: #777; -webkit-box-shadow: 0 15px 10px #777; -moz-box-shadow: 0 15px 10px #777; box-shadow: 0 15px 10px #777; -webkit-transform: rotate(-3deg); -moz-transform: rotate(-3deg); -o-transform: rotate(-3deg); -ms-transform: rotate(-3deg); transform: rotate(-3deg);} 
footer .logo::after{-webkit-transform: rotate(3deg); -moz-transform: rotate(3deg); -o-transform: rotate(3deg); -ms-transform: rotate(3deg); transform: rotate(3deg); right: 10px; left: auto;}
footer .widget-title{display: none;}
footer .widget_nav_menu{padding: 30px 0 20px 0; border-bottom: 1px solid #fff; display: inline-block; margin-bottom: 15px;}
footer .menu-footer-menue-container{ margin: 0 auto; width: 100%;}
footer .menu-footer-menue-container ul li{list-style: none; float: none;}
footer .menu-footer-menue-container ul li a{color: #fff; padding: 10px 3px; display: block;}
footer p.has-text-align-right{text-align: left;}

/* Formatierung Startseite */
body.home.page-id-9 main .wp-block-group{    margin-top: -110px; border-top: 8px solid #870d20; background: #fff;}
body.home.page-id-9 .headimage{width: 100%; height: 170px; background-size: cover; background-position: top center; position: relative;}
body.home.page-id-9 .headimage::after{display: none !important;}


/* Formatierung Header Unterseiten */
body.home.page-id-9 main .wp-block-group{    margin-top: -110px; border-top: 8px solid #870d20; background: #fff;}

/* Partnerlogos */

body.page-id-485 main .wp-block-image img{max-width: 70%; height:auto;width: auto; margin: 0 auto;border: 2px solid #fff;}
body.page-id-485 main .wp-block-image img:hover{border: 2px solid rgba(150,150,150,1.00);}

@media screen and (min-width: 550px){
	.kontaktarea .col-60{width: 80%;}
	.kontaktarea .col-40{width: 20%;}
}
	
@media screen and (min-width: 580px){
body.home.page-id-9 .headimage, .headimage, .headimage::after{width: 100%; height: 250px;}
body.home.page-id-9 .slogan{font-size: 1.5em;padding-top: 20%;}
	
section.leistungen .col-30, section.teams .col-30, section.numbers .col-30{width: 33%; float: left;}
section.leistungen .col-10{display: block; width: 11%; float: left;}
	

}

@media screen and (min-width: 680px){
	.kontaktarea .col-60{width: 70%;}
	.kontaktarea .col-40{width: 30%;}
}

@media screen and (min-width: 700px){
header .logo img{width: 100%; height: auto; max-width: 246px;}
.slogan, body.home.page-id-9 .slogan{font-size: 1.7em;}
	
.col-33{width: 30%; float: left;}

}
@media screen and (min-width: 760px){
	.kontaktarea{padding: 70px 0;}
}
@media screen and (min-width: 780px){
	body.home.page-id-9 .headimage, .headimage, .headimage::after{width: 100%; height: 350px;}
	.slogan, body.home.page-id-9 .slogan{font-size: 1.9em;}
	
}
@media screen and (min-width: 820px){

	footer .menu-footer-menue-container ul li{float: left; padding: 0px 5px; display: inline-block;}
	footer p.has-text-align-right{text-align: right;}
}

@media screen and (min-width: 900px){
h1{font-size: 1.8em;}
h1.topline{font-size: 1.2em;}
	header .logo{width: 30%; float: left;}

	.kontaktarea, section.teams{margin-bottom: 400px}
.text-right{text-align: right;}
		
.footer-widget figure.wp-block-gallery figure.wp-block-image{width: 22% !important; height: auto; display: inline-block; float: left; margin: 10px 1% !important; text-align: center;}
	.slogan, body.home.page-id-9 .slogan{font-size: 2.2em;}
}
@media screen and (min-width: 920px){
	header .mobil-nav, header .hamburger, header .close-icon {  display: none;}
nav.main-navigation{width: 70%; display: block; float: left; padding-top: 55px; }
nav.main-navigation ul{width: 100%; display: inline-block; position:relative; height:auto;}
nav.main-navigation ul > li{ float: left; display: inline-block;  position: relative;}
nav.main-navigation ul > li > a{color: #6c6667; font-weight: 400; font-size: 1.0em; padding: 0px 5px; display: inline-block;}
nav.main-navigation ul > li.current_page_item > a, nav.main-navigation ul > li:hover > a, nav.main-navigation ul > li.current-page-parent{color: #870d20;}
nav.main-navigation ul li:hover > ul {    display: block;	z-index: 100;}
nav.main-navigation ul > li > ul {display: none; position: absolute; top: 100%;    left: 0;    width: 200px;     background: #fff;    border-bottom: 1px solid #fff; 
    padding: 10px 0; }
nav.main-navigation ul > li > ul.sub-menu li {    display: inline-block;    border: none; width: 100%;}
nav.main-navigation ul > li > ul.sub-menu li a {    color: #6c6667; font-size: 0.95em;    padding: 10px 17px;  width: 100% !important; background: none; display: inline-block;}
nav.main-navigation ul > li > ul.sub-menu > li:hover > a, nav.main-navigation ul > li > ul.sub-menu > li.current-menu-item > a { color: #870d20;}
}
@media screen and (min-width: 1000px){
body.home.page-id-9 .headimage {width: 100%; height: 500px;}
.slogan, body.home.page-id-9 .slogan{font-size: 2.5em;}	
nav.main-navigation ul li a{padding: 0px 9px; }
.kontaktarea{padding: 70px 0;}
	.kontaktarea h4{color: #870d20; font-size: 1.7em; margin-bottom: 30px;}
	.kontaktarea p.contact{margin-top: 30px;padding: 12px 25px; font-size: 1.4em;}
	.kontaktarea .col-60{width: 60%;}
	.kontaktarea .col-40{width: 40%;}
		footer .menu-footer-menue-container{width: 100%;}
	footer .menu-footer-menue-container ul{margin: 0 auto;}
	footer .menu-footer-menue-container ul li{padding: 0 30px}
}
@media screen and (min-width: 1220px){
.row, .innerwrap{width: 1200px; margin: 0 auto; position: relative;}	
nav.main-navigation ul li a{font-size: 1.05em; padding: 0px 15px; }
	.slogan, body.home.page-id-9 .slogan{font-size: 3em;}

}
@media screen and (min-width: 1440px){
	body.home.page-id-9 .headimage, .headimage{background-position: top -100px center;}
}