html {height: 100%;width: 100%;margin: 0px;padding: 0px;}
body{margin: 0px;padding: 0px;width: 100%;font-family: Arial;font-size: 18px;}
a {color: Blue;} 
a:visited{color: Blue;}
a:active{color: Red;}
img{border:0px;}
form{padding: 0px;margin: 0px;}
p{width:auto;padding:0px;margin:0px;overflow:hidden}
.hide{display:none}
.ui-widget-header:hover {background-position: 42% 42%; border-color:black;}

/*upgrade*/
.upgradeimg {position:absolute;top:-20px;left:0px;width:320px;height:480px;z-index:10000000}

/*iScroll*/
#header {position:absolute; z-index:2;top:0; left:0;width:100%;height:50px;padding:0px;}
#wrapper, wrapper {position:absolute; z-index:1;top:50px; bottom:15px; left:0;width:100%;background:#fff;overflow:auto;}
#scroller {position:absolute; z-index:1;-webkit-touch-callout:none;-webkit-tap-highlight-color:rgba(0,0,0,0);width:100%;padding:0;}
#footer {position:absolute; z-index:2;bottom:0; left:0;width:100%;height:14px;background-color:#ccc;padding: 0px;text-align:center;font-size: 10px;line-height:14px;}
#vfooter {position:absolute; z-index:2;bottom:0; left:0;width:100%;height:14px;background-color:#23a5eb;color:White;padding: 0px;text-align:center;font-size: 10px;line-height:14px;}

