@charset "UTF-8";
/* CSS Document */

/* Schriften */
@font-face {
    font-family: 'CabinRegular';
    src: url('fonts/Cabin-Regular-webfont.eot');
    src: url('fonts/Cabin-Regular-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Cabin-Regular-webfont.woff') format('woff'),
         url('fonts/Cabin-Regular-webfont.ttf') format('truetype'),
         url('fonts/Cabin-Regular-webfont.svg#CabinRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'CabinBold';
    src: url('fonts/Cabin-Bold-webfont.eot');
    src: url('fonts/Cabin-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/Cabin-Bold-webfont.woff') format('woff'),
         url('fonts/Cabin-Bold-webfont.ttf') format('truetype'),
         url('fonts/Cabin-Bold-webfont.svg#CabinBold') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'MolotRegular';
    src: url('fonts/Molot-webfont.eot');
    src: url('fonts/Molot-webfont.eot?iefix') format('eot'),
         url('fonts/Molot-webfont.woff') format('woff'),
         url('fonts/Molot-webfont.ttf') format('truetype'),
         url('fonts/Molot-webfont.svg#webfontQ7OZ4Jw3') format('svg');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'EBGaramondRegular';
    src: url('fonts/EBGaramond-webfont.eot');
    src: url('fonts/EBGaramond-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/EBGaramond-webfont.woff') format('woff'),
         url('fonts/EBGaramond-webfont.ttf') format('truetype'),
         url('fonts/EBGaramond-webfont.svg#EBGaramondRegular') format('svg');
    font-weight: normal;
    font-style: normal;

}


/* Style */
html {
	width:100%;
	overflow-y:scroll;
}

img {
	border:0;
}

body {
	font-size:100%;
}

a {
	text-decoration:none;
}

div#center {
	width:100%;
}

div#container {
	width:1200px;
	margin:0px auto 0px auto;
	position:relative;
}

div#team_preview {
	width:440px;
	height:480px;
	
	background-image:url(bilder/team_preview.png);
	background-position:bottom right;
	background-repeat:no-repeat;
	
	top:-220px;
	left:-220px;
	
	z-index:160;
	
	position:absolute;
	
	cursor:pointer;
}

div#team_preview:hover {
	background-image:url(bilder/team_preview_hover.png);
	background-position:bottom right;
	background-repeat:no-repeat;
}

div#team_thumbnails {
	width:120px;
	
	padding:10px;
	
	position:absolute;
	
	left:0px;
	top:-400px;
}

div#team_thumbnails img {
	opacity:0.8;
	float:left;
	
	margin:0 10px 10px 0;
	
	cursor:pointer;
}

div#team_thumbnails img:hover {
	opacity:1;
}

div#team_thumbnails img.thumb_active {
	opacity:1;
	
	float:left;
	
	margin:0 10px 10px 0;
	
	cursor:default;
}

div#team_final {
	width:650px;
	height:584px;
	
	background-image:url(bilder/spiegel-gross.png);
	background-position:center top;
	background-repeat:no-repeat;
	
	top:-600px;
	position:absolute;
	
	left:50%;
	margin-left:-440px;
	
	z-index:10;
}

div#team_fotos {
	width:485px;
	height:475px;
	
	margin:0 0 0 0;
	
	position:absolute;
}

div#team_fotos img {
	position:absolute;
	display:none;
	
	margin:75px 0 0 135px;
}

div#close_button {
	position:absolute;
	
	margin:70px 0 0 550px;
	
	z-index:200;
}

div#kontakt_main {
	width:315px;
	height:194px;
	
	background-image:url(bilder/kontakt_origami.png);
	background-position:top right;
	background-repeat:no-repeat;
	
	right:0;
	top:0;
	
	position:absolute;
	
	z-index:160;
}

div#uhrzeit {
	width:150px;
	
	float:left;
	margin:5px 30px 0px 25px;
}

div#kontakt_buttons {
	width:60px;
	
	float:left;
	margin:35px 0px 0px 0px;
}

