@font-face { font-family: 'Merriweather'; src: url('../fonts/merriweather-black-webfont.woff2') format('woff2'), url('../fonts/merriweather-black-webfont.woff') format('woff'); font-weight: 900; font-style: normal; }
@font-face { font-family: 'Merriweather'; src: url('../fonts/merriweather-blackitalic-webfont.woff2') format('woff2'), url('../fonts/merriweather-blackitalic-webfont.woff') format('woff'); font-weight: 900; font-style: italic; }
@font-face { font-family: 'Merriweather'; src: url('../fonts/merriweather-light-webfont.woff2') format('woff2'), url('../fonts/merriweather-light-webfont.woff') format('woff'); font-weight: 300; font-style: normal; }
@font-face { font-family: 'Merriweather'; src: url('../fonts/merriweather-lightitalic-webfont.woff2') format('woff2'), url('../fonts/merriweather-lightitalic-webfont.woff') format('woff'); font-weight: 300; font-style: italic; }
@font-face { font-family: 'Merriweather'; src: url('../fonts/merriweather-regular-webfont.woff2') format('woff2'), url('../fonts/merriweather-regular-webfont.woff') format('woff'); font-weight: 400; font-style: normal; }
@font-face { font-family: 'Open Sans'; src: url('../fonts/opensans-regular-webfont.woff2') format('woff2'), url('../fonts/opensans-regular-webfont.woff') format('woff'); font-weight: 400; font-style: normal; }
@font-face { font-family: 'Open Sans'; src: url('../fonts/opensans-semibold-webfont.woff2') format('woff2'), url('../fonts/opensans-semibold-webfont.woff') format('woff'); font-weight: 700; font-style: normal;}

body { margin: 0; padding: 0; font: 20px/30px 'Open Sans', sans-serif;}

/* Layout */
.inner { width: 1170px; margin: 0 auto;}

