html, body{
    width:100%;
	margin:0;
	padding:0;
    color:#7c7c7c;
	line-height:150%;
    font-family: Arial, Gotham, "Helvetica Neue", Helvetica,  sans-serif ;
    height:100%; /* braucht es für die min-height des Containers */ 
	display: table; /* Die Seite zu einer Tabelle machen für den Sticky Footer*/
	font-size:16px;
    }
#main{
	width:100%;
	height:auto;
	display: table-row; /*Haupt Inhalt in eine Tabellen Zeile machen und Footer*/
	}
	
	
.wrapper02{
    background-color:#333333;
}
.wrapper03{
    background-color:#f4f4f4;
}
.wrapper04{
    background-color:#a2c500;
    height:30px;
}
.wrapper05{
    background-color:#a2c500;
}

.wrapper06{
    margin-bottom:20px;
    background-image: url(../images/ueber-uns.jpg);
    background-repeat: no-repeat;
    background-position: center;
}
p{
    margin: 15px 0;
}
img{
    width:100%;
}

h1, h2{
    font-size:30px;
    line-height:120%;
    letter-spacing: -0.050em;
    margin-top:0;
    margin-bottom:5px;
    color:#7c7c7c;
	font-weight:normal;
}

h1{
    margin:40px 0 20px 0;
    }
h3, h4{
    font-size:20px;
    font-weight: bold;
    margin-top:10px;
    color:#7c7c7c;
}
h2.tel, h2.tel-footer{
    font-size: 22px;
    color:#f63884;
    font-weight: normal;
    margin: 0 0 0 -10px;
}
h2.tel{
	line-height:90%;
    margin: 0 0 0 0px;
	text-align:right;
	letter-spacing: 0em;
}
h3.tel.servicezeiten{
	font-size:12px;
	margin:0;
	color:#828383;
	}
#detailseite h2.tel{
    text-align:right;
}

h2.tel-footer{
    margin:0;
}
h3.tel, #footer-wrapper h3.tel-footer{
    font-size: 13px;
    font-weight:normal;
    clear: both;
    margin-bottom:0;
    color:white;
	text-align:right;
}
h3.tel{
    font-size: 13px;
    color:#d4d7d7;
    font-weight:normal;
}
#detailseite h2{
	text-align:center;
	}
.rs-beispiel-mobile-now h2{margin-top:40px;}
.telefon h2{
	font-size:16px;
	}
#detailseite > div.wrapper01.bggrey > div.con.pb.scpt40 > div > div > p{line-height:150%;}
.telefon{
	padding-bottom:30px;
	font-size:20px;
	}
.bggrey{
	background-color:#eeeeee;
	padding:10px 0 40px 0;
	}	
p:first-child{
    margin-top:0;
    padding-top:0;
}

a:link, a:hover, a:active, a:visited{
    color:#f63884;
    text-decoration: none;
}
a:hover{
    text-decoration:underline;
}

.tel a:link, .tel a:active, .tel a:visited, .tel a:hover, #footer-wrapper .tel-footer a:link, #footer-wrapper .tel-footer a:active, #footer-wrapper .tel-footer a:visited, #footer-wrapper .tel-footer a:hover{
    color:#f63884;
    text-decoration: none;
} 
p:last-child{
    margin-bottom:0;
    padding-bottom:0;
}
#footer-wrapper h3{
    color:#a2c500;
    margin-bottom:20px;
}
.inactive{
    display:none;
}
.active{
    display:none;
}
.iconset img, #detailseite.handwerker > div.con.iconset.mm.pb60 > div:nth-child(2) > div:nth-child(2) > img{
    width:64px;
}
#detailseite > div.con.iconset.mm.pb60 > div:nth-child(2) > div:nth-child(2) > img{
	width:75px;
	}
.iconset02 .c02:first-child{
    padding-left:150px;
 }
.iconset02 .c02:last-child{
    padding-right:150px;
 }
