/*Layout - enthält alle Inhalts Elemente -----------------------------------*/
/*Schriften*/
@font-face {
 font-family: Diavlo;
 src: url('fonts/diavlo_book.otf');
}
body {
	font-family:Diavlo, Helvetica, Arial, sans-serif;
	background:#017C00 url(images/bg-body.png) repeat-x;
	font-size:70%;
	text-align:center
}
h1 {
	color:#fff;
	text-shadow:2px 1px #333;
	display:block;
	height:50px;
	font-weight: normal;
	margin:40px 0 0 10px;
}
h2 {
	color:#fff;
	background: #6c0;
	display: inline;
	font-size:1.3em;
	text-shadow:2px 1px #017C00;
	padding:  .2em .5em 0 .5em;
	font-weight: normal;
	text-transform:uppercase;
}
h3 {
	margin:1.5em 0;
	color:#333;
	font-size:1em;
	font-weight:bold;
}
p {
	line-height:1.45em;
	padding:.5em 0;
}
ul.referenzen li {
	margin:.7em 0;
	padding:1.1em 0 0.3em;
	border-top:2px dotted #D0EAB7;
}
ul {
	margin:0;
}
li {
	margin:.5em 0 1em 0;
}
a:link, a:visited, a.active {
	color:#333;
}
a:hover {
	color:#6c0;
}
span.skype {
	background:url(images/skype.gif) no-repeat center left;
}
a.vcard {
	background:url(images/vcard.gif) no-repeat center left;
}
a.xing {
	background:url(images/xing.gif) no-repeat center left;
}
span.skype, a.vcard, a.xing {
	padding-left:1.5em;
}
#wrap {
	position:relative;
	z-index:10;

}
.inner{
	position:relative;
	min-width:1000px;
	max-width:1300px;
	margin:auto;

}
#container {
	position:relative;
	min-width:1000px;
	max-width:1300px;
	margin:auto;
	text-align:left;
}
#wrap .head-out {
	background: transparent url(images/bg-wrap-outer.png) 70% 0 repeat-x;
	height:17em;
}
#wrap .head-in {
	background: transparent url(images/bg-wrap-inner.png) 300% 0 repeat-x;
	height:17em;
}
#logo {
	position:absolute;
	width:28.5%;
	top:47px;
	right:0;
}
#stamp{
	background:url(images/stamp.png);
	width:125px;
	height:100px;
	position:absolute;
	right: 0;
	top: 71px;
}
#scills {
	position:absolute;
	width:30%;
	right:0;
	top:7em;
	color:#FF7007;
}
#content {
	float:left;
	font-size:1.2em;
	width:73%;
}
#right {
	float:right;
	font-size:1.2em;
	width:25%;
	margin:90px 0 0 0;
}
.box {
	background:#D0EAB7;
	border:.6em solid #66CC00;
	padding:1em;
	color:#333;
	margin-bottom:1em;
	-moz-border-radius:7px;
	border-radius:7px;
	overflow:hidden;
	position:relative;
}
.box.white {
	background:#fff;
}
.box.about {
	background:#D0EAB7 url(images/kathi-frei.png) no-repeat right bottom;
	padding-right:17em;
	min-height:15em;
}
.box.contact {
	overflow:visible;
}
.plant {
	background: url(images/box_bg1.png) no-repeat right 20px;
	position:absolute;
	bottom:0px;
	right:-45px;
	width:227px;
	height:206px;
}
.box.bg1 {
	background:#D0EAB7 url(images/box_bg1.png) no-repeat right 20px;
}
.box.bg2 {
	background:#E0F5CC url(images/box_bg2.png) no-repeat bottom right;
}
.box.bg3 {
	background:#E0F5CC url(images/box_bg3.png) no-repeat bottom right;
}
/*Projekte*/
.slide .project a{	
	height:27em;
	display:block;
	margin-bottom:1em;
	text-indent:-999em;
}
.slide .project.p1 a{	
	background:#ccc url(images/slide_project_1.jpg) bottom center no-repeat;
}
.slide .project.p2 a{	
	background:#ccc url(images/slide_project_2.jpg) bottom center no-repeat;
}
.slide .project.p3 a{	
	background:#ccc url(images/slide_project_3.jpg) bottom center no-repeat;
}
.slide .project.p4 a{	
	background:#ccc url(images/slide_project_4.jpg) bottom center no-repeat;
}
.slide .project.p5 a{	
	background:#ccc url(images/slide_project_5.jpg) bottom center no-repeat;
}
.slide h3{
	background:#017C00;
	overflow:hidden;
	height:12px;
	padding:.3em .5em .3em .5em;
	font-size:1em;
	margin:1em 0 0 0;
	color:#fff;
	text-shadow:2px 1px #017C00;
	font-weight:normal;
}
.slide h3 a{
	color:#fff;
	text-decoration:none;
}
.slide h3 a:hover{
	text-decoration:underline;
}
.slide h3 .ra{
	font-size:.9em;
	padding-top:.2em;
}
.slide p{
	padding:.2em;
}
/*Projekte*/
.box.projects{
	background:#D0EAB7 url(images/bg_projects.png) no-repeat bottom right;
	
}
.projectShortContainer{
	margin:1em 0 1.15em 1%;
	
}
.projectShort{
	width:33%;
	float:left;	
}

