fieldset {
	margin:20px 0 0 10px;
	padding:0 30px 30px;
	-moz-border-radius:10px 10px 10px 10px;
	-webkit-border-radius:10px 10px 10px 10px;
}

fieldset h2{
	font-size:1.2em;
	font-weight:normal;
	text-align:center;
	padding: 0 0 20px 0;
}

label {
	clear:left;
	color:#000000;
	display:block;
	font:bold 1em arial,verdana,tahoma,sans-serif;
	margin:0 18px 10px 0;
}

label.error{
	color:red;
	display:block;
	font-size:0.9em;
	margin:-24px 0 10px 12px;
	padding-bottom:17px;
}

/* APPLIES THE STYLE TO EACH FORM ELEMENT */
.textfield, .dropdown, .textarea {
	-moz-border-radius:6px;
	-webkit-border-radius:6px;	
	background:none repeat scroll 0 0 #F2F2F2;
	border:1px solid #382D2D;
	color:#666666;
	font:1.1em arial,verdana,tahoma,sans-serif;
	margin:0 0 30px;
	padding:5px 8px;
	width:220px;
	-moz-box-shadow:0 2px 5px #EAD7AD;
	-webkit-box-shadow: 0px 2px 5px #EAD7AD;
	box-shadow: 0px 4px 5px #EAD7AD;
}

/* OPTIONAL SET WIDTH FOR THE SELECT LIST */
.dropdown {
  width: 250px;
}

/* OPTIONAL SET WIDTH FOR THE TEXTAREA */
.textarea {
  width: 410px;
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px; 
}

/* CHANGE THE STYLE WHEN THE FORM ELEMENT IS CLICKED */
input:focus, select:focus, .textarea:focus {
  background: #fff;
  border: 2px solid #DD8A36;
  -moz-box-shadow: 2px 1px 1px #ddd;
  -webkit-box-shadow: 2px 1px 1px #ddd;
  box-shadow: 2px 1px 1px #ddd;
  outline: none;
}

/* THE NAMES FOR EACH OF THE FORM ELEMENT DIVS WHICH AUTOMATICALLY HIDES THE TIPS BY DEFAULT */
div.myName p.hint, div.myEmail p.hint, div.myComments p.hint, div.sendTip p.hint {
  display: none;
}  

/* WHEN EACH DIV IS HOVERED, THE TIP IS DISPLAYED */
div.myName:hover > p.hint, div.myEmail:hover > p.hint, div.myComments:hover > p.hint, div.sendTip:hover > p.hint  {
  position: absolute;
  display: block;
  font: bold 0.8em arial,verdana,tahoma,sans-serif;
  text-shadow: none;
  color: #000;
  margin: 0 0 0 265px;
  padding: 10px 15px;
  background: #f9dda1;
  border: 1px solid #000;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;   
  -moz-box-shadow: 4px 4px 4px #ddd;
  -webkit-box-shadow: 4px 4px 4px #ddd;
  box-shadow: 4px 4px 4px #ddd;  
}

/* CHANGES THE LEFT MARGIN ON THE TEXTAREA TIP, FOR BALANCE */
div.myComments:hover > p.hint {
  margin: 2px 0 0 350px;
}

/* CHANGES THE LEFT MARGIN ON THE SUBMIT BUTTON TIP, FOR BALANCE */
div.sendTip:hover > p.hint {
  margin: 2px 0 0 150px;
}

.btn {
  display: block;
  font: bold 1.1em arial,verdana,tahoma,sans-serif;
  color: #000;
  text-decoration: none;
  margin: 0;
  padding: 9px 11px 8px 11px;
  background: #f2f2f2 url(../img/submit-backgr.png) repeat-x;
  border: 2px solid #d0d0d0;
  -moz-border-radius: 20px;
  -webkit-border-radius: 20px;
  border-radius: 20px;  
  -moz-box-shadow: 4px 4px 4px #ddd;
  -webkit-box-shadow: 4px 4px 4px #ddd;
  box-shadow: 4px 4px 4px #ddd;  
}

.btn:hover, .btn:focus {
  color: #DD8A36;
  background: #f2f2f2 url(../img/submit-hover-backgr.png) repeat-x; 
  border: 2px solid #888;
  -moz-box-shadow: 2px 2px 2px #ddd;
  -webkit-box-shadow: 2px 2px 2px #ddd;
  box-shadow: 2px 2px 2px #ddd;  
}
