/* Start Kontaktformular Fahne */
form div.dynamiclabel{ 
display: block;
margin: 10px;
font: 15px;
letter-spacing: 0.5px;
position: relative;
}


form div.dynamiclabel input[type="text"], form div.dynamiclabel textarea{
width: 400px;
padding: 10px;
border: 1px solid #c3c3c3;
border-radius: 0px;
}

form div.dynamiclabel textarea{
height: 170px;
}


form div.dynamiclabel label{ /* pop up label style */
position: absolute;
left: 0;
background: white;
border: 1px solid rgb(196, 196, 196);
border-radius: 0px;
padding: 3px 10px;
box-shadow: 3px 2px 3px gray;
font-weight: bold;
-webkit-backface-visibility: hidden;
top: 8px; /* initial top position of label relative to dynamiclabel container */
-moz-transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
-webkit-transition: all 0.4s ease-in-out; /* Safari doesn't seem to support cubic-bezier values beyond 0 to 1, so use keyword value instead */
-o-transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
opacity: 0;
z-index: -1;
}


form div.dynamiclabel > *:focus{ /* when user focuses on child element inside div.dynamiclabel */
box-shadow: 0 0 1px 1px #ebe9e9;
}


form div.dynamiclabel > *:focus + label{ /* label style when user focuses on child element inside div.dynamiclabel */
opacity: 1;
color: #963d40;
z-index:100;
left: -5px;
top: -36px; /* Post top position of label on focus relative to dynamiclabel container */
-ms-transform: rotate(-3deg);
-moz-transform: rotate(-3deg);
-webkit-transform: rotate(-3deg);
transform: rotate(-3deg);
}

/* Ende Kontaktformular Fahne */

/* Start Button für Kontaktformular */
.sub_kontakt {
    position: absolute;
    top: 380px;
    left: 455px;
    background: white;
    color: #7b7b7b;
    text-decoration: none;
    font: bold 14px Arial; /* font size and style */
    border-radius: 35px; /* border radius of button */
    width: 35px; /* dimensions of button */
    height: 35px;
    outline: none;
    box-shadow: 0 6px 0 #8d8d8d, /* depth and color of main shadow */
        0 0 3px rgba(0,0,0, 0.2),
        0 10px 10px #eee;
    -moz-transition: all 0.2s ease-in-out; /* transition style and duration */
    -o-transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.sub_kontakt:hover {
    background: #b4b4b4; /* background color when mouse rolls over button */
    box-shadow:  none;
    cursor: pointer;
    -ms-transform: translateY(8px); /* shift button downwards by shadow depth amount */
    -webkit-transform: translate3D(0, 8px, 0);
    -moz-transform: translateY(8px);
    transform: translate3D(0, 8px, 0);
}

/* Ende Button für Kontaktformular */