@charset "utf-8";
/* form.css */

/* * { font-family: "fortschrittbook", Arial, Helvetica, sans-serif;  } */


.form_box  {
	/* font-size:1.3em; 
	color:#1A2633;
	float:left;
	display:block;
	top:250px;;
	/* width:600px;
	z-index:5; */
    overflow-y:hidden;
    overflow-x:hidden;

}



.form_box {
	margin-top:30px;	
}

.form, .form input, .form textarea {
	font-family: "fortschrittbook", Arial, Helvetica, sans-serif !important;
	font-weight:300;
}


.form_headline  {
	/* width:600px; */
	font-family: "fortschrittbook", Arial, Helvetica, sans-serif;
	/*font-style:italic; */
	/* color:#1cdbdb; */
	
	font-size: 1.45em;
	line-height:1.3em;
	letter-spacing:0.01em;
}

p.form_headline {
	margin-bottom:20px;
	}
	

.form input[type="text"],
.form input[type="Name"],
.form input[type="E-Mail"],
.form input[type="Nachricht"],
.form textarea {
	background-color:#fdfcfb;
	border:1px solid;
	border-color:#CCC;
	font-family: "fortschrittbook", Arial, Helvetica, sans-serif;
	font-size:1.5em;
	font-weight:300;
	color:#756B64;
	/* color:#1cdbdb; */
	}
	
.form input[type="text"]:hover, .form textarea:hover,
.form input[type="text"]:focus, .form textarea:focus {
	background-color:#fff;
	border:1px solid;
	border-color:#767D85;
	font-family: "fortschrittbook", Arial, Helvetica, sans-serif;
	font-size:1.5em;
	font-weight:300;
	color:#756B64;
	/* color:#1cdbdb; */
}

.form input[type="text"].fehler, .form textarea.fehler  {
	background-color:#fdfcfb;
	border-color:#e81a2e;
	color:#e81a2e;
	}
	
.form input[type="text"].fehler:hover, .form textarea.fehler:hover {
	border-color:#e81a2e;
	background-color:#FFF;
	color:#e81a2e;
	}

textarea, textarea:focus {
  /* font-family: inherit; */
  font-family: "fortschrittbook", Arial, Helvetica, sans-serif;
}


@media (min-width: 600px)  {
    
    .form input[type="text"]   {
	width:270px;
	height:32px;
	margin-bottom:12px;
	padding-left:5px;
	}
    
    .form textarea  {
        width:350px;
        max-width:400px;
        min-width:265px;
        height:200px;
        max-height:200px;
        min-height:12px;  /* 32 - 2*10  */

        margin-bottom:15px;
        padding:10px 5px;
    }
}

@media (max-width: 599px)  {
    
    .form input[type="text"]   {
	width:250px;
	height:32px;
	margin-bottom:12px;
	padding-left:5px;
	}
    
    .form textarea  {
        width:250px;
        height:140px;
        max-height:200px;
        min-height:12px;  /* 32 - 2*10  */

        margin-bottom:15px;
        padding:10px 5px;
        line-height:1.5em;
    }
}


.form_box .form label  {
	display:block;
	margin-bottom:3px;
	font-size:1em;
	letter-spacing:0.1em;
	text-transform: uppercase;
    color:#777;
}


.form_box .button {
	
	padding:10px 25px;
	margin-right:10px;
	border:none !important;

	background-color:#767D85;
	
	font-size: 1.5em;
	line-height:1.3em;
	letter-spacing:0.02em;
	color:#fff;
	}

.form_box .button:hover {
	cursor:pointer;
	text-decoration:none;
	background-color:#e81a2e;
	/* background-color:#756B64; */
}

.senden {
	float:left;
}
.zurueck  {
 	margin-top:50px;
	margin-left:120px;
}


.fehlerinfo  {
    /* position: absolute; */
    margin-top:10px;
	font-family:  Arial, Helvetica, sans-serif;
	font-size: 1.35em;
	line-height:1.6em;
	letter-spacing:0.02em;
	padding-left:25px;
	color:#F00;
	background-image:url(../images/achtung.png);
	background-repeat:no-repeat;
	background-position:top left;
	background-size:20px;
}
	
.fehlerinfo b  {
	font-family: Arial, Helvetica, sans-serif;
	font-weight:bold;
}

.fehler {
color:#F00;
border-color: #F00;
}

.output  {
	background-color:#222;
	border:1px solid;
	border-color:#222;
	font-family: "asap-regular", Arial, Helvetica, sans-serif;
	font-size:1.35em;
	color:#b9b9b9;
	}

div .output {
    line-height: 2.5em; /* rutscht den Inhalt nach unten */
 
}

.form_box .debug {
font-family:  Arial, Helvetica, sans-serif; 
font-size:1.6em;
color:#eb4692;
}