/* General                                        */
/**************************************************/

.row-inactive {
	color:#aaa;
}

body { 
	margin:0px;
	padding:0px;
	/* height:100%; */
	background:#EEE;
	color:#666;
}

.two-factor-auth {
	color: red;
}

html {
	height:100%;
}

.container {
	width:1500px;
	max-width:100%;
}

.top-toolbar {
	background:#eee;
	padding:5px;
	/* margin-left:15px; */
	/* margin-right:15px; */
	margin-bottom:15px;
	padding:10px;
	color:#fff;
	border-radius:4px;
}

.top-toolbar .btn {
	margin-right:5px;
}

.nav {
	flex: 1;
    overflow-x: auto;
    white-space: nowrap;
    min-width: 0;
    display: inline-block;
    display: flex
}

.navbar {
	background:#fff;
	border-bottom:5px solid #224088;
	border-radius:0px;
	display: flex;
}

.navbar-nav {
	margin: 0px !important;
}

.navbar-nav,
.navbar-nav > li {
	float: none !important;
}
.navbar-nav > li > a {
	padding: 5px 10px !important;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}

.navbar a {
	color:#224088;
}

.navbar-brand {
	padding:10px;
}
.navbar img {
	width: 50px;
	height: 50px;
}

.logo-icon {
	position:absolute;
	left:10px;
	top:10px;
	width:30px;
	height:30px;		
}

h1 {
	color:#224088;
	margin:6px 0px;
	font-size:30px;
}

.subtitle {
	clear:left;
	font-size:14px;
	color:#b5b5b5;
	font-style:italic;
	margin-top:5px;
}

.title-bar {
	overflow:hidden;
	/*border-bottom:1px solid #EAEAEA;*/
	margin:0px 0px 20px 0px;
	padding-bottom:20px;
}

.title-bar h1 {
	float:left;
}

.title-bar .nav {
	clear:left;
	/* padding-top:20px */
}

.title-bar-toolbar {
	float:right;
}

.button-bar {
	overflow:auto;
	border-bottom: 1px solid #EAEAEA;
	margin: 0px 0px 20px 0px;
	padding-bottom: 20px;
}

.button-bar-top {
	border-bottom: 1px solid #EAEAEA;
	margin: 0px 0px 20px 0px;
	padding-bottom: 20px;
}

.panel.with-nav-tabs > .panel-heading{
	padding: 5px 5px 0 5px;
}
.panel.with-nav-tabs .nav-tabs{
	border-bottom: none;
}
.panel.with-nav-tabs .nav-justified{
	margin-bottom: -1px;
}

.nav-pills a {
	color:#666;
}

.nav-pills>li.active>a, .nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
	background-color: #224088;
}

.nav>li>a:focus,
.nav>li>a:hover {
	background-color:#e3f0f3;
}

.navbar-default .navbar-nav>li>a:focus,
.navbar-default .navbar-nav>li>a:hover {
	background-color:#e3f0f3;
}

.navbar-default .navbar-nav>.active>a,
.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
	color:white;
	background-color:#224088;
}

.fc-highlight {
	background:#FF00FF !important;
	opacity:0.75 !important;
}

.navbar-fixed-bottom, .navbar-fixed-top {
}

.timeline-error {
	color:red;
}

h3 {
	color:#224088;
	font-size:20px;
	font-weight:bold;
	margin-top:20px;
}

.inv-outstd-balance {
	color:red;
}

.email-status-error {
	color:red;
}

.large-explanation {
	text-align:center;
	padding:70px;
	font-size:20px;
	font-style:italic;
}

.total-row {
	font-weight:bold;
}

.row-overdue {
	color:red;
	font-weight:bold;
}

#login-panel {
	background:#fff;
	padding:30px;
	height:100%;
	text-align:center;
	width:500px;
	margin:auto;
	max-width:100%;
	margin-top:50px;
	border-radius:20px;
}

#login-button {
	margin-top:30px;	
}

#main-container {
	min-height:100%;
	margin-top:70px;
}

#main-container.main-container-full-width {
	margin-top:55px;
}

#current-page-container {
	height:100%;
	background:#fefefe;
	padding:20px;
	border-radius:8px;
	margin-bottom:20px;
}

#current-page {
}

h1, h2, h3, h4 {
	color:#224088;
}

.panel-default .panel-heading {
	background-color:#224088;
	color:white;
}

.panel-default {
	border-color:#d8deec;
}

.btn-white {
	background-color:#fff;	
	color: #153173 !important;
}

.btn-info,
.btn-primary {
	color: #fff;
	background-color: #224088;
	border-color: #224088;
}