.iconset03 img{
    width:15%;
}
.iconset03 h3{
    color:#a2c500;
    padding:20px;
}
.parallax-bg{
    padding:40px 0 0px 0;
    min-height:230px;
    background: url(../images/bg02.jpg) no-repeat bottom #2c2c2c;
    background-attachment: fixed; 
}
.musiker .parallax-bg{
    padding:40px 0 0px 0;
    min-height:230px;
    background: url(../images/bg03.jpg) no-repeat bottom #2c2c2c;
    background-attachment: fixed; 
}
.hotel .parallax-bg{
    padding:40px 0 0px 0;
    min-height:230px;
    background: url(../images/bg04.jpg) no-repeat bottom #2c2c2c;
    background-attachment: fixed; 
}
.fotograf .parallax-bg{
    padding:40px 0 0px 0;
    min-height:230px;
    background: url(../images/bg05.jpg) no-repeat bottom #2c2c2c;
    background-attachment: fixed; 
}
.restaurant .parallax-bg{
    padding:40px 0 0px 0;
    min-height:230px;
    background: url(../images/bg06.jpg) no-repeat bottom #2c2c2c;
    background-attachment: fixed; 
}
.handwerker .parallax-bg{
    padding:40px 0 0px 0;
    min-height:230px;
    background: url(../images/bg07.jpg) no-repeat bottom #2c2c2c;
    background-attachment: fixed; 
}
.blue{
    font-weight:bold;
    color:#37b0e5;
}
.green{
    color:#a2c500;
}
.big-green{
    font-weight:bold;
    color:#a2c500;
    font-size:20px;
}
.magenta{
    color:#f63884;
}
.grey{color:#858686;}
.small{
    font-size:12px;
    display:block;
}
.referenz{
    border-top:1px solid #a2c500;
}
.referenz .siegel .c02 img{
        width:120px;
    }
.hide{
    display:none;
}
.kundenstimme img{
    width:50px;
    height:50px;
    padding:10px;
    text-align: center;
}
.impressum, .jobs{
    padding:0px 0 60px 20px;
}
.impressum img{
    width:150px;
}
.impressum a:link, .impressum a:active, .impressum a:hover, .impressum a:visited{
    color:#7c7c7c;
}
.jobs li{ 
    list-style-type: disc;
    margin-left:20px;
}
.job h3{
    background-color:#a2c500;
    padding:10px 10px 10px 20px;
    color:white;
    cursor: pointer;
}
.job h5{
    font-weight:bold;
    margin-top:15px;
    
}
.jobs{
    min-height:500px;
}
.job h2{
    padding-bottom:10px;
}
.job_content{
    display: none;
    padding:30px;
}
.light{
    color:#ccc
}
.bewerbungslink{
    padding:10px 0 0 0 ;
    font-size:15px;
}
.job.job-active h3{
    background-color:#858686;
}
.job{
    padding:0px 0 0px 0px;
}
.job p{
    margin-top:0;
}
.job h2{
    margin:0 0 0px;
}
.job button{
    margin-top:20px;
}

.ueber-uns{
    width:1000px;
    height:448px;
    margin: 0 auto;
}

.ueber-uns02{
    width:400px;
    padding:55px 75px 55px 25px;
    float:left;
    position: relative;
    margin: 0 auto;
}
.ueber-uns03{
    width:833px;
    float: left;
    position: relative;
    display: none;
}
.flow-now-stoerer{
    width:160px;
    position: absolute;
    top:-5%;
    right:-20%;
}


/*
.job{
    padding:30px 0 60px 20px;
}
.job p{
    margin-top:0;
}
.job h2{
    margin:0 0 40px;
}
*/
	.washabensiedavon{
		padding:30px;
		}
	
	.washabensiedavon.telefon h2{
		font-size:30px;
		line-height:120%;
		letter-spacing: -0.050em;
		margin-top:0;
		margin-bottom:5px;
		color:#7c7c7c;
		}
	.erfolgreiche-firmenwebsite{
		padding:50px 20px;
		}
	.erfolgreiche-firmenwebsite img{
		width:100px;
		padding-bottom:20px;
		}
		
@media screen and (max-width:1080px){
    .ueber-uns{
        width:100%;
    }
    .ueber-uns02{
        width:40%;
        padding:55px 8% 55px 25px;
    }
    .flow-now-stoerer{
        width:120px;
        top:-2%;
        right:-15%;
    }
    .jobs{
        padding: 0 20px;
    }
    .kundennav .cycle-next{
        float:left;
        margin-left:30px;
    }
    .produkte h1, .weitere-dienste-headline h2, .weitere-dienste, .rs-beispiel h1, .design-beispiele h2, .vorher-nachher h2{
        padding-left:20px;
    }
     .vorher-nachher h2{
         padding-left:0px;
        text-align: left;
     }
    .weitere-dienste{
        padding-bottom:60px;
    }
}
@media screen and (max-width:800px){
    .parallax-bg{
        background-image: none;
        min-height: inherit;
    }
}
@media screen and (max-width:680px){
    .ueber-uns02{
        width:90%;
        padding:5%;
        float:left;
        position: relative;
        margin: 0 auto;
    }
    .ueber-uns03{
        width:100%;
        float: left;
        position: relative;
        display: block;
    }
    .flow-now-stoerer{
        width:120px;
        height:auto;
        top:-65px;
        right:20px;
        background-color: white;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
    }
    .wrapper06{
        background-image: none;
    }
    
    .parallax-bg{
        background-image: none;
        min-height: inherit;
    }
    .iconset02 .c02:first-child{
        padding-left:30px;
     }
    .iconset02 .c02:last-child{
        padding-right:30px;
     }
    .kundennav{
        clear:both;
    }
    .referenz .c02 img{
        width:80%;
    }
    .iconset img{
        width:80px;
        padding:0px;
    }
     .iconset03 img{
        width:35px;
        padding:10px;
    }
    .washabensiedavon h3{
        margin:0 0 10px 0;
        padding:0;
        font-size:14px;
    }
    .kundennav .cycle-next{
        float:left;
        margin-left:30px;
    }
    .referenz img{
        width:80%;
    }
	.erfolgreiche-firmenwebsite.c01{
		padding:50px 20px;
		}
}


@media screen and (max-width:420px){

    .flow-now-stoerer{
        width:90px;
        top:-45px;
        right:15px;
        background-color: white;
        border-radius: 50%;
        -webkit-border-radius: 50%;
        -moz-border-radius: 50%;
    }
}

/*\\\\\\\\\\\\\\ RS BEISPIEL ////////////*/

.rs-beispiel{
    height: auto;
    position: relative;
}

.rs-beispiel-left{
     width: 75.2%;
    float: left;
    position: relative;
}
.rs-beispiel-right{
    width:24.8%;
    height:auto;
    float: right;
}
.rs-beispiel-iphone{
    width: 100%;
    height:auto;
    position: absolute;
    left:0;
    top:0;
    z-index: 1000;
}
.rs-beispiel-bg{
    width: 100%;
    height:auto;
    position: relative;
}
.rs-beispiel-right h3{
    margin-top:80%;
    line-height: 130%;
}
.rs-beispiel-right p{
    line-height: 140%;
    margin-top:10px;
    display: block;
}
.rs-beispiel-button{
    position: absolute;
    bottom:-17%;
}
.anbieter-logos{
    position: absolute;
    width:140%;
    left:-70%;
    top:25%;
}
.rs-cycle-prev, .rs-cycle-next{
	width:30px;
    height:30px;
    margin-right:20px;
    float:left;
	cursor:pointer;
    background:url(../images/slider-button-left.png) no-repeat center;
    background-size: contain;
	}
.rs-cycle-next{
	float:left;
     background:url(../images/slider-button-right.png) no-repeat center ;
	}
.rs-beispiel-navigation{
    width:100px;
    position: absolute;
    right:-100px;
    bottom:15%;
    z-index: 10000;
}

/* DESIGN BEISPIELE */
.design-beispiele {
    padding:40px 20px 20px 00px;
}
.design-beispiele h3{
    color:#a3c600;
}
.design-beispiel{
    text-align: center;
    margin-top:20px;
}
.design-beispiel img{
    width:78%;    
}

/* Vorher Nachher Beispiel */
.vorher-nachher{
    padding:60px 0 30px 0px;
}

.vorher-nachher-beispiel01, .vorher-nachher-beispiel02{
    width:480px;
    margin: 0 10px 40px 0;
    padding-bottom:40px;
    position: relative;
}
.vorher-nachher-scroll01, .vorher-nachher-scroll02{
    width:44%;
    height:375px;
    position: absolute;
    overflow: hidden;
    top:51px;
    right:43px;
}
.vorher-nachher-scroll01 img, .vorher-nachher-scroll02 img{
    position: absolute;
    top: 0 ;
    transition: all 1s  ease;
}
.vorher-nachher-scroll01 img.scrolldown, .vorher-nachher-scroll02 img.scrolldown{
    position: absolute;
    top:-360px; /*scrolldown beispiel01*/
}
.vorher-nachher-scroll02 img.scrolldown01{
    position: absolute;
    top:-220px; /*scrolldown beispiel02*/
}
.v-n-navi01, .v-n-navi02{
    width:200px;
    float:right;
    margin-right:80px;
}
.v-n-navi-button01, .v-n-navi-button02{
    width:35px;
    height:35px;
    float: right;
    margin-right:10px;
    background: url(../images/arrow-up.gif);
    background-size: cover;
    cursor: pointer;
}
.v-n-navi-button02{
    background: url(../images/arrow-down.gif);
    background-size: cover;
}


@media screen and (max-width:1080px){
    /*\\\\\\\\\\\\\\ RS BEISPIEL ////////////*/
    .rs-beispiel-left{
         width: 60%;
    }
    .rs-beispiel-right{
        width:39%;
        padding-right:1%;
    }
    .rs-beispiel-iphone{
        width: 100%;
    }
    .rs-beispiel-right h3{
        margin-top:40%;
    }
    .anbieter-logos{
        width:80%;
        left:0%;
        top:25%;
    }
    .rs-beispiel-navigation{
        right:-100px;
        bottom:15px;
    }
    .rs-beispiel-button{
    bottom:-23%;
    }
    
    
    
    
    /* Vorher Nachher Beispiel */
    .vorher-nachher{
        padding:60px 0 30px 25px;
    }
    .vorher-nachher-beispiel01, .vorher-nachher-beispiel02{
        width:370px;
        margin: 0 20px 50px 0px;
    }
    .vorher-nachher-scroll01, .vorher-nachher-scroll02{
        height:289px;
        top:39px;
        right:32px;
    }
    .vorher-nachher-scroll01 img.scrolldown, .vorher-nachher-scroll02 img.scrolldown{
        position: absolute;
        top:-280px; /*scrolldown beispiel01*/
    }
    .vorher-nachher-scroll02 img.scrolldown01{
        position: absolute;
        top:-170px; /*scrolldown beispiel02*/
    }
}
@media screen and (max-width:800px){
    /*\\\\\\\\\\\\\\ RS BEISPIEL ////////////*/
     .rs-beispiel-left{
         width: 100%;
         float: left;
    }
    .rs-beispiel-right{
        width:99%;
        height:auto;
    }
    .rs-beispiel-iphone{
        width: 100%;  
    }
    .rs-beispiel-right h3{
        margin-top:0%;
    }
    .anbieter-logos{
        width:50%;
        margin:0;
        right:30px;
        top:-70px;
        left: auto;
    }
    .rs-beispiel-navigation{
        bottom:-30px;
        left:5%;
        z-index:10000;
        width:150px;
    }
    .rs-beispiel-text{
        width:90%;
        padding: 5%;
        margin-top:40px;
        margin-bottom:50px;
    }
    .rs-beispiel-button{
    position: static;
        margin-bottom:20px;
    }
    
    /* DESIGN BEISPIELE */
    .design-beispiel img{
        width:85%;    
    }
    
    
    /* Vorher Nachher Beispiel */
    .vorher-nachher-beispiel01, .vorher-nachher-beispiel02{
        width:475px;
        margin: 0 50px 50px 0px;
    }
    .vorher-nachher-scroll01, .vorher-nachher-scroll02{
        height:370px;
        top:50px;
        right:42px;
    }
    .vorher-nachher-scroll01 img.scrolldown, .vorher-nachher-scroll02 img.scrolldown{
        top:-360px; /*scrolldown beispiel01*/
    }
    .vorher-nachher-scroll02 img.scrolldown01{
        top:-220px; /*scrolldown beispiel02*/
    }
}

@media screen and (max-width:680px){   
/* Vorher Nachher Beispiel */
    .vorher-nachher-beispiel01, .vorher-nachher-beispiel02{
        width:400px;
        margin: 0 20px 50px 25px;
    }
    .vorher-nachher-scroll01, .vorher-nachher-scroll02{
        height:310px;
        top:42px;
        right:35px;
    }
    .vorher-nachher-scroll01 img.scrolldown, .vorher-nachher-scroll02 img.scrolldown{
        position: absolute;
        top:-305px; /*scrolldown beispiel01*/
    }
    .vorher-nachher-scroll02 img.scrolldown01{
        position: absolute;
        top:-188px; /*scrolldown beispiel02*/
    }
    /* DESIGN BEISPIELE */
    .design-beispiel img{
        width:100%;    
    }
}

@media screen and (max-width:580px){   
/* Vorher Nachher Beispiel */
    .vorher-nachher-beispiel01, .vorher-nachher-beispiel02{
        width:350px;
        margin: 0 20px 50px 25px;
    }
    .vorher-nachher-scroll01, .vorher-nachher-scroll02{
        height:272px;
        top:38px;
        right:30px;
    }
    .vorher-nachher-scroll01 img.scrolldown, .vorher-nachher-scroll02 img.scrolldown{
        position: absolute;
        top:-270px; /*scrolldown beispiel01*/
    }
    .vorher-nachher-scroll02 img.scrolldown01{
        position: absolute;
        top:-165px; /*scrolldown beispiel02*/
    }
}
@media screen and (max-width:450px){   
/* Vorher Nachher Beispiel */
    .vorher-nachher-beispiel01, .vorher-nachher-beispiel02{
        width:300px;
        margin: 0 20px 50px 25px;
    }
    .vorher-nachher-scroll01, .vorher-nachher-scroll02{
        height:232px;
        top:32px;
        right:26px;
    }
    .vorher-nachher-scroll01 img.scrolldown, .vorher-nachher-scroll02 img.scrolldown{
        position: absolute;
        top:-230px; /*scrolldown beispiel01*/
    }
    .vorher-nachher-scroll02 img.scrolldown01{
        position: absolute;
        top:-142px; /*scrolldown beispiel02*/
    }
}
@media screen and (max-width:350px){   
/* Vorher Nachher Beispiel */
    .vorher-nachher-beispiel01, .vorher-nachher-beispiel02{
        width:260px;
        margin: 0 20px 50px 15px;
    }
    .vorher-nachher-scroll01, .vorher-nachher-scroll02{
        height:210px;
        top:28px;
        right:23px;
    }
    .vorher-nachher-scroll01 img.scrolldown, .vorher-nachher-scroll02 img.scrolldown{
        position: absolute;
        top:-190px; /*scrolldown beispiel01*/
    }
    .vorher-nachher-scroll02 img.scrolldown01{
        position: absolute;
        top:-120px; /*scrolldown beispiel02*/
    }
}

/*\\\\\\\\\\\\\\ PODUKTTABELLE ////////////*/
.produkte{
    margin-bottom: 100px;
	position:relative;
}

.produktheader{
    position: relative;
    background:url(../images/produkt-bg.png);
    padding:70px 20px 20px 20px;
    text-align: center;
}
.produktheader img{
    display:block;
}
.produkt-headline{
    width: 90%;
    text-align: center;
    position: absolute;
    top:13px;  
}
.produkt-headline h2{
    border:1px solid #9f9f9f;
    font-size:28px;  
    padding:4px 28px 4px 28px;
    margin:0 0 0 0;    
    display: inline-block;
    line-height: auto;
    font-weight:bold;
}
.produktinfo{
    background-color:#fff;
	 border-left: 2px solid #eee;
}
.produktspalte:nth-child(4) .produktinfo{
	 border-right: 2px solid #eee;
}
.produkt-button-top{
	float: right;
	margin-top: 40px;
	margin-bottom: 20px;
	margin-right: 3px;
	}
.produktmainspalte01, .produktmainspalte02, .produktmainspalte03, .produktmainspalte04{
    margin-bottom:0px;
}
.produkt-call-us{
	position:absolute;
	left:0;
	bottom:65px;
	}
.produkt-tel-button{
	margin:5px 0 20px 0 ;
	}
#detailseite .produktmainspalte04{
    margin-bottom:40px;
}
.lernmore01, .lernmore02, .lernmore03, .lernmore04 {
    float: right;
    display:none;
}
.lernmore04 {
    display:none;
}
.c01.produktzeile{
    border-top:2px solid #eee;
    border-left: 2px solid #eee;
    background-color:#fff;
    padding:15px;
    text-align: center;
}
.produktspalte:nth-child(4) .c01.produktzeile{
    border-right: 2px solid #eee;
}

