/********************

Autor: Wishu Kaiser
Website: http://www.wishu.de

********************/

* {
margin:0;
padding:0;
}

html,
body {
height:100%;
}

body {
background:#102831 url(/media/img/bg.gif) repeat-x  fixed;
color:#4c4c4c;
font:100.1% Calibri,sans-serif;
}

code {
font-size:12px !important;
position:relative;
}

address {
font-style:normal;
}

strong {
}

a img {
border:0;
}

a {
color:#0063A5;
transition: 0.4s ease;
-o-transition: 0.4s ease;
-moz-transition: 0.4s ease;
-webkit-transition: 0.4s ease;
}

a:visited {
color:#004472;
}

a:hover,
a:focus {
color:#001E33;
text-decoration:none;
}

#inhalt p,
#sidebar p,
#sidebar address {
padding:5px 10px;
font-size:17px;
line-height:1.5;
font-family:Calibri, Arial, sans-serif;
}

.clear {
clear:both;
}

p.fehler {
color:#FFF;
background:#E61E26;
padding:10px;
margin:10px 0;
}

p.OK {
color:#FFF;
background:#309B46;
padding:10px;
margin:10px 0;
}

/********************
|     ALLGEMEIN     |
********************/

#wrap {
width:740px;
margin:0 auto;
background:#FFF;
clear:both;
box-shadow:0 0 5px #000, 0 0 10px #000;
}

#head,
#footer {
width:740px;
margin:0 auto;
}

#wrap #navi {
background:#EEE;
}

#wrap #navi ul {
list-style-type:none;
padding:5px;
position:relative;
z-index:200;
}

#wrap #navi li {
float:left;
display:block;

}

#wrap #navi li.twitter,
#wrap #navi li.facebook,
#wrap #navi li.gplus,
#wrap #navi li.blog {
float:right;
display:block;
}

#wrap #navi li a {
padding:10px;
line-height:1;
display:block;
color:#000;
text-decoration:none;
font-size:17px;
margin-right:3px;
margin-bottom:5px;
font-weight:bold;
}

#wrap #navi li a:hover,
#wrap #navi li a.current {
color:#FFF;
background:#102831;
}

#wrap #navi li.twitter a:hover,
#wrap #navi li.twitter a:focus {
background:#33CCFF;
}

#wrap #navi li.facebook a:hover,
#wrap #navi li.facebook a:focus {
background:#3B5998;
}

#wrap #navi li.blog a:hover,
#wrap #navi li.blog a:focus {
background:#FF9933;
}

#wrap #navi li.gplus a:hover,
#wrap #navi li.gplus a:focus {
background:#CE4228;
}

#referenzen div {
background:#102831;
color:#FFF;
font-family:'Yanone Kaffeesatz',Arial, sans-serif;
font-weight:200;
font-size:21px;
line-height:1.4;
padding:0 10px;
}

#referenzen div p.topic {
float:left;
}

#referenzen div p.site {
float:right;
color:#5C7781;
}

#referenzen a.mobiflip img {
display:block;
transition: 0.5s ease;
-o-transition: 0.5s ease;
-moz-transition: 0.5s ease;
-webkit-transition: 0.5s ease;
opacity:0;
}

#referenzen a {
color:#FFF;
text-decoration:none;
}
#referenzen a:hover {
color:#CCC;
text-decoration:none;
}

#referenzen a.mobiflip {
background:url(http://neu.wishu.de/media/img/referenzen/mobiflip_navi.png) no-repeat;
display:block;
}

#referenzen a:hover img {
opacity:1;
}

#sidebar {
width:281px;
float:right;
background:#4c4c4c;
margin-top:12px;
}

#sidebar p,
#sidebar address {
color:#DDD;
}

#sidebar a {
color:#FFF;
}

#inhalt.kontakt {
width:435px;
}

#footer {
margin:5px auto 10px;
color:#FFF;
font-size:12px;
text-align:center;
}

#footer a {
color:#CCC;
}


/********************
|     HEADLINES     |
********************/

h1 {
float:left;
position:relative;
margin:10px 0 -25px;
z-index:20;
}