.btn-info:hover,
.btn-info:active,
.btn-info:focus,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:focus {
	background-color: #153173 !important;
	border-color: #153173 !important;
}

.text-info,
.control-label {
	color:#224088 !important;
}

th {
	color:#FFF;
	background-color:#224088 !important;
	border:none !important;
	padding:10px 15px !important;
}

.ui-datepicker-calendar th {
	padding:5px !important;
}

.table-borderless td {
	border: none !important;
}

th:first-child {
	border-top-left-radius:4px;
}

th:last-child {
	border-top-right-radius:4px;
}

.ui-datepicker-calendar th:first-child {
	border-top-left-radius:0px !important;
}

.ui-datepicker-calendar th:last-child {
	border-top-right-radius:0px !important;
}

.input-group-btn .btn {
	background-color:#eee;
}

.btn-cancel {
	background:#aaa;
	color:#fff;
}

.btn-light-grey {
	background:#eee;
}

.btn-cancel:hover,
.btn-cancel:focus,
.btn-cancel:active {
	background:#989898;
	color:#fff;
}

.padded-info-text {
	text-align:center;
	padding:30px !important;
	
}

.search-result-archived {
	color: #ccc;
}

.search-result .glyphicon {
	color:#224088;	
}

.search-result-supplier .glyphicon {
	color:#aaa;	
}

.tagsinput {
	display: block;
	width: 100%;
	height: 34px;
	padding: 6px 12px;
	font-size: 14px;
	line-height: 1.42857143;
	color: #555;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
	border-radius: 4px;
	-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
	-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
	-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
	padding: 12px;
	padding-left: 5px;
	cursor:text;
}

/**************************************************/
/* Dropzone                                       */
/**************************************************/

.dropzone {
	border:4px dashed #224088  !important;
	position:relative;
}

.dz-message {
	position: absolute;
	top: 50%;
	margin-top: -12px !important;
	left: 50%;
	margin-left: -110px !important;
	text-align:center !important;
	font-size:20px;
}

.dz-filename {
	margin-top:35px;
}

/**************************************************/
/* Loading/spinners				                  */
/**************************************************/

.load-overlay {
	color:#224088;
	font-size:30px;
	background-color:#FFF;
	animation: fade-in 0.25s linear;
	animation-delay:0ms;
	opacity:0.75;
	z-index: 10000;
}

@keyframes fade-in {
	0% { opacity: 0 },
	100% { opacity: 0.75 }
}

.spinner {
	margin: 0px auto;
	margin-bottom:20px;
	width: 50px;
	height: 40px;
	text-align: center;
	font-size: 10px;
}

