/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
1.0 Normalize
2.1 Header
2.2 Main
2.3 Rentals Forms
2.6 Footer

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

/*--------------------------------------------------------------
1.0 Normalize
Styles based on Normalize v5.0.0 @link https://github.com/necolas/normalize.css
--------------------------------------------------------------*/

html {
font-family: sans-serif;
line-height: 1.15;
-ms-text-size-adjust: 100%;
-webkit-text-size-adjust: 100%;
margin: 0;padding:0;
background:#dedbce;
}
body {
margin: 0;padding:0;
overflow-x: hidden;
overflow-y: scroll;
background:#dedbce;
}
footer,
header,
nav,
section {
display: block;
}
h1 {
font-size: 2em;
margin: 0.67em 0;
}
main {
display: block;
}
a {
background-color: transparent;
-webkit-text-decoration-skip: objects;
}
a:active,
a:hover {
outline-width: 0;
}
abbr[title] {
border-bottom: 1px #767676 dotted;
text-decoration: none;
}

b,
strong {
font-weight: inherit;
}

b,
strong {
font-weight: 700;
}


mark {
background-color: #eee;
color: #222;
}

small {
font-size: 80%;
}

sub,
sup {
font-size: 75%;
line-height: 0;
position: relative;
vertical-align: baseline;
}

sub {
bottom: -0.25em;
}

sup {
top: -0.5em;
}

audio,
video {
display: inline-block;
}

audio:not([controls]) {
display: none;
height: 0;
}

img {
border-style: none;
}

svg:not(:root) {
overflow: hidden;
}

button,
input,
optgroup,
select,
textarea {
font-family: sans-serif;
font-size: 100%;
line-height: 1.15;
clear: both;
margin: 10px;
display: block;
padding: 5px;
border: 1px solid #222;
}

button,
input {
overflow: visible;
}

button,
select {
text-transform: none;
}

button,
html [type="button"],
[type="reset"],
[type="submit"] {
-webkit-appearance: button;
}

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
border-style: none;
padding: 0;
}

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
outline: 1px dotted ButtonText;
}

fieldset {
border: 1px solid #bbb;
margin: 0 2px;
padding: 0.35em 0.625em 0.75em;
position:relative;
}
legend {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
color: inherit;
display: table;
max-width: 100%;
padding: 0;
white-space: normal;
}

progress {
display: inline-block;
vertical-align: baseline;
}

textarea {
overflow: auto;
}

[type="checkbox"],
[type="radio"] {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
padding: 0;
}

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
height: auto;
}

[type="search"] {
-webkit-appearance: textfield;
outline-offset: -2px;
}

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
-webkit-appearance: none;
}

::-webkit-file-upload-button {
-webkit-appearance: button;
font: inherit;
}

details,
menu {
display: block;
}

summary {
display: list-item;
}

canvas {
display: inline-block;
}

template {
display: none;
}

[hidden] {
display: none;
}
/*--------------------------------------------------------------
2.1 Header

--------------------------------------------------------------*/
header {
height: 60px;
background: #333;
box-sizing: border-box;
position: fixed;
z-index:999;
top: 0;
left: 0;
width: 100%;
overflow: hidden;
border-top: 2px solid #000;
border-bottom: 2px solid #000;
box-shadow: inset 3px 3px 15px #3d3d3d, inset -3px -3px 15px #000;	
}
header #mobileNavTrigger {display:none;}
header img {
    height: 50px;
    width: auto;
    box-sizing: border-box;
    background:transparent;
    margin: 2px 0 0 40px;	
}
header .headerProfile {
	float: right;
    color: #fff;
    margin: 10px 20px 0 0;
}
header .headerProfile span#headerGreeting,
header .headerProfile span#headerLogout {
	display:block;
    text-align: right;
}
header .headerProfile span#headerLogout a {
color: #f4ad07;text-decoration: none;font-size: .8em;	
}

