/*
Willing theme 2014

design & code / feingestalten webdesign

grey:	#565659
red:	#e30613

*/

/* body */
html { margin:0; padding:0; }
body { margin:0; padding:0; background:#fdfdfe; -webkit-text-size-adjust:none; /* overflow:scroll; */ overflow-y:hidden; overflow-x:hidden; }
.ie7 body,
.ie8 body { min-width:960px }
a { color:#e30613; text-decoration:none; }
a:hover { color:#ef1120; }
.clear { clear:both; width:0; height:0; line-height:0; }
.space { height:70px; clear:both; }
.footer a { -moz-transition:color 0.2s; -webkit-transition:color 0.2s; transition:color 0.2s; }

input[type="button"],
input[type="submit"],
input[type="reset"] { -webkit-appearance:none; }

/* header */
header { margin-bottom:20px; /* position:absolute; */ width:100%; /* height:95px; */ background:#fdfdfe; /* background:rgba(255,255,255,0.97); */ position:relative; z-index:100; }
header .logowrapper { position:relative; float:left; }
header a.logo { display:block; width:302px; height:85px; padding:10px 10px; background:url(../images/willing-logo.png) center center no-repeat; font-size:0; line-height:0; /* z-index:20; */ }

/* navigation */
header .navwrapper { position:relative; float:right; /* right:30px; */ }
nav { margin-top:47px; }
nav ul { list-style-type:none; float:right; margin:0; }
nav ul li { list-style-type:none; float:left; margin:0 2px; }
nav ul li a { display:block; padding:6px 8px; font-size:14px; line-height:1; color:#565659; text-transform:uppercase; font-weight:400; border-bottom:1px solid #bbb; -moz-transition:all 0.2s; -webkit-transition:all 0.2s; transition:all 0.2s; }
nav ul li.current>a,
nav ul li.section>a { color:#e30613; border-bottom-width:2px; border-bottom-color:#e30613; }
nav ul li:hover a,
nav ul li a:hover { border-bottom-color:#e30613; /* color:#e30613; */ }
nav ul li ul.submenu { display:none; position:absolute; background:#565659; padding:10px 0 10px; z-index:990; }
/* nav ul li:hover ul.submenu { display:block; } */
nav ul li ul.submenu li { float:none; margin:0; }
nav ul li ul.submenu li a { border:0 none; font-size:13px; padding-top:7px; padding-bottom:7px; color:#fff; }
nav ul li ul.submenu li a:hover { background:#e30613; }



header .toolbox { position:absolute; top:0; right:40px; font-weight:400; font-size:13px; line-height:22px; }
header .toolbox .phone { /* display:inline-block; */ float:left; color:#e30613; background:url(../images/graphics/willing-phone-mini.png) left center no-repeat; padding:2px 10px 2px 30px; }
header .toolbox .impress { background:#e30613; color:#fff; /* display:inline-block; */ float:left; padding:2px 10px; }
header .toolbox .impress a { color:#fff; }

/* site-layout */
.gridwrapper { /* background:#fff; */ }
.main { position:relative; margin-top:20px; padding-bottom:150px; zoom:1; }
.mainblock { padding-top:30px; }
.camera_wrap { margin-bottom:30px; position:relative; }

.subheading h2 { color:#e30613; }

.subicon { text-align:right; }
.subicon img { width:150px; height:auto; }

.button-wrapper { margin-bottom:20px; }
a.back-button { background:#565659 url(../images/graphics/arrow-right-white.png) 5px 50% no-repeat; color:#fff; padding:5px 15px 5px 25px; }
a.back-button:hover { background-color:#e30613; color:#fff; }

.site-banner { position:relative; width:100%; height:350px; background:#565659; background-position:center center; background-repeat:no-repeat; background-size:cover; }

.mainiconwrapper {  }
.mainiconwrapper .mainiconblock { margin-top:30px; }
.mainiconwrapper .mainiconblock .icon { text-align:center; /* padding:20px 60px; */ }
.mainiconwrapper .mainiconblock .icon img { width:100px; height:auto; }
.mainiconwrapper .mainiconblock .heading { background:#565659; padding:5px 10px; margin-bottom:10px; }
.mainiconwrapper .mainiconblock .heading h2 { color:#fff; margin:0; text-align:center; }
.mainiconwrapper .mainiconblock .content { text-align:center; text-transform:uppercase; color:#565659; }

.servicesholdericonwrapper { /* padding-left:100px; padding-right:100px; */ width:80%; max-width:880px; margin:0 auto; }
.servicesholdericonwrapper .mainiconblock { margin-top:30px; padding-left:20px; padding-right:20px; }
.servicesholdericonwrapper .mainiconblock .icon { text-align:center; /* padding:20px 40px; */ }
.servicesholdericonwrapper .mainiconblock .icon img { width:100px; height:auto; }
.servicesholdericonwrapper .mainiconblock .heading { /* background:#565659; */ padding:5px 10px; margin-bottom:10px; }
.servicesholdericonwrapper .mainiconblock .heading h3 { color:#000; margin:0; text-align:center; font-size:18px; text-transform:uppercase; }
.servicesholdericonwrapper .mainiconblock:hover .heading h3 { color:#e30613; }
.servicesholdericonwrapper .mainiconblock .content { text-align:center; text-transform:uppercase; color:#565659; }

.serviceiconwrapper { /* padding-left:100px; padding-right:100px; */ width:80%; max-width:880px; margin:0 auto; }
.serviceiconwrapper .mainiconblock { margin-top:30px; padding-left:20px; padding-right:20px; }
.serviceiconwrapper .mainiconblock .icon { text-align:center; /* padding:20px 40px; */ }
.serviceiconwrapper .mainiconblock .icon img { width:100px; height:auto; }
.serviceiconwrapper .mainiconblock .heading { /* background:#565659; */ padding:5px 10px; margin-bottom:10px; }
.serviceiconwrapper .mainiconblock .heading h3 { color:#000; margin:0; text-align:center; font-size:18px; text-transform:uppercase; }
.serviceiconwrapper .mainiconblock .content { text-align:center; text-transform:uppercase; }
.serviceiconwrapper a.mainiconblock .content { color:#565659; }
.serviceiconwrapper a.mainiconblock:hover .content { color:#e30613; }

.serviceserviceheading { text-align:center; margin-top:100px; border-top:1px solid #bbb; padding-top:30px; }
.serviceserviceheading h3 { text-transform:uppercase; }
.serviceservicewrapper { /* padding-left:100px; padding-right:100px; */ width:80%; max-width:880px; margin:0 auto; }
.serviceservicewrapper .mainiconblock { margin-top:30px; padding-left:20px; padding-right:20px; }
.serviceservicewrapper .mainiconblock .icon { text-align:center; /* padding:20px 40px; */ }
.serviceservicewrapper .mainiconblock .icon img { width:100px; height:auto; }
.serviceservicewrapper .mainiconblock .heading { /* background:#565659; */ padding:5px 10px; margin-bottom:10px; }
.serviceservicewrapper .mainiconblock .heading h3 { color:#000; margin:0; text-align:center; font-size:18px; text-transform:uppercase; }
.serviceservicewrapper .mainiconblock .content { text-align:center; text-transform:uppercase; color:#565659; }



.projectsholder-wrapper { margin-top:70px; }
.projectsholder-wrapper a.projectsholder-project { display:block; position:relative; margin-bottom:30px; }
.projectsholder-wrapper a.projectsholder-project .projectbanner { /* margin-left:70px; */ display:block; position:relative; height:120px; width:100%; background:#565659; background-position:center center; background-repeat:no-repeat; background-size:cover; overflow:hidden; }
.projectsholder-wrapper a.projectsholder-project .imageoverlay { display:block; position:absolute; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,0.0); background: /* rgba(0,0,0,0.0) */ url(../images/graphics/imageoverlay.png) right center no-repeat; -moz-transition:all 0.2s; -webkit-transition:all 0.2s; transition:all 0.2s; }
.projectsholder-wrapper a.projectsholder-project:hover .imageoverlay { background-color:rgba(0,0,0,0.1); }
.projectsholder-wrapper a.projectsholder-project .textblock { display:block; position:absolute; top:10px; right:30px; width:50%; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }
.projectsholder-wrapper a.projectsholder-project .heading { margin-top:5px; }
.projectsholder-wrapper a.projectsholder-project .heading h3 { color:#fff; font-size:24px; text-transform:uppercase; }
.projectsholder-wrapper a.projectsholder-project .content { color:#fff; font-weight:400; }
.projectsholder-wrapper a.projectsholder-project .content .fakelink { color:#e30613; }
.projectsholder-wrapper a.projectsholder-project:hover .content .fakelink { text-decoration:underline; }
.projectsholder-wrapper a.projectsholder-project .sideinfo { display:block; position:absolute; top:0; left:20px; width:60px; border-right:5px solid #fff; height:100%; background:#e30613 url(../images/icons/willing-inv-mainicon-sanitaer.png) 10px 10px no-repeat; }
.projectsholder-wrapper a.projectsholder-project .sideinfo.sanitaer { background-image:url(../images/icons/willing-inv-mainicon-sanitaer.png); }
.projectsholder-wrapper a.projectsholder-project .sideinfo.heizung { background-image:url(../images/icons/willing-inv-mainicon-heizung.png); }
.projectsholder-wrapper a.projectsholder-project .sideinfo.klima { background-image:url(../images/icons/willing-inv-mainicon-klima.png); }
.projectsholder-wrapper a.projectsholder-project .sideinfo.solar { background-image:url(../images/icons/willing-inv-mainicon-solar.png); }



.gallerywrapper { margin-top:70px; margin-bottom:70px; }
.gallerywrapper .galleryimage { position:relative; }
.gallerywrapper .galleryimage a { position:relative; display:block; padding:10px; }
.gallerywrapper .galleryimage img { display:block; width:100%; height:auto; }
.gallerywrapper .galleryimage .overlay { position:absolute; top:10px; left:10px; bottom:10px; right:10px; background:rgba(0,0,0,0.4); -moz-transition:background 0.2s; -webkit-transition:background 0.2s; transition:background 0.2s; }
.gallerywrapper .galleryimage a:hover .overlay { background:rgba(0,0,0,0.0); }


/* footer */
footer { background:#444; color:#bbb; font-size:12px; padding-bottom:100px; padding-top:40px; zoom:1; }
footer .typography a { color:#fff; }
footer .typography h4 { color:#fff; }
footer .typography ul { margin-left:0; }
footer .typography ul li { list-style-type:none; }
footer .copy { margin-top:34px; }

/* responsive */
@media only screen and (max-width: 1024px) {

	.projectsholder-wrapper a.projectsholder-project .textblock { width:70%; }
	header .logowrapper { float:none; }
	header .navwrapper { float:none; }
	nav { margin-top:0px; }


}

@media only screen and (max-width: 768px) {
	
	header .navwrapper {  }
	nav { /* margin-top:0px; */ }
	nav ul { list-style-type:none; float:none; margin:0; }

}


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


	.projectsholder-wrapper a.projectsholder-project .content { display:none; }
	.projectsholder-wrapper a.projectsholder-project .textblock { right:0; }
	.projectsholder-wrapper a.projectsholder-project .heading h3 { font-size:20px; }
	header .logowrapper { padding-top:20px; }
	header a.logo { padding:10px 0px; }
	nav ul li { list-style-type:none; float:none; margin:0 2px; }
	nav ul li a { padding:10px 10px; }
	nav ul li ul.submenu { position:relative; }
	/* nav ul li:hover ul.submenu { display:block; } */
	nav ul li ul.submenu li { float:none; }
	nav ul li ul.submenu li a {  }


}


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



}

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



}

/* retina graphics */
@media screen and (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {

/* header a.logo { background-image:url(../images/logo-197x85-2x.png); background-size:197px 85px; } */
/* header { background-size:320px 80px; } */
footer .fb { background-image:url(../images/social/fb-2x.png); background-size:28px 28px; }

}
