/*------------------------------------------------------------------
[Screen Stylesheet]

Project: Dart Appraisal - Appraiser Center
Version: 1.0
Last change:   06/19/09 [creation]
Assigned to:   Karl Kasischke
Primary use:   2 Column Page Layouts
-------------------------------------------------------------------*/



/*------------------------------------------------------------------
[Table of contents]
A. Global Reset

B. Typography

C. Layout
   1. Body 
      1.1. Skip to content / ul#skip
   2. Layout wrapper / div#wrapper
      2.1. Masthead / div#masthead
         2.1.1. Logo / h1.logo
         2.1.2. Utility navigation / ul#utility
      2.2. Middle section / div#middle
         2.2.1. Primary column / div#primeCol
            2.2.1.1. Main content / div#mainContent
         2.2.2. Second column / div#secondCol
            2.2.2.1. Global navigation / div#globalNav
            2.2.2.2. Sidebars / div.sidebar
      2.3. Footer / div#footer   
         2.3.1. Copyright information / p#copy
         2.3.2. Footer navigation / ul#footNav
         

-------------------------------------------------------------------*/



/*------------------------------------------------------------------
[Color codes]

#fff     white          globalNav, subNav, h2, utility
#000     black          text, utility nav background
#a30234  red            utility navigation border, subnav
#fc6     yellow         utility navigation current
#ffe5b8  pale-yellow    navigation h3
#f1e4c8  light-tan      th background
#fff4db  lighter-tan    zebra striping on table rows
#387272  green          content h3
#eee     gray           

-------------------------------------------------------------------*/



/*------------------------------------------------------------------
A. GLOBAL RESET 
-------------------------------------------------------------------*/