header .headerProfile span#headerLogout a:active,
header .headerProfile span#headerLogout a:focus,
header .headerProfile span#headerLogout a:hover,
header .headerProfile span#headerLogout a:visited {
color:#f4ad07;text-decoration:none;cursor:pointer;	
}
header #rentalVision {
color: #fff;
font-weight: bold;
font-size: 1.6em;
font-style: italic;
text-shadow: -1px -1px #000, 1px 1px #000, 2px 1px 3px #666;
letter-spacing: 1px;
padding: 0 0 0 10px;
position: relative;
top: -7px;	
}
@media (max-width:1048px) {
header img {margin:2px 0 0 75px;}
header #mobileNavTrigger {
	display:block;
	color: #ddd;
    font-size: 38px;
    font-weight: normal;
    position: fixed;
    top: 5px;
    left: 14px;
    padding: 3px 7px 0px 7px;
    box-sizing: border-box;
    border-radius: 4px;
    border: 1px solid #555;
}
header #rentalVision {
font-size: 1.3em;
padding: 0 0 0 15px;
position: absolute;
top: 6px;	
}
	
}
/*--------------------------------------------------------------
2.2 Main

--------------------------------------------------------------*/
main {
    position: relative;
    box-sizing: border-box;
    padding-top:0px;
    height: auto;
    width: 100vw;
    z-index: 99;
	margin-top:0px;
}
main nav {
    width: 240px;
    background: #6b6558;
    color: #fff;
    text-shadow: 0px 1px #555;
    margin: 0;
    box-sizing: border-box;
    padding: 0px;
    height: 100%;
    position: fixed;
    border-right: 2px solid #bbb;
    box-shadow: 1px 0px #888, inset 0px -1px #888;
    left: 0;
    top: 60px;
}
main nav .menuTrigger {
	display:none;
}