p.info{
	background:#96C82B;
	padding:.3em .7em;
	margin-bottom:1em;
	-moz-border-radius:3px;
	border-radius:3px;
}
.projectShort h3{
	color:#017C00;
	margin:1em 0 .3em 0;
	
}

.projectShort p{
	margin:.3em 0;
	padding:.3em 0;
	line-height:1.2em;
	
}
.projectShort a{
	color:#017C00;

}
.projectShort .image{
	position:relative;	
}
.projectShort .image a{
	height:135px;
	position:relative;
	display:block;
	border-bottom:3px solid #96C82B;
	margin-bottom:2em;
	background-repeat:no-repeat;
	background-position: center 40px;
}
.projectShort  .image a:hover{
	background-position: center 0px;
}
.projectShort  .image.p1 a{
	background-image:url(images/short_project_1.png);
}
.projectShort  .image.p2 a{
	background-image:url(images/short_project_2.png);
}
.projectShort  .image.p3 a{
	background-image:url(images/short_project_3.png);
}
.projectShort  .image.p4 a{
	background-image:url(images/short_project_4.png);
}
.projectShort  .image.p5 a{
	background-image:url(images/short_project_5.png);
}
.projectShort  .image.p6 a{
	background-image:url(images/short_project_6.png);
}
.projectShort  .image.p7 a{
	background-image:url(images/short_project_7.png);
}
.projectShort  .image.p8 a{
	background-image:url(images/short_project_8.png);
}
.projectShort  .image.p9 a{
	background-image:url(images/short_project_9.png);
}
.projectShort  .image.p10 a{
	background-image:url(images/short_project_10.png);
}
.projectShort  .image.p11 a{
	background-image:url(images/short_project_11.png);
}
.projectShort  .image.p12 a{
	background-image:url(images/short_project_12.png);

}
.tooltip_container .tooltip {
    z-index:1000 !important;
		-moz-border-radius: 7px;
		border-radius:7px;
    background:#D0EAB7;
    border: 3px solid #6c0;
    bottom:-20%;
    left: 250px;
		width:180px;
    padding: 10px;
    position: absolute;
    visibility: hidden;
    
}

.tooltip_container .tooltip.bg1 {
    background:#D0EAB7 url(images/tooltip_bg.png) bottom right no-repeat;
}
.tooltip_container .tooltip.bg2 {
    background:#D0EAB7 url(images/tooltip_bg2.png) bottom right no-repeat;
}
.tooltip_container .tooltip.bg3 {
    background:#D0EAB7 url(images/tooltip_bg3.png) bottom right no-repeat;
}
.tooltip_container .tooltip.bg4 {
    background:#D0EAB7 url(images/tooltip_bg4.png) bottom right no-repeat;
}
.tooltip_container .tooltip .arrow {
    position:absolute;
		width:19px;
		height:46px;
		left:-19px;
		top:30%;
		background:url(images/tooltip_arrow_left.png) no-repeat top right;
}
.tooltip_container .tooltip.left .arrow {
		left:200px !important;
		background:url(images/tooltip_arrow_right.png) no-repeat top left;
}
.tooltip_container .tooltip p{
    padding:0;
		margin:.5em 0;
}
.tooltip_container .tooltip p a{
    padding:0;
		margin:0;
}
.tooltip_container .tooltip.right {
    left: 250px;
}
.tooltip_container .tooltip.left {
    left: -140px;
}
.tooltip_container .tooltip a {
		background-image:none !important;
		border:none;
		height:auto;
}




#scills li {
	margin:.1em 0;
	padding-top:.2em;
	text-transform:uppercase;
	display:block;
	font-size:2.4em;
}
#arrow-corner {
	background:transparent url(images/corner.gif) bottom right no-repeat;
	position:absolute;
	right:0px;
	bottom:0px;
	height:73px;
	width:94px;
}
#logorow {
	width:99%;
	overflow:auto;
	padding-top:1em;
	height:11em;
	background:#fff;
	border:3px solid #FFDB91;
}
#logorow .scroll {
	width:3000px;
	display:table;
	vertical-align:middle;
	display:block;
}
#logorow img {
	float:left;
	margin:0 2.5em;
	border:none;
}
#footer {
	height:250px;
	background:url(images/bg-footer.png) bottom left repeat-x;
	position:relative;
	width:100%;
	margin-top:-60px;
}
#footer div {
	position:absolute;
	left:240px;
	bottom:0px;
}
#footer p {
	position:absolute;
	bottom:5px;
	left:30px;
}