.c01.produktzeile01{
    border-top:2px solid #eee;
    color:#fff;
    font-weight:bold;
    background-color:#f63884;
    padding:20px;
    text-align: center;
}
.c01.produktzeile_preis{
    border-top:2px solid #eee;
    text-align: center;
    font-size:20px;
    background-color:#fff;
    padding:20px;
}
.c01.produktzeile_button{
    border-top:2px solid #eee;
    text-align: left;
    background-color:transparent;
    padding:0px;
    position: relative;
}

.produktspalte > .produktmainspalte01.hide-ptabelle, .produktspalte > .produktmainspalte02.hide-ptabelle, .produktspalte > .produktmainspalte03.hide-ptabelle, .brandnow .produktmainspalte04.hide-ptabelle{
    display: block;
}
.button a:link, .button a:hover, .button a:active, .button a:visited{
    color:white;
    text-decoration: none;
}
.p-price{
    position:relative;
    width: 100%;
    top:0;
    right:0px;    
}
.weitere-dienste{
    margin:0px auto 60px auto;
}
.weitere-dienste-headline h2{
	margin-top:20px;
    margin-bottom:20px;
	text-align:center;
}
.weitere-dienste .c04{
    padding:10px 40px 20px 0;
    text-align: right;
}
.weitere-dienste .c75{
    padding:0 100px 20px 0;
}
.weitere-dienste img{
        width:60px;
    }
.brandnow{
}
#detailseite .brandnow {
margin-top: 20px;
margin-bottom: 10px;
}
.brandnow-logo, .mobile-now-img{
    background-color:#eeeeee;
    text-align: center;
    padding:20px;
    overflow:hidden;
}
.brandnow-logo img{
    width: 177px;
}
.mobile-now-img img{
	width:240px;
	}
.brandnow .c02, .brandnow .c03{
}
.brandnow .c02.produktzeile{
    border-top:2px solid #eee;
    border-left: 2px solid #eee;
}
.brandnow .c02:nth-child(2) .produktzeile{
    border-top:2px solid #eee;
    border-right: 2px solid #eee;
}
 .brandnow .c03:first-child{
    border-left:none;   
}
.brand-beratung{
    float:left;
    display:none;
}
.brandnow .produktzeile:last-child{
    border-bottom:2px solid #eee;
}
.weitere-dienste-button{
    padding:20px 0 0 150px;
}
@media screen and (max-width:1080px){
    .weiteredienste h2{
        margin-left:30px;
    }
}
@media screen and (max-width:680px){
	.brandnow .produktzeile:last-child{border-bottom:none;}
    .produktinfo{
    min-height:190px;
	}
    .produktheader img{
        width:75%;
        margin: 0 auto;
    }
    .lernmore01, .lernmore02, .lernmore03, .lernmore04, .brand-beratung{
        display:block;
    }
	.produkt-button-top{
	float: left;
	margin-top: 0px;
	margin-bottom: 20px;
	margin-left:20px;
	}
    .brandnow .produktzeile:first-child{
        border-top:2px solid #eee;
    }
    .p-price{
        width: 100%;
        right:0px;    
    }
     .js .produktmainspalte01, .js .produktmainspalte02, .js .produktmainspalte03, .js .produktmainspalte04{

    }
	.js #detailseite .produktmainspalte04{
		display:block;
		}
    .produktspalte{
        border-right:none;
        border-bottom:20px solid #fff;
    }
    .weitere-dienste .c10, .weitere-dienste .c75{
        padding:10px 20px 20px 0;
        text-align: center;
    }
    .weitere-dienste .c10{
        padding:20px 20px 0px 0;
    }
    .weitere-dienste{
        padding:40px;
    }
    .weitere-dienste-button{
    padding:20px 0 0 50px;
    }
	.produkt-call-us{
	position:static;
	margin-left:20px;
	}
	.produkt-tel-button{
	margin:5px 0 20px 0 ;
	}
}
@media screen and (max-width:420px){
    .p-price{
        width:100%;
        right:0px;    
    }
}
@media screen and (max-width:450px){
	.produktinfo{
    min-height: 250px;
	}
}
@media screen and (max-width:350px){
	.produktinfo{
    min-height: 260px;
	}
}
/*\\\\\\\\\\\\\\ BUTTON ////////////*/
.button {
    padding:10px 25px 10px 25px;
    border:none;
    background-color: #a5c800;
    outline:none;
    color:#fff;
    font-weight: bold;
    text-decoration:none;
    -webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
}
.button:hover{
    background-color:#333;
    border:none;
}
.button:active{
    background:#232323;
}

/*\\\\\\\\\\\\\\\\\\\\\ HEADER /////////////////////*/	

.head-wrapper{
	width:100%;
	height:auto;
	background:#333333;
	}

#header{
    width:1000px;
	padding:0% 0% 0% 0%;
	margin:0 auto;
	color:#999;
	}
#header:after{
    content: ".";
    display: block;
    clear: both;
    font-size: 0;
    height: 0;
    visibility: hidden;
}
.header-left{
	width:17%;
	height:auto;
	padding:1.5% 0% 0.5% 1%;
	float:left;
	}