main nav .menuInner {
	
}
.menuInner ul {
	list-style: none;
    margin: 0;
    padding: 0;	
}
.menuInner ul li {
box-sizing: border-box;
    width: 100%;
    height: 60px;
    padding: 20px 0 0 40px;
    border-bottom: 1px solid #333;
    font-weight: bold;
    cursor: pointer;	
}
.menuInner ul li.active {
	background:#9a9488;	
}
.menuInner ul li {position:relative;}
.menuInner ul li#deleted:after {content:" VISITS";position:relative;}
.menuInner ul li#change:after {content:" HISTORY";position:relative;}
.menuInner ul li#sales:after {content:" REPORTS";position:relative;}
.menuInner ul li#menu:after {content:" OPTIONS";position:relative;}
main section.infoBox {
    width: calc(100% - 240px);
    margin-left: 240px;
    height: auto;
	min-height:100%;
    position: relative;
    box-sizing: border-box;
    padding: 0;
	margin-top:0px;
	margin-bottom:65px;
}
.infoBox menu {
    width: 100%;
    box-sizing: border-box;
    min-height: 100px;
    margin:10px;
    border-bottom: 1px solid#222;
    box-shadow: 0px 1px #fff;
	overflow:hidden;
}
.infoBox menu .menu2button {position:relative;}
.infoBox .dataBox {
    width: 98%;
    height: auto;
    box-sizing: border-box;
	background:#dedbce;
    padding: 3px;
    position: relative;
    margin: 60px 0 0 2px;
}
.dataBox table,
.dataBox th,
.dataBox td {
   border: 1px solid black;border-collapse:collapse;
}
.rentalCompleteTable,
.rentalChecklistTable {width:96%;max-width:400px;}
.dataBox table {width:100%;z-index:100;margin-bottom: 40px;}
.dataBox th {height:30px;}
.dataBox th,
.dataBox td {text-align:left;vertical-align:middle;padding:5px 0 5px 10px;
}
.dataBox table tbody tr:nth-child(odd) { background:#a79980;}
.checklistList h4 {
	font-size:1.4em;
}
.checklistList strong {padding-right:10px;}
.dataBox th.utFirst,
.dataBox td.utFirst {display:none;}
.dataBox table#usersTable tr td {max-width:95px;}
.dataBox table#usersTable tr td button {
    width: 65px;
    text-align: center;
    color: #ddd;
    font-size: 11px;
    border-radius: 3px;
}
.dataBox table#usersTable tr td div.userPwUpdate {
width: 65px;
    padding: 1px;
    border: 1px solid #b92801;
    text-align: center;
    color: #ddd;
    font-size: 11px;
    border-radius: 3px;
    background: #f00;
    display: inline-block;
    margin: 0 5px 0 0;
	cursor:pointer;
}
.dataBox table#usersTable tr td button.activate {
    background: #269234;
    border: 1px solid #0c6113;	
}
.dataBox table#usersTable tr td button.activate:before {
	content:"reactivate";
}
.dataBox table#usersTable tr td button.deactivate {
    background: #bf0000;
    border: 1px solid #860000;
}
.dataBox table#usersTable tr td button.deactivate:before {
	content:"deactivate";	
}
.dataBox table#adminTable tr td button {
width: 65px;
    padding: 2px;
    border: 1px solid #b92801;
    text-align: center;
    color: #ddd;
    font-size: 13px;
    border-radius: 3px;
    background: #f00;
    display: inline-block;
    margin: 0 5px 0 0;
    cursor: pointer;
}
.dataBox table#adminTable tr td button:before,
.dataBox table#adminTable tr td button:after,
.dataBox table#adminTable tbody tr td button:after {content:"";display:none;}
@media (max-width:1048px) {
main nav {
	display:none;
	position: fixed;
    left: 0;
    top: 60px;
    z-index: 999;
}
main section.infoBox {
	width: 100%;
    float: none;
	margin-left:0;	
}
}
.orangeButton {
    background: #eea806;
    color: #402d02;
    font-weight: bold;
    width: 280px;
    clear: both;
    text-align: center;
    box-sizing: border-box;
    cursor: pointer;
    padding: 10px;
    -webkit-appearance: none;
    border: none;
    border-bottom: 3px solid #9e7108;
    margin: 10px 0;
    text-decoration: none!important;
    border-radius: 3px 3px 0 0;
}
.orangeButtonSmall {
    background: #eea806;
    display: inline;
    color: #402d02;
    font-weight: bold;
    width: auto;
    clear: both;
    text-align: center;
    box-sizing: border-box;
    border-radius: 9px;
    cursor: pointer;
    padding: 2px 10px;
    font-size: 12px;
    -webkit-appearance: none;
    border: 1px solid #9e7108;
    margin: 10px 0;
    text-decoration: none!important;
}
.mobileFloat {
	width: 100%;
	max-width: 330px;
	float: left;	
}
.mobileFloat h3,
.mobileFloat h5 {
	margin: 0;
	padding: 0;	
}
.mobileFloat .timelist {
    width: 100%;
    box-sizing: border-box;
    padding: 0;
    margin: 5px 0;	
}
.mobileFloat .timelist dt {
	margin:5px 0;
	padding:0;
	box-sizing: border-box;
    width: 100px;
    float: left;
    clear: left;	
}
.mobileFloat .timelist dd {
    margin:5px 0;
    padding:0;
    box-sizing: border-box;
    width: calc(100% - 100px);
    float: left;
	font-weight: bold;	
}
.mobileFloat .timelist dd input {
    display: inline-block;
    width: 60px;
    text-align: center;
    margin: 0;
    padding: 4px;	
}