h2 {
float:left;
color:#FFF;
text-decoration:none;
text-shadow:#000 0 0 5px;
padding:50px 5px 0;
display:block;
font-size:36px;
position:relative;
z-index:20;
bottom:-5px;
left:-5px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
font-family:'Yanone Kaffeesatz',Arial, sans-serif;
font-weight:200;
}

#inhalt h3 {
font-size:35px;
}

#inhalt h4 {
font-size:30px;
}

#inhalt h5 {
font-size:23px;
}

#inhalt h3,
#inhalt h4,
#inhalt h5 {
padding:5px 10px;
border-bottom:1px solid #4c4c4c;
}

#sidebar h4 {
background:#DDD;
padding:4px 10px;
font-size:25px;
border-bottom:1px solid #DDD;
}

#referenzen h4 {
color:#FFF;
text-align:center;
display:block;
padding:5px;
background:#102831 url(../../media/img/referenzen_h4.gif)repeat-x;
font-size:25px;
line-height:1;
margin-bottom:0px;
}

/********************
|     TABELLEN      |
********************/

#sidebar table {
color:#DDD;
font-size:19px;

}

#sidebar table td {
padding:0 10px;
}

#sidebar table td address {
margin-bottom:10px;
}

#sidebar table td a {
color:#FFF;
padding:0 3px;
border-radius:3px;
}

#sidebar table td a:hover {
background:#DDD;
color:#000;
}


table#lebenslauf {
display:block;
margin:0 10px;
border-collapse:collapse;
box-shadow:0 0 3px #000;
}

table#lebenslauf table {
border-collapse:collapse;
width:100%;
}

table#lebenslauf img {
float:right;
border:5px solid #FFF;
box-shadow:0 0 3px #000;
}

table#lebenslauf h4 {
border:0;
font-size:40px;
}

table#lebenslauf tr {
background:#EEE;
border-bottom:2px solid #FFF;
}

table#lebenslauf tr:last-child {
border:0;
}

table#lebenslauf table tr {
background:transparent;
border:0;
}

table#lebenslauf tr:hover {
background:#102831 !important;
}

table#lebenslauf tr:first-child:hover {
background:#EEE !important;
}

table#lebenslauf table tr:hover td {
background:#EEE;
color:#4c4c4c;
}

table#lebenslauf tr:hover td {
color:#FFF;
}

table#lebenslauf tr:first-child:hover td {
color:#4c4c4c;
}

table#lebenslauf td {
padding:10px;
font-size:17px;
line-height:1.3;
font-family:Calibri, Arial, sans-serif;
vertical-align:top;
}

table#lebenslauf td:first-child {
font-weight:700;
}

table#lebenslauf table td:first-child {
font-weight:100;
font-style:italic;
width:220px;
}

/********************
|     FORMULARE     |
********************/

form#kontakt p {
margin:0 0 10px;
}

form#kontakt label {
float:left;
width:100px;
font-weight:bold;
margin-right:5px;
}

form#kontakt input[type=text],
form#kontakt textarea {
font-size:16px;
padding:3px 4px;
border:1px solid #DDDDDD;
border-width:0 0 1px 1px;
width:296px;
transition: 0.2s linear;
-o-transition: 0.2s linear;
-moz-transition: 0.2s linear;
-webkit-transition: 0.2s linear;
color:#666;
font-family:Calibri,sans-serif;
outline:0;
}

form#kontakt input:focus,
form#kontakt textarea:focus {
border-color:#102831;
background:#F7F7F7;
border-width:0 0 1px 5px;
width:292px;
color:#000;
}

form#kontakt input:hover,
form#kontakt textarea:hover {
border-color:#102831;
}

form#kontakt input[type=submit] {
display:block;
width:410px;
padding:10px;
background:#DDDDDD;
border:0;
transition: 0.2s linear;
-o-transition: 0.2s linear;
-moz-transition: 0.2s linear;
-webkit-transition: 0.2s linear;
cursor:pointer;
font-size:18px;
outline:0;
}

form#kontakt input[type=submit]:hover,
form#kontakt input[type=submit]:focus {
background:#102831;
color:#FFF;
}