div#kontakt_form {
	width:212px;
	height:450px;
	
	z-index:170;
	
	right:23px;
	top:163px;
	
	padding:0px 10px 0px 10px;
	
	position:absolute;
	
	background:#37d1ff;
	
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0, startColorstr='#00afe4', endColorstr='#37d1ff');
	
	background-image: linear-gradient(bottom, rgb(56,209,255) 0%, rgb(5,132,171) 100%);
	background-image: -o-linear-gradient(bottom, rgb(56,209,255) 0%, rgb(5,132,171) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(56,209,255) 0%, rgb(5,132,171) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(56,209,255) 0%, rgb(5,132,171) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(56,209,255) 0%, rgb(5,132,171) 100%);

	background-image: -webkit-gradient(
		linear,
		right bottom,
		right top,
		color-stop(0, rgb(56,209,255)),
		color-stop(1, rgb(5,132,171))
	);
	
	display:none;
}

div#kontakt_form p {
	color:#FFF;
	font-size:0.8em;
	font-family:CabinRegular, sans-serif;
}

div#kontakt_telefon {
	width:200px;
	height:121px;
	
	padding:10px;
	
	z-index:150;
	
	right:288px;
	top:52px;
	
	position:absolute;
	
	background:#37d1ff;
	
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr='#37d1ff', endColorstr='#00afe4');
	
	background-image: linear-gradient(left bottom, rgb(56,209,255) 0%, rgb(0,174,227) 100%);
	background-image: -o-linear-gradient(left bottom, rgb(56,209,255) 0%, rgb(0,174,227) 100%);
	background-image: -moz-linear-gradient(left bottom, rgb(56,209,255) 0%, rgb(0,174,227) 100%);
	background-image: -webkit-linear-gradient(left bottom, rgb(56,209,255) 0%, rgb(0,174,227) 100%);
	background-image: -ms-linear-gradient(left bottom, rgb(56,209,255) 0%, rgb(0,174,227) 100%);

	background-image: -webkit-gradient(
		linear,
		left bottom,
		right top,
		color-stop(0, rgb(56,209,255)),
		color-stop(1, rgb(0,174,227))
	);
	
	display:none;
}

div#content {
	width:570px;
	height:480px;
	
	padding:170px 40px 40px 40px;
	
	top:-655px;
	/* top:-10px; */
	left:50%;
	z-index:10;
	margin-left:-325px;
	position:absolute;
	
	background-image:url(bilder/content_feld.png);
	background-position:top center;
	background-repeat:no-repeat;
	
	-moz-transform:rotate(-3deg);
	-o-transform:rotate(-3deg);
	-webkit-transform:rotate(-3deg);
	-ms-transform:rotate(-3deg);
}

div#content div h1 {
	color:#333;
	
	font:Georgia, "Times New Roman", Times, serif;
	letter-spacing:0;
}

div#content div li {
    list-style-image: url(bilder/list.png);
	color:#087292;
	
	font:1.1em 'EBGaramondRegular', serif;
	letter-spacing:0;
	line-height:1.1;
	padding-top:10px;
  }
  
div#content div p {
	color:#333;
	
	font:1.1em 'EBGaramondRegular', serif;
	letter-spacing:0;
	line-height:1.1;
  }

div#jubilaum {
	/*width:150px;
	height:130px;*/
	
	width:272px;
	height:168px;
	
	position:absolute;
	
	/*margin:120px 0px -130px 525px;*/
	margin:50px 0 0 455px;
	
	float:left;
	
	z-index:5;
}

div#logo {
	width:720px;
	height:300px;
	
	margin:220px 0px -130px 220px;
	
	z-index:160;
	
	position:absolute;
	
	float:left;
	
	clear:both;
}

div#base {
	width:1190px;
	height:435px;
	
	background-image:url(bilder/base_origami.png);
	background-position:top center;
	background-repeat:no-repeat;
	
	z-index:150;
	
	top:398px;
	
	left:50%;
	
	margin-left:-595px;
	
	position:absolute;
	
	clear:both;
}

div#titel {
	width:720px;
	height:30px;
	
	margin:90px 0px 0px 225px;
	
	float:left;
}

div#postit {
	width:150px;
	height:150px;
	
	position:absolute;
	
	margin:40px 0 0 810px;
	
	-moz-transform:rotate(10deg);
	-o-transform:rotate(10deg);
	-webkit-transform:rotate(10deg);
	-ms-transform:rotate(10deg);
	
	display:none;
}