.spinner > div {
	background-color: #224088;
	height: 100%;
	width: 6px;
	display: inline-block;
	-webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
	animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.spinner .rect2 {
	-webkit-animation-delay: -1.1s;
	animation-delay: -1.1s;
}

.spinner .rect3 {
	-webkit-animation-delay: -1.0s;
	animation-delay: -1.0s;
}

.spinner .rect4 {
	-webkit-animation-delay: -0.9s;
	animation-delay: -0.9s;
}

.spinner .rect5 {
	-webkit-animation-delay: -0.8s;
	animation-delay: -0.8s;
}

@-webkit-keyframes sk-stretchdelay {
	0%, 40%, 100% { -webkit-transform: scaleY(0.4) }  
	20% { -webkit-transform: scaleY(1.0) }
}

@keyframes sk-stretchdelay {
	0%, 40%, 100% { 
		transform: scaleY(0.4);
		-webkit-transform: scaleY(0.4);
	}
	20% { 
		transform: scaleY(1.0);
		-webkit-transform: scaleY(1.0);
	}
}

/**************************************************/
/* Reusable components                            */
/**************************************************/

/* Panel */
.clickable-row td:not(.non-clickable) {
	cursor:pointer;
}

.cursor-pointer {
	cursor:pointer;
}

.clickable-table tr:not(.non-clickable) td:not(.non-clickable) {
	cursor:pointer;
}

.clickable-row:hover td,
.clickable-table tr:hover td {
	background-color:#EEE;
}

.clickable-row.row-selected:hover td {
	background:#ececf9;
}

.row-danger {
	color: #721c24;
	background-color: #f8d7da;
}

.row-danger td {
	border-color: #f5c6cb !important;
}

.row-danger.clickable-row:hover td {
	background-color:#f0a8ae !important;
	border-color:#f0a8af;
}

.row-success {
	color: #155724;
	background-color: #d4edda;
}

.row-success td {
	border-color: #c3e6cb;
}

.row-success.clickable-row:hover td {
	background-color:#b7e1c1 !important;
	border-color:#93d2a2;
}

.row-warning {
	color: #8a6d3b;
	background-color: #fcf8e3;
}

.row-warning td {
	border-color: #faebcc;
}

.row-warning.clickable-row:hover td {
	background-color:#f5e8a3 !important;
	border-color:#f6daa2;
}

.subtle-text {
	border:1px solid #ccc;
	width:100%;
	padding:7px;
}

.subtle-text:not(:focus):not(:active):not(:hover) {
	border:1px solid white !important;
	outline:none;
	box-shadow:none !important;
}

.task-completed {
	color:#ababab;
	text-decoration:line-through;
}

/* Tables */

table.sortable-table thead tr .header {
	background-image: url(/images/table-sort-bg.gif);
	background-repeat: no-repeat;
	background-position: center right;
	cursor: pointer;
}

table.sortable-table thead tr .headerSortUp {
	background-image: url(/images/table-sort-asc.gif);
}

table.sortable-table thead tr .headerSortDown {
	background-image: url(/images/table-sort-desc.gif);
}

td.padded-cell,
tr.padded-cell td,
tr.padded-cell th {
	padding:16px !important;
}

tr.no-padding td,
td.no-padding {
	padding:0px !important;
}

table.no-vertical-lines td {
	border-left:none !important;
	border-right:none !important;
}

/* Text boxes */
textarea.auto-expand {
	overflow:hidden;
	resize:none;
}

.row-urgent {
	color:red;
	font-weight:bold;
}

/* Search box */

.search-panel {
	display:none;
	/*z-index:2110;*/
	z-index:50000;
	background:white;
	border:1px solid #ccc;
	border-bottom-left-radius:4px;
	border-bottom-right-radius:4px;
}

.search-panel-message p {
	font-style:italic;
	margin:0px;
	color:#00F;
	text-align:center;
	padding:10px;
}

.search-results {
	list-style:none;
	margin:0px;
	padding:0px;
	overflow-y:scroll;
}

.search-results li {
	margin:0px;
	padding:10px;
	cursor:pointer;
}

.search-results li:hover,
.search-results li:hover .search-result-plumber-name {
	background:#224088;
	color:white;
}

.search-results li .glyphicon {
	margin-top:2px;
}

.search-results li:hover .glyphicon {
	color:white !important;
}

.search-result-title {
	font-weight:bold;
	margin-left:30px;
}

.search-result-subtitle {
	font-size:12px;
	padding-left:30px;
	/* margin-top:5px; */
}

label.error {
	color:red;
	margin-top:5px;
}

input.error, 
select.error,
textarea.error {
	border-color:red;
}

@media print {
	body {
		-webkit-print-color-adjust: exact;
	}

	.navbar {
		display: none !important;
	}

	#main-container {
		margin-top: 0px !important;
	}
	
	body.modal-open #main-container,
	.modal-overlay {
		display:none;
		width:0px;
		height:0px;
		position:absolute;
	}
	
	body.modal-open .modal {
		position:absolute;	
		top:0px;
		left:0px;
		width:100%;
		height:100%;
	}
	
	a[href]:after {
		content:none;
	}

	.modal-backdrop {
		background-color:white !important;
		opacity:1 !important;	
	}
	
	.modal-dialog {
		width:100% !important;
		max-width:100% !important;	
	}
	
	.modal-content {
		border:none !important;	
	}
	
	hr {
		display:none;	
	}
	
	.col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
		float: left;
	}
	.col-sm-12 {
		width: 100%;
	}
	.col-sm-11 {
		width: 91.66666667%;
	}
	.col-sm-10 {
		width: 83.33333333%;
	}
	.col-sm-9 {
		width: 75%;
	}
	.col-sm-8 {
		width: 66.66666667%;
	}
	.col-sm-7 {
		width: 58.33333333%;
	}
	.col-sm-6 {
		width: 50%;
	}
	.col-sm-5 {
		width: 41.66666667%;
	}
	.col-sm-4 {
		width: 33.33333333%;
	}
	.col-sm-3 {
		width: 25%;
	}
	.col-sm-2 {
		width: 16.66666667%;
	}
	.col-sm-1 {
		width: 8.33333333%;
	}
}

input[type=email] {
	text-transform:lowercase;	
}

.no-margin {
	margin:0px;	
}

.text-bold {
	font-weight:bold !important;	
}

.users-table label {
	font-weight:normal;
}