.header-center{
	width:55%;
	height:auto;
	padding:0% 2.5% 0% 0.5%;
	float:left;
	}
.header-right{
	width:35%;
	height:auto;
	padding:0 2.5% 0% 0%;
	float:right;
	}


@media screen and (max-width:1080px){
    /*\\\\\\\\\\\\\\\\\\\\\ HEADER /////////////////////*/
	#header{width:100%;}
    .header-left{
	width:17%;
	height:auto;
	padding:2.5% 0% 1.5% 2%;
	float:left;
	}
    .header-center{
        width:55%;
        padding:1% 0% 0% 1%;
        }
    .header-right{
        float: right;
        }
    h2.tel{
        font-size: 22px;
    }
    h3.tel{
        font-size: 13px;
    }
	}
@media screen and (max-width:830px){
    /*\\\\\\\\\\\\\\\\\\\\\ HEADER /////////////////////*/
    .header-left{
        width:15%;
        height:auto;
        padding:3% 0% 2.5% 2%;
        float:left;
	}
    .header-center{
        padding:1.5% 0% 0% 1%;
        }
    h2.tel{
        font-size: 18px;
        margin:0;
    }
    h3.tel{
        margin:5px 0 0 0;
        font-size: 12px;
    }
}
@media screen and (max-width:680px){
	
	/*\\\\\\\\\\\\\\\\\\\\\ HEADER /////////////////////*/
	.header-left{
		width:150px;
        padding:5% 5% 4% 5% ;
		}
	.header-center, .header-right{
		width:90%;
		padding:2.5% 5% 2.5% 5% ;
		clear:both;
		}
    .header-center{
		width:100%;
        padding:0;
        clear: both;
	}
	.header-right{
		border-top:1px solid #777;
		}
    h2.tel{
        font-size: 28px;
        margin: 0px 0 0 0px;
    }
    h3.tel{
        font-size: 14px;
    }
}

/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER ////////////////////*/

#giant-slider{
	width:100%;
	height:auto;
	position:relative;
    background-color:#c5c5c8;
    background-image: url(../images/repeat03.jpg);
    background-repeat: repeat-x;
    background-position:top center;
	}
.musiker #giant-slider{
	background-image: url(../images/musiker-bg.jpg);
	}
.hotel #giant-slider{
	background-image: url(../images/hotel-bg01.jpg);
	}
.fotograf #giant-slider{
	background-image: url(../images/fotografen-bg.jpg);
	}
.restaurant #giant-slider{
	background-image: url(../images/restaurant-bg.jpg);
	}
.handwerker #giant-slider{
	background-image: url(../images/handwerker-bg.jpg);
	}
#giant-slider .con {	
	width: 1080px;
	padding-left: 100px;
}

.giant-slider-con img{
    padding-top:30px;
    width:59%;
    display:block;
}
.musiker .giant-slider-con img{
    padding:0px;
    width:59%;
}
.hotel .giant-slider-con img{
    padding:0px;
    width:76.8%;
	margin-left:-180px;
}
.fotograf .giant-slider-con img{
    padding:0px;
    width:81%;
	margin-left:-200px;
}
.restaurant .giant-slider-con img{
    padding:0px;
    width:73.7%;
	margin-left:-150px;
}
.handwerker .giant-slider-con img{
    padding:0px;
    width:74.3%;
	margin-left:-150px;
}






.giant-slider-con{
    width:100%;
    height:615px;
    margin: 0 auto;
    padding:0% 0% 0% 0%;
    color:#565757;
}

.giant-slider-con h2{
    border:1px solid #9f9f9f;
    font-size:45px;
    font-weight:bold;
    padding:0px 30px;
    display: inline-block;
    margin:0 0 10px -30px;
}

.giant-slider-content-box, .giant-slider-content-box_left{
    width:35%;
    top:15%;
    right:0%;
    position: absolute;
}
.giant-slider-content-box_left{
    left:30%;
}
.giant-slider-content-box p, .giant-slider-content-box_left p{
    width:70%;
    font-size:17px;
    line-height:140%;
    padding:0px 0 0 0;
}
.musiker .giant-slider-content-box p, .hotel .giant-slider-content-box p, .fotograf .giant-slider-content-box p, .restaurant .giant-slider-content-box p, .handwerker .giant-slider-content-box p{color:#ffffff;}
.slider-zusatz-box{
    font-size:18px;
    color:#555656;
    text-align: center;
    background-color:#add200;
    padding:15px 40px 20px 40px;
    margin-top:-90px;
    position: relative;
    z-index: 1000;
}
.slider-zusatz-box h1, .slider-zusatz-box p{
    margin:0 0 10px 0;
    padding:0;
    color:#555656;
}
.slider-zusatz-box a:link, .slider-zusatz-box a:active, .slider-zusatz-box a:visited, .slider-zusatz-box a:hover{color:#555656; text-decoration:none;}

.slider-zusatz-box p.slider-zusatz-box-tel{font-size:16px; padding-top:10px;}

/*========== giant-slider NAVIGATION ==========*/

.giant-slider-nav{
    width:80px;
    padding-top:20px;
}    
.cycle-prev, .cycle-next{
	width:30px;
    height:30px;
    float:left;
	cursor:pointer;
    background:url(../images/slider-button-left.png) no-repeat center;
    background-size: contain;
	}
.cycle-next{
	float:right;
     background:url(../images/slider-button-right.png) no-repeat center ;
	}

@media screen and (max-width:1080px){	
	#giant-slider .con {	
	width: 95%;
	padding-left: 5%;
	}
}
@media screen and (max-width:1080px){ 
/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER ////////////////////*/
    .giant-slider-content-box, .giant-slider-content-box_left{
    width:39%;
    top:10%;
    right:0;
    }
	#giant-slider .con {	
	width: 100%;
	padding-left: 0%;
	}
    .giant-slider-con h2{
    border:1px solid #9f9f9f;
    font-size:30px;   
    margin:0 0 10px -0px;
    }
    .giant-slider-content-box p, .giant-slider-content-box_left p{
    width:90%;
    }
    .giant-slider-con{
    height:auto;
    background: cover;
    margin-left:0%;
    }
    .slider-zusatz-box{
    margin-top:0;
    }
    .giant-slider-con img{
    padding:30px 0 30px 20px;
    width:55%;
    display:block;
    }
}

@media screen and (max-width:800px){
/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER ////////////////////*/
	.giant-slider-content-box, .giant-slider-content-box_left{
    width:95%;
    padding:2.5%;
    position: static;
    overflow: hidden;
    background-color:#eee;
    }
	.musiker .giant-slider-content-box, .musiker .giant-slider-content-box_left, .hotel .giant-slider-content-box, .hotel .giant-slider-content-box_left, .fotograf .giant-slider-content-box, .restaurant .giant-slider-content-box, .handwerker .giant-slider-content-box{
    background-color:#333;
    }
    .giant-slider-nav{
    float:right;
    padding-top:0px;
    }
    .giant-slider-content-box .button{
    float:left;
    }
    .giant-slider-con img, .musiker .giant-slider-con img{
    width:90%;
    display:block;
    padding:2.5%;
	}
	.musiker .giant-slider-con img{
    width:70%;
    padding:0 15%;
	}
	.musiker #giant-slider{
		background-size:cover;
	}
	
	.hotel .giant-slider-con img{
    padding:0px;
    width:90%;
	margin-left:0px;
	}
	.fotograf .giant-slider-con img{
    padding:0px;
    width:90%;
	margin-left:0px;
}
.restaurant .giant-slider-con img{
    padding:0 5%;
    width:90%;
	margin-left:0px;
}
.handwerker .giant-slider-con img{
    padding:0;
    width:90%;
	margin-left:0px;
}
}
@media screen and (max-width:680px){
/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER ////////////////////*/
	    .giant-slider-content-box, .giant-slider-content-box_left{
    width:90%;
    padding:5% 5% 10% 5% ;
    }
	.musiker .giant-slider-con img{
    width:90%;
    padding:0 5%;
	}
    
}

.immobilien #giant-slider{
	height:620px;
	position:relative;
	}
.immobilien .slider-zusatz-box	h1{
	margin-bottom:0;
	}
.immobilien .slider-zusatz-box	h2{
	font-size:24px;
	margin-top:0;
	color:#555555;
	}

.immo-preis img{
	position:absolute;
	top:-100px;
	right:70px;
	width:150px;
	}	
.immo-building img{
	position:absolute;
	bottom:90px;
	left:50%;
	margin-left:-570px;
	width:1138px;
	height:auto;
	z-index:2;
	}
.immo-schild img{
	position:absolute;
	bottom:0px;
	right:7%;
	width:357px;
	height:auto;
	z-index:3;
	}
