/*~~~~~~~ Basic ~~~~~~~*/
* {
margin: 0;
padding: 0;
}

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
color: #252525 ;
line-height: 1.2em;
white-space: nowrap;
}

h1, h2 {
font-family: Arial, Helvetica, sans-serif;
font-size:2em;
font-weight: normal;
padding: 0 1em;
color: #f15a25;
line-height: 2em;
}

h2 {
font-size: 1.8em;
}


h3, h4, h5, h6 {
font-family: Georgia, serif;
font-style: italic;
font-weight: normal;
line-height: 2em;
}

h3 {font-size:1.8em; color: #f15a25;}
h4 {font-size:1.5em; color: #f15a25;}
h5 {font-size:1em;}
h6 {font-size:1em;}



a {
color: #f15a25;
text-decoration: none;
}

input, textarea, select {
font-family: Arial, Helvetica, sans-serif;
font-size: 1em;

}

input[type="radio"] {
margin: 5px;
}

textarea {
width: 100%;
}

fieldset {
text-align: left;
}

p {
margin: 1em 0;
}

td {
white-space: nowrap;
line-height: 1.6em;
}

strong {
color: #f15a25;
}

#header {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 4.5em;
overflow: hidden;
z-index: 50;
}

#content {
position: fixed;
top: 4.5em;
left: 0;
bottom: 0;
width: 100%;
height: auto;
overflow: auto;
z-index: 50;
}

#cover {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
z-index: 0;
background: white;
}

#processing {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
opacity: 0;
z-index: 0;
background: white;
}

#menu {
position: absolute;
top: 0;
bottom: 0;
left: 0;
width: 15em;
padding: 0;
min-height: 100%;
background: #F0F0F0;
border-right: 1px solid #E2E2E2;
z-index: 0;
opacity: 0;
overflow: hidden;
}

#filters {
position: absolute;
top: 0;
right: 0;
width: auto;
padding: 1em;
height: auto;
background: #F0F0F0;
z-index: 0;
opacity: 0;
overflow: hidden;
border: 1px solid gray;
}

img.processing {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
opacity: 1;
z-index: 100;
}

/*~~~~~~~ Feedback Message ~~~~~~~*/
div.message {
position: absolute;
top: 3.25em;
left: 20%;
width: 60%;
text-align: center;
z-index: 500;
}

.response {
color: #222222;
background-color: #F9EDBE;
border: 1.5px solid;
border-color: #F0C36D;
border-radius: 2px;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
padding: 6px 10px;
text-align: center;
font-size: 12pt;
font-weight: bold;
opacity: 0;
}



div.container {
position: fixed;
width: 100%;
height: 4.5em;
}

table {
width: 100%;
}

table.header {
position: fixed;
width: 100%;
}

td.menu, td.logout, td.filter {
text-align: center;
vertical-align: middle;
width: 8em;
}

table.filters {
width: auto;
height: auto;
}

table.filters tbody tr td{
padding: 0.5em;
}

td.button{
text-align: right;
}

.right {
text-align: right;
}

div.title-bar {
width: auto;
}

div.title-bar table {
width: auto;
}

div.title-bar tbody tr td {
padding: 0 1em;
width: auto;
text-align: left;

}

/*~~~~~~~ Buttons ~~~~~~~*/
input[type="button"] {
border-radius: 4px;
border: medium none;
color: #ffffff;
cursor: pointer;
font-weight: bold;
}

input.refresh {
background: #f15a25 url("../images/refresh.png") no-repeat scroll 0.75em;
padding: 0.5em 0.8em 0.5em 2.5em;
}

input.go {
background: #f15a25 url("../images/arrow_right.png") no-repeat 3em 0.5em;
padding: 0.5em 2.5em 0.5em 0.8em;
}

input.logout {
background: #f15a25 url("../images/on-off.png") no-repeat scroll 0.75em;
padding: 0.5em 0.8em 0.5em 2.5em;
}

input.filter {
background: #f15a25 url("../images/filter.png") no-repeat scroll 0.75em;
padding: 0.5em 0.8em 0.5em 2.5em;
}

input.menu {
background: #f15a25 url("../images/menu.png") no-repeat scroll 0.75em;
padding: 0.5em 0.8em 0.5em 2.5em;
}

/*~~~~~~~ Left Menu Navigation ~~~~~~~*/
.nav {
background: #FFFFFF;
font-family: Georgia, serif;
font-style: italic;
font-weight: normal;
margin-bottom: 0;
}

div.nav {
width: 100%;
opacity: 1;
z-index: 150;
}

.nav ul {
overflow: hidden;
}

.nav ul, .nav li {
list-style: none;
}

.nav li {
font-size: 1.2em;
border-bottom: 1px solid #f0f0f0;
position: relative;
float: left;
width: 12.5em;
}

.nav li.nav-title {
font-family: 'Open Sans', sans-serif;
font-weight: 600;
font-size: 100%;
font-style: normal;
font-size: inherit;
background: #252525;
color: #CCCCCC;
width: 100%;
padding: 0.2em 0.5em;
border: none;
}

.nav a {
display: block;
padding: 0.5em;
color: #252525;
}

