﻿/****************************************************************************************
 Quick Values modified Grid.css (from MVC/JQuery library?)
****************************************************************************************/
 /****************************************************************************************
 Basic Grid style
 ****************************************************************************************/
.qv-grid { clear:both; border-spacing: 0px; border-collapse: collapse;width:100%; }
.qv-grid thead th { border-top: solid 1px #BCBCBC; border-right: solid 1px #BCBCBC; border-left: solid 1px #BCBCBC; border-bottom: solid 1px #BCBCBC; background-color: #0058a0; height: 25px; padding-left:10px; text-align: left; vertical-align:middle; color:White; }
.qv-grid tbody td { background-color: White; border-right: solid 1px #BCBCBC; border-left: solid 1px #BCBCBC; border-bottom: solid 1px #BCBCBC; text-align: left; padding: 3px 5px 2px 10px; vertical-align:bottom; color: #636363; }
.qv-grid tfoot th { padding: 5px 5px 5px 10px; border-top: solid 1px #BCBCBC; border-right: solid 1px #BCBCBC; border-left: solid 1px #BCBCBC; border-bottom: solid 1px #BCBCBC; text-align:left; vertical-align:middle; }
.qv-grid tbody td.number div { width:40px;text-align:right;}

/** For a note above and about the grid **/
.qv-grid-note { font-size:12px; padding:10px 0px 10px 0px; }
.qv-grid-note em { font-weight:bold;}

 /****************************************************************************************
 Search styles
 ****************************************************************************************/
.qv-grid-search-init { color: #999; font-family: Arial; font-size: 11px; width: 229px; }
.qv-grid-search-init-small { color: #999; font-family: Arial; font-size: 11px; width: 160px; }
.qv-grid-search-init-smaller { color: #999; font-family: Arial; font-size: 11px; width: 75px; }
.qv-grid-search-focus { color: Black; font-family: Arial; font-size: 11px; width: 229px; }
.qv-grid-search-focus-small { color: Black; font-family: Arial; font-size: 11px; width: 160px; }
.qv-grid-search-focus-smaller { color: Black; font-family: Arial; font-size: 11px; width: 75px; }
.qv-grid-search-hidden { visibility: hidden; width:65px; }
.qv-grid-search-gridrow { color: #636363; vertical-align:bottom; }
.qv-grid-search-gridrow:hover { color: Black; }
.qv-grid-search-init-smallest { color: #999; font-family: Arial; font-size: 11px; width: 65px; }
 /****************************************************************************************
 Widths of table columns
 ****************************************************************************************/
 /****************************************************************************************
 QV Specific Widths
 ****************************************************************************************/
.qv-grid-width-date-range { width:145px; }
.qv-grid-width-new-or-used { width:55px; }
.qv-grid-width-vehicle-description { width:350px; }
.qv-grid-width-valuation-reference { width:200px; }
.qv-grid-width-number { width:30px; }
.qv-grid-width-date-and-time { width:145px; }
.qv-grid-width-user-name { width:185px; }
.qv-grid-width-valuation-status { width:145px; }
 /****************************************************************************************
 Generic Widths
 ****************************************************************************************/
.qv-grid-width-smallest { width:20px; }
.qv-grid-width-smaller { width:45px; }
.qv-grid-width-small { width:95px; }
.qv-grid-width-standard { width:160px; }
.qv-grid-width-big { width:200px; }
.qv-grid-width-bigger { width:400px; }
.qv-grid-width-bigest { width:100%; }
 
 /****************************************************************************************
 These classes appear to be assigned by javascript classes so Keith didn't
 want to touch the names just yet. Optimally we will rename to follow convention
 ****************************************************************************************/
.dataTables_wrapper { position: relative; clear: both; padding-top:10px; }
.dataTables_processing { position: absolute; top: 20px; left: 50%; width: 250px; text-align: center; color: #999; font-size: 11px; }
.dataTables_paginate { width:100%; text-align:center; color:#0071ca; font-size: 12px; padding-top: 3px; padding-bottom: 3px; }
.dataTables_filter { float: left; font-family: Arial; font-size: 12px; margin: 2px 0px 2px 0px; }
.dataTables_info { clear: both; float: left; font-size: 12px; padding-top:7px; }
.dataTables_length { font-size: 11px; float: right; padding-right: 10px; padding-bottom:5px; }
 /****************************************************************************************
 Sorting Styles
 ****************************************************************************************/
 tr td.sorting_1 { background-color: #E2EAF7; }
 thead th.sorting_asc { background-color: #0058a0; }
 thead th.sorting_desc { background-color: #0058a0; }
 /****************************************************************************************
 Paging Styles
 ****************************************************************************************/
 
 .paginate_button { padding: 2px 5px; cursor : pointer; background-color:White; }
 .paginate_active { color: #636363; padding: 2px 5px; background-color:White; }
.qvi-grid-top-panel { width:100%; margin-bottom:15px; }

 /****************************************************************************************
 Optimally we will refactor below
 ****************************************************************************************/
.bottom { padding-top:15px; /*border-top: solid 1px #BCBCBC; */}
.gridrow , .gridrow_alternate { color: #636363; min-height: 50px; }
table tfoot th { padding: 10px 10px; background: url("/images/DoubleRuleGraphic.jpg") repeat-x top; font-weight: bold; }
.refreshprofile { float: right; margin-right: 10px; margin-top: 0px; position: relative; }
 /****************************************************************************************
 Easy Read Grid style
 ****************************************************************************************/
.qv-grid-easy-read { border:1px solid #8FAECA; padding:3px 3px 3px 3px; margin-bottom:20px; }
.qv-content-half-page > .qv-grid-easy-read{ margin-left:20px; }
.qv-grid-easy-read table { border:0; width:100%; border-collapse:separate; }
.qv-grid-easy-read thead tr { background-color:#0071ca; }
.qv-grid-easy-read thead th { padding:4px 10px 4px 40px; background-color:#E7E7E7; height:35px; vertical-align:middle;font-weight:bold;text-align:left; }
.qv-grid-easy-read tbody td { padding:4px 10px 4px 40px; height:35px; vertical-align:middle; }
.qv-grid-easy-read tbody td[class~="alternate"] { background-color:#E7E7E7; }
.qv-grid-easy-read tbody tr[class~="alternate"] { background-color:#E7E7E7; }
.qv-grid-easy-read tbody td input[type="radio"] { padding-left:15px; }

 /****************************************************************************************
 PurchaseSummary Grid
 ****************************************************************************************/
 
.qv-grid-purchase-summary.grey
{
    background-color:#E7E7E7;
    border:1px solid #8FAECA; 
    padding:3px 3px 3px 3px;
}
.qv-grid-purchase-summary { margin-bottom:20px; margin-top:15px; }
.qv-grid-purchase-summary table { border:0; border-collapse:separate;width:100%; }
.qv-grid-purchase-summary thead tr {  }
.qv-grid-purchase-summary thead th { padding:5px 10px 5px 10px;vertical-align:middle;font-weight:bold;text-align:left;white-space:nowrap; }
.qv-grid-purchase-summary tbody td { padding:5px 10px 5px 10px; vertical-align:middle; }
.qv-grid-purchase-summary tbody td[class~="alternate"] {  }
.qv-grid-purchase-summary tbody tr[class~="alternate"] {  }
.qv-grid-purchase-summary tbody td input[type="radio"] { padding-left:15px; }
.qv-grid-purchase-summary tbody td[class~="total-price"] { border-top:1px solid #8FAECA; }

 /****************************************************************************************
 Specific Easy Read Grid styles
 ****************************************************************************************/
.qv-grid-purchase-credits { width:360px; margin-bottom:20px; }
 /****************************************************************************************
 Options Checkboxes Grid style
 ****************************************************************************************/
.qv-grid-options-checkbox { font-size:11px; }
.qv-grid-options-checkbox tr { vertical-align:top; }
.qv-grid-options-checkbox td { padding:15px 15px 15px 15px; width:33%; }
.qv-grid-options-checkbox label { line-height:13px;padding-bottom:5px; }
.qv-grid-options-checkbox input[type="checkbox"] { clear:both;margin:0px 5px 6px 0px;padding:0; }

 /****************************************************************************************
 Configure Vehicle Options style
 ****************************************************************************************/
.qv-grid-configure-new-options { margin-bottom:15px; }
.qv-grid-configure-new-options table { border:0px none #000000; width:100%;font-size:10px;white-space:normal; }
.qv-grid-configure-new-options thead th { text-align:left;font-weight:normal;padding:5px 5px 5px 5px; }
.qv-grid-configure-new-options tbody td { vertical-align:middle;padding:5px 5px 5px 5px; }
.qv-grid-configure-new-options tbody td[class~="alternate"] { background-color:#E7E7E7; }
.qv-grid-configure-new-options tbody tr[class~="alternate"] { background-color:#E7E7E7; }
.qv-grid-configure-new-options th[class~="value"] { width:75px !Important;text-align:center;padding-left:0px;padding-right:0px}
.qv-grid-configure-new-options th[class~="checkboxanddescription"] { width:208px; }
.qv-grid-configure-new-options th[class~="checkboxanddescription"] strong { font-size:12px;font-weight:bold; }
.qv-grid-configure-new-options th[class~="checkbox"] { width:25px; }
.qv-grid-configure-new-options td[class~="value"] { width:75px !Important;text-align:center;padding-left:0px;padding-right:0px }
.qv-grid-configure-new-options th[class~="checkbox"] strong { font-weight:bold; }
.qv-grid-configure-new-options td[class~="checkbox"] { width:25px !Important; }
.qv-grid-configure-new-options td[class~="description"] { width:183px !Important; }
.qv-grid-configure-new-options td[class~="footer"] { width:433px; padding-top:0px; padding-bottom:0px; }
.qv-grid-configure-new-options div.footer{ padding-bottom:5px; }
.qv-grid-configure-new-options .mod-head { border:1px solid #DFDFDF;height: 27px; padding-top:8px;padding-left:10px;cursor:pointer; }
.qv-grid-configure-new-options .mod-head:hover { border:1px solid #8FAECA; }
.qv-grid-configure-new-options .mod-head h2 {margin-top:4px;padding-left:10px; }
.qv-grid-configure-new-options ul { border:1px solid #DFDFDF;border-top:0;border-collapse:collapse; padding-top:10px; }

/****************************************************************************************
Usage History
 ****************************************************************************************/

.qvi-style-float-left
{
    float:left;
}
.qvi-style-float-left.left-spacing
{
    margin-left:15px;
}
.qvi-style-float-right
{
    float:right;
}
.qvi-style-float-right.left-spacing
{
    margin-left:15px;
}

.qvi-style-padding-vertical-standard { padding-top:.5em;padding-bottom:.3em; }
.qvi-style-padding-vertical-large { padding-top:1em;padding-bottom:.6em; }
.qvi-style-padding-horizontal-standard { padding-left:2em; }

.qvi-style-text-align-right { text-align:right; }
.qvi-style-clear-both { clear:both; }
.qvi-style-cursor-pointer { cursor:pointer; }


a.qvi-style-button
{
    background-color:#0058a0;
    color:#FFFFFF;
    font-weight:bold;
    padding:0px 8px 0px 8px;
    border-width:1px;
    border-style: solid;   
    border-color: #0058A0;
    cursor:pointer;
    height:20px;
    line-height:20px;
    display:inline-block;
}
a:hover.qvi-style-button
{
    background-color:#3C6792;
    color:#E0E0E0;
}

.qvi-input-textbox-date { width:80px; }
.qvi-input-textbox-search { width:150px; }
.qv-input-textbox-checkbox { padding-top:3px;}