body {font: 62.5%/1.3 arial,verdana,geneva,lucida,sans-serif; background: #fff; color: #231f20; margin: 0; padding: 0;}
p, h1, h2, h3, h4, h5, h6, /*fieldset,*/ form, label, input, textarea, select, /*legend, dl, dt, dd,*/ table, caption, th, td, blockquote, cite {margin: 0; padding: 0; font-size: 1em;}
ul, ol, li, ul *, ol *  {font-size: 1em;}

input, textarea, select {font-family: arial,verdana,geneva,lucida,sans-serif; font-size: inherit;}
textarea {overflow: auto;}
/*fieldset {border: solid 0 transparent;}*/
table {border-collapse: collapse;}
img {border: 0;}
acronym, abbr {border-bottom: 1px dotted; cursor: help;}
cite {font-style: normal;}
#globalNav :focus, #subNav :focus, .logo :focus, .header :focus {outline: 0;}

.nav, .nav ul {margin: 0; padding: 0; list-style: none;}
.clear {clear: both;}
.clear-l {clear: left;}
.clear-r {clear: right;}
.left {float: left; display: inline;}
.right {float: right; display: inline;}
.center {text-align: center;}
.block {display: block;}
.alpha {list-style: upper-alpha;}
.inline {display: inline;}
#mainContent hr {color: #387272; background-color: #387272; height: 1px; border: none; margin: 1.5em -20px;}


/*------------------------------------------------------------------
B. TYPOGRAPHY  
-------------------------------------------------------------------*/
strong, a, #footNav .current a, .highlight, #control label {font-weight: bold;}
.highlight {color: #a30234;}
span.highlight {font-weight: normal;}
a, #footNav .current a, #utility a, #globalNav a {color: #069; text-decoration: none;}
a:hover, a:focus {text-decoration: underline;}
#utility a, #globalNav li a, input.accept, input.decline {color: #fff;}
#utility .current a, #utility a:hover, #utility a:focus {color: #fc6;}
#footNav a {color: #231f20; font-weight: normal;}
.sidebar h3, #globalNav .current a, #globalNav li a:hover {color: #a30234;}
#globalNav h3 a {color: #ffe5b8;}
#mainContent h3, #control label {color: #387272;}
h1 {font-size: 1.7em;}
h2, #globalNav li a {font-size: 1.5em;}
h3, #mainContent, #utility a, .sidebar, #control label {font-size: 1.3em;}
#footer {font-size: 1.2em;}
#globalNav h3 a, .sidebar strong {font-size: 1.15em;}
h4 {font-size: 1.1em;}
h5 {font-size: 1.0em;}
h6, th, .uploadOrder td {font-size: 0.9em;}
td {font-size: 0.85em;}
.inner td, .inner th {font-size: 100%;}



/*------------------------------------------------------------------
C. LAYOUT 
-------------------------------------------------------------------*/

/* 1. Body */
body {background: #fff url(../images/appraiser-body-bg.gif) repeat-x top;}

   /* 1.1. Skip to content / ul#skip */
   #skip {position: absolute; top: -1000px;}

/* 2. Layout wrapper / div#wrapper */
#wrapper {margin: 0 auto; width: 950px;}

   /* 2.1. Masthead / div#masthead */
   #masthead {height: 165px; position: relative; background: url(../images/appraiser-masthead-bg.png) no-repeat right top;}

      /* 2.1.1. Logo / h1.logo */
      h1 {width: 279px; height: 122px; background: url(../images/appraiser-logo.png) no-repeat; text-indent: -9000px; z-index:3; margin-left: 14px;}
      h1 a {display: block; width: 279px; height: 122px;}

      /* 2.1.2. Utility navigation / ul#utility */
      #utility {background: #000; text-align: right; padding-right: 4em; height: 2.6em; line-height: 2.6em;}
      #utility li {display: inline; padding-left: 2em; margin-left: 2em; border-left: 1px solid #a30234;} 
      #utility li:first-child {border: 0;}
      #utility a {background: #000; line-height: 1.3;}
      

   /* 2.2. Middle section / div#middle */     
   #middle {overflow: hidden; width: 950px; clear: both; padding-top: 20px;}
   img.right {margin: 0 0 8px 10px;}
   img.left {margin: 0 10px 8px 0;}
   #middle p {margin-bottom: 1.5em;}

      /* 2.2.1. Primary column / div#primeCol */
      #primeCol {float: right; display: inline; width: 694px;}
      .oneCol #primeCol {float: none; width: 100%;}

         /* 2.2.1.1. Main content / div#mainContent */
         #mainContent {padding: 0 20px;}
         #mainContent h2 {margin: 0 -20px 20px; border-bottom: 2px solid #e2e2e2; padding: 0 20px 10px;}
         #mainContent p, #mainContent ul, #mainContent ol {margin-bottom: 1.5em;}
         #mainContent ul {margin-top: 0;}
		   #mainContent ol ul {margin-top: 0; margin-bottom:0;}
         
         .shading {margin: 1.5em -20px;/* background: #eee; padding: 5px; */}
         /*.shading,*/th, td {border: 1px solid #d0d0d0; vertical-align: top;}
         table {background: #fff; width: 100%;}
         th, td {padding: 12px 5px;}
         th {text-align: left; background: #f1e4c8;}
         #mainContent td p {margin: 1em 0 0;}
		.signupLabels {font-size: 1.2em; font-weight: bold;}
         tr.alt {background: #fff4db;}
         input.accept, input.decline {display: block; text-align: center; margin-bottom: 1em; font-weight: bold; width: 100%; cursor: pointer;}
         input.accept {background: #690; border: 0;}
         input.decline {background: #c00; border: 0;}
         table textarea {width: 99%; padding: 5px 0;}
         #mainContent input:focus, #mainContent textarea:focus, #mainContent select:focus {background: #ffc;}
         #mainContent input[type="text"], #mainContent textarea, #mainContent select {border: 2px solid #999; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;}
         table.completedOrder {margin-top: 2em;}
         table.completedOrder:first-child {margin:0;}
         .inner {width: 100%;}
         .inner td {border: 0; padding: 5px; border-bottom: 1px solid #f1e4c8;}
         td.commentText {width: 80%;}
         td.commentTime {width: 20%; text-align: right;}        
         #infoBar {width: 100%; overflow: hidden;}
         #infoBar h3 {float: left; margin-top: 2px;}
         #control {float: right;}
         #control input {width: 7em; text-align: center;}
         input#searchBtn {vertical-align: bottom; width: auto;}
         .upload, .view {padding: 5px 0 5px 25px; display: block;}
         .upload {background: url(../images/upload.gif) no-repeat left;}
         .view {background: url(../images/view.gif) no-repeat left;}
         
         p.info {margin-top: 2em; color: #387272;}
         p.info:first-child {margin:0;}
         
         .uploadOrder th {width: 30%; text-align: right; padding-right: 10px;}
         .uploadOrder td {padding-left: 10px;}
         
         table.uploadOrder {margin-top: 1em;}
         table.uploadOrder:first-child {margin-top: 0;}
         .uploadOrder input {vertical-align: top; margin-right: 1em;}

/*		 
         #mainContent form p {margin-bottom: 1em;}
         #mainContent fieldset {margin: 1em 0; padding: 1em;}
         #mainContent legend {font-weight: bold; color: #000;}
         #mainContent label {display: block; float: left; width: 175px; font-weight: bold; text-align: right; margin-right: 1em;}
         #mainContent .titles {}
         #mainContent .titles p {overflow: hidden;}
         #mainContent .titles label {width: 5em;}
         #mainContent input, #mainContent textarea {width: 200px;}
         #mainContent select {min-width: 200px;}
         #mainContent fieldset .long {width: 350px;}
         #mainContent input.radio, #mainContent input.submit, #mainContent input.continue {width: auto;}
         #mainContent input.radio {float: left; margin-right: 1em;}
         #mainContent textarea {height: 100px; overflow: auto;}
         #mainContent textarea#address1 {height: 3em;}
         #mainContent input:focus, #mainContent textarea:focus, #mainContent select:focus {background: #ffc;}
         #mainContent input[type="text"], #mainContent textarea, #mainContent select {border: 2px solid #999; border-bottom: 1px solid #ccc; border-right: 1px solid #ccc;}
         #mainContent .required {font-size: 0.75em; color: #a30234;}
         #mainContent input.submit {margin-left: 190px;}            
         #mainContent fieldset {border: 0; border-bottom: 1px solid #79c142; margin-left: -20px; margin-right: -20px;}
         #mainContent p.zipLookup {position: relative;}
         #mainContent label.lookup {width: auto; float: none; display: inline; margin-left: 2em;}
         #mainContent label.lookup img {vertical-align: middle;}
         #mainContent input.inline, #mainContent select.inline {margin-left: 1em;}
         #mainContent p.inputHeaders label {width: 200px; text-align: left; font-weight: normal;}
         #mainContent p.inputHeaders label.indent {margin-left: 192px; display: inline;}
         #mainContent input#displayedAmount {color: #000;}
         #mainContent p.ccDate select {width: auto; min-width: 0;}
         
         table#lenders {margin-bottom: 1em;}
         table#lenders tr.labels label {color: #3f8647; font-weight: normal; text-align: center; width: auto;}
         table#lenders th, table#lenders td {padding: 0.25em 1em;}
         table#lenders input {width: auto;}
         
         ol#process {margin: -0.5em -20px 2em; padding: 0 20px 0.5em; border-bottom: 2px solid #e2e2e2; font-size: 1.1em; color: #ccc; font-weight: bold; overflow: hidden;}
         ol#process li {float: left; margin-right: 1.5em; list-style-position: inside;}
         * html ol#process {height: 1.25em;}
*/
         
      /* 2.2.2. Second column / div#secondCol */
      #secondCol {float: left; display: inline; width: 240px; margin-right: 16px;}
      .oneCol #secondCol {float: none; display: none;}

            /* 2.2.2.1. Global navigation / div#globalNav */
            #globalNav {background: #a30234; border: 1px solid #000;}
            #globalNav a {display: block;}
            #globalNav h3 {background: #000;}
            #globalNav a {padding: 0.25em 10px;}
            #globalNav li {border-top: 1px solid #000;}
            #globalNav li a {padding-left: 30px; background: url(../images/appraiser-arrow-box.gif) no-repeat 10px 0.5em;}
            #globalNav li a:hover, #globalNav li.current a {background-color: #e3e3e3;}
            * html #globalNav li a {height: 1%;} /* fix for list item spacing and clickable area IE 6*/
            
            /* 2.2.2.2. Sidebars / div.sidebar */
            .sidebar {background: url(../images/title-bg.gif) repeat-x top; margin: 3em 0; padding: 0 8px;}
            .sidebar h3 {border-bottom: 2px solid #e2e2e2; padding: 1em 0 0.5em; margin-bottom: 1em;}
            #secondCol .sidebar:first-child {margin-top: 0;}


   /* 2.3. Footer / div#footer */
   #footer {width: 950px; background: #fff; overflow: hidden; padding: 20px 0; border-top: 2px solid #e2e2e2; margin-top: 3em;}

      /* 2.3.1. Copyright information / p#copy */
      #copy {float: left; display: inline; text-align: center; width: 240px;}

      /* 2.3.2. Footer navigation / ul#footNav */
      #footNav {text-align: center;}
      #footNav li {display: inline; border-left: 1px solid #231f20; margin-left: 1.5em; padding-left: 1.5em;}
      #footNav li:first-child {border: 0; margin: 0; padding: 0;}
