<!--
/*
########################################
## Autor: Thomas Brunner / skillflow.de
## Copyright: 2017
## Generator: TextPad
########################################
*/

/*-------------------------------------------------------------------
Hier beginnt die Formatirung für alle Elemente nur fuer das Formular
--------------------------------------------------------------------*/
.formDiv{
	border:0px solid red;
	margin-top:-10px;
}

.kopieAnMich{
	border:0px solid red;
	margin-top:10px;	
}

.fehlerAusgabe
{
	border:solid 0px rgb(71,180,3);
	width:95%;
	//min-width:205px;
	padding:5px;
	margin-bottom:10px;
	color:red;
	font-weight:600;
	text-align:center;
}

#rightDivContenten-70{
	-o-border-radius: 5px;
	-ms-border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	margin-top:3px;
	margin-bottom:10px;
	padding-top:15px;
	border:2px solid rgb(71,180,3);
}

.field_set
{
	border:none;
	margin-bottom:10px;
}

legend
{
	padding-bottom:10px;
	font-weight:600;
}

.formBlock, .formBlock-2{
	margin-top:0px; 
	display:inline-block; 
	border:0px solid red;
	width:50%;
	height:30px;
}

.formBlock{
	width:15%;
	height:30px;
}

input.T_Nummer,
input.F_irma,
input.V_Name, 
input.N_Name, 
input.E_Mail{
	width:100%;
	height:28px;
}

.area
{
	width:65.5%;
	height:150px;
	resize: none;
}

.input_senden, 
.input_reset
{
	width:80px;
	font-weight:500;
	margin-top:8px;
}

.input_senden:hover, 
.input_reset:hover
{
	color:white;
	background: -moz-linear-gradient(top, rgb(71,180,3) 0%, rgb(100,253,4) 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgb(71,180,3)), color-stop(100%,rgb(100,253,4)));
	background: -webkit-linear-gradient(top, rgb(71,180,3) 0%,rgb(100,253,4) 100%);
	background: -o-linear-gradient(top, rgb(71,180,3) 0%,rgb(100,253,4) 100%);
	background: -ms-linear-gradient(top, rgb(71,180,3) 0%,rgb(100,253,4) 100%);
	background: linear-gradient(top, rgb(71,180,3) 0%,rgb(100,253,4) 100%);	
	opacity:0.65;
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	-o-transition: opacity 1s;
	-ms-transition: opacity 1s;
	transition: opacity 1s;
}

select, input, textarea
{
	-o-border-radius: 5px;
	-ms-border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	border: 1px solid rgb(71,180,3);
	background-color: white;	
}

.fehler
{
	color:red;
	font-weight:600;
}

#rot
{
	color:red;
}

.ergeb
{
	width:30px;
}



/*-------------------------------------------------
Hier beginnt die Bildschirmauflösungsanpassung
-------------------------------------------------*/

@media only screen and (max-width:1231px)
{
	//#leftDivContent-25-auto{font-size:10pt;}
	#rightDivContenten-70, 
	.fehlerAusgabe, 
	.field_set, 
	.formDiv, 
	.formBlock, 
	.formBlock-2, 
	.peantworteFrage, 
	.kopieAnMich{font-size:12pt;}
	.p_impresumm, .p_impresumm_N{font-size:12pt;}
}

@media only screen and (max-width:917px)
{
	.tel{margin-bottom:10px;}
}

@media only screen and (max-width:863px)
{
	#leftDivContent-25-auto{ width:50%; margin-left:-4px; padding-left:13px;}
	#rightDivContenten-70{clear:right !important;}
}

/*-------------------------------------------------
Was passiert bei Auflösung 970 (Tablet-Querformat)
-------------------------------------------------*/
@media only screen and (max-width:970px){
	/*
	body{
		background-image:url(../images/back-1200x620.jpg) !important; 
		background-repeat:repeat-y !important;
		height:2800px;
	}
	*/
	#rightDivContenten-70, 
	.fehlerAusgabe, 
	.field_set, 
	.formDiv, 
	.formBlock, 
	.formBlock-2, 
	.peantworteFrage, 
	.kopieAnMich{font-size:10pt;}
	.p_impresumm, .p_impresumm_N{font-size:10pt;}	
	#leftDivContent-25-auto, #leftDivContent-25-auto p, .anschriftTel, .tel{font-size:10pt;}
}


/*-------------------------------------------------
Was passiert bei Auflösung 620 (Tablet-Querformat)
-------------------------------------------------*/
@media only screen and (max-width:619px){
	/*
	body{
		background-image:url(../images/back-600x1200.jpg) !important; 
		background-repeat:repeat-y !important;
		
		/*Folgendes muss man machen sonst haut das mit dem Hintergrundbild nicht wirklich hin*/ 
		height:1800px;
	}
	*/
}


@media only screen and (max-width:615px)
{
	#leftDivContent-25-auto{ width:50%; padding-left:12px;}
	#footer, #leftDivContent-25-auto, .p_impresumm, .p_impresumm_N{font-size:10pt;}
	
}

@media only screen and (max-width:580px)
{
	.meineAnschrift{display:none;}
	.meineAnschrift_2{display:block;}
}

@media only screen and (max-width:510px)
{
	#leftDivContent-25-auto, #leftDivContent-25-auto p, .anschriftTel, .tel{font-size:10pt;}
	#leftDivContent-25-auto{width:70%;}
	.formBlock, .formBlock-2{display:block; width:90%;}
	.area{width:90%;}
}

@media only screen and (max-width:480px)
{
	#leftDivContent-25-auto, .anschriftTel, .tel{font-size:10pt;}
	#leftDivContent-25-auto{width:95%; margin-left:-4px;}
}

/*-----------------------------------------------------
iPhone Querformat - Auflösung 480px
-----------------------------------------------------*/
@media only screen and (max-width:479px){
	
	/*
	body{
		background-image:url(../images/back-350x700.jpg) !important;
		background-repeat:repeat-y !important;
		//Folgendes muss man machen sonst haut das mit dem Hintergrundbild nicht wirklich hin
		height:1800px;
	}
	*/
}

@media only screen and (max-width:320px)
{
	#leftDivContent-25-auto{width:93.5%;}
}

-->