/* - - - - - Header - - - - - */
.header-wrap { position: fixed; z-index: 50; background: #fff; width: 100%; overflow: hidden; top: 0; left: 0;}
.header-wrap .inner { position: relative;}

/* Logo */
.logo { width: 275px; margin: 30px 0 20px;}
.logo a:before { display: none;}
.logo img { width: 100%; height: auto;}

/* Menü */
.nav-toggle { background: url("../../images/template/menu-toggle.png") no-repeat 0 0; width: 42px; height: 30px; background-size: 42px; position: absolute; right: 0; top: 0; cursor: pointer;}
.nav-toggle:after { content: 'Menü'; display: inline-block; right: -68px; position: absolute;}
.nav-toggle.open { background: url("../../images/template/menu-toggle-close.png") no-repeat right center; background-size: 30px;}
.nav-inner { display: none; width: 100%; height: 100%; background: #fff; position: fixed; left: 0; top: 0; z-index: 50; overflow: scroll;}
.nav-inner .inner { position: relative;}
.nav-inner .mainnav { padding: 3x 0 0; margin: 0;}
.nav-inner .mainnav li { border-top: solid 2px #000; list-style: none; position: relative; height: 135px;}
.nav-inner .mainnav li.active { border-color: #c90927;}
.nav-inner .mainnav li a { position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.nav-inner .mainnav li a:before { display: none}
.nav-inner .mainnav .small { background: #000; display: inline; text-align: right; position: absolute; right: 0; top: 0; text-transform: uppercase; padding: 0 15px;}
.nav-inner .mainnav a:hover .small { color: #c90927;}
.nav-inner .mainnav li.active .small { background: #c90927; color: #000;}
.nav-inner .mainnav li.active a:hover .small { color: #000;}
.nav-inner .mainnav .big { text-align: right; position: absolute; right: 0; top: 31px; font: 300 50px/55px 'Merriweather', serif;}
.nav-inner .mainnav a .big { color: #000;}
.nav-inner .mainnav a:hover .big { color: #c90927;}
.nav-inner .mainnav a .big em { color: #c90927; font-style: normal}
.nav-inner .mainnav a .big b { font-weight: 700;}

/* - - - - - Main Container - - - - - */
.main-wrap { margin-top: 125px;}

.home .main-wrap .inner { background: url("../../images/template/arrow.png") no-repeat center top ; padding-top: 100px}

hr { border: none; border-top: 2px solid #c90927; background: url("../../images/template/arrow.png") no-repeat top center; padding-bottom: 20px; margin: 60px 0;}

/* Headlines */
h1 { display: inline-block; color: #c90927; text-transform: uppercase; font: 600 20px/30px 'Open Sans', sans-serif; background: #000; margin: 0; padding: 0 10px;}
.csc-header.h1-in { border-bottom: solid 2px #000; margin: 50px 0 23px;}

h2 { font: 900 50px/62px 'Merriweather', serif; margin: 0 0 50px;}
h2 em { font-style: normal; color: #c90927;}

.headline { padding: 1.6px 0 1px; border-left: 20px solid #000; display:inline-block; margin-bottom: 20px;}
h3 { font: 900 20px/24px 'Merriweather', serif; background-color: #000; color: #fff; display: inline; margin: 0; padding: 4px 0 3px; text-transform: uppercase; letter-spacing: 2px;}
h3 .headline-inner { position: relative; left:-10px; display: inline}
h3 em { font-style: normal; color: #c90927;}

h4 { margin: 0;}
h4.linie-rot { color: #c90927; border-top: solid 2px #c90927; margin: 25px 0 35px;}
h4.linie-rot a:before { display: none}
h4.linie-schwarz { border-top: solid 2px #000; margin: 25px 0 35px;}
h4.linie-schwarz a { color: #000;}
h4.linie-schwarz a:before { display: none}

/* Text */
p { margin: 0 0 30px;}
p:last-child { margin-bottom: 0;}
p.fazit { font-weight: 900; border-top: solid 2px #000;}
p em { color: #c90927; font-style: normal; font-weight: 600}

/* Listen */
ol { margin: 0; padding-left: 0; counter-reset: item;}
ol li { border-top: solid 2px #000; list-style: none; margin-bottom: 28px;}
ol li:before { counter-increment: item; content: counter(item) '.'; text-align: center; display: inline-block; font-weight: 900; padding-right: 5px;}

ul { margin: 0; padding: 0;}
ul li { list-style: none; border-top: solid 2px #000; margin-bottom: 30px;}
ul.pfeil-liste { padding: 0;}
ul.pfeil-liste li { list-style: none; background: url("../../images/template/list-arrow.png") no-repeat left 2px; padding-left: 100px; border: none;}
ul.pfeil-liste li:last-child { margin-bottom: 0}
ul.pfeil-liste em { font-style: normal; color: #c90927; font-weight: 700;}

/* Links */
a { color: #c90927; font-weight: 700; text-decoration: none;}
a:before { content: '»'; display: inline-block; padding-right: 5px; font: 900 20px/30px 'Open Sans', serif;}
a:hover { color: #000;}

a.button { background: #c90927; color: #fff; display: inline-block; padding: 10px 10px; border: none; cursor: pointer; margin-top: 20px;}
/*a.button:before { display: none;}*/
a.button:hover { color: #000;}

/* Text mit Bild */
.csc-textpic-center.csc-textpic-below .csc-textpic-imagewrap { margin-top: 50px;}
.csc-textpic-center.csc-textpic-above .csc-textpic-imagewrap { margin-bottom: 25px;}
div.csc-textpic .csc-textpic-imagewrap .csc-textpic-image { margin: 0;}
figure { margin: 0;}

/* Formular */
.tx-powermail { margin-bottom: 20px;}
.tx-powermail .headline,
.tx-powermail h3 { display: none;}
.powermail_legend { display: none;}
.powermail_fieldset { border: none; margin: 0; padding: 0;}
.powermail_textarea, 
.powermail_input {border: solid 1px #000; padding: 10px; font: 500 20px/30px 'Open Sans', serif; margin-bottom: 30px; width: 96%;}
.powermail_textarea:focus, 
.powermail_input:focus { outline: none; border-color: #c90927; }
.powermail_submit { background: #c90927; color: #fff; font: 900 20px/24px 'Merriweather', serif; text-align: center; width: 100%; display: block; padding: 15px 0; border: none; cursor: pointer;}
.powermail_submit:hover { color: #000;}
.powermail_fieldwrap_datenschutz { margin-bottom: 30px;}
.powermail_fieldwrap_datenschutz .powermail_label { display: none;}

/* - - - Grid Elemente - - - */

/* 2-sapltiger Container 25/75*/
.col-25-75-wrap { overflow: hidden; margin-bottom: 50px;}
.col-25-75-wrap .col { float: left; margin-right: 30px; width: 23.1%;}
.col-25-75-wrap .col2 { margin-right: 0; width: 74.3%}

/* 2-sapltiger Container 33/66*/
.col-33-66-wrap { overflow: hidden; margin-bottom: 50px;}
.col-33-66-wrap .col { float: left; margin-right: 30px; width: 31.7%;}
.col-33-66-wrap .col2 { margin-right: 0; width: 65.7%}

/* 2-sapltiger Container 40/60*/
.col-40-60-wrap { overflow: hidden; margin-bottom: 50px;}
.col-40-60-wrap .col { float: left; margin-right: 30px; width: 40.2%;}
.col-40-60-wrap .col2 { margin-right: 0; width: 57.2%}

/* 2-spaltiger Container 50/50 */
.col-50-wrap { overflow: hidden; margin-bottom: 50px;}
.col-50-wrap .col { float: left; margin-right: 30px; width: 48.7%;}
.col-50-wrap .col2 { margin-right: 0;}

/* 2-spaltiger Container 50/40 */
.col-50-40-wrap { overflow: hidden; margin-bottom: 50px;}
.col-50-40-wrap .col { float: left; margin-right: 130px; width: 48.7%;}
.col-50-40-wrap .col2 { margin-right: 0; width: 40.1%;}

/* 2-sapltiger Container 66/33*/
.col-66-33-wrap { overflow: hidden; margin-bottom: 50px;}
.col-66-33-wrap .col { float: left; margin-right: 30px; width: 65.7%}
.col-66-33-wrap .col2 { margin-right: 0; width: 31.7%;}

/* 2-sapltiger Container 60/40*/
.col-60-40-wrap { overflow: hidden; margin-bottom: 50px;}
.col-60-40-wrap .col { float: left; margin-right: 30px; width: 57.2%;}
.col-60-40-wrap .col2 { margin-right: 0; width: 40.2%}

/* 2-sapltiger Container 75/25*/
.col-75-25-wrap { overflow: hidden; margin-bottom: 50px;}
.col-75-25-wrap .col { float: left; margin-right: 30px; width: 74.3%}
.col-75-25-wrap .col2 { margin-right: 0; width: 23.1%;}

/* 3-spaltiger Container 33/33/33 */
.col-33-wrap { overflow: hidden; margin-bottom: 50px;}
.col-33-wrap .col { float: left; margin-right: 30px; width: 31.6%;}
.col-33-wrap .col3 { margin-right: 0;}

/* 4-spaltiger Container 25/25/25/25 */
.col-25-wrap { overflow: hidden; margin-bottom: 50px;}
.col-25-wrap .col { float: left; margin-right: 30px; width: 23%;}
.col-25-wrap .col4 { margin-right: 0;}

/* Startseiten Header */
.header-img { background: url("../../images/template/header.png") no-repeat center top; background-size: 2085px; }
.header-img a:hover { color: #fff;}
.header-img a:before { display: none;}
.home .header-img .inner { position: relative; height: 910px; border-bottom: solid 2px #c90927; background: none; padding-top: 0;}
.header-img .ball { background: #c90927; -webkit-animation: scaling 6s infinite; animation: scaling 6s infinite;}
.header-img .ball.big { width: 170px; height: 170px; -webkit-border-radius: 85px; -moz-border-radius: 85px; border-radius: 85px;}
.header-img .ball.big.first { position: absolute; left: 15px; top: 150px; opacity: 1;}
.header-img .ball.big.second { position: absolute; left: 160px; top: 560px; opacity: 1; animation-delay: 3.6s}
.header-img .ball.big.third { position: absolute; left: 460px; top: 270px; opacity: 1; animation-delay: 2.4s}
.header-img .ball.big.fourth { position: absolute; left: 780px; top: 40px; opacity: 1; animation-delay: 4.8s}
.header-img .ball.big.fifth { position: absolute; left: 780px; top: 660px; opacity: 1; animation-delay: 1.2s}
.header-img .ball.middle { width: 85px; height: 85px; -webkit-border-radius: 43px; -moz-border-radius: 43px; border-radius: 43px; }
.header-img .ball.middle.first { position: absolute; left: -43px; top: 460px; opacity: 1; animation-delay: 3s}
.header-img .ball.middle.second { position: absolute; left: 780px; top: 340px; opacity: 1; animation-delay: 3s}
.header-img .ball.small { width: 43px; height: 43px; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px;}
.header-img .ball.small.first { position: absolute; left: 990px; top: -9px; opacity: 1; animation-delay: 0.6s}
.header-img .ball.small.second { position: absolute; left: 1006px; top: 300px; opacity: 1; animation-delay: 0.6s}
.header-img .ball.small.third { position: absolute; left: 1250px; top: 515px; opacity: 1; animation-delay: 0.6s}
.header-img p { font: 900 20px/17px 'Merriweather', serif; color: #c90927; width: 320px; text-transform: uppercase; letter-spacing: 2px;}
.header-img p span { display: inline-block; background: #000; padding: 5px 9px;}
.header-img .first { position: absolute; left: 75px; top: 200px; width: 370px}
.header-img .second { position: absolute; left: 560px; top: 325px;}
.header-img .third { position: absolute; left: 570px; top: 80px; text-align: right;}
.header-img .fourth { position: absolute; left: 210px; top: 610px; text-align: right; width: 385px;}
.header-img .fifth { position: absolute; left: 515px; top: 710px; text-align: right;}

@-webkit-keyframes scaling {
	0%, 100% {-webkit-transform: scale(1);}
	50% {-webkit-transform: scale(0.75);}
}
@-moz-keyframes scaling {
	0%, 100% {-moz-transform: scale(1);}
	50% {-moz-transform: scale(0.75);}
}
@keyframes scaling {
	0%, 100% {-webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transform: scale(1); }
	50% {-webkit-transform: scale(0.75);-moz-transform: scale(0.75);-ms-transform: scale(0.75);-o-transform: scale(0.75);transform: scale(0.75); }
}

/* Case Slider */
.flexslider { margin: 0 0 60px; border: none; border-radius: none;}
.flexslider li { background: #000; z-index: 5; border-top: none; margin-bottom: 0; padding-bottom: 55px;}
.flexslider li:before { content: ''; display: block; width: 100%; background: #fff url("../../images/template/slider-arrow.png") no-repeat right top; height: 85px;}
.flexslider .frame-type-textpic { padding: 0 50px; overflow: visible}
.flexslider .ce-gallery { margin: -70px 0 0; }
.flexslider .ce-textpic { overflow: visible;}
.flexslider h4 { font: 300 30px/40px 'Merriweather', serif; color: #fff; font-style: italic; margin: 27px 0 30px;}
.flexslider li a { color: #c90927; font-weight: 900; text-decoration: none;}
.flexslider li a:before { content: '»'; display: inline-block; padding-right: 5px; font: 900 20px/30px 'Open Sans', serif; }
.flexslider li a:hover { color: #fff;}
.flexslider .frame-type-text { padding: 25px 30px; color: #fff;}
.flexslider .frame-type-text p:last-child { margin-bottom: 0;}
.flexslider .frame-type-text em { color: #c90927; font-weight: 900; font-style: normal;}
.flexslider .zitat { color: #fff; font: 300 30px/40px 'Merriweather', serif; font-style: italic;}
.flexslider .zitat:before { content: '»'; display: inline-block; padding-right: 5px; color: #c90927; font: 900 30px/40px 'Merriweather', serif; font-style: italic;}
.flexslider .zitat:after { content: '«'; display: inline-block; padding-left: 5px; color: #c90927; font: 900 30px/40px 'Merriweather', serif; font-style: italic;}

.flexslider .flex-control-nav { z-index: 10; bottom: 30px; right: 15px; text-align: right;} 
.flexslider .flex-control-nav li { height: auto; background: none; border: none; margin: 0 15px; padding-bottom: 0;}
.flexslider .flex-control-nav li:before { display: none}
.flexslider .flex-control-nav li a { border: solid 2px #c90927; font-size: 1px; color: transparent; width: 20px; height: 20px; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 15px; box-shadow: none;}
.flexslider .flex-control-nav li a.flex-active { background: #c90927;}
.flexslider .flex-control-nav li a:before { display: none;}
.flexslider .flex-direction-nav { display: none;}

/* Seitenabschluss Element */
.cta-wrapper { background: #c90927; position: relative; padding: 22px 0; margin-top: 80px;}
.cta-wrapper:hover { background: #000;} 
.home .cta-wrapper .inner { padding-top: 0; background: none;}
.cta-wrapper p { color: #fff; font: 900 35px/55px 'Merriweather', serif; letter-spacing: 2px;}
.cta-wrapper p:before { content: '»'; display: inline-block;}
.cta-wrapper em { font-style: normal; color: #000;}
.cta-wrapper:hover em { color: #c90927;}
.cta-wrapper a { position: absolute; left: 0; top: 0; width: 100%; height: 100%;}

/* 3-spaltiger Container 25/15/60 */
.col-25-15-60-wrap { overflow: hidden; margin-bottom: 60px;}
.col-25-15-60-wrap .col { float: left; margin-right: 30px;}
.col-25-15-60-wrap .col1 { width: 23.1%;}
.col-25-15-60-wrap .col2 { width: 14.5%;}
.col-25-15-60-wrap .col2 img { width: 100%; height: auto;}
.col-25-15-60-wrap .col2 .csc-textpic-center.csc-textpic-above .csc-textpic-imagewrap { margin-bottom: 0;}
.col-25-15-60-wrap .col3 { width: 57.2%; margin-right: 0;}

/* Leistung Bubble */
.bubble { color: #fff; margin-bottom: 30px; position: relative; }
.bubble:last-child { margin-bottom: 0;}
.bubble a { display: block; color: #fff;}
.bubble a:before { display: none}
.bubble .work { background: #c90927;-webkit-border-radius: 135px; -moz-border-radius: 135px; border-radius: 135px; width: 270px; height: 270px; display: table; cursor: pointer;}
.bubble .bubble-inner { display: table-cell; vertical-align: middle; text-align: center; font-weight: 600; padding: 0 40px;}
.bubble .description { display: none; position: absolute; left: 150px; top: 70px; background: url("../../images/template/bubble-left.png") no-repeat left top; width: 366px; height: 373px; z-index: 20; padding: 30px 30px 30px 100px;}
.bubble .description .bubble-inner { font-weight: 400;}
.bubble .description .bubble-inner a:before { color: #fff; content: '»'; display: inline-block; padding-right: 5px; font: 900 20px/30px 'Open Sans', serif;}
.bubble .description .bubble-inner a:hover { text-decoration: underline;}
.bubble:hover .description { display: table;}
.col3 .bubble .description,
.col4 .bubble .description { left: -380px; background: url("../../images/template/bubble-right.png") no-repeat left top; padding: 30px 100px 30px 30px;}
.bubble:last-child .description { background: url("../../images/template/bubble-left-down.png") no-repeat left top; top: -230px;}
.col3 .bubble:last-child .description,
.col4 .bubble:last-child .description { background: url("../../images/template/bubble-right-down.png") no-repeat left top; top: -230px;}

/* Accordion */
.ui-accordion .ui-accordion-header { background: none; border: none; border-bottom: solid 2px #000; border-radius: 0; padding: 0; margin: 0 0 7px;}
.ui-accordion .ui-accordion-header:focus { outline: none;}
.ui-accordion .ui-accordion-header p { color: #fff; background: #000; display: inline-block; font: 900 20px/24px 'Merriweather', serif; text-transform: uppercase; padding: 3px 11px;}
.ui-accordion .ui-accordion-header p em { color: #c90927; font-weight: 900; font-style: normal;}
.ui-accordion .ui-accordion-header:after { content:"+"; font: 900 20px/24px 'Merriweather', serif; color: #c90927; display: inline-block; padding-left: 25px; float: right; background: #000; padding: 3px 11px;}
.ui-accordion .ui-accordion-header:hover:after { color: #fff;}
.ui-accordion .ui-accordion-header.ui-state-active:after { content:"-"; }
.ui-accordion-header-icon { display: none;}
.ui-accordion .ui-accordion-content { border: none; padding: 50px 0 30px; font: 20px/30px 'Open Sans', sans-serif;}

/* Kunden Logos */
.kunden-container { margin: 0 -30px 50px 0; overflow: hidden;}
.kunden-wrap { border: solid 1px #000; width: 22.3%; margin: 0 30px 30px 0; float: left;}
.kunden-wrap .color { display: none;}
.kunden-wrap:hover .color { display: block;}
.kunden-wrap:hover .bw { display: none;}
.kunden-wrap img { width: 100%; height: auto;}

/* Cookie Banner */
.cc_container { font: 15px/33px 'Open Sans', sans-serif !important;}
.cc_container .cc_message { line-height: 1.2em !important;}
.cc_container a, .cc_container a:visited { color: #c90927 !important;}
.cc_container a:hover, .cc_container a:active { color: #555 !important;}
.cc_container .cc_btn, .cc_container .cc_btn:visited { background-color: #c90927 !important; color: #fff !important;}
.cc_container .cc_btn:hover, .cc_container .cc_btn:active { background-color: #555 !important; color: #fff !important;}
.cc_container a:before { display: none;}

/* - - - - - Footer - - - - - */

.footer-wrap { background: #000; color: #fff; font-weight: 700; margin-top: 4px; padding: 55px 0;}
.footer-wrap .col-33-wrap { margin-bottom: 0;}
.footer-wrap p { margin-bottom: 0; border-bottom: solid 2px #fff;}
.footer-wrap a { color: #fff; }
.footer-wrap a:hover { color: #c90927;}
.footer-wrap a[href^="tel:"] { color: #fff;}
.footer-wrap a[href^="tel:"]:hover { color: #c90927;}
.footer-wrap a[href^="tel:"]:before { display: none;}

.footer-wrap ul { margin: 0; padding: 0;}
.footer-wrap ul li { list-style: none; border-bottom: solid 2px #c90927; margin-bottom: 0; border-top: none;}
.footer-wrap a:hover { color: #fff;}
.footer-wrap .col2 a { color: #c90927;}
.footer-wrap .col2 a:hover { color: #fff;}
.footer-wrap .col3 ul li { border-color: #fff;}
.footer-wrap .col3 ul li a { color: #fff;}
.footer-wrap .col3 ul li a:hover { color: #c90927;}

/* Firefox Fix */
@-moz-document url-prefix() { 
  .headline { padding: 1.3px 0 2.3px;}
}

/* Rot aus png #c90927 */
/* Rot ec0044 */