/*
   New Perspectives on HTML and CSS
   Tutorial 6
   Case Problem 4

   Miilinnium Computers Style Sheet
   Author: Roger Martineau
   Date:  01 May 2016

   Filename:         oform.css
   Supporting Files: 

*/
/*Field set styles*/
fieldset.custInfo {
   background-color: rgb(255, 246, 205);
   border: 1px solid rgb(233, 69, 0);
   float: left;
   display: block;
   width: 46%;
   height: 20%;
   margin: 10px 0px 10px 2.5%;
}
fieldset.leader {
   background-color: rgb(255, 246, 205);
   border: 1px solid rgb(233, 69, 0);
   float: right;
   display: block;
   width: 46%;
   height: 20%;
   margin: 10px 0px 10px 2.5%;
}
fieldset.warranty {
   background-color: rgb(255, 246, 205);
   border: 1px solid rgb(233, 69, 0);
   float: left;
   display: block;
   width: 46%;
   height: 20%;
   margin: 10px 0px 10px 2.5%;
}
fieldset.comment {
   background-color: rgb(255, 246, 205);
   border: 1px solid rgb(233, 69, 0);
   float: right;
   display: block;
   width: 46%;
   height: 20%;
   margin: 10px 0px 10px 2.5%;
}

/*Field set legend style*/   
legend {
   background-color: lightseagreen;
   color: black;
   padding: 3px 0px;
   font-size: 0.9em;
   text-indent: 5px;
   width: 100%;
}

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

/*Input control styles*/
input {
   display: block;
   float: left;
   font-size: 0.9em;
   width: 50%;
   margin: 7px 0px;
}

input#state {
    width: 50px;    
}

/*selection list styles */
select {
   display: block;
   float: left;
   font-size: 0.9em;
   margin: 7px 0px; 
}
/*Option button styles*/
fieldset.leader {
    border-width: 0px;    
}
fieldset.leader label {
    display: inline;
    float: none;
    margin: 0px 3px 0px 0px;
    width: 30px;
}
fieldset.leader input {
    display: inline;
    float: none;
    margin: 0px 20px 0px 0px;
    width: 20px;
}
/*Text area styles*/
textarea{ 
    display: block;
    font-size: 0.9em;
    float: left;
    height: 150px;
    width: 50%;
    margin: 10px 0px;
}
/*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 style*/
input:focus, select:focus, textarea:focus {
    background-color: rgb(220, 255, 220);
}
input:focus:valid {
    background: rgb(220, 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:valid {
    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;
}