.immo-website img{
	position:absolute;
	bottom:100px;
	left:7%;
	width:474px;
	height:auto;
	z-index:4;
	}
@media screen and (max-width:1600px){
/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER IMMO ////////////////////*/
.immobilien #giant-slider{
	height:580px;
	}
.immo-building img{
	margin-left:-500px;
	width:1000px;
	}
.immo-schild img{
	right:6%;
	width:327px;
	}
.immo-website img{
	left:6%;
	width:434px;
	}
    
}
@media screen and (max-width:1280px){
/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER IMMO ////////////////////*/
.immobilien #giant-slider{
	height:500px;
	}
.immo-building img{
	margin-left:-450px;
	width:900px;
	}
.immo-schild img{
	bottom:60px;
	width:247px;
	}
.immo-website img{
	width:354px;
	}
    
}
@media screen and (max-width:1080px){
/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER IMMO ////////////////////*/
.immobilien #giant-slider{
	height:400px;
	}
.immo-building img{
	margin-left:-420px;
	width:840px;
	bottom:0;
	}
.immo-schild img{
	bottom:0px;
	right:2%;
	width:240px;
	}
.immo-website img{
	left:2%;
	width:324px;
	bottom:50px;
	}   

}
@media screen and (max-width:840px){
/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER IMMO ////////////////////*/
.immobilien #giant-slider{
	height:300px;
	}
.immo-building img{
	margin-left:-300px;
	width:600px;
	}
.immo-schild img{
	right:2%;
	width:170px;
	}
.immo-website img{
	left:2%;
	width:250px;
	bottom:30px;
	}  
.immo-preis img{
	top:-80px;
	right:40px;
	width:130px;
	}	  
}

@media screen and (max-width:680px){
/*\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER IMMO ////////////////////*/
.immobilien #giant-slider{
	height:280px;
	}
.immo-building img{
	margin-left:0px;
	
	top:inherit;
	bottom:0px ;
	left:0;
	width:90%;
	padding:5% 5% 0 5%;
	}
.immo-schild img{
	right:2%;
	width:25%;
	}
.immo-website img{
	left:2%;
	width:35%;
	bottom:30px;
	} 
	.immo-preis img{
	top:-70px;
	right:10px;
	width:100px;
	}	   
}
@media screen and (max-width:500px){
.immobilien #giant-slider{
	height:200px;
	}
}
@media screen and (max-width:400px){
.immobilien #giant-slider{
	height:170px;
	}
	.immo-schild img{
	bottom:40px;
	}
}


/*@media screen and (max-width:680px){
\\\\\\\\\\\\\\\\\\\\ GIANT SLIDER IMMO ////////////////////
.immobilien #giant-slider{
	height:610px;
	}
.immo-building img{
	margin-left:0px;
	top:0;
	left:0;
	width:90%;
	padding:5%;
	}
.immo-schild img{
	right:2%;
	width:50%;
	}
.immo-website img{
	left:2%;
	width:65%;
	bottom:00px;
	}    
}
@media screen and (max-width:600px){.immobilien #giant-slider{	height:500px;	}  }
@media screen and (max-width:500px){.immobilien #giant-slider{	height:400px;	}  }*/


/*\\\\\\\\\\\\\\\\\\\\ HORIZONTALE NAVIGATION ////////////////////*/ 
#navbar-hr{
	width:100%;
	height:auto;
	font-size:20px;
	font-weight:normal;
	padding:0 0 0 6%;	
	margin:3.8% 0 0 0;
	}
#navbar-hr li{
	margin-right:10px;			/*<---Abstand einstellen*/
	float:left;
	list-style-type:none;
	position:relative;
	}
#navbar-hr li a{
	padding: 8px 15px; 		/*<---Breite und Höhe einstellen*/
	background:#333333; 
	display:block;
	text-decoration:none;
	text-align:center;
	color:#d4d7d7;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
	}
#navbar-hr li a:hover, ul#navbar-hr li a.active{
	background:#f63884;
	color:#fff;
	}
	
/*mobile menu-button*/
.menu-button{
	width:50px;
	padding:5% 5% 5% 5% ;
	background-color:#333333;
	display:none;
    float:right;
	}
.menu-toggle{
	color:#333333;
	background-color:#ffffff;
	border:1px solid #333333;
	display:block;
	cursor:pointer;
	border-radius:50%;	
	width:38px;
	height:38px;
	margin:0 auto;
	text-align:center;
	line-height:2.4em;
	font-weight:bold;
	}
[data-icon]:before{
	content: attr(data-icon);
	speak:none;
	display:inline-block;
	font-size:180%;
	}
@media screen and (max-width:1080px){
	/*navbar-hr*/
	#navbar-hr {
    margin-top:2.5%;
    }
}
@media screen and (max-width:830px){
	/*navbar-hr*/
	#navbar-hr {
    padding:0 0 0 3%;
    font-size:16px;
    margin-top:2.3%;
    }
	#navbar-hr li{margin-right:0;}
    #navbar-hr li a{
	padding: 5px 15px; 		/*<---Breite und Höhe einstellen*/
    }
}

@media screen and (max-width:680px){
	
	/*navbar-hr*/
    #navbar-hr{
        padding:0;
    }
	.js #navbar-hr{
        display:none; 
        padding:0;
        font-size:20px;
    }
	#navbar-hr li{
		width:100%;
		margin:0;
	}
	#navbar-hr li a{
		 padding:4%;
        border-top:1px solid #666;
	}	
	.menu-button{display:block;}
	.js #navbar-hr.toggle-on{display:block;}
}



/*\\\\\\\\\\\\\\\\\\\\\ FOOTER /////////////////////*/	
#footer-wrapper{
	width:100%;
	height:440px; /*benötigte Grundhöhe angeben, die restlichen Größen passen sich von alleine an*/
	background:#333333;
	color:#f5f5f5;
	display: table-row; /*Haupt Inhalt in eine Tabellen Zeile machen und Footer*/
	}


.fremdlogos01 img, .fremdlogos02 img{
    width:18%;
    margin-right:4%;
}
.fremdlogo{
    display:inline;
}
.footer-kontakt a:link, .footer-kontakt a:active, .footer-kontakt a:visited, .footer-kontakt a:hover{color:#f5f5f5; text-decoration: none;}


/*\\\\\\\\\\\\\\\\\\\\\ FORMULAR /////////////////////*/	
form{
	}
fieldset{padding:0;}
input{
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	}

.formularfeld input, .formularfeld textarea, .formularfeld select, .radiogroup{  /*Einstellungen Inputfelder !!! BOX SIZING !!!*/
	width:55%;
	display:inline-block;
	padding:4px;
	border: 1px solid #232323;
	margin-top: 10px;
	outline:0;
	vertical-align:top;
	}
.formularfeld100{padding-top:10px;}

.formularfeld100 input, .formularfeld100 textarea, .formularfeld100 select{ /*die Klasse ".formularfeld100" ordnet Formularfelder untereinander an und bringt sie auf 100% breite*/
	width:100%;
	display:block;
	padding:4px;
	border: 1px solid #232323;
	margin-top: 2px;
	outline:0;
	vertical-align:top;
    color:#333;
	}
input.radio{
	width:10%;
	margin-top:6px;
	}
textarea#nachricht{
		width:98%;
		}
.formularfeld input:focus{
		border: 1px solid #232323;		
	}
.formularfeld label{
	display:inline-block;
	width:30%;
	margin-top:10px;
	cursor:pointer;
	}

.submitbutton input{  /*Button Farbe/Größe uws.*/
	width:30%;
	height:40px;
	display:inline-block;
	padding:4px;
	color:#a2c500;
    background-color: transparent;
	border:1px solid #a2c500;
	margin:auto;
	margin-top:5%;
	font-size:inherit;
	outline:0;
	}

fieldset{border:none;}

.radiogroup{
	border:none;
	margin-top:7px;
    }

#kontaktformular label.error, label.error{ /*text von feldern bei falscheingabe*/
	color:#f63884;
	font-size:12px;
	width:100%;
	margin:0;
    text-align: left;
    display: block;
	}
#kontaktformular input.error,#kontaktformular textarea.error, textarea.error, input.error{ /*farbe von feldern bei falscheingabe*/
	background-color:#f6afcb; 
	color:#232323;
	}
 /*schriftfarbe von placeholdern bei falscheingabe*/