.dropdown-menu > li > label {
	display: block;
	padding: 3px 20px;
	clear: both;
	font-weight: normal;
	line-height: 1.42857143;
	color: #333;
	white-space: nowrap;
	font-weight:normal;
	margin-right:15px;
	user-select:none;
	cursor:pointer;
}

.dropdown-menu > li input[type=checkbox] {
	cursor:pointer;
}

.text-highlight {
	color:#224088 !important;
	font-weight:bold !important;
}

.text-lower {
	text-transform:lowercase;	
}

.text-upper {
	text-transform:uppercase;	
}

input[type=number].no-spinners::-webkit-inner-spin-button, 
input[type=number].no-spinners::-webkit-outer-spin-button { 
	-webkit-appearance: none; 
	margin: 0; 
}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
	display: none;
	-webkit-appearance: none;
	margin: 0; /* <-- Apparently some margin are still there even though it's hidden */
}

.ck-editor__editable {
	min-height: 400px;
}


.documents-container {
	overflow:auto;
}

.documents-container .document {
	width:153px;
	margin-right:10px;
	margin-bottom:10px;
	float:left;
}

.documents-container .document-preview {
	width:153px;
	height:153px;
	border:1px solid #ccc;
}

.documents-container .document-name {
	margin-top:10px;
}

.btn-default:not(.btn-info):not(.btn-primary) {
	color:#666;
}

.thin-gutter [class*="col"]:not(:first-child) { 
	padding-left: 5px;
}

.thin-gutter [class*="col"]:not(:last-child) { 
	padding-right: 5px;
}

.row-selected {
	color:#00F;
	background:#f4f4ff;
}

.row-grey,
.row-archived {
	color:#b5b5b5;
}

.log-out-panel {
	text-align:center;	
}

.no-bottom-margin {
	margin-bottom:0px !important;
}

.bottom-margin {
	margin-bottom:15px !important;
}

.top-margin {
	margin-top:15px;
}

.table .divider-row {
	background:#ddd;	
}

h2 {
	font-size:20px;
	margin-bottom:20px;
}

select {
	color:#555 !important;	
}

.absence-table {
	
}

.absence-table-header {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 100px;
}

.absence-table-day {
	width:32px;
	padding:5px !important;
	font-size:10px;
	text-align:center;	
}

.absence-block {
	position:absolute;
	overflow:hidden;
	cursor:pointer;
	z-index:1000;
	color:#fff;
	font-weight:bold;
	white-space:nowrap;
}


.absence-table-container {
	position:absolute;
	overflow:hidden;
}

.absence-table th,
.absence-table td {
	height: 40px;
	vertical-align: middle;
}

.invisible-date-picker {
	position:absolute;top:0px;left:0px;width:100%;height:100%;opacity:0;cursor:pointer
}

.sortable-table th {
	cursor:pointer;
}

th.sorted.ascending:after {
	content: "  \2191";
}

th.sorted.descending:after {
	content: " \2193";
}

.inline-block {
	display:inline-block;
}

.modal-dialog {
	margin-bottom:150px;
}

.form-control-static {
	/*border: 1px solid #eaeaea;*/
	border-radius: 8px;
	padding-left: 12px;
	background-color: #f7f7f7;
}

.todo-circle {
	display:inline-block;
	width:18px;
	height:18px;
	border-radius:18px;
	vertical-align:middle;
	margin-right:10px;
}

.due-status-not-due .todo-circle {
	background:#5cb85c;
}

.due-status-nearly-due .todo-circle {
	background:#f0ad4e; 
}

.due-status-overdue {
	/*color:red;*/
}

.todo-in-progress {
	color: #ccc;
}

.todo-in-progress .todo-circle {
	opacity: 0.5
}
.due-status-overdue .todo-circle {
	background:#d9534f;
}

.job-error {
	color:red;
}

.cursor-pointer {
	cursor:pointer;
}

.subtodo-heading {
	color:#224088 !important;
	font-weight:bold;
}

.subtodo-nonheading {
	width:95%;
	float:right;
}

.todo-completed {
	color:#ccc;	
}

.other-service-item-name {
	font-style:italic;
	text-align:center;
	margin-top:5px;
}

