/* Style Sheet for FORM */
/* Based on 'WALCAM_FORM_STYLE_VERSION', 'xx.yy'        */
#walcam {version:11.10.2;}

:root	{
  --WFbkgrnd:var(--lgreen);;
	--WFtitcolor:var(--dgreen);;
	--WFauxcolor:#666;
	--WFtextcolor:#00f;
}
/* ensure form is below header */
#holder:before {
    display:block;
    content:" ";
    margin-top:-10em;
    height:10em;
    visibility:hidden;
}
#holder	{
	font-family: Arial, Helvetica, sans-serif;
	background-color:var(--WFbkgrnd);
	padding:0.5em;
	border-radius: 0.5em;
	max-width:calc(100% + 1rem);
}
form	{
	background-color:var(--WFbkgrnd);
	margin: 0.2em;
	border-radius: 0.8em;
}
form .inputbox{
    position: relative;
}
form .inputbox input,
form .inputbox textarea,
form .inputbox checkbox,
form .inputbox select	{
	position:relative;
	font-size:1em;
	color:var(--WFtextcolor);
  margin:1.5rem 0;
	max-width:100%;
}
form .inputbox input ~ label,
form .inputbox textarea ~ label,
form .inputbox checkbox ~ label {
    position:absolute;
    top:1.7rem;
	left:0.2em;
    font-size:1.5rem;
	font-weight:600;
    color:#666;
    transition: .2s linear;
	text-transform:capitalize;
}
form .chkbox	{
	position:relative;
	font-size:1.5em;
	color:var(--WFtextcolor);
    margin:1.5rem 0;
	font-weight:700;
}

form .inputbox input:focus ~ label,
form .inputbox input:valid ~ label,
form .inputbox textarea:focus ~ label,
form .inputbox textarea:valid ~ label,
form .inputbox checkbox:focus ~ label,
form .inputbox checkbox:valid ~ label {
    top:-.5rem;
    font-size: 1.7rem;
    color:var(--green);
}

input[type="checkbox"] {
	height:1.5em;
	width:1.5em;
	margin:0 0;
}
form td {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1em;
	font-weight: bold;
	vertical-align: top;
}
.formmsg	{
	width:100%;
    color:#666666;
    border:solid 0.2em #666666;
    background-color:#affaaf;
    text-align:center;
    font-size:2em;
    font-weight:800;
}
.formtit	{
	width: 20%;
	padding:0.4em;
	color:var(--WFtitcolor);
}
.formaux	{
	color:var(--WFauxcolor);
	font-size: 0.9em;
	font-style: italic;
}
#submit	{
  display:inline-block;
  margin-top:1rem;
  padding:.5rem 2rem;
	text-decoration:none;
  font-size: 1.7rem;
	font-weight:600;
	text-align:center;
  color:#fff;
	font-family:Verdana, Arial, sans-serif;
  background:var(--gradient);
	-moz-border-radius:5em;
	-webkit-border-radius:5em;
	-khtml-border-radius:5em;
	-o-border-radius:5em;
  border-radius:5rem;
  box-shadow:0 .5rem 1rem rgba(0,0,0,.1);
  cursor:pointer;
  transition:all .3s linear; 
}
/* Swap Button control */
#clickarea	{
	position:relative;
	width:100%;
}
input #submit {
	position:relative;
	cursor:pointer;
	display:inline-block;
}
#submit:hover	{
	color: white;	
	background-color: #445aa9;
  transform: scale(1.1);
}
input#submit:focus,
input#submit:active {
	color:transparent;
}
#submited	{
	position:absolute;
	left:0;
	top:1.5em;
	width:0px;
	display:inline-block;
	transition-delay:0s;
	transition-duration:0.5s;
	transition-property:width;
	z-index:10;
}
input#submit:active ~ #submited {
	width:16em;
	display:inline-block;
}
/* swap button control end */

.wwwformerr	{
	background-color: #F00;
}
#err	{
	background-color: #F69;
	border: solid 0.3em #f00;
	padding: 1em;
	text-align: left;
	border-radius: 0.5em;
}

/*====== Force portrait into landscape  (Not Requirted for this site)======*/
/*
@media only screen and (max-width:630px) and (orientation:portrait){
  body {
    height: 100vw;
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
    transform: rotate(90deg);
  }
}

@media only screen and (orientation:landscape){
  body {
     -webkit-transform: rotate(0deg);
     -moz-transform: rotate(0deg);
     -o-transform: rotate(0deg);
     -ms-transform: rotate(0deg);
     transform: rotate(0deg);
  }
}
 */
/*===========================================*/