/* creating my own default tag settings */
.button {cursor: pointer; padding: 4px 10px; *padding: 3px 5px;}
.error-text {color: red;}
.success-text {color: blue;}
.disabled {color: silver;}
.double-arrows {font-family: Arial; font-size: 130%;}
.typeless li {list-style: none;}

.big {font-size: 16px;}
.bold {font-weight: bold;}
.uppercase {text-transform: uppercase;}
.lowercase {text-transform: lowercase;}

.clear {clear: both;}
.center {text-align: center;}

a.hover-underline {text-decoration: none;}
a.hover-underline:hover {text-decoration: underline;}

a.partial-underline {text-decoration: none;}
a.partial-underline > * {text-decoration: underline;}
a.partial-underline > *.double-arrows {text-decoration: none;}

.photo-frame {background-color: white; border: 1px solid #dddddd; padding: 10px;}
.block {display: block;} /* made for img tag */
/* end of creating my own default tag settings */

/* Layouts */
table.form-layout {empty-cells: show; table-layout: fixed; width: 100%;}

table.form-layout > * > tr > th,
table.form-layout > * > tr > td {margin: 0px; padding: 0px; font-family: inherit; vertical-align: top;}

table.form-layout > * > tr > th {font-weight: normal; text-align: left;}
table.form-layout > * > tr > td {text-align: right;}

table.form-layout > caption {padding-bottom: 10px; text-align: center;}
table.form-layout > tfoot > tr > td, table.form-layout > tfoot > tr > th {padding-top: 10px;}
table.form-layout > tbody > tr > td {margin: 0px; padding: 0px; font-family:inherit; vertical-align: top;}
table.form-layout > tbody > tr > th {vertical-align: middle;}
table.form-layout > tbody > tr > th.label-top {padding-top: 10px; vertical-align: top;}

table.form-layout > tbody > tr.required > th {background: transparent url(../images/reusable/req.gif) center right no-repeat; padding-right: 15px;}
input.invalid[type=text] {background-color: #ffffcc; border: 1px solid #ffaaaa;}

table.form-layout > tbody > tr > td > div {margin: 2px 5px; padding-right: 6px;} /* 2px (input padding), 4px (input border) */
table.form-layout > tbody > tr > td > div.left {margin-left: 0px;}
table.form-layout > tbody > tr > td > div.right {margin-right: 0px;}
table.form-layout input[type=text],
table.form-layout textarea {border: 1px solid #9cbed2; color: #555555; font-family: Arial; font-size: 20px; padding: 1px; width: 100%;}
/* End Of Layouts */

/* Test Layouts */
table.test-form-layout {empty-cells: show; table-layout: fixed; width: 100%;}
table.test-form-layout th,
table.test-form-layout td {font-size: 11px; font-weight: normal; margin: 0px; padding: 0px; font-family: inherit; text-align: right; vertical-align: top;}
table.test-form-layout th {line-height: 17px;}
table.test-form-layout td {}
table.test-form-layout caption {padding-bottom: 10px; text-align: center;}
table.test-form-layout th.first {text-align: left;}
table.test-form-layout td label {display: block; font-size: 11px; padding-bottom: 5px; padding-left: 7px; text-align: center;}
table.test-form-layout td div {margin: 0px 5px; padding-right: 7px;} /* 5px (input padding), 2px (input border) */
table.test-form-layout td div.left {margin-left: 0px;}
table.test-form-layout td div.right {margin-right: 0px;}
table.test-form-layout td div input.text,
table.test-form-layout td div textarea {border: 1px solid #9cbed2; font-family: Arial; font-size: 13px; padding: 1px; width: 100%;}
table.test-form-layout td div.select {margin: 0px 5px; padding-right: 3px;}
table.test-form-layout td div select {color: #555555; font-family: Arial; font-size: 13px; *font-size: 11px; *margin-top: 1px; width: 100%;}
.invalid {background-color: #ffffcc; border: 1px solid #ffaaaa;}
/* End of Test Layouts */

/* new form styling */
form.w {font-family: "Lucida Grande", Tahoma, Arial, sans-serif; font-size: 13px;}
form.w ul {float: left; width: 100%;}
form.w li {clear: both; float: left; display: block; margin: 0; padding: 4px 10px 2px 9px; position: relative; width: 100%;}
form.w li.focused {background-color: #fff7c0; position: relative;}

form.w li div, form.w li span {color: #444444; margin: 0 4px 0 0; padding: 0 0 8px;}
form.w li div label, form.w li span label {clear: both; color: #444444; display: block; font-size: 9px; line-height: 9px; margin: 0; padding-top: 6px;}
form.w li span {float: left;}
form.w li span.left {float: left; margin: 0; width: 47%;}
form.w li span.right {float: right; margin: 0; width: 47%;}

/* form.w label.desc {float: left; margin: 2px 15px 0 0; width: 30%;} */

form.w input.small {width: 17%;}
form.w input.medium {width: 35%;}
form.w input.large, form.w textarea.textarea, form.w div.column {width: 100%;}
form.w div.column {float: left;}

form.w p.instruct {margin-left: 5px; width: 24%;}

label.desc {border: medium none; color: #222222; display: block; font-size: 95%; font-weight: bold; line-height: 150%; padding: 0 0 1px;}
input.text {padding: 2px 0;}

input.text, textarea.textarea, .firefox select.select {background: #ffffff url(../images/reusable/fieldbg.gif) repeat-x scroll center top; border-color: #7c7c7c #c3c3c3 #dddddd; border-style: solid; border-width: 1px;}

form.w span.req {color: red !important; float: none; font-weight: bold;}
form.w span.symbol  {font-size: 115%; line-height: 130%;}

p.instruct {background: #f5f5f5 none repeat scroll 0 0; border: 1px solid #cccccc; color: #444444; font-size: 80%; left: 0; line-height: 130%; margin: 0 0 0 8px; padding: 8px 10px 9px; position: absolute; top: 0; visibility: hidden; width: 42%; z-index: 1000;}

form.w li p.instruct {left: 66%; top: 5px;}
form.w li.focused p.instruct, form.w li:hover p.instruct {visibility: visible;}

/* form.w li.buttons div {margin-left: 32%;} */
/* form.w li.buttons input {font-size: 120%; margin-right: 5px; overflow: visible; padding: 0 7px; width: auto;} */

form.w li.error {background-color: #FFDFDF !important; border-bottom: 1px solid #F9B9B2; border-right: 1px solid #F9B9B2; display: block !important;}
form.w li.error label {color: #DF0000 !important;}
form.w p.error {clear: both; color: red; display: block; font-size: 10px; font-weight: bold; margin: -2px 0 5px; /*margin-left: 30%; padding-left: 15px;*/}

.full {width: 100%;}
.left input, .right input, .full input, .left select, .right select, .full select {width: 100%;}
select.select[class] {margin: 0; padding: 1px 0;}

input.checkbox, input.radio {display:block; line-height:1.5em; margin:.6em 0 0 3px; width:13px; height:13px;}
form.w label.choice {font-size:100%; display:block; line-height:1.5em; margin:-1.65em 0 0 25px; padding:.44em 0 .5em 0; color:#222; width:88%;  display:block;}
/* end of form styling */