/*--------------- FORMS: Panel Forms ----------------

INSTRUCTIONS:
1. Make sure you change the width of the Panel_Form_Box and apply to correct places
2. Background and Main Border is located on Panel_Form_Box
3. Make sure to change input border color
4. Do not change input padding or border size
5. Width instructions are located on certain elements

---------------------------------------------------*/

.panel_form_box { width:504px; padding:0; margin:0; font-family:Arial, Helvetica, sans-serif; color:#000; }
#main .panel_form_box li, #main .panel_form_box ul{margin: 0;padding:0;}


#main .panel_form_box h2 { font-size: 1.2em; width:100%; padding-bottom:6px; border-bottom: 8px solid #DDD; text-transform:uppercase; color:#000; margin-bottom:6px; margin-top:2px; }
#main .panel_form_box h3 { font-size: 1em; width:100%; padding-bottom:6px; border-bottom: 8px solid #DDD; text-transform:uppercase; color:#000; margin-bottom:6px; margin-top:20px; }

ul.panel_form { width:504px; overflow:hidden;  } /* Width must match panel_form_box */
ul.panel_form li { float:left; margin:3px 0 0 0; display:inline; }
ul.panel_form li.cards_accepted { float:right; margin:28px 0 0 0; display:inline; }

#main ul.panel_form li label { font-size:1em; text-transform:uppercase; color:#000; font-weight:bold;}

ul.panel_form li input { color:#000; padding:6px 8px; border:1px solid #ccc; }
ul.panel_form li input.text_field_left { width: 229px; margin-right:10px;} /* Width equals UL minus 46px then divided by 2 */
ul.panel_form li input.text_field_right { width: 229px;} /* Width equals UL minus 46px then divided by 2 */
ul.panel_form li input.text_field_full { width: 486px;} /* Width equals UL minus 18px */
ul.panel_form li input.state { width: 136px; margin-right:10px;}
ul.panel_form li input.zip { width: 64px;}
ul.panel_form li input.zip_2 { width: 64px; margin-right:10px;} /* used for enewsletter.php */
ul.panel_form li input.country { width: 164px; } /* used for enewsletter.php */

ul.panel_form li select { color:#000; padding:5px 4px 5px 8px; border:1px solid #ccc;  }
ul.panel_form li select.country { width:274px;} /* the width is different but must match text_field_left */

ul.panel_form li option { padding-right:18px;}

ul.panel_form li textarea { color:#000; border:1px solid #ccc; padding:6px 8px; }
ul.panel_form li textarea.comments { width: 486px;} /* Width equals UL minus 18px */




/*--------------- FORMS: Panel Forms Questions (dontations.php) ---------------*/

ul.panel_form_questions { width:504px; overflow:hidden; } /* Width must match panel_form_box */
ul.panel_form_questions li { float:left; margin:3px 0 0 0; display:inline; overflow:hidden; width:100%;  }

ul.panel_form_questions li span.float_right { float:right; }
ul.panel_form_questions li label {  }
ul.panel_form_questions li input { color:#000; border:1px solid #ccc; padding:6px 8px; }
ul.panel_form_questions li input.dollar { width: 100px; background: #fff url(../images/icon_dollar.gif) 2% 50% no-repeat; padding-left:21px; }
ul.panel_form_questions li input.ccn { width: 200px;}
ul.panel_form_questions li input.two_digits { width: 20px;}

ul.panel_form_questions li select { color:#000; padding:4px 4px 4px 8px; border:1px solid #ccc;  }
ul.panel_form_questions li select.fixed { width: 170px; color:#000; padding:4px 4px 4px 8px; border:1px solid #ccc;  }
ul.panel_form_questions li select.tocc { width:148px;} /* the width is different  */

ul.panel_form_questions li option { padding-right:18px;}

ul.panel_form_questions li textarea { border:1px solid #918b7b; color:#4a4a4a; padding:6px 8px; }
ul.panel_form_questions li textarea.comments { width: 504px;}

.radio { border:0; padding:0; }

/*--------------- FORMS: Verification ---------------*/

ul.verification { width:504px; overflow:hidden; padding-top:6px; border-top: 8px solid #DDD; margin-top:12px; color:#000; } /* Width must match panel_form_box */
ul.verification li { float:left; margin:3px 0 0 0; display:inline; }
ul.verification li img { margin-top:6px; margin-right:6px; }
ul.verification li label { font-size:1em; text-transform:uppercase; font-weight:bold;}
ul.verification li input { color:#000; border:1px solid #ccc; padding:4px 8px; }
ul.verification li input.ver_code { width: 64px;}

ul.verification li.submit { margin-right:0; float:right; }
ul.verification li input.btn_submit { border:0; color:#ffffff; }

/*--------------- FORMS: Confirmation ---------------*/

.confirmation_note { width:472px; padding:0 12px; margin-right:0; border:1px solid #aeca61; color:#5baf07; overflow:hidden; text-align:center; background: #e6f7b8 url(../images/icon_check_confirm_small.gif) 2% 50% no-repeat; margin-top:12px;} /* Width must equal panel_form_box minus 26px */
.confirmation_note p { margin: 8px 0;  }