::-webkit-input-placeholder {color: #6f6f70; font-weight: bold;} ::-webkit-input-placeholder {color: #6f6f70; font-weight: bold;}
:-moz-placeholder {color: #6f6f70; font-weight: bold;} :-moz-placeholder {color: #6f6f70; font-weight: bold;}
::-moz-placeholder {color: #6f6f70; font-weight: bold;} ::-moz-placeholder {color: #6f6f70; font-weight: bold;}
:-ms-input-placeholder {color: #6f6f70; font-weight: bold;}  textarea.error:-ms-input-placeholder {color: #6f6f70; font-weight: bold;}

 /*schriftfarbe von placeholdern bei falscheingabe*/
input.error::-webkit-input-placeholder {color: #232323; font-weight: bold;} textarea.error::-webkit-input-placeholder {color: #232323; font-weight: bold;}
input.error:-moz-placeholder {color: #232323; font-weight: bold;} textarea.error:-moz-placeholder {color: #232323; font-weight: bold;}
input.error::-moz-placeholder {color: #232323; font-weight: bold;} textarea.error::-moz-placeholder {color: #232323; font-weight: bold;}
input.error:-ms-input-placeholder {color: #232323; font-weight: bold;}:-ms-input-placeholder {color: #232323; font-weight: bold;}

.footer-nav a:link, .footer-nav a:active, .footer-nav a:visited, .footer-nav a:hover, .footer-nav .c01{
    text-decoration: none;
    color:#333;
}
.social-media img{
    float:left;
    width:43px;
    margin:0px 10px 40px 0;
}
form#auftrag{
    padding:0;
}

#beratung  ::-webkit-input-placeholder {color: #ccc; font-weight: normal;} #beratung  ::-webkit-input-placeholder {color: #ccc; font-weight: normal;}
#beratung  :-moz-placeholder {color: #ccc; font-weight: normal;} #beratung  :-moz-placeholder {color: #ccc; font-weight: normal;}
#beratung  ::-moz-placeholder {color: #ccc; font-weight: normal;} #beratung  ::-moz-placeholder {color: #ccc; font-weight: normal;}
#beratung  :-ms-input-placeholder {color: #ccc; font-weight: normal;}  #beratung  textarea.error:-ms-input-placeholder {color: #ccc; font-weight: normal;}

#auftrag  ::-webkit-input-placeholder {color: #ccc; font-weight: normal;} #auftrag  ::-webkit-input-placeholder {color: #ccc; font-weight: normal;}
#auftrag  :-moz-placeholder {color: #ccc; font-weight: normal;} #auftrag  :-moz-placeholder {color: #ccc; font-weight: normal;}
#auftrag  ::-moz-placeholder {color: #ccc; font-weight: normal;} #auftrag  ::-moz-placeholder {color: #ccc; font-weight: normal;}
#auftrag  :-ms-input-placeholder {color: #ccc; font-weight: normal;}  #auftrag  textarea.error:-ms-input-placeholder {color: #ccc; font-weight: normal;}

#auftrag .zwei-formularfelder .formularfelder label.error:nth-child(2){
    display:none;
}
#auftrag .zwei-formularfelder .formularfelder label.error{
    margin:0;
}
.auftrag-form{position:relative;}
.more-space{
	padding-bottom:200px;
	}
.moremore-space{
	padding-bottom:350px;
	}
.bestandteile{
	position:absolute;
	width:86%;
	right:-93%;
	margin-top:35px;
	}
.bestandteile li{
	list-style-type:disc;
	color:#f63884;
	padding-left:10px;
	margin-left:20px;
	}
.bestandteile li span{
	color:#7c7c7c;
	}
.bestandteile h3{
	margin-top:0;
	margin-bottom:5px;
	line-height:150%;
	}
.bestandteile div{
	margin-bottom:15px;
	display:none;
	background-color:#eeeeee;
	padding:20px 30px;
	box-sizing:border-box;
	}
.bestandteile div.preis-mn, .bestandteile div.preis-fn, .bestandteile div.preis-sn, .bestandteile div.preis-bn{
	text-align:right;
	padding:1px;
	background-color:#ffffff;
	margin-bottom:0px;
	padding-right:5px;
	}
	
.bestandteile div.preis-bn span{	display:inline-block;	margin-right:0px;}
.bestandteile div.preis-sn span {	display:inline-block;	margin-right:0px;}
.bestandteile div.preis-fn span {	display:inline-block;	margin-right:0px;}
.bestandteile div.preis-mn span{	display:inline-block;	margin-right:9px;}
.bestandteile div.preis-summe span{ display:inline-block;	margin-right:0px; }
.bestandteile div.preis-summe{
	display:block;
	text-align:right;
	padding:5px;
	background-color:#ffffff;
	margin-bottom:0px;
	border-top:1px solid #999;
	margin-top:1px;
	}
.show{
	display:block;
	}
#beratung .formularfeld100 input,  #beratung .formularfeld100 textarea, #beratung .formularfeld100 select,#auftrag .formularfeld100 input,  #auftrag .formularfeld100 textarea, #auftrag .formularfeld100 select{ /*die Klasse ".formularfeld100" ordnet Formularfelder untereinander an und bringt sie auf 100% breite*/
	width:100%;
    padding-right:20%;
    height:40px;
    border:1px solid #999;
	}
 #beratung .formularfeld100 textarea,  #auftrag .formularfeld100 textarea{
     width:79%;
     height:100px;
 }
#auftrag .zwei-formularfelder{
    width:100%;
    position: relative;
}
#auftrag .formularfelder input{
    width:79%;  
    height:40px;
    border:1px solid #999;
    color: #333;
}
#auftrag .zwei-formularfelder label{
    display:inline-block;
	margin-top:10px;
}
.labels label:first-child, .formularfelder input:first-child, #auftrag .formularfelder input:first-child{
    width:18%;
    margin-right:2%;
}
.labels label:last-child, .formularfelder input:last-child, #auftrag .formularfelder input:last-child{
    width:79%;    
}
.agbs{position: relative;}
.agbs label.error{
    position: absolute;
    bottom:0;
    top:35px;
}
input[type="checkbox"]{
    background-color:#f6afcb;
}
.agbs-checkbox{
  margin-bottom:1em;
}
span.agbs-checkbox input[type="checkbox"] {
  background-color:green;
    display: inline-block;
}


.checkprodukte .formularfeld input{
    width:20px;
    height:20px;
    border-radius: none;
}
.checkprodukte .formularfeld label{
    margin-right:20px;
    width:100px;
    display: block;
}
.checkprodukte .c04{
    margin-bottom:100px;
	position:relative;
}
.checkprodukte .formularfeld:first-child p{
    width:158px;
    padding:0px 0px 4px 0px;
}
.star{
	position:absolute;
	top:55%;
	left:155px;
	width:20px;
	height:20px;
	}
.tt-pfeil{
	position:absolute;
	bottom:-16px;
	left:12px;
	width:30px;
	}
.design-paket-tool-tip{
	position:absolute;
	top:-103px;
	right:-196px;
	background-color:#fff;
	width:210px;
	height:auto;
	padding:10px;
	font-size:14px;
	border:1px solid black;
	z-index:500;
	display:none;
	}
	
.checkprodukte .formularfeld:last-child  .star .design-paket-tool-tip{
	position:absolute;
	top:-53px;
	right:-196px;
	background-color:#fff;
	width:210px;
	height:auto;
	padding:10px;
	font-size:14px;
	border:1px solid black;
	z-index:500;
	display:none;
	}	
	
.star:hover .design-paket-tool-tip, .formularfeld:last-child  .star:hover .design-paket-tool-tip{
	display:block;
	}
	


	
.checkprodukte .formularfeld p{
    background-color:#eee;
    text-align: right;
    color:white;
    margin:0 0 20px 0px;
    height:50px;
	width:158px;
    padding:0px 0px 4px 0px;
}

.formularfeld .produkt-headline{
    width: 90%;
    text-align: left;
    position: inherit;
    float:left;
}

.formularfeld .produkt-headline h2{
    border:1px solid #9f9f9f;
    font-size:20px;  
    padding:12px 28px 12px 28px;
    margin:0 0 0 0;    
    width:100px;
    display: inline-block;
    line-height: auto;
    font-weight:bold;
}
	
.auftrag-drucken{
    display:block;
    padding:10px 0 0 25px;
}

#beratung form, #auftrag form{
	padding: 0 5% 5% 0%;}


.formularfeld label.checkbox{
	width:70%;
    display: block;
    float: right;
    padding-right:15px;
	}
input.checkbox{
	background:#fff;
	width:20px;
	margin-top:16px;
	}
.checkboxenfeld{
    width:100%;
}
.abweichende-rechnungsadresse{
    display:none;
}
#beratung .submitbutton input, #auftrag .submitbutton input{  /*Button Farbe/Größe uws.*/
    width: auto;   
	padding:10px 25px 10px 25px;
    border:none;
    background-color: #a5c800;
    outline:none;
    color:#fff;
    font-weight: bold;
    text-decoration:none;
    -webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	transition: all 0.3s;
	outline:0;
	}
