﻿@charset "utf-8";
/* CSS Document */


/*-----------------------------------------------------------------------------------*/
/*	Kontaktformular
/*-----------------------------------------------------------------------------------*/

/* Wrapper --------------------------------------------------------------------------*/
* {box-sizing: border-box;}

.column {
	float:left;
	width:50%;
    padding:0 20px 0 0; /* bei media auf "0" setzen */
	margin:0;
	}
.row:after {/* Clear floats after the columns */
	content:"";
	display:table;
	clear:both;
}

/* Formular -------------------------------------------------------------------------*/
.form {width:100%;
	margin:0;
	margin-top:1em;
	padding:0;							/*bei media verändern*/
	font-size:0.9em;
	line-height:1.2em;
	word-spacing:0.05em;
	letter-spacing:0.05em;
	}
.form h3 {font-weight:400;text-align:left;line-height:1.2em;
	font-style:normal;
	color:#BF9974;
	margin:0px;
	padding:0px;
	margin-bottom:10px;
	} 
.form h4 {font-weight:300;
	font-style:normal;
	color:#BF9974;
	margin:0px;
	padding:0px;
	margin-bottom:10px;
} 


/* -----------------------------------
Radio-Buttons und Checkboxen gestalten
------------------------------------*/

input {/* remove standard-styles */
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
	border:none;
	border-radius:0;
	width:100%
} 

/* graceful degradation for ie8 */
input[type='checkbox'],
input[type='radio'] {
	width:auto;
	float:left;
	margin-right:.75em;
	background:transparent;
	border:none;
}

input[type='checkbox']:checked,
input[type='checkbox']:not(:checked),
input[type='radio']:checked,
input[type='radio']:not(:checked) {
	position:relative;
	opacity:0;
	margin-top:5px;
	padding:0;
}

input[type='checkbox'] + label,
input[type='radio'] + label {
	cursor:pointer;
}

input[type='checkbox']:checked + label::before,
input[type='checkbox']:not(:checked) + label::before,
input[type='radio']:checked + label::before,
input[type='radio']:not(:checked) + label::before {
    content:' ';
    display:inline-block;
    width:17px;
    height:17px;
    position:relative;
    top:1px;
    border:1px solid #205775;
    background:white;
    margin-right:1em;
    box-shadow:inset 0 1px 1px 0 rgba(0,0,0,.1);
}

input[type=radio]:checked + label::before,
input[type=radio]:not(:checked) + label::before {
	border-radius:30px;
}

input[type='checkbox']:hover  + label::before,
input[type='radio']:hover  + label::before {
	background:#F8C049;
	box-shadow:inset 0 0 0 1px white;
}

input[type='checkbox']:checked  + label::before,
input[type='radio']:checked  + label::before {
	background:#D44833;
	box-shadow:inset 0 0 0 1px white;
}


/* -----------------------------------
Sendebutton, Textbereich, Label
------------------------------------*/
input[type=submit] { /* Sendebutton */
	width:100%;
	margin-top:1em;
	background:#ABDCED;
	padding-top:1em;

	text-transform:uppercase;
	font-size:1.9em;
	color:#D44833;
	word-spacing:0.05em;
	letter-spacing:0.05em;
	font-weight:600;
	font-style:normal;
	font-family: 'Yanone Kaffeesatz', sans-serif;
} 

label { /* Checkbox, Radiobutton */
	color:#BF9974;
	margin:0;
	display:inline-block;
	cursor:pointer;
} 

textarea { /* Nachrichtenfeld */
	font-weight:400;
	font-style:normal;
	font-family: 'Yanone Kaffeesatz', sans-serif;
	height:16.35em;
} 

input, textarea, select { /* Eingabefelder: basic */
	border-radius:0;
	font-size:1.0em;
	color:#D44833; 
	background:#ffffff;
	width:100%;
	/*max-width:360px;*/
	margin:1.5; /*?????? noch prüfen*/
	padding:.75em; /* Eingabefelder: innerer Textabstand nach oben/unten */
}

.field {margin-bottom:1em;} /* Eingabefelder: Abstand nach unten */


/* -----------------------------------
Eingabefelder: Effekte
------------------------------------*/
input[type=text], input[type=submit], textarea, select { /* Eingabefelder: Rahmen */
	-webkit-transition:all 0.30s ease-in-out;
	-moz-transition:all 0.30s ease-in-out;
	-ms-transition:all 0.30s ease-in-out;
	-o-transition:all 0.30s ease-in-out;
	outline:none;
	border:.05em solid #205775;}

input[type=text]:focus, input[type=submit]:focus, textarea:focus, select:focus { /* Eingabefelder-Rahmen: anklicken */
	box-shadow:0 0 5px rgba(248, 192, 73, 1);
	border:1px solid rgba(32, 87, 117, 1);}

input[type=submit]:hover, input:hover, textarea:hover, select:hover { /* Eingabefelder: hovereffekt */
	background:#F8C049;}


/* -----------------------------------
Eingabefelder: Check Spam
------------------------------------*/
.weg {display:none;}/* Versteckte Eingabefelder */
