@charset "UTF-8";
/* CSS Document */
/* nothing-you-could-do-regular - latin */
@font-face {
  font-family: 'Nothing You Could Do';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/nothing-you-could-do-v7-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Nothing You Could Do'), local('NothingYouCouldDo'),
       url('../fonts/nothing-you-could-do-v7-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/nothing-you-could-do-v7-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/nothing-you-could-do-v7-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/nothing-you-could-do-v7-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/nothing-you-could-do-v7-latin-regular.svg#NothingYouCouldDo') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/open-sans-v15-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('../fonts/open-sans-v15-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../fonts/open-sans-v15-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../fonts/open-sans-v15-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../fonts/open-sans-v15-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../fonts/open-sans-v15-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
* {
	margin: 0;
	padding: 0;
	outline:none;
}
body {
	font-family: 'Open Sans', Helvetica, Arial, sans-serif;
	font-size: 13px;
	line-height: 21px;
	background-color: #464646;
	color: #333333;
	background-image: url(../img/bg.png);
	background-repeat: repeat-x;
}
#wrap {
	width: 950px;
	padding-left:15px;
	padding-right:15px;
	margin-left: auto;
	margin-right: auto;
}
a {
	color: #3c3c3c;
	cursor: pointer;
	display: inline-block;
	text-decoration: none;
}
.clbt {
clear:both;
}
a:hover {
	text-decoration: none;
	color: #000;
}
#logo {
	float: left;
	margin-top: 65px;
}
#logo a {
	font-size: 16px;
	text-align: center;

	 /*text-shadow: 2px 2px 4px #000000;*/
}