/*Inputs*/
.ttitle, .title {font-size:12px;text-align:center;margin-top:5px;margin-bottom:5px;padding:5px;background-color:#eee;font-weight:bold}/*ttile for tyres specific*/
.tttitle {font-size:20px;height:34px;line-height:34px;text-align:center;margin-top:5px;margin-bottom:5px;background-color:#cccccc;font-weight:bold;cursor: pointer}
.textbox{font-family: Arial;font-size: 18px;border: 1px solid black;width: 80%;}
.tboxwide{font-size:18px;width:100%;border:0px;margin-left:2px}/*Login*/
.pheading{background:#cccccc;width: auto;font-weight:bold;padding-top: 2px;padding-bottom: 2px;padding-left: 2px;margin: 0px; height:22px;}
.ptitleheading{background:#444444;color: #ffffff;width: auto;font-weight:bold;padding-top: 2px;padding-bottom: 2px;padding-left: 2px;margin: 0px;}
.errtxt{color:red;font-size:14px;font-weight:bold}
.notesarea {font-size: 16px;margin-left:2px;width: 300px;height: 110px;border: 3px solid #cccccc;padding: 5px;font-family: Tahoma, sans-serif;}
/*.notesarea {font-size: 16px;margin-left:2px;width: 300px;height: 120px;border: 3px solid #cccccc;padding: 5px;font-family: Tahoma, sans-serif;}*/
.chars {font-size:10px;margin-left:5px;}

/*Buttons*/
.buttonbox {text-align: center;margin-top: 10px;}
.but{margin: 2px;font-size: 21px;}
.bigbut{font-size: 20px;}
.bigfont{font-size: 21px;}

/*Colours*/
.bggreen{background:#11ff11 !important;}
.bggreenl{background:#d0ffd0 !important;}
.bgred{background:#ff5555 !important;}
.bgredl{background:#ffd7db !important;}
.bgamber{background:#ffcc00 !important;}
.bgamberl{background:#fef5b4 !important;}
.bggreyl{background:#ededed !important;}
.bggrey, .bggray{background-color: #ddd !important;}

/*Option lists*/
.hcul {list-style:none;padding:0;margin:0;width:100%;text-align:left;-webkit-transform:translate3d(0,0,0);background-color:#f3f3f3;}
.hcul li {height:40px;line-height:40px;border-bottom:1px solid #ccc;border-top:1px solid #fff;font-size:20px;padding-left: 10px;cursor: pointer;overflow:hidden; white-space:nowrap;}
.hcul li input[type=text]{float:left;background-color: white;border: 1px solid #999;color: Black;font-size: 20px;margin: 7px 0px 4px 2px;}
/*    Error Page*/
.hcul .hclitext{border-bottom:1px solid #ccc;border-top:1px solid #fff;background-color:#fafafa;font-size:14px;padding: 5px;}
.hcul .hclilabel{height:30px;line-height:30px;border-bottom:1px solid #ccc;border-top:1px solid #fff;background-color:#f3f3f3;font-size:14px;padding-left: 10px;}
/*    Cat/Tyre List exclude fault description in subcategory*/
.hcul span:not(.spfault) {display:block;float:left;width:190px;}
.hcul span.small {width:156px;}
.hcul b {border: 1px solid #666;background-color:#ccc;display:block;width:20px;float:left;text-align:center;font-size:12px;line-height:22px;height:20px;margin-top:9px;margin-left:5px;}

/*butbox*/
.butbox {width:100%;overflow:hidden;height:50px;line-height:52px;border-bottom:1px solid #ccc;border-top:1px solid #fff;background-color:#f3f3f3;font-size:20px;overflow:hidden;-webkit-transform:translate3d(0,0,0);}
.butbox ul {position:relative;left:50%;list-style-type:none;float:left;margin:0px;padding:0px}
.butbox li {position:relative;right:50%;float:left;text-align:center;margin:0px;width:100px;height:50px;border-left: 1px solid #ccc;cursor:pointer}
.butbox .pinbut {background-color:transparent;color:black;font-weight:normal;width:100%;margin:0px;border:0px;cursor:pointer;height:inherit;font-size:inherit;outline:none}
.butbox li:first-child {border-left: 0px !important;}

/*Tyres*/
.tyreselect {width:100%;margin-left:auto;margin-right:auto;margin-top:5px;margin-bottom:5px;height:40px;}
.tyreselect ul {position:relative;left:50%;list-style-type:none;float:left;margin:0px;padding:0px}
.tyreselect li {position:relative;right:50%;float:left;text-align:center;margin:0px;width:100px;cursor:pointer}
.tyreselect li:hover {background-color: #e7e7e7}
.tyreselect .selected {background-color:#a6daf3 !important;cursor:default !important}
.tyreselect input {display:none}
.tyreselect b {display:block;font-size: 12px;padding-top:3px}
.tyreselect span {display:block;font-size: 20px;padding:3px;height:26px}
.tyresizes {height:20px;font-size:15px;line-height:20px;}
.tyresizes span {display:block;margin-left:5px;margin-right:5px;width:100px;text-align:center;float:left}
.tsizes select {float:left; width:30%;font-size:20px}
.tsizes select:first-child {margin-left:5%;}
.tmake select {margin-left:5%;width:90%;font-size:20px}

/*Date CSS*/
.datebluebut{color:Blue;background-color: White;border: solid 1px blue;margin: 5px;}
.dateday{width: 65px;text-align: center;}
.datedivbut{text-align: center;border: solid 2px black;margin: 5px;padding: 10px;cursor: pointer;}
.datedisplaybox{ width:312px;margin-left:auto;margin-right:auto;font-size:12px}
#calYear{width:50px;float:left;}
#calMonth{width:100px;float:left;}
#calDay{width:50px;float:left;}
#calItems{width:auto;text-align:center;clear:left;padding-top:10px;}

/*menubox bodydamage*/
.menu {border-top: 1px solid #999;width:auto;margin:0;padding:0;width:100%;overflow:hidden}
.menu ul {position:relative;float:left;display:block;left: 50%;list-style: none;margin: 0;padding: 0;}
.menu li {position: relative;width:70px;float: left; display: block; right: 50%;margin: 0;padding: 0;cursor: pointer;border-right: 1px solid #999;background-position: center;background-repeat: no-repeat;text-align:center;}
.menu li:first-child {border-left: 1px solid #999;}
.menu li b {display:block;height:45px;width:auto;overflow:hidden;background-repeat:no-repeat;background-position: center center;}
.menu li span {display:block;height:15px;line-height:15px;width:auto;font-family:"Lucida Sans Unicode", "Bitstream Vera Sans", "Trebuchet Unicode MS", "Lucida Grande", Verdana, Helvetica, sans-serif;overflow:hidden;}

/*Loction box*/
#locbox div {margin-top:20px;width:100%;height:280px;background-position:center center;background-repeat:no-repeat;margin-left:auto;margin-right:auto;}
/*#locbox.car div{background-size: 255px 280px;background-image:url('./img/diagram01.gif');}*/
#locbox.car div{background-size: 179px 280px;background-image:url('./img/car01.gif');}
#locbox.lcv div{background-size: 179px 280px;background-image:url('./img/lcv01.gif');}
#locbox.hgv div{background-size: 159px 280px;background-image:url('./img/hgv01.gif');}
#locbox.bike div{background-size: 168px 280px;background-image:url('./img/bike1.gif');}
#locbox table {text-align:center;width:100%;border:0px;}
#locbox td{height: 140px;vertical-align: middle;width: 33%;}
#locbox.car td{height: 90px;vertical-align: middle;}
#locbox.bike td{height: 90px;vertical-align: middle;}
#locbox.lcv td{height: 100px;vertical-align: middle;}
#locbox.hgv td{height: 100px;vertical-align: middle;}
#locbox input {font-size:16px;}

/*Photo specific*/
.qq-uploader{position:relative;width:100%;} 
.qq-upload-button{display:block;width:auto;text-align:center;color:#fff;padding:7px 0;background-image:url('ico/86-camera.png');background-position:center center;background-repeat:no-repeat;height:40px;}
.qq-upload-button-hover{background-image:url('ico/86-camera.png');background-position:center center;background-repeat:no-repeat;} 
.qq-upload-button-focus{outline:1px dotted #000;} 
.qq-upload-drop-area, .qq-upload-extra-drop-area{position:absolute;top:0;left:0;width:100%;height:100%;min-height:30px;z-index:2;background:#FF9797;text-align:center;} 
.qq-upload-drop-area span{display:block;position:absolute;top:50%;width:100%;margin-top:-8px;font-size:16px;} 
.qq-upload-extra-drop-area{position:relative;margin-top:50px;font-size:16px;padding-top:30px;height:20px;min-height:40px;} 
.qq-upload-drop-area-active{background:#FF7171;} .qq-upload-list{list-style:none;margin:0;padding:0;} 
.qq-upload-list li{line-height:10px;font-size:11px;background-color:#FFF0BD;margin:0;padding:4px;} 
.qq-upload-file, .qq-upload-spinner, .qq-upload-size, .qq-upload-cancel, .qq-upload-failed-text{margin-right:12px;} 
.qq-upload-spinner{display:inline-block;background:url('../images/loading.gif');width:15px;height:15px;vertical-align:text-bottom;} 
.qq-upload-size, .qq-upload-cancel{font-size:10px;font-weight:400;} 
.qq-upload-failed-text{display:none;} 
.qq-upload-fail .qq-upload-failed-text{display:inline;} 
.qq-upload-list li.qq-upload-success{background-color:#5DA30C;color:#FFF;} 
.qq-upload-list li.qq-upload-fail{background-color:#D60000;color:#FFF;}
        
.ulPics {list-style:none;margin:0px;padding:0px;width:100%;}
.ulPics li {border-bottom:1px solid #ccc;border-top:1px solid #fff;background-color:#f3f3f3;padding:10px;min-height:40px;overflow:hidden}
.ulPics img {border:0px;float:left;}
.ulPics span {float:right;display:block;background-image:url('ico/218-trash2@2x.png');background-size: 16px 21px;background-position:center center;background-repeat:no-repeat; width:30px; height:30px; background-color: #ddd; border: 1px solid #333;margin-right:5px;cursor:pointer}
.ulPics span:hover {background-color: #aaa}

.ui-widget-header {border-left:0px !important;border-right:0px !important;padding:0px;}
        
#picinfo {font-size: 18px;padding:15px;}
#picinfo .cameraimg {display:block; width: 160px; height: 120px; margin-left: auto; margin: 20px auto 20px auto;background-image:url('./img/camera.png');background-repeat:no-repeat;background-position: center center;}
/*End Photo*/

/*Select list*/
.select {min-height:20px;overflow:visible;margin:3px;padding: 3px;border: 1px solid #ccc;cursor:pointer;background-image:url('./img/dropdownarrow.png');background-position: right center;background-repeat:no-repeat;}
.select span {display:block;min-width:100px;height:20px;}
.select b {display:none;}
.select ul {display:none !important;}
.select li {background-color:#ededed;}

.selectshow {width:auto !important;background-image:none;background-color:#ededed;}
.selectshow span {display:none}
.selectshow b {display:block !important;font-size:9px; text-align:center;}
.selectshow ul {display:inline !important;}

/*created on fly using code behind*/
#vidtick {background-image:none;background-position: center center;background-size: 17px 16px;background-repeat: no-repeat;background-color: white;}
.spfault {color:Gray;width:auto;float:none;display:inline}

/*.butbox {width:100%;overflow:hidden;height:50px;line-height:52px;border-bottom:1px solid #ccc;border-top:1px solid #fff;background-color:#f3f3f3;font-size:20px;overflow:hidden;-webkit-transform:translate3d(0,0,0);}
.butbox ul {position:relative;left:50%;list-style-type:none;float:left;margin:0px;padding:0px}
.butbox li {position:relative;right:50%;float:left;text-align:center;margin:0px;width:100px;height:50px;border-left: 1px solid #ccc;cursor:pointer}
.butbox .pinbut {background-color:transparent;width:100%;margin:0px;border:0px;cursor:pointer;height:inherit;font-size:inherit;outline:none}
.butbox li:first-child {border-left: 0px !important;}*/
/*End Select*/

.icoBack {background-image:url('./ico/213-reply.png');}
.icoSign {background-image:url('./ico/216-compose.png');}
.icoSignOff {background-image:url('./ico/117-todo.png');}
.icoSave {background-image:url('./ico/258-checkmark.png');}
.icoLogout {background-image:url('./ico/63-runner.png');}
.icoSwitch {background-image:url('./ico/02-redo.png');}
.icoNotes {background-image:url('./ico/179-notepad.png');}
.icoNotesHi {background-image:url('./ico/179-notepadred.png');}
.icoDel, .icoClear {background-image:url('./ico/218-trash2.png');}
.icoIgnore {background-image:url('./ico/04-squiggle.png');}
.icoRefresh {background-image:url('./ico/01-refresh.png');}
.icoOther {background-image:url('./ico/272-windows.png');}

/*http://menacingcloud.com/?c=highPixelDensityDisplays*/
@media only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) {
    .icoBack {background-image:url('./ico/213-reply@2x.png');background-size: 23px 17px;}
    .icoSign {background-image:url('./ico/216-compose@2x.png');background-size: 23px 18px;}
    .icoSignOff {background-image:url('./ico/117-todo@2x.png');background-size: 18px 19px;}
    .icoSave {background-image:url('./ico/258-checkmark@2x.png');background-size: 19px 18px;}
    .icoLogout {background-image:url('./ico/63-runner@2x.png');background-size: 18px 25px;}
    .icoSwitch {background-image:url('./ico/02-redo@2x.png');background-size: 30px 26px;}
    .icoNotes {background-image:url('./ico/179-notepad@2x.png');background-size: 22px 18px;}
    .icoNotesHi {background-image:url('./ico/179-notepadred@2x.png');background-size: 22px 18px;}
    .icoDel, .icoClear {background-image:url('./ico/218-trash2@2x.png');background-size: 16px 21px;}
    .icoIgnore {background-image:url('./ico/04-squiggle@2x.png');background-size: 33px 16px;}
    .icoRefresh {background-image:url('./ico/01-refresh@2x.png');background-size: 24px 26px;}
    .icoRefresh {background-image:url('./ico/272-windows@2x.png');background-size: 20px 18px;}
    
    #locbox div {background-image:url('./img/diagram01.svg');}
    #picinfo .cameraimg {background-image:url('./img/camera2x.png');background-size: 100%}
}