#beratung .submitbutton input:hover, #auftrag .submitbutton input:hover{
    background-color:#333;
    border:none;
}
#beratung .submitbutton input:active, #auftrag .submitbutton input:active{
    background:#232323;
}
.infospalte{
    float: right;
    padding-left:100px;
}
.infospalte p{
    margin:5px 0;
}
.greennumber{
    border:4px solid #a2c500;
    display: inline-block;
    width:13px;
    height:21px;
    color:#a2c500;
    font-size:16px;
    font-weight:bold;
    padding:1px 4px 3px 8px;
    border-radius: 100%;
    vertical-align: top;
}
.sogehtspunkt{
    width:80%;
    padding-top:4px;
    margin-left:10px;
    display: inline-block;
}
.LV_valid, .LV_invalid{
    float:right;
    margin:-30px -30px 5px 15px;
    width:20px;
    height:20px;
    background-image:url(../images/form-valid.png);
    background-size: contain;
        overflow: hidden;
    font-size: 0;
}
.LV_invalid{
    background-image:url(../images/form-notvalid.png);
}
.datensecure{

    padding:30px 30px 30px 0;
}
.datensecure img{
    width:8%; 
    padding:3%;
    float: left;
    border: 1px solid #999999;
}
.datensecure p{
    width:80.5%;
    float:right;
    padding:0 0 0 2.5%;
    margin:0;
    font-size:13px;
}

.pdfformular{ position:relative; top:-10px;}

.pdfformular a:link, .pdfformular a:active, .pdfformular a:visited, .pdfformular a:hover{color:#7c7c7c;}

@media screen and (max-width:1080px){	
    #beratung form, #auftrag form{
	padding: 0 5% 5% 30px;
    }
    .ms .mc01, .mm .mc01, .ml .mc01, .mc01{ width:100%; margin:0;} 
    .formularfeld label.checkbox{
        width:60%;
        display: inline-block;
        float: none;
        }
        .datensecure{
        padding:30px 30px 30px 30px;
        }
    #auftrag .zwei-formularfelder .labels label:first-child, #auftrag .zwei-formularfelder  .formularfelder input:first-child{
        width:23%;
        margin-right:2%;
    }
    #auftrag .zwei-formularfelder .labels label:last-child,#auftrag .zwei-formularfelder  .formularfelder input:last-child{
        width:73%;    
    }
    #auftrag .formularfelder input{
    width:73%;  
    }
    form#auftrag{
        padding:0 0 0 30px;
    }
	.design-paket-tool-tip{
	top:-106px;
	}
	.star{
	left:148px;
	}
	
	.checkprodukte .formularfeld:last-child  .star .tt-pfeil{
	bottom:-16px;
	left:158px;
	z-index:550;
	}
	.checkprodukte .formularfeld:last-child  .star .design-paket-tool-tip{
	right:-50px;
	}
	.moremore-space{
	padding-bottom:500px;
	}
}
@media screen and (max-width:900px){
.more-space{
	padding-bottom:380px;
	}
.moremore-space{
	padding-bottom:700px;
	}
}
@media screen and (max-width:800px){
	.more-space{
	padding-bottom:0px;
	}
.formularfeld:first-child .produkt-headline h2{ 
    padding:4px 28px 4px 28px;
}
.star{
	top:50%;
	left:148px;	
	}
.bestandteile{
	position:static;
	width:95%;
	box-sizing:border-box;
	margin-top:0px;
	margin-bottom:20px;
	}
.bestandteile div{
	padding:30px;
	}
}

@media screen and (max-width:680px){
	.bestandteile div{
	padding:15px;
	}
	.tt-pfeil{
	bottom:-16px;
	left:158px;
	z-index:550;
	}
.design-paket-tool-tip{
	right:-50px;
	}
	
	.infospalte{
    padding:0 0 60px 30px;
    }
    .footer-kontakt .c66{
        clear: both;
    }
	/*\\\\\\\\\\\\\\\\\\\\\ FORMULAR /////////////////////*/
	.formularfeld label, label.checkbox{
		width:auto;
		display: block;
		}
	.formularfeld label.checkbox{ display:inline-block;}
	.formularfeld input.checkbox, .formularfeld input.radio{width:20px;}
	.formularfeld input, .submitbutton input, .formularfeld textarea,  .formularfeld select{
		width:100%;
		}
	textarea#nachricht{
		width:97.3%;
		}
	form{
	padding:0%;
	width:100%;
	}
    #beratung .formularfeld100 input,  #beratung .formularfeld100 textarea, #beratung .formularfeld100 select, #auftrag .formularfeld100 input,  #auftrag .formularfeld100 textarea, #auftrag .formularfeld100 select{ /*die Klasse ".formularfeld100" ordnet Formularfelder untereinander an und bringt sie auf 100% breite*/
	width:95%;
    padding-right:20%;
	}
    #beratung form, #auftrag form{
	padding: 0 5% 5% 0px;
    }
    #beratung .formularfeld100 textarea, #auftrag .formularfeld100 textarea{
     width:73%;
     }
    .datensecure{
    padding:30px 30px 30px 0px;
    }
    
    #auftrag .zwei-formularfelder .labels label:first-child, #auftrag .zwei-formularfelder .formularfelder input:first-child{
        width:30%;
        margin-right:2%;
    }
    #auftrag .zwei-formularfelder .labels label:last-child, #auftrag .zwei-formularfelder .formularfelder input:last-child{
        width:62%;    
    }   
    #auftrag .formularfelder input{
    width:62%;  
    }
    /*label.error{
        margin-left:-30px;
    }*/
    .fremdlogo{
        width:35%;
        display:block;
        float: left;
        margin-bottom:20px;
        margin-left:10%;
    }
    .fremdlogo img{
        width:100%;
    }
    .fremdlogos02 .fremdlogo:last-child{
        margin-left:30%;
    }
    form#auftrag{
       padding:0px;
    }
    #auftrag .zwei-formularfelder .formularfelder label.error:nth-child(2){
    display:none;
}
}

/*\\\\\\\\\\\\\\\\\\\\\ Features Details /////////////////////*/
.f-detail{padding-bottom:120px;}
.f-detail .con{
	padding-top:80px;
	
	}
.f-detail h2{text-align:center;}	
.f-detail .con .f-text{
	padding:20px 50px 20px 20px;
	}	
.f-detail .con:nth-child(odd) .c02.f-text{
	padding:20px 20px 20px 50px;
	float:right;
	}	
.f-detail .con .c02:last-child{
	border:1px solid #cccccc;
}
.f-detail img{display:block;}	
@media screen and (max-width:680px){
	.f-detail .con, .f-detail{
		padding:0px;
	}
	.f-detail .con .f-text{
		padding:50px;
		}
	.f-detail .con .c02{float:left;}	
	}



.wrapper-mobile-friendly{padding:60px 30px;}	
.mobile-friendly-wrapper{
	width:1000px;
	height:1200px;
	overflow:hidden;
	}
.mobile-friendly-iframe{width:100%; height:1300px; margin-top:-150px;  }	

@media screen and (max-width:1000px){
	.mobile-friendly-wrapper{
	width:100%;
	}
	}
@media screen and (max-width:930px){
	.mobile-friendly-iframe{margin-top:-230px; }	
	}	
	
@media screen and (max-width:698px){
	.mobile-friendly-wrapper{height:1000px;}
	.mobile-friendly-iframe{width:100%; height:1000px; margin-top:-120px;  }	

	}
	
	
	
	
	
	
	
	
	
	
	
/*//////////////////////////////////////////ESHOP//////////////////////////////////////////*/	
	
	
	
.eshop .giant-slider-content-box ul{margin:0; padding:0;}
.eshop .giant-slider-content-box h2{text-align:left;}
	
	/*HEAD SLIDER*/
.eshop .giant-slider-content-box{ 
width:400px; 
background-color: #333; 
padding:30px; 
min-height:200px;
color:#fff; 
z-index:500; 
top:80px;
text-align:left;
right:20%;
padding-bottom:70px;
}
.eshop .giant-slider-content-box img{position:absolute;	width:100%; bottom:-90px; left:0; z-index:100;}

.eshop #detailseite .giant-slider-content-box h2 {
    border: none;
	text-align:left !important;
}
.eshop .giant-slider-content-box ul li{
	list-style:disc;
	margin:0 0 0 20px;
	}
.angebots-bestand{
	font-size:20px;
	}


div#getting-started {
    font-size: 20px;
    padding: 0px 20px 30px 0;
}
.video-wrapper{
	width:100%;
	height:620px;
	position:relative;
	overflow:hidden;
}
.video-overlayer {
    position: absolute;
    z-index: 50;
	background-image:url(../images/video-over-pattern.png);
	width:100%;
	height:100%;
}
.iframe-video{
	overflow:hidden;z-index:10;height:1080px;width:1920px; position:absolute; top:-10%;
	}
