// CSS Form
// https://www.mediaevent.de/css/form-input.html
// https://www.w3schools.com/charsets/ref_emoji_smileys.asp 

html, body, p, ul, li, label, input, select {
	font-family: Arial, sans-serif !important;
	font-size: 10px !important;
}

input, select, textarea, button {
	font-size: inherit;
}	

#knopf 
{
    margin: 5px;
    padding: 10px 20px;
    font-size: 18px;
    background: #00f;
    color: #fff;
    border: none;
    border—radius: 5px;
    cursor: pointer;
	font-family: Arial, sans-serif !important;

}

#knopf:hover
{
    background: #00a; 
    transform: scale(1.05);
    box—shadow: 4px 6px rgba(0, 0, 0, 0.1);
}

#zeile
{
	height: 40px;
}



.demoform input[type="text"],
.demoform input[type="email"],
.demoform input[type="search"],
.demoform textarea { 
  width: 100%; min-width: 100%; 
  box-sizing: border-box;
  padding: 4px;
  outline: none;
}

::-moz-color-swatch {
    border-color: blue;
}


::placeholder {
	color:navy;
	opacity:1;
	transition: opacity 1s;
}

:focus::placeholder { opacity:0  }

:placeholder-shown {
	border:1px solid lightgrey;
}

label {display: block; padding: 1ex; font-family: Arial, sans-serif !important; font-size: 13px; }
.flex label { cursor: pointer }

textarea {
   background:url(textarea-background-image.png) top right no-repeat; 
   background-size: 100%;
   border-radius:6px; 
   border:2px solid silver;
   outline: none; 
}

.titel { font-family: Arial, sans-serif !important; font-weight: bold; font-size:16px inherit; }