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

/*/////////////////////////////////////////////
	GLOBAL
/////////////////////////////////////////////*/

body { background: #f2f2f2; margin: 0; padding: 0; font-size: 13px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; color: #3d3c3c; }
a { color: #7d7d7d; }

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	list-style: none;
	text-decoration: none;
}

.clear { clear: both; }

h1 { font-size: 24px; color: #efefef; font-weight: normal; margin: 0 0 15px 0; }
h2 { color: #0065c5; font-size: 24px; margin: 15px 0; }
h3 { color: #0065c5; font-size: 24px; margin: 0 0 5px 0; }
h4 { color: #0065c5; font-size: 14px; line-height: 14px; margin: 8px 0 5px 0; }
a:hover h4 { text-decoration: underline; }
p { font-size: 13px; line-height: 18px; }
b { letter-spacing: 1px; }

.borderTop { border-top: 6px solid #0065c5; }
.borderBottom { border-bottom: 1px dotted #ccc; }

.facebook { width: 32px; height: 32px; margin-top: 10px; margin-bottom: 10px;}


/*/////////////////////////////////////////////
	GENERAL LAYOUT
/////////////////////////////////////////////*/

.inside { width: 900px; margin: 0 auto; }
#header .inside { position: relative; height: 110px; }

#intro { background: url(../images/introBackground.png) repeat-x; }
#intro .inside { height: 285px; position: relative; margin: 0 auto 40px auto; }



/*/////////////////////////////////////////////
	HEADER
/////////////////////////////////////////////*/

#header .logo { position: absolute; top: 32px; left: 0; }

#header .nav { position: absolute; top: 35px; right: 0px; }
#header .nav li { color: #dedede; float: left; background: url(../images/btn.png) repeat-x; font-size: 13px; text-transform: uppercase; line-height: 13px; margin: 0 0 0 4px; padding: 11px 10px 11px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
#header .nav li.active, #header .nav li:hover { background: url(../images/btnActive.png) repeat-x; }
#header .nav li a { color: #dedede; }



/*/////////////////////////////////////////////
	MAIN
/////////////////////////////////////////////*/

.introText { position: absolute; top: 50px; width: 200px; }
.introText p { color: #ccc; }

.slides p { margin: 0 0 15px 0; }

#main { padding: 30px 0 30px 0; }



/*/////////////////////////////////////////////
	FOOTER
/////////////////////////////////////////////*/

#footer { border-top: 1px dotted #ccc; padding: 10px; font-size: 12px; line-height: 12px; }
#footer a { color: #0065c5; }
#footer img { margin: 0 0 -7px; }

@-webkit-keyframes rotate {
  from {
    -webkit-transform: rotate(0deg);
  }
  to { 
    -webkit-transform: rotate(360deg);
  }
}

#footer img{
    -webkit-animation-name:             rotate; 
    -webkit-animation-duration:         1.5s; 
    -webkit-animation-iteration-count:  infinite;
    -webkit-transition-timing-function: linear;
    }



/*/////////////////////////////////////////////
	BLOCKS
/////////////////////////////////////////////*/

.blockWrap { margin: 0 0 -30px -30px; width: 930px; }
.block1, .block2, .block3 { margin: 0 0 30px 30px; background: #fff; padding: 10px 20px; float: left; display: inline; box-shadow: 0 0 5px rgba(0,0,0,0.3); -moz-box-shadow: 0 0 5px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.3); }
.block1 a { color: #3d3c3c; }
.block1 a:hover { text-decoration: underline; }

.block1 { width: 240px; } /* 1/3 */
.block2 { width: 550px; } /* 2/3 */
.block3 { width: 860px; } /* 3/3 */
.mailBlock { width: 330px; margin: 60px auto 0 auto; background: #fff; padding: 10px 20px; box-shadow: 0 0 5px rgba(0,0,0,0.3); -moz-box-shadow: 0 0 5px rgba(0,0,0,0.3); -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.3); }

.onswerk { width: 260px; height: 233px; overflow: hidden; padding: 10px; }


/*/////////////////////////////////////////////
	FORM
/////////////////////////////////////////////*/

.form { font-weight: bold; color: #0065c5; }
form { margin: 15px 0 0 0; }
input { width: 544px; background: #fff; border: 1px solid #ddd; padding: 6px 3px; margin: 3px 0 10px 0; }
textarea { width: 544px; background: #fff; border: 1px solid #ddd; padding: 6px 3px; margin: 3px 0 10px 0; }



/*/////////////////////////////////////////////
	BUTTONS
/////////////////////////////////////////////*/

.btn { background: url(../images/btn.png) repeat-x; font-size: 12px; font-weight: normal; line-height: 50px; padding: 8px; color: #efefef; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; }
.btn:hover { background: url(../images/btnActive.png) repeat-x; }



/*/////////////////////////////////////////////
	ONS WERK
/////////////////////////////////////////////*/

@-moz-keyframes imageHover {
 from {margin: 0;}
  to {margin: 0 0 -33px 0;}
}

@-webkit-keyframes imageHover {
 from {margin: 0;}
  to {margin: 0 0 -33px 0;}
}

.onswerk img:hover {
	-webkit-animation-name: imageHover;
	-webkit-animation-duration: 0.5s;
	-webkit-animation-iteration-count: 1;
	-moz-animation-name: imageHover;
	-moz-animation-duration: 0.5s;
	-moz-animation-iteration-count: 1;}

.onswerk .image { height: 150px; overflow: hidden; }
.onswerk img:hover { margin: 0 0 -33px 0; }
.zieFotos { height: 20px; background: #fff; opacity: 0.8; border-top: 3px solid #0065c5; padding: 5px; position: relative; font-size: 13px; line-height: 13px; }