.eshop .slider-zusatz-box {
    font-size: 18px;
    color: #7c7c7c;
    text-align: center;
    background-color: #fff;
    padding: 50px 40px 20px 40px;
    margin-top: 0;
    position: relative;
    z-index: 1000;
}	
.head-video{
	position:relative;
	}	
.nur-noch{
	color:#f63884;
	}
.eshop .slider-zusatz-box h1, .eshop .slider-zusatz-box p{color:#7c7c7c;}
.count-finish{display:none;}	
		
@media screen and (max-width:1600px){	
.iframe-video{
	height:900px;width:1600px;
	}
}
@media screen and (max-width:1280px){	
.iframe-video{
	    height: 720px;width:1280px; 
	}
div#getting-started {
    font-size: 16px;
    padding: 0px 20px 20px 0;
}	
.angebots-bestand {
    font-size: 16px;}
.eshop .giant-slider-content-box{padding-bottom:50px;  }

}



@media screen and (max-width:1080px){	
.eshop	#giant-slider {	
	height:620px;
	}
.eshop .giant-slider-content-box{right:120px; }
}
@media screen and (max-width:1000px){ 
   .eshop .giant-slider-con h2{
    font-size: 45px;
    margin:0 0 10px -0px;
	padding:0;
    }
.eshop .giant-slider-content-box img{padding:0;}
}

@media screen and (max-width:800px){
.video-wrapper{
	height:400px;
	}	
	
.eshop .giant-slider-content-box{
	width:100%;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
	position:relative;
	background-color:#333333;
	top:0;
	right:0;
	padding:30px;
	}
.eshop .giant-slider-content-box img{
    width: 40%;
    top: 0;
    right: 0;
    left: inherit;}
}
@media screen and (max-width:680px){ 
	.eshop .giant-slider-content-box img {
		width: 100%;
		position: static;
		margin-top: 30px;
	}
}

.eshop-s01.cycle-sentinel, .eshop-s01, .eshop-s02, .eshop-s03{background-image:url(../images/es01.jpg);width:100%; height:620px; background-position:center center; background-size:cover; -webkit-transition: background-position ease 25s; transition: background-position ease 25s;}
.eshop-s02{background-image:url(../images/es02.jpg); background-position:center bottom;}
.eshop-s03{background-image:url(../images/es03.jpg);}

.eshop-s03.cycle-slide-active{ background-position:bottom;}
.eshop-s02.cycle-slide-active, .eshop-s02.cycle-slide-active.immom-s02, .eshop-s02.cycle-slide-active.w-check02{ background-position:center;}
.eshop-s01.cycle-slide-active.slide-down{ background-position:bottom;} 

/*Slider ImmoMarketing*/
.eshop-s01.cycle-sentinel.immom-s01, .eshop-s01.immom-s01, .eshop-s02.immom-s02, .eshop-s03.immom-s03{background-image:url(../images/immom02.jpg);}
.eshop-s02.immom-s02{background-image:url(../images/immom01.jpg); background-position:center bottom;}
.eshop-s03.immom-s03{background-image:url(../images/immom03.jpg);}


/*Slider Websitecheck*/
.eshop-s01.cycle-sentinel.w-check01, .eshop-s01.w-check01, .eshop-s02.w-check02, .eshop-s03.w-check03{background-image:url(../images/w-check01.jpg);}
.eshop-s02.w-check02{background-image:url(../images/w-check02.jpg); background-position:center bottom;}
.eshop-s03.w-check03{background-image:url(../images/w-check03.jpg);}


.slider-repeat{
	position:absolute; 
	width:100%;
	height:100%; 
	background-image:url(../images/video-over-pattern.png);
	background-repeat: repeat;
    z-index: 500;}

.eshop-slider img{
	display:none;
	}
.eshop .slider-wrapper{position:relative; background-color:#000;    overflow: hidden;}

@media screen and (max-width:1600px){ 
.eshop .giant-slider-content-box {

    right: 150px;
}
}

@media screen and (max-width:1280px){ 
.eshop-s01.cycle-sentinel, .eshop-s01, .eshop-s02, .eshop-s03{
	height:450px;
	}
.eshop .giant-slider-content-box {
    top: 20px;
    right: 150px;
	width: 350px;
	}
}
@media screen and (max-width:1024px){ 
.eshop .giant-slider-content-box {
    right: 20px;
	}
}
@media screen and (max-width:800px){ 
.eshop-slider img{display:block;}
.eshop-slider, .eshop-s01, .eshop-s02, .eshop-s03{height:auto; position:relative;}
.eshop-s01.cycle-sentinel, .eshop-s01, .eshop-s02, .eshop-s03{height:auto;}
.eshop .giant-slider-content-box{top:inherit; right:inherit; width: 100%;}
}

.eshop .cycle-pager{
	width:100%;
	margin:0 auto;
	font-size:45px;
	line-height:25px;					/*<--- höhe pager*/
	color:white;
	text-align:center;
	position:absolute;
	bottom:0;
	z-index:101;
	}
.eshop .cycle-pager span{
	cursor:pointer;
	margin:0.3%;
	}	
.eshop .cycle-pager-active{color:#000;}

.eshop .cycle-prev, .eshop .cycle-next{
	width:5%;
	height:5%;
	top:40%;
	position:absolute;
	z-index:101;
	cursor:pointer;
	background-image:none;
	left:50px;
	}
.eshop .cycle-prev img, .eshop .cycle-next img{width:30px;}	
.eshop .cycle-next{
	right:50px;
	left:inherit;
	text-align:right;
	}



@media screen and (max-width:680px){ 
.eshop .cycle-prev img, .eshop .cycle-next img{width:20px;}	
}


	
/*iconset*/
.eshop .iconset{
	width:100%;
	}
.eshop .iconset img{margin-top:20px;}	
.eshop .trennericon{width:100%;}
	
.eshop .iconset .con:nth-child(2){}
.eshop .iconset .con{padding:30px;}
	
.eshop .iconset .button {
    margin: 0px auto 50px auto;
}	

.eshop .iconset img{width:80px;}


/*was sie bekommen*/
.eshop .c01.produktzeile {
    font-size: 15px;
}	
.eshop .washabensiedavon.telefon.active{padding-top:0;}

.sterne{font-size:12px; padding:10px 20px 20px 20px;}

/*SO EINFACH GEHTS*/

.eshop .soeinfachgehts{
	padding:60px 0px;
	text-align:center;
	}
.page-id-59 .wrapper.soeinfachgehts {
    border-bottom: 1px solid #ccc;
	    padding: 60px 0px 10px 0;
}
.eshop .soeinfachgehts .con:nth-child(2){
	padding:20px 100px;
	text-align:center;
	}
.eshop .soeinfachgehts .c03{
	text-align:center;
	padding:20px 10px;
	}
.eshop .soeinfachgehts .c03 img{
	width:60px;
	}
.eshop .soeinfachgehts .c01 a.ghost-button{
	margin-top:0px;
	}
@media screen and (max-width:640px){
	.eshop .soeinfachgehts .c03{
	padding:20px 0px;
	}
	.eshop .soeinfachgehts .con:nth-child(2){
	padding:20px 40px;
	}
	}

.wc-gzd-item-desc.item-desc ul {
    font-size: 11px;
    line-height: 120%;
    padding: 0 0px 0 10px;
}	
	
	
/*////////////WEBSITE CHECK///////////*/	
	
.wrapper02.website-check-form-wrapper{
	background-color:#fff !important;
	text-align:left;
	padding-top:40px;
	}
.wrapper02.website-check-form-wrapper h2, .wrapper02.website-check-form-wrapper p{text-align:center;}	
.wrapper02.website-check-form-wrapper h2{padding-bottom:30px;}
.wrapper02.website-check-form-wrapper input.wpcf7-submit{
    padding: 10px 25px 10px 25px;
    border: none;
    background-color: #a5c800;
    outline: none;
    color: #fff;
    font-weight: bold;
    text-decoration: none;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
	width:150px;
}

.wrapper02.website-check-form-wrapper .design-beispiele.con	{
	width:680px;
	}	
	
.eshop .iconset.icon-web-check{
	width:1280px;
	text-align:left;
	}
	
	
.website-check-form div.kontakt-name input, .website-check-form div.kontakt-email input, .website-check-form div.kontakt-text input, .website-check-form .wpcf7-textarea{
	border: 1px solid #999;
	background-color:#fff; 
	}
	
	
@media screen and (max-width:1280px){
	.eshop .iconset.icon-web-check	{
	width:100%;
	}
	}	

@media screen and (max-width:700px){
	.wrapper02.website-check-form-wrapper .design-beispiele.con	{
	width:100%;
	padding:30px;
	}
	}	