/********************************************************
* Filename:     form.css
* Description:  css-Datei für Online-Formular
* Author:		    Ing. Andreas Gabriel - 2020-10-16
********************************************************/


/****************************************
  Standardelemente
****************************************/

html, body, input, select {
  font-family:'Sansation-Regular',sans-serif;
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
  font-size:20px;
/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
}

body, p, form {
  margin:0;
  padding:0;
	color:#7b7b7b;
  background-color:#fff;
  overflow:hidden;
}

bold, strong, .bold {
  font-family:'Sansation-Bold';
}

a { color:#299926; text-decoration:none; font-family:'Sansation-Bold'; }
a:hover { color:#1c6c1a; }

* { outline:none; }

.little { font-size:80%; line-height:1.3; }
.black { color:#000; }
.clear { clear:both; }


/****************************************
  Formular-Felder
****************************************/
.field { margin-bottom:1rem; float:left; }

input, select {
  padding:.3em .3em .25em .3em;
	color:#000;
	font-family:'Sansation-Bold';
}

input[type=text],
input[type=email],
select {
	border:none;
  border-bottom:1px solid #299926;
	border-radius:3px;
}

select {
	-moz-padding-start:.1em;
	-moz-padding-end:.1em;
	-moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}
select::-ms-expand { display: none; }
select:hover { cursor:pointer; }

option {
  background-color:#F9f9f9;
  padding:2px 4px;
  font-size:70%;
  font-family:Arial, Helvetica, sans-serif;
	width:100%;
}
option.favorites {
	background-color:#ededed;
}

.setwidth input { width:calc(100% - 1.2em); }
.setwidth select { width:calc(100% - .61em); }
.w15 { width:15%; }
.w35 { width:35%; }
.w50 { width:50%; }

input::placeholder {
  font-size:70%;
  font-family:'Sansation-Light';
}

input:focus, select:focus { background-color:#f9f9f9; }
input:focus::placeholder { content:none; }


/*	Text direkt nach Radio-Buttons
****************************************/
input[type=radio] { cursor:pointer; }
input[type=radio] + span { padding-left:.3rem; margin-right:1rem; cursor:pointer; }
input[type=radio]:checked + span  { color:#000; font-family:'Sansation-Bold'; }


/****************************************
  Agreement
****************************************/
input[type=checkbox] { cursor:pointer; }
#agreement { padding-top:1rem; }
#agreement .checkbox,
#agreement .text {
	cursor:pointer;
  float:left;
}
#agreement .checkbox { width:1.5rem; }
#agreement .text { width:calc(100% - 1.5rem); }


/****************************************
  Buttons
****************************************/
#buttons { text-align:right; padding-top:1.2rem; }
#back    { margin-right:1rem; }
input[type=button], input[type=submit] {
  padding:.6em 2em;
  cursor:pointer;
	border:none;
	border-radius:5px;
}
input[type=submit] {
  background-color:#ececec;
  color:#299926;
}
input:hover[type=submit] {
  background-color:#e4e4e4;
  color:#1c6c1a;
}


/****************************************
  Diverses
****************************************/
#checkdata {
	line-height:1.4;
	margin:1rem 0 1.5rem 0;
}
#thanks {
	line-height:1.7;
}


/****************************************
  RESPONSIV DESIGN
****************************************/




/****************************************
  ENDE
****************************************/