* { font-family: Gotham A,Gotham B,Verdana,Arial,sans-serif  !important; color: #333; }

/* Compact version */
.compact { font-size: 12pt !important; }
.compact h1 { font-size: 20pt !important; }
.compact input.text-input, .compact input.date-input, .compact select.time-input, .compact textarea, .compact select.dropdown-input { font-size: 12pt !important; }
.compact .label { width: 150px !important; }
.compact .job .button { font-size: 11pt !important;width: 99px !important; }
.compact .job .detail-button {padding: 21px 0 !important;}
.compact .title-container #refresh-button { width: 30px !important;height: 30px !important;}
.compact nav #portal-header #right-header aside {  font-size: 12pt !important;padding-right: 20px !important;}
.compact nav #portal-header #center-header { padding: 3px !important;  }
.compact nav #portal-header #center-header aside { font-size: 30px !important;  }

/* Small version */
.small .job .button { font-size: 11pt !important;width: 81px !important; }



body { background-color: #fff; font-size: 18pt; margin: 0; overflow-x: hidden; }
.left { float: left; }
.right { float: right !important; }
.clear { clear: both !important; float: none;  }
.hidden { display: none; }
.strong { font-weight: bold;}
.label { width: 200px; }
.field {padding-left: 2px;}
.fields .label { padding: 6px; white-space: nowrap; width: 200px;}
.fields .field { padding: 6px 8px 6px 6px; }
.top { vertical-align: top !important; }
.red-text { color: #ff0000 !important; }
.grey-text { color: #808080 !important; }

/*Buttons*/
.button {float: right;width: 180px; border: 1px solid #333;border-radius: 5px; color: #333; background: #fff; padding: 30px 0;margin: 5px 6px;text-decoration: none; text-align: center;}
.negative { border: 1px solid #c80000 !important; color: #fff !important; background: #c80000;}
.positive { border: 1px solid #173f73 !important; color: #fff !important;background: #173f73;float: left; }
.detail-button { padding: 16px 0;}
.disabled { border: 2px solid #c0c0c0 !important; color: #c0c0c0 !important; }
.stretch { width: 97%;margin-left: 5px; }
.button-save { float: right;}
.button-high {padding: 30px 34px;}

.button-container { width: 100%; height: 57px}

/*Inputs*/
.error, .error .selectize-input { background-color: #fee0e0 !important; box-shadow: 0 0 5px #e09b9b !important;  border: 1px solid #5F2222 !important; }
input.text-input, input.date-input, select.time-input, textarea, select.dropdown-input {font-size: 18pt;border-radius: 5px;padding: 3px; background-color: #ffffff; border: 1px solid #b2b2b2; width: 100%;height: 50px;}
textarea { resize: none; }
input.date-input { width: 200px !important;}
select.time-input { width: 80px !important; }
input.integer { width: 120px !important; text-align: right;}
input.text-input:focus, input.datetime-input:focus, textarea:focus, select.dropdown-input:focus { background: #fff none repeat scroll 0 0; border-color: #b2b2b2; outline: medium none; box-shadow: 0 0 3px #999; }
select option { font-size: 18pt !important;}

/*Side menu items*/
.menu {background: #333;width: 100%; height: 100%; margin: 0; padding: 0; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 0; list-style: none;}
.menu .item { width: 200px; }
.menu .item a { display: block;padding: 44px 15px; font-size: 20pt; color: #bdbdbd; text-decoration: none;border-bottom: 1px solid #474646; }

/*Side menu button and behaviour*/
#body { min-height: 100%; min-width: 100%; width: 100%; position: fixed; top: 0; bottom: 0; left: 0; z-index: 1; background-color: #fff; overflow-y: auto; box-shadow: 0 0 10px #000 }

.hamburger { position: absolute; clip: rect(0, 0, 0, 0); }
label[for="hamburger"] { position: fixed; left: 0; top: 0; z-index: 2;height: 86px; width: 50px; background: url('/Assets/Img/hamburger.png') no-repeat center center; }
.hamburger + label, #body, nav { transition: left 0.2s; }
.hamburger:checked + label { left: 200px; }
.hamburger:checked ~ #body, .hamburger:checked ~ #body nav { left: 200px; }

/*Header bar*/
nav {background: #173f73; padding: 0; display: block; width: 100%; height: 93px;  top: 0;left: 0;overflow: hidden; z-index: 999; }
nav * { font-size: 20pt; }
nav #portal-header { width: 100%;padding: 26px 10px; }
nav #portal-header #left-header { width: 70px;}
nav #portal-header #center-header { margin: 0 auto; padding: 3px 3px 3px 17px; text-align: center;}
nav #portal-header #center-header aside {color: #FFF;font-weight: bold; font-size: 40px}
nav #portal-header #center-header img.logo { height: 30px; }
nav #portal-header #right-header { background: url('/Assets/Img/online.png') no-repeat center right;background-size: 25%;width: 75px; }
nav #portal-header #right-header.offline { background: url('/Assets/Img/offline.png') no-repeat center right !important;}
nav #portal-header #right-header aside {  font-size: 20pt;padding-right: 35px;color: #FFF; }

/*Content*/
main { padding: 10px; display: block; }
main h1 { color: #173f73; font-size: 26pt; margin: 0 0 12px 0;font-weight: normal; }
main h2 { color: #173f73; font-size: 15pt;font-weight: normal;}
main .title-container { border-bottom: 1px solid #173f73;}
main .title-container h1 { float: left;}
main .title-container #refresh-button {float: right; width: 60px; height: 60px; }
main .title-container #last-refreshed { margin: 10px 0 10px 4px; }

/*main .jobs-container #save-changes { margin: 0 4px 30px 4px; }*/

/*Expandable sections*/
main .expandable-section {border-bottom: 1px solid #173f73; }
main .expandable-section a.label { display: block; padding: 25px 5px;font-weight: bold;color: #173f73; text-decoration: none; width: 100%; }
main .expandable-section .content { display: none; }
main .expandable-section.expanded .content { display: block !important; }

/*Loading message*/
#overlay, #overlay-message, #exit-message { position: fixed; display: none; }
#overlay { opacity: 0.5; z-index: 998; background-color: #000; height: 100%; width: 100%; top: 0; left: 0; }

#overlay-message { z-index: 999; background-color: #FFF;  top: 0; left: 0; right: 0; bottom: 0; text-align: center; width: 120px; height: 20px; margin: auto; border: 1px solid #CCC;border-radius: 5px;padding: 16px 40px; }

#exit-message { z-index: 999; background-color: #FFF; top: 0; left: 10px; right: 10px; bottom: 0; text-align: center; height: 152px; margin: auto; border: 1px solid #CCC;border-radius: 5px; padding: 16px 10px; }
#exit-message textarea { display: none; }
#exit-message.other { height: 230px; }
#exit-message.other textarea { display: block; }

/*Index page*/
#toc { padding: 0; clear: both;margin: 20px 10px; }
#toc .group a { text-decoration: none; }
#toc .group ul { list-style: outside none none; margin: 0; padding: 2px 4px 12px 0; }
#toc .group ul li ul { padding: 0; margin: 0 0 6px 0; }
#toc .group ul li { position: relative;}
#toc .dead { color: #CCC; }

/*Image capture*/
#photos-resize-canvas { display: none; }
.photo-list { margin: 0 0 6px 0; padding: 0; list-style: none; }
.photo-list li { margin: 0; padding: 0; }
.photo-list li input[type=file] { padding: 6px 0; margin: 0; width: 100%; }
.photo-list:first-child { margin-top: 12px; }
.photo-list .target-image { width: 100%; max-width: 480px; margin: 6px 0; display: none; }

/*Pages*/
#edit-incident-report { width: 100%; margin-top: 10px; }
#edit-incident-report .label { width: 90px; }

/*Tables*/
.header-table { width: 100%; margin: 5px 0 10px 0; }
.header-table tr td { padding: 5px 0; }