#logo a #sign{
font-family: 'Nothing You Could Do', cursive;
font-size:40px;
color:#515151;
}
h1, h2, h3, h4, h5, h6 {
	font-weight: 300;
}
#header-reihe {
	height: 130px;
}
nav ul {
	list-style-type: none;
	margin-top: 57px;
	float: right;
}
nav ul li {
	display: inline;
	margin-right: 15px;
}
nav ul li:nth-child(5) {
	margin-right: 0;
}
nav ul li a {
	font-size: 14px;
	text-align: center;
}
#headline {
	height: 80px;
}
#headline p {
	text-align: center;
	color: #fff;
	margin-top: 20px;
	font-size: 20px;
}
#portfolio {
	height: 300px;
}
#boxen {
	padding-top: 40px;
}
#boxen .gruen {
background: #8abd25; /* Old browsers */
background: -moz-linear-gradient(45deg, #8abd25 0%, #77e82c 65%, #8abd25 99%); /* FF3.6+ */
background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#8abd25), color-stop(65%,#77e82c), color-stop(99%,#8abd25)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(45deg, #8abd25 0%,#77e82c 65%,#8abd25 99%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(45deg, #8abd25 0%,#77e82c 65%,#8abd25 99%); /* Opera 11.10+ */
background: -ms-linear-gradient(45deg, #8abd25 0%,#77e82c 65%,#8abd25 99%); /* IE10+ */
background: linear-gradient(45deg, #8abd25 0%,#77e82c 65%,#8abd25 99%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8abd25', endColorstr='#8abd25',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#boxen .gelb {
background: #ffcc00; /* Old browsers */
background: -moz-linear-gradient(45deg, #ffcc00 0%, #f4f72e 65%, #ffcc00 99%); /* FF3.6+ */
background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#ffcc00), color-stop(65%,#f4f72e), color-stop(99%,#ffcc00)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(45deg, #ffcc00 0%,#f4f72e 65%,#ffcc00 99%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(45deg, #ffcc00 0%,#f4f72e 65%,#ffcc00 99%); /* Opera 11.10+ */
background: -ms-linear-gradient(45deg, #ffcc00 0%,#f4f72e 65%,#ffcc00 99%); /* IE10+ */
background: linear-gradient(45deg, #ffcc00 0%,#f4f72e 65%,#ffcc00 99%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffcc00', endColorstr='#ffcc00',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#boxen .pink {
background: #ff40af; /* Old browsers */
background: -moz-linear-gradient(45deg, #ff40af 0%, #ea1c72 65%, #ff40af 99%); /* FF3.6+ */
background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#ff40af), color-stop(65%,#ea1c72), color-stop(99%,#ff40af)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(45deg, #ff40af 0%,#ea1c72 65%,#ff40af 99%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(45deg, #ff40af 0%,#ea1c72 65%,#ff40af 99%); /* Opera 11.10+ */
background: -ms-linear-gradient(45deg, #ff40af 0%,#ea1c72 65%,#ff40af 99%); /* IE10+ */
background: linear-gradient(45deg, #ff40af 0%,#ea1c72 65%,#ff40af 99%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff40af', endColorstr='#ff40af',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
}
#boxen li {
	height: 220px;
	width: 295px;
	float: left;
	margin-right: 30px;
	list-style: none;
		-webkit-border-radius: 8px 0 8px 8px;
	-moz-border-radius: 8px 0 8px 8px;
	border-radius: 8px 0 8px 8px;
	-webkit-box-shadow: 0 8px 6px -6px black;
	-moz-box-shadow: 0 8px 6px -6px black;
	box-shadow: 0 8px 6px -6px black;
	    -webkit-transition: height 2s; /* Safari 3.1 to 6.0 */
    transition: height 2s;
}
#boxen li:nth-child(3) {
margin-right:0;
}
#boxen li a {
	margin-top: 50px;
	display: block;
	color: #fff;
	font-size: 25px;
	text-align: center;
}
#boxen li:hover {
	height: 240px;
}

#boxen li a:hover {
	font-size: 35px;
}

#boxen li a .fa {
	font-size: 60px;
	padding-bottom: 25px;
	text-shadow:none;
}
.gelb {
	background-color: #FFCC00;
}
.blau {
	background-color: #0099CC;
}
.pink {
	background-color: #FF40AF;
}
.gruen {
background: #8abd25; 
}
#portfolio {
position:relative;
}
#content {
	background-color: #fff;
	width: 800px;
	position: absolute;
	top: -43px;
	left: 80px;
	height: 480px;
	overflow: auto;
	-webkit-box-shadow: 0 8px 6px -6px black;
	-moz-box-shadow: 0 8px 6px -6px black;
	box-shadow: 0 8px 6px -6px black;
	z-index: 100;
	-webkit-border-radius: 8px 0 8px 8px;
	-moz-border-radius: 8px 0 8px 8px;
	border-radius: 8px 0 8px 8px;
}
#content h1 {
	color: #fff;
	padding: 10px 20px 10px 20px;
	margin-bottom: 30px;
}
#content h2, #content h3 {
	padding: 10px 20px 0 20px;
}
#content ul { 
padding:10px 20px 0 35px; }
#content p {
	padding: 8px 20px 10px 20px;
	font-size: 14px;
}
#content a {
	text-decoration:underline;
}
#backlink {
	position:absolute;
	bottom:15px;
	right:15px;
	font-size:11px;
}
#dienstleistungen {
height:100px;
margin-top:140px;
padding-left:200px;
}
#dienstleistungen h1{
	font-family: 'Nothing You Could Do', cursive;
font-size:35px;
color:#fff;
padding-bottom:30px;
}
#dienstleistungen ul {
font-size:15px;
color:#fff;
padding-bottom:5px;
}
#dienstleistungen .fa-circle {
font-size:10px;
padding-right:5px;
vertical-align:center;
padding-bottom:2px;
}
#kontaktbuttons a {
	margin-top: 180px;
	color: #fff;
	font-size: 30px;
}
#kontaktbuttons .fa {
	font-size: 30px;
}
footer {
	margin-top:20px;
	padding-top:10px;
	color: #fff;
	text-align: right;
	border-top:solid 1px #ccc;
}
footer a {
	color: #fff;
		
}
footer a:hover {
	color: #ccc;
}
#kontaktbuttons .fa.fa-facebook-square {
	margin-right: 10px;
}
#portfolio #content img {
	margin-right: 10px;
	margin-bottom: 10px;
	float: left;
}