﻿select,	input, textarea	{	appearance:	none; -webkit-appearance: none; -moz-appearance: none; }	
	*:focus 			{	outline: -webkit-focus-ring-color auto 0; outline: none; }
	*:-moz-focusring 	{	outline: 0; }
	::placeholder	 	{	opacity: 0.00; }
	button	 			{	background-color: transparent; }
	
input[type=radio], 
input[type=checkbox] 	{	display: none; }

	input, textarea		{	width: calc(100.0% - 2.00em); height: 3.00em; padding: 0 1.00em; }
	textarea			{	min-height: 5.00em; padding: 0.50em 1.00em; resize: vertical; }
	select				{	width: 100.0%; height: 3.00em; padding: 0 1.00em; background-image: url('../img/picts/keyboard_arrow_down.svg'); background-repeat: no-repeat; background-position: center right 0.50rem; background-size: 1.25rem; }
	select.semi			{	width: calc(50.00% - 0.25em); }
	select.semi	+ .semi	{	margin-left: 0.50em; }
	
select[name=otr-time]	{	visibility: visible; margin-top: -1px; }

/* Check- + Radio-Boxen */

.check 							{	display: inline-block; }
.check > input + label			{	position: relative; height: 2.00em; padding: 0 2.50em; display: flex; flex: 0 0 auto; flex-flow: row wrap; justify-content: flex-start; align-content: center; align-items: center; text-align: left; }
.check > input + label:before	{	content:''; position: absolute; top: 0; left: 0; display: block; aspect-ratio: 1 / 1; height: 100.0%; background-repeat: no-repeat; background-position: center; background-size: 80.00%; box-shadow: inset 0 0 0 0.25em rgba(230,000,001,1.00); }
		
	.check > input[type=radio] + label:before		{	border-radius: 100.0%; }
	.check > input[type=checkbox] + label::before	{	border-radius: 0; }
		
		.check > input:checked + label:before		{	background-image:  url('../img/picts/check_white.svg'); background-color: rgba(230,000,001,1.00); }
		
/* --- Formular --- */

form		{	position: relative; display: block; width: 100.0%; }
form > div	{	margin-top: 1.00rem; }
		
input[type=checkbox].DSGVO-ok + label					{	position: relative; display: block; min-height: 1.00em; margin-top: 1.00em; padding-left: 1.50em; display: flex; flex-flow: row wrap; justify-content: flex-start; align-content: center; align-items: center; }
input[type=checkbox].DSGVO-ok + label >	a				{	display: inline-block; margin: 0 0.50em; }
input[type=checkbox].DSGVO-ok + label:before			{	content:''; position: absolute; top: 0.35em; left: 0; display: block; width: 1.00em; height: 1.00em; opacity: 0.75; border-radius: 100.0%; background-color: white; box-shadow: 0 0 0 2px rgba(000,000,000,0.60); }
input[type=checkbox].DSGVO-ok:checked + label:before	{	background: url('../img/picts/check_red.svg') no-repeat center white; background-size: 100.0%; opacity: 1.00; }		
		
/* Form Label Group */

.form-label-group						{	position: relative; width: 100.0%; display: flex; flex-flow: row wrap; justify-content: flex-start; align-content: center; align-items: center; }
.form-label-group *						{	transition: all 100ms ease-in-out; }
.form-label-group + .form-label-group,
.form-label-group + select				{	margin-top: 0.50em; }
.form-label-group * ~ label				{	position: absolute; top: 0; left: 0; width: calc(100.0% - 2.00em); height: 3.00em; padding: 0 1.00em; cursor: text; 
											display: flex; flex-flow: row wrap; justify-content: flex-start; align-content: center; align-items: center; transform: scale(1); transform-origin: top right; }

.form-label-group *:not(:placeholder-shown) ~ label,
.form-label-group *:focus ~ label		{	transform: scale(0.75); justify-content: flex-end; }

.form-label-group#input					{	height: 0; margin: 0; padding: 0; border: 0; overflow: hidden;}


/*	=================================
		END
	================================= */
