/*
      IT270 - Website Design - Final Project

      Rattlesnake Football Club
      Author: Sean McLaughlin
      Date: 1/12/2016  
   
      Filename: form.css

*/

/* Feild set styles */

fieldset {
   background-color: rgb(105, 96, 87);
   background-color: rgba(32, 96, 63, 0.7);
   border: 3px solid black;
   color: white;
   float: left;
   margin: 10px 0px 10px 2.5%;
   width: 90%;
}

legend {
   background-color: black;
   color: white;
   font-size: 1.3em;
   Height: 30px;
   opacity: 0.6;
   padding: 0px 0px;
   text-indent: 5px;
   width: 100%;
}

/* Label styles */

label {
   clear: left;
   display: block;
   float: left;
   font-size: 1.3em;
   margin: 7px 4% 7px 5px;
   width: 40%;
}

/* Input control styles */

input {
   display: block;
   float: left;
   font-size: 1.3em;
   margin: 7px 0px;
   width: 50%;
}

input#state {
   width: 50px;
}

/* Selection list styles */

select {
   display: block;
   float: left;
   font-size: 0.9em;
   margin: 7px 0px;
}

/* Option button styles */

fieldset.optionGroup {
   border-width: 0px;
}

fieldset.optionGroup label {
   display: inline;
   float: none;
   margin: 0px 3px 0px 0px;
   width: 30px;
}

fieldset.optionGroup input {
   display: inline;
   float: none;
   margin: 0px 20px 0px 0px;
   width: 20px;
}

/* Button styles */

form p {
   text-align: center;
}

input[type="submit"], input[type="reset"], input[type="button"] {
   display: inline;
   float: none;
   height: 40px;
   width: 200px;
}

/* Validation styles */

input:focus, select:focus, textarea:focus {
   background-color: rgb(220, 255, 220);
}

input:focus:valid { 

 background: rgb(255, 255, 220) url(go.png) bottom right no-repeat; 
 -o-background-size: contain; 
 -moz-background-size: contain; 
 -webkit-background-size: contain; 
 background-size: contain; 
}

input:focus:invalid { 

 background: rgb(255, 232, 233) url(stop.png) bottom right no-repeat; 
 -o-background-size: contain; 
 -moz-background-size: contain; 
 -webkit-background-size: contain; 
 background-size: contain; 
}