.nav a:hover, .nav a.active {
color: #FFFFFF;
background-color: #f15a25;
background-position: 97%;
}

div.nav ul li.add, div.nav ul li.request {
color: #FFFFFF;
background: #f15a25;
}

div.nav ul li.add a {
background: #f15a25 url(../images/add25.png) 0.4em 0.4em no-repeat;
color: #FFFFFF;
padding: 0.5em 0.5em 0.5em 2.5em;
}

div.nav ul li.request a {
background: #f15a25 url(../images/doc_plus25.png) 0.4em 0.4em no-repeat;
color: #FFFFFF;
padding: 0.5em 0.5em 0.5em 2.5em;
}

/*~~~~~~~ Quick Actions ~~~~~~~*/
div.quick-actions {
display: block;
position: relative;
width: 2em;
height: 1.8em;
background: #252525 url(../images/icon-down-reverse.png) 50% 50% no-repeat;
cursor: pointer;
z-index: 50;
padding: 0;
}

.quick-actions:hover {
background: #f15a25 url(../images/icon-right-reverse.png) 50% 50% no-repeat;
}
.quick-actions ul, .row-actions li{
list-style: none;
}

.quick-actions ul{
display: none;
}

.quick-actions:hover ul{
display: block;
width: 15em;
position: absolute;
left: 2em;
top: 0;
z-index: 100;
padding: 0 0 0 0.5em;
}

.quick-actions li {
padding: 0 0 0 3em;
background: #252525;
width: 11em;
float: left;
}

.quick-actions a {
display: block;
padding: 0.5em 0.5em 0.5em 0;
color: #FFFFFF;
vertical-align: middle;
}

.quick-actions a:hover {
color: #999999;
}

.quick-actions li.quick-edit {
background: #252525 url(../images/edit18.png) 0.75em no-repeat;
}

.quick-actions li.quick-edit-inactive {
background: #252525 url(../images/edit18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

.quick-actions li.quick-invoice {
background: #252525 url(../images/script18.png) 0.75em no-repeat;
}

.quick-actions li.quick-invoice-inactive {
background: #252525 url(../images/script18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

.quick-actions li.quick-print {
background: #252525 url(../images/print18.png) 0.75em no-repeat;
}

.quick-actions li.quick-print-inactive {
background: #252525 url(../images/print18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

.quick-actions li.quick-note {
background: #252525 url(../images/icon-note.png) 0.75em no-repeat;
}

.quick-actions li.quick-delete {
background: #252525 url(../images/trash18.png) 0.75em no-repeat;
}

.quick-actions li.quick-delete-inactive {
background: #252525 url(../images/trash18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

.quick-actions li.quick-delete-db {
background: #252525 url(../images/database18.png) 0.75em no-repeat;
}

.quick-actions li.quick-delete-db-inactive {
background: #252525 url(../images/database18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

.quick-actions li.quick-close {
background: #252525 url(../images/lock18.png) 0.75em no-repeat;
}

.quick-actions li.quick-close-inactive {
background: #252525 url(../images/lock18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

.quick-actions li.quick-unclose {
background: #252525 url(../images/unlock18.png) 0.75em no-repeat;
}

.quick-actions li.quick-unclose-inactive {
background: #252525 url(../images/unlock18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

.quick-actions li.quick-task {
background: #252525 url(../images/user18.png) 0.75em no-repeat;
}

.quick-actions li.quick-task-inactive {
background: #252525 url(../images/user18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

.quick-actions li.quick-report {
background: #252525 url(../images/report18.png) 0.75em no-repeat;
}

.quick-actions li.quick-report-inactive {
background: #252525 url(../images/report18.png) 0.75em no-repeat;
padding: 0.5em 0 0.5em 3em;
color: #999999;
}

/******* FORM *******/

.left-align {
text-align: left;
margin: 0 0 0 50px;
float: left;
}

input.check {
text-align: left;
width: auto !important;
}

td.check {
text-align: left;
width: auto !important;
}


/*~~~~~~~ Spaces ~~~~~~~*/
td.space {
width: 50px;
}

td.small-space {
width: 15px;
white-space: nowrap;
}

/*~~~~~~~ Invoice edit? ~~~~~~~*/
.value {
text-align: right;
}

.first {
font-weight: bold;
font-style: italic;
}

.notfirst {
font-weight: normal;
font-style: normal;
}

li.filter{
font-size: 100%;
margin: 5px 0;
}

td.center {
text-align: center;
}

.centre {
text-align: center;
}

.underline {
text-decoration: underline;
}

.orange-label {
color: #f15a25;
}

/*~~~~~~~ Not Sure ~~~~~~~*/
.button-delete {
display: block;
position: relative;
width: 2em;
height: 2em;
background: #252525 url(../images/icon-delete.png) 0.1em 0.1em no-repeat;
cursor: pointer;
z-index: 50;
}

label.selection {
color: #f15a25;
text-align: right;
}

tr.selection {
line-height: 2em;
vertical-align: middle;
}

td.selection {
vertical-align: middle;
text-align: right;
padding: 0.25em 0.5em;
}

td label {
display: block;
color: #f15a25;
text-align: right;
}