/*.equipment-grid-icon:hover .equipment-grid-location-icon {
	display:none;
}

.equipment-grid-icon:hover .equipment-grid-expand-icon {
	display:block;
}

.equipment-grid-icon .equipment-grid-expand-icon {
	display:none;
	}*/


	.equipment-table {
		font-size:12px;	
	}

	.equipment-table tr {
		cursor:pointer;
		user-select:none;
	}

	.equipment-table tr:not(.row-selected):hover td {
		background-color:#EEE;
	}

	.equipment-table .row-selected {
		background-color:#cbd4ea;
		color:#333;
	}

	.equipment-table-block {
		width:32px;
		display:table-cell;
		float:left;
	}

	.equipment-table-name-cell {
		padding:0px !important;
	}
	
	.equipment-table-name-container {
		padding:8px;
	}
	

	.equipment-table-row-buttons {
		float:right;
		padding:5px;
	}

	.equipment-table-out-of-order {
		color:#ff5e00
	}
	
	.equipment-table-condemned {
		color:#F00;
	}

	.equipment-table-archived {
		color:#c1c1c1;
	}
	
	.vehicle-table-archived {
		color: #c1c1c1;
	}

	.equipment-table-checked {
		color:#00F !important;
	}

	.equipment-table .equipment-table-empty {
		display:none;
	}

	.equipment-table.dragging .equipment-table-location,
	.equipment-table.dragging .equipment-table-empty {
		background-color:#ffffec;
	}

	.equipment-table.dragging .equipment-table-empty {
		display:table-row !important;
	}

	.task-row-highlighted {
		background-color:#cbd4ea;
		color:#333;
	}

	.ui-sortable-helper {
		display: table;
	}

	.equipment-table .drag-drop-target {
		outline:5px solid yellow !important;
	}

	.equipment-table .drag-handle {
		display:none;
	}

	.equipment-table tr:hover .drag-handle {
		display:inline-block;
	}

	.jobs-table {
		font-size:12px;	
	}

	.outstanding-equipment-table {
		font-size:12px;	
	}

	.alternatives-table {
		font-size:12px;	
	}

	.notes-table {
		font-size:12px;
	}

	.parts-table, 
	.parts-table .subtitle {
		font-size:12px;
	}

	.part-types-table {
		font-size:12px;
	}

	.equipment-types-table {
		font-size:12px;
	}

	.parts-table .row-checked {
		color:#00F;
	}
	
	.parts-table tr.po-req .highlight-if-po-req {
		font-weight: bold;
		background-color: #FFB9B9;
	}
	
	body:not(.modal-open){
		padding-right: 0px !important;
	}

	.image-panel {
		position:relative;
		border:1px solid #e8e8e8;
		height:400px;
		background-size:contain;
		background-position:center;
		background-repeat:no-repeat;
		/*background-color:#000	*/
		background-color:#e8e8e8;
	}

	.image-panel-tool {
		display:none;
	}

	.image-panel:hover .image-panel-tool {
		display:block;
	}

	.cropper-image {
		height:700px;
	}

	.cropper-preview {
		overflow:hidden;
		margin:auto;
	}

	.cropper-preview-container {
		border:1px solid #e8e8e8;
		background:#e8e8e8;
		/*margin-left:15px;*/
	}

	.copy-site-info-this-site {
		font-weight:bold;
	}

	.copy-site-info-same {
		
	}

	.copy-site-info-different {
		
	}

	#map {
		height: 700px;
	}

/*
html, body {
	height: 100%;
	margin: 0;
	padding: 0;
}
*/
.notes-table {
	font-size:12px;
}

.user-job-info {
	margin-top:10px;
}

.user-job-info,
.user-job-info .btn,
.user-job-info a {
	font-size:12px;
	color:#00F;
}

.add-multiple-jobs-table {
	font-size:12px;
}

.sortable-cell {
	cursor:pointer;
}

.part-ready-to-fit-info {
	font-size:12px;
	color:#00F;
	margin-top:5px;
}

.blink {
	animation: blinker 1s linear infinite;
}

@keyframes blinker {
	50% {
		opacity: 0.3;
	}
}

.part-could-not-fit-reason {
	font-weight:bold;
	color:red;	
	margin-top:15px;
}

.part-obsolete-warning {
	font-weight:bold;
	color:red;	
	margin-top:15px;
}

.floating-site-details-panel {
	position: fixed;
	top: 0px;
	left: 0px;
	background-color: #ffffff;
	padding: 20px;
	border: 2px solid red;
	z-index: 1000;
	display: none;
	width: 370px;
	height: 300px;
}

.floating-site-details-panel .field-header {
	font-weight: bold;
}

.floating-site-details-panel .field-header:not(:first-child) {
	margin-top: 13px;
}

.centralised-checkbox {
	display: flex;
	align-items: center;
	margin: 0px;
	height: 34px;
}

.centralised-checkbox input {
	width: 20px;
	height: 20px;
	margin-right: 10px;
	margin-top: 0px;
	margin-bottom: 0px;
}
