@charset "utf-8";

/*
   New Perspectives on HTML5 and CSS3, 8th Edition
   Tutorial 8
   Coding Challenge 4
   
   Filename: code8-4_styles.css

*/

html {
   background: white;
   font-family: Verdana, Geneva, sans-serif;
}

body {
   margin: 0px auto;
   min-width: 320px;
   max-width: 1100px;  
   padding: 10px;
   width: 100%;
}


h1 {
   color: rgba(51, 51, 51, 0.9);   
   font-size: 2.9em;
   font-family:Baskerville, "Palatino Linotype", Palatino, "Century Schoolbook L", "Times New Roman", serif;
   line-height: 1em;
   margin-top: 30px;
   position: relative;
}

/* Form Layout Styles */

form#payment {
   background-color: rgba(206, 141, 56, 0.1);
   width: 700px;
	position: absolute;
}

fieldset {
   margin-top: 30px;
   border: none;
}

legend {
   background-color: rgb(200, 118, 0);
   color: rgba(255, 255, 255, 0.7);
   font-size: 0.9em;
   border-radius: 10px;
   margin-bottom: 10px;
   padding: 8px;
   width: 100%;
}


/* Input and Label Styles */

label {
   display: block;
   float: left;
   clear: left;
   font-size: 0.9em;
   margin-bottom: 10px;
   margin-right: 10px;
   width: 180px;
   text-align: right;
}

form#payment input, form#payment select {
   display: block;
   float: left;
}

/* Radio Button Styles */

label.cardLabel {
   display: inline-block;
   float: none;
   width: auto;
}

label.cardLabel img {
   border: 1px solid rgb(181, 181, 181);
   box-shadow: rgb(51, 51, 51) 0px 0px 10px;
}

input[type='radio'] {
   width: auto;
   float: none;
   clear: none;
   margin-right: 15px;
}


input#csc {
	margin-left: 10px;
	width: 50px;
}