/*--------------------------------------------------------------
2.3 Search Forms

--------------------------------------------------------------*/
.menu form {
box-sizing:border-box;
padding:10px;
margin:0 0 20px 0;
border-bottom:1px solid #222;	
}
.menu form fieldset {
border:none;
width:100%;
float:left;
box-sizing:border-box;
margin:5px;
}
.menu form .text {
	float:left;
}
.menu form .text:nth-of-type(odd) {clear:left;}
#ui-datepicker-div {z-index:99999999;}
.ui-datepicker-prev, .ui-datepicker-next {
font-size: 1.6em!important;
    text-align: center;
}
.ui-datepicker .ui-datepicker-next {
    box-shadow: inset -4px 4px #000!important;
    width: 20px!important;
    height: 20px!important;
    transform: rotate(45deg)!important;
    top: 8px!important;
    right: 10px!important;
}.ui-datepicker .ui-datepicker-prev {
    box-shadow: inset 4px -4px #000!important;
    width: 20px!important;
    height: 20px!important;
    transform: rotate(45deg)!important;
    top: 8px!important;
    left: 10px!important;
}
#returnToPrev {
	position: absolute;
    top: 55px;
    left: 0;
    width: auto;
    padding: 3px 15px;	
}
#editRental {
	position: relative;
    width: auto;
    padding: 3px 15px;	
}
#deleteRental {
	position: absolute;
    top: 55px;
    right: 0;
    width: auto;
    padding: 3px 15px;	
}
.topForm {
    position: relative;
    margin:10px 0;
}
.topForm .checkbox {border:none;max: 320px;margin: 5px;float:left;}
.topForm .checkbox label {
    float: left;
    margin: 10px;
    font-size: .9em;
}
.topForm .checkbox label input[type='checkbox'] {
    -webkit-appearance:none;
    width:30px;
    height:30px;
    background:white;
    border-radius:5px;
    border:2px solid #555;
}
.topForm .checkbox label input[type='checkbox']:checked {
    background:#f00;
}
.topForm #rentalNameSearch {float:left;display: block;width: 320px;max-width:90%;padding:10px;}
.topForm #rentalNameSearch input {margin:10px 0;}
#custLookup, #addNewCust,
.singleRental.custInfo {margin-top: 40px;}
#custLookup h2:first-child {/*margin-top: 40px;*/}
.hidden {display:none;}
.existCustInfo label,
#addNewCust label {float:left;}
.existCustInfo label:nth-of-type(even),
#addNewCust label:nth-of-type(odd) {clear:left;}
.equipment input[type="radio"] {display:inline;}
.equipment select {margin:0 0 15px 0;max-width: 90%;}
.submitForSig {padding:40px 10px;}
textarea {
resize: both;
width: 96%;
box-sizing: border-box;
margin: 10px 2%;
padding: 5px;
min-height: 12em;	
}
.submitAuth,
.singleRental.submitAuth {border:none;}
span.citySelector {
    position: absolute;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 0px;
    left: 215px;
    top: 18px;	
}
span.citySelector input {
	padding: 0;
    margin: 0 0 4px 0;
}
span.citySelectorMenu {
	font-size: 11px;
    font-weight: bold;
    top: -25px;
    position: relative;
	clear: both;
    display: block;
}
span.citySelectorMenu input {
	display: inline;
    padding: 0 0 4px 0;
    font-size: 11px;
    font-weight: bold;	
}
@media (max-width:767px) {
.submitAuth,
.singleRental.submitAuth {border:none;}
#rentalsTable {font-size:9px;}
#rentalsTable th, #rentalsTable td {
    text-align: center;
    vertical-align: middle;
    padding: 4px;
}
}
#rentalsTable thead tr th:first-child,
#rentalsTable tbody tr td:first-child {
padding-right: 30px;	
}
form.newRental .existCustInfo {
display:none;	
}
form.newRental  button.inactive {
	
}
form.newRental fieldset.equipment {
    width: calc(50% - 2px);
	min-width:370px;
    float: left;
    box-sizing: border-box;
    margin: 0;
	height:360px;
}
form.newRental fieldset.equipment:nth-of-type(even) {
	clear:left;
	margin-left:2px;
}
form.newRental fieldset#newRentalSubmitField {
width:calc(100%-4px);
clear:both;
}
form.newRental fieldset#equipOne label,
form.newRental fieldset#equipTwo label,
form.newRental fieldset#equipThree label,
form.newRental fieldset#equipFour label {
	display:none;
}
form.newRental fieldset#equipOne label.new,
form.newRental fieldset#equipTwo label.new,
form.newRental fieldset#equipThree label.new,
form.newRental fieldset#equipFour label.new {
	display:block;
}
#rentalEquipDetails{ min-height:300px;}
.checklist.hours,
.checklist.fuel {
	
}
.checklist.fuel label {
float:left;
text-align:center;
width:22%;
max-width:60px;
margin-right:2%;	
}
.checklist.fuel label input{
	margin:10px auto;
}
#rentalEquipDetails,
#e1images,
.loaderPics,
.excavatorPics {
display:none;	
}
#e1images label,
#e1images input {display:block;}
.formButton {
    display: block;
    width: 200px;
    overflow: hidden;
    text-align: center;
    padding: 10px;
    margin: 10px 0 10px 10px;
	color: #fff;
    text-shadow: 0px 1px #aaa, 0px -1px #777;
    background: #999;
    box-shadow: inset 2px 3px 6px #aaa, inset -2px -3px 6px #777;
    border: 1px solid #8c8579;
    border-radius: 4px;
	cursor:pointer;
}
p#equip2, p#equip3, p#equip4, p#equip2a, p#equip3a, p#equip4a,
.newEquip, .newEquip2, .newEquip3, .newEquip4 {cursor:pointer;line-height:1.4em;}
div.newRentalConf {
background:#f00;
min-height:100px;color:#fff;
width:96%;
box-sizing:border-box;
margin:30% auto;
max-width:500px;
text-align:center;
padding:15px;
}
.dataBox table tbody tr td button {position:relative;}
.dataBox table tbody tr td button:after {
    content: "";
    font-family: 'FontAwesome', FontAwesome;
    position: absolute;
    top: 0;
    right: -1.5em;
    color: #000000;
    font-size: 1.1em;
}
.dataBox table tbody tr td button[data-id="1"]:after {content:"\f030";} /* Need pictures*/
.dataBox table tbody tr td button[data-id="2"]:after {content:"\f044";} /* Need signature*/
.dataBox table tbody tr td button[data-id="3"]:after {content:"\f14a";} /* In progress / rented*/
.dataBox table tbody tr td button[data-id="4"]:after {content:"\f192";} /* complete*/
/*#ui-datepicker-div, table.ui-datepicker-calendar {display:none!important;width:0!important;height:0!important;}*/
#e1EquipPicBlock .e1cornerPics label {
    display: inline-block;
    width: 95px;	
}
#e1EquipPicBlock .e1cornerPics input[type="file"] {
clear:none;
display:inline;	
}
#returnToRentalsButton {

    background: #f00;
    color: #fff;
    text-shadow: 0px 1px #73210b;
    width: 280px;
    clear: both;
    text-align: center;
    box-sizing: border-box;
    border-radius: 3px;
    cursor: pointer;
    text-decoration: none;
    padding: 10px;
    -webkit-appearance: none;
    border: 1px solid #888;	
}
h4 {margin: 1em 0 .2em 0}
form p {margin:0;padding:0;}
.singleRental {
min-height:100px;
box-sizing:border-box;
width:100%;
border:1px solid #333;
padding:10px;
margin:5px 0;	
}
.custInfo ul {
    margin: 0;
    padding: 0 0 0 15px;	
}
.custInfo ul li {
display:inline-block;
list-style:none;
padding:0 70px 0 0;	
}
.custInfo ul li strong {
    width: 105px;
    display: inline-block;
    font-size: .8em;
    padding: 0 0 15px 0;
}
form input,
select#newCustSt {
    clear: both;
    margin: 10px;
    display: block;
	padding:5px;
    border: 1px solid #222;
}
select#newCustSt {width:208px;}
form input[type="file"] {border:none;}
.checkListBlock fieldset {border:none;}
.damage label,
.functionality label,
.fluid label {float:left;text-align: center;}
.damage label,
.functionality label,
.fluid label {float:left;text-align: center;padding: 0 5px;}
.damage label.returnNotes,
.functionality label.returnNotes,
.fluid label.returnNotes {
clear:both;
text-align: left;
}
.damage textarea,
.functionality textarea,
.fluid textarea {
min-height: 4em;
}
form .damage p,
form .functionality p,
form .fluid p {
	margin:1em 0 .4em 0;
}
.file_uploading {display:none;}
.gallery ul {
margin:0;
}
.gallery ul:before, .gallery ul:after {}
.gallery ul:after {}
.gallery ul li {
    list-style: none;
    float: left;
    width: 80px;
    display: inline-block;
	min-height: 100px;
    box-sizing: border-box;
    margin: 10px;
}
.gallery ul li div a {
	
}
.gallery ul li a img,
.gallery ul li div a img {
	width: 100%;
	height: auto;
    padding: 5px;
    background: #eee;
    border: 1px solid #ccc;
}
#sketchpadapp {
    /* Prevent nearby text being highlighted when accidentally dragging mouse outside confines of the canvas */
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
	width:100%;
	max-width:600px;
	margin:30px auto;
}
#clearbutton {
font-size: 15px;
    padding: 10px;
    -webkit-appearance: none;
    background: #eee;
    border: 1px solid #888;
    position: absolute;
    right: 0;
    top: 15px;
	cursor:pointer;
}
#authFormSubmitButon {
    position: absolute;
    left: 0;
    top: 15px;
    background: #f00;
    color: #fff;
    text-shadow: 0px 1px #73210b;
    width: 280px;
    clear: both;
    text-align: center;
    box-sizing: border-box;
    border-radius: 3px;
    cursor: pointer;
    text-decoration: none;
    padding: 10px;
    -webkit-appearance: none;
    border: 1px solid #888;
}
@media (max-width:767px) {
#clearbutton {
    position: relative;
    top: 0;
    right: auto;
    float: none!important;
    margin: 30px 0 30px 10px;
    width: 200px;
    text-align: center;
}
#authFormSubmitButon {
position:relative;
}
}
#termsImage {
width: 96%;
    max-width: 900px;
    height: auto;
    margin: 40px auto;
    display: block;
    box-sizing: border-box;
    border: 2px solid #222;
    padding: 10px;
    background: #eee;
    box-shadow: inset -2px -3px 12px #999;	
}
#preRentTrigger {cursor:pointer;}
#allPicsList {display:block;}
#preRentGallery {
    box-sizing: border-box;
    width: 100%;
    border: 1px solid #333;
    padding: 10px;
    margin: 5px 0;	
}
.returnSig img {
    max-width: 96%;
    box-sizing: border-box;
    height: auto;
    margin: 10px auto;
    border: 1px solid #aaa;
    padding: 8px;
    box-shadow: inset 0 0 0 4px #eee;	
}
@media (max-width:1048px) {
form.newRental fieldset.equipment {width:100%;}
}
/*--------------------------------------------------------------
2.4.1 Equipment

--------------------------------------------------------------*/
.newEquipment, .newUser, .pwReset {
    margin-top: 65px;
    max-width: 400px;
    margin: 65px auto!important	
}
fieldset.newEquip {
border: none;	
}
fieldset.newEquip label {
    margin: 20px 0 10px 0;
    display: block;	
    line-height: 2em;
}
fieldset.newEquip label input,
fieldset.newEquip label select {
    padding: 12px;	
}
fieldset.newEquip label select option {
	
}
#newEquipOverlay {
	display:none;
	position:fixed;
	top:0;
	left:0;
	bottom:0;
	right:0;
	width:100%;
	height:100%;
	z-index:9995;
	background: rgba(0, 0, 0, 0.7);
}
.equipmentModal {
	display:none;
    position: fixed;
    top: 70px;
    left: -180px;
    margin: 0 0 0 50%;
    width: 400px;
    min-height:500px;
    z-index: 9998;
    background: #fff;
    box-sizing: border-box;
    border: 2px solid #000;
    border-radius: 4px;
    padding: 5px;
    box-shadow: 3px 4px 15px #000;
}

/*--------------------------------------------------------------
2.4.2 Customers

--------------------------------------------------------------*/
.pagination {
text-align:center;
margin:6px auto 20px auto;	
font-size:1.1em;
font-weight:bold;
}
.pagination #pagePrev,
.pagination #pageNext {
	cursor:pointer;
	text-decoration:underline;
	color:#9a6d02;
    font-size: .9em;
    font-weight: normal;
}
.pagination .disabled#pagePrev {
cursor:default;
color:#aaa;	
}

/*--------------------------------------------------------------
2.6 Footer

--------------------------------------------------------------*/
footer {
height: 10px;
background: #000;
box-sizing: border-box;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
z-index:999;	
}