div#leistungen {
	width:680px;
	height:200px;
	
	margin:40px 0px 0px 225px;
	
	float:left;
	
	padding:0 0 0 40px;
}

div#leistungen_font {
	width:30px;
	height:195px;
	
	float:left;
	
	position:absolute;
	
	margin:-20px 0 0 -40px;
	
}

div#leistungen_closed {
	width:78px;
	height:200px;
	
	display:none;
	
	float:left;
	
	margin:35px 0 0 53px;
	
	cursor:pointer;
}

div#team_beschreibungen {
	width:690px;
	height:200px;
	
	margin:10px 0px 0px 54px;
	
	float:left;
	
	padding:0 0 0 40px;
	
	display:none;
	
	position:relative;
}

div#team_beschreibungen h1 {
	color:#087292;
	
	font:2em Georgia, "Times New Roman", Times, serif;
	letter-spacing:0;
}

div#team_beschreibungen p {
	color:#333;
	
	font:1.1em 'EBGaramondRegular', serif;
	letter-spacing:0;
	line-height:1.1;
	
	margin-left:20px;
}

div#how_to {
	width:140px;
	height:275px;
	
	float:right;
	
	margin:40px 25px 0px 0px;
	
	text-align:center;
}

div#instrumente {
	width:120px;
	height:275px;
	
	margin:0px 0px 0px 40px;
	
	top:378px;
	
	z-index:10;
	
	position:absolute;
}

div#impressum {
	width:99%;
	height:30px;
	
	z-index:200;
	
	position:absolute;
	
	text-align:right;
	
	top:790px;
}

div#preloaded-images {
   position: absolute;
   overflow: hidden;
   left: -9999px; 
   top: -9999px;
   height: 1px;
   width: 1px;
}

/* Klassen */

.inline {
	display:inline;
}

.invisible {
	display:none;
	position:absolute;
	width:570px;
	height:430px;
	overflow:auto;
}

.pointer:hover {
	-moz-transform:rotate(-10deg);
	-o-transform:rotate(-10deg);
	-webkit-transform:rotate(-10deg);
	-ms-transform:rotate(-10deg);
}

h1.cabinbold {
	font: 2.3em 'CabinBold';
	letter-spacing: 0;
	color:#FFF;
	}

h2.cabinbold {
	font:1.8em 'CabinBold';
	letter-spacing:0;
	color:#FFF;
}

p.cabinbold {
	font:1em 'CabinBold';
	letter-spacing:0;
	color:#FFF;
}

h1.cabingreen {
	font:2.2em 'MolotRegular';
	letter-spacing:2px;
	color:#54b109;
	display:inline;
}

h2.cabingreen {
	font:1.2em 'MolotRegular';
	letter-spacing:2px;
	color:#8acb1a;
	display:inline;
	line-height:0.5;
}

p.cabinregular {
	font:0.95em 'CabinRegular';
	letter-spacing:0;
	color:#444;
	line-height:1.1;
	display:inline;
}

span.garamondgrey {
	font:2.3em 'EBGaramondRegular', serif;
	letter-spacing:0;
	color:#777;
	display:inline;
	line-height:0.6;
}

span.cabingrey {
	font:1em 'CabinBold';
	letter-spacing:0;
	color:#555;
	display:inline;
}

span.cabingrey a {
	text-decoration:none;
	color:#555;
}

.pointer {
	cursor:pointer;
}

.leistung_button {
	width:190px;
	height:32px;
	
	margin:50px 0 0 33px;
	
	float:left;
	
	border-radius:3px;
	
	box-shadow:2px 2px 3px #333;
	
	border:1px solid #2B9D1C;
	
	background:#c5f46d;
	
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#c5f46d', endColorstr='#88c30f');
	
	background-image: linear-gradient(bottom, rgb(136,196,17) 0%, rgb(195,243,107) 100%);
	background-image: -o-linear-gradient(bottom, rgb(136,196,17) 0%, rgb(195,243,107) 100%);
	background-image: -moz-linear-gradient(bottom, rgb(136,196,17) 0%, rgb(195,243,107) 100%);
	background-image: -webkit-linear-gradient(bottom, rgb(136,196,17) 0%, rgb(195,243,107) 100%);
	background-image: -ms-linear-gradient(bottom, rgb(136,196,17) 0%, rgb(195,243,107) 100%);

	background-image: -webkit-gradient(
		linear,
		left bottom,
		left top,
		color-stop(0, rgb(136,196,17)),
		color-stop(1, rgb(195,243,107))
	);
	
	cursor:pointer;
}

.leistung_button:hover {
	background:#37d1ff;
	
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr='#37d1ff', endColorstr='#00afe4');
	
	background-image: linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);
	background-image: -o-linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);
	background-image: -moz-linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);
	background-image: -webkit-linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);
	background-image: -ms-linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);

	background-image: -webkit-gradient(
		linear,
		left top,
		right top,
		color-stop(0, rgb(55,208,255)),
		color-stop(1, rgb(0,175,228))
	);
}

.active {
	background:#37d1ff;
	
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=1, startColorstr='#37d1ff', endColorstr='#00afe4');
	
	background-image: linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);
	background-image: -o-linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);
	background-image: -moz-linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);
	background-image: -webkit-linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);
	background-image: -ms-linear-gradient(left , rgb(55,208,255) 0%, rgb(0,175,228) 100%);

	background-image: -webkit-gradient(
		linear,
		left top,
		right top,
		color-stop(0, rgb(55,208,255)),
		color-stop(1, rgb(0,175,228))
	);
}

.leistung_button span {
	font:1.3em 'EBGaramondRegular', serif;
	letter-spacing:0;
	color:#0a475a;
	display:inline;
	line-height:1.6;
}

.leistung_button img {
	border:0;
	margin:-30px 0 0 0;
	vertical-align:middle;
}

.team_beschreibungen_texte {
	display:none;
	position:absolute;
}


/* Kontaktformular */

#kontakt_form label, legend {
	font-size: 12px;
	font-family:Arial, Helvetica, sans-serif;
}
#kontakt_form legend {
	margin-bottom:10px;
}
#kontakt_form {
	display: block;
	margin-bottom:10px;
}
#kontakt_form label {
	display: inline-block; 
	float: left; 
	height: 36px; 
	line-height: 36px; 
	width:80px;
	font-size:12px; 
}
#kontakt_form input, textarea, select {
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	width:200px;
	padding: 5px;
	color: #666666; 
	background-color:#FFFFFF;
	border:1px solid #0A0A0A;
	margin: 7px 0; 
	-moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -khtml-border-radius: 3px;
    border-radius: 3px;
}   
#kontakt_form textarea {
	resize:none;
}   
#kontakt_form input:focus, textarea:focus, select:focus {
	box-shadow: rgba(0,0,0, 0.7) 0px 0px 3px;
	-moz-box-shadow: rgba(0,0,0, 0.7) 0px 0px 3px;
	-webkit-box-shadow: rgba(0,0,0, 0.7) 0px 0px 3px;  
	border:1px solid #333333;
}
#kontakt_form input:hover, textarea:hover, select:hover {
}
#kontakt_form .required {
	color:#C00;
}
#kontakt_form .form_buttons {
	margin:0px;
}
#kontakt_form input.button {
	width: 80px;
	cursor: pointer;
	background-color:#FFFFFF;
	border:1px solid #0A0A0A;
	color:#666666;	
	padding: 4px 7px 4px 7px;
}
#kontakt_form input.button:hover {
	color:#222222;	
	background-color:#FFFFFF;
	border:1px solid #000000;
}
#kontakt_form .special {
	display:none;
}
#kontakt_form .error, #kontakt_form .sent {
	font-size:11px;
	padding:2px 5px 2px 5px;
	text-shadow:none;
	-moz-border-radius:3px; 
	-webkit-border-radius:3px; 
	border-radius: 3px;
}
#kontakt_form .error {
	background:#FBE5E2; 
	border:#F2A197 solid 1px; 
	color:#992213;
}
#kontakt_form .sent {
	background:#E1F8CB; 
	border:#C6D880 solid 1px; 
	color:#37620d;
}