/*************************************************************
	 DIGITIST ADMIN PANEL STRUCTURE WITH OFF-CANVAS NAV
*************************************************************/
/* BRAND COLORS
blue: #005aab 

*/

/*
	ref:
		http://scotch.io/tutorials/off-canvas-menus-with-css3-transitions-and-transforms
		http://codepen.io/ncerminara/full/KJjiD/
*/

/*
.modal-body {
	max-height:70vh !important;
	overflow-y:auto !important;
}
*/

/*
.modal-body {
	max-height:40vw !important;
}

.bootbox-body {
	max-height:40vw;
	overflow-y:auto;
}
*/

/* @NOTE: This is a bugfix for Bootbox v5 and BS4 */
.modal-header{
	display: block !important;
}
/* @NOTE: END BUGFIX */

div#admin-wrapper {
	position:relative;
	overflow-x:hidden;
	overflow-y:hidden;
	width:100%;
	min-height:95vh; /* For full height browser window 1/2 */
}

div#admin-wrapper.show-nav div#admin-canvas {
    -webkit-transform: translateX(230px); /* this must match site-menu `left` */
    transform: translateX(230px);

	-webkit-transform: translateX(230px) tranlateZ(0);
	transform: translateX(230px) tranlateZ(0);

	-webkit-transform: translate3d(230px, 0, 0);
	transform: translate3d(230px, 0, 0);
}

div#admin-canvas {
	position:relative;
	background-color:transparent;
	width:100%;
	height:100%;

	/* attempt to mitigate browser canvas painting issues */
	-webkit-backface-visibility: hidden;
    backface-visibility: hidden;

	/* CSS3 Transitions with graceful degradation for GPU hardware acceleration */
    -webkit-transform: translateX(0);
    transform: translateX(0);

	-webkit-transform: translateX(0) translateZ(0);
	transform: translateX(0) translateZ(0);

	-webkit-transform: translate3d(0, 0, 0);
	transform: translate3d(0, 0, 0);

    -webkit-transition: .3s linear all;
    transition: .3s linear all;
}

.crud-section {
	border:1px solid #d9d9d9;
	padding:15px;
}

.crud-section h2 {
	margin-top:10px;
}

div#admin-menu {
	position:absolute;
	top:0;
	left:-230px; /* this relates to the width */
	width:300px;
	height:100%;
	min-height:95vh; /* For full height browser window 2/2 */
	background:#f6f6f6;
	padding:25px;
	border-sizing:border-box;
	border-right:1px solid #d9d9d9;
}

div#admin-menu h3 {
	color:#ccc;
	font-weight: lighter !important;
}

nav#nav-sidebar ul {
	position:relative;
	left:-25px;
	width:300px;
	list-style-type:none;
	background-color:#fff;
	padding-left:0px !important;
	border-right:1px solid #d9d9d9;
	margin-top:50px;
}

nav#nav-sidebar ul li {
	padding-left:25px;
	opacity:0.9;
}

nav#nav-sidebar ul li.active {
	background-color:#d9d9d9;
	opacity:1 !important;
}

nav#nav-sidebar ul li:nth-child(even) {
}

nav#nav-sidebar ul li:hover {
	opacity:1;
	background-color:#005bab;
}

nav#nav-sidebar ul li:hover a {
	color:#fff !important; 
}

nav#nav-sidebar ul li a {
	display:block;
	padding-top:20px;
	padding-bottom:20px;
	color:#3987c0;
	font-size:18px;
}

nav#nav-sidebar ul li a {
	text-decoration: none !important;
}

nav#nav-sidebar ul li a i.fa {
	font-size:1.4em;
	position:relative;
	top:8px;
	right:22px;
	float:right;
}

/* Font awesome alignment fix for this particular revenue icon */
nav#nav-sidebar ul li[data-mod-id="revenue"] > a > i {
	right:25px;
}

div#admin-menu i#nav-bars {
    position: absolute;
    top: 30px;
    right: 27px;
    color: rgba(80,80,80,0.5);
    cursor: pointer;
    cursor: hand;
}

div#admin-content {
	margin-left:70px;
	min-height:1000px;
}

.show-nav div#admin-content {}
/*********** END ADMIN PANEL STRUCTURE ***********************/

/*********** CUSTOMER COMPONENTS ***************/
/* Dropdown checkbox menu */
ul.dropdown-menu-form {
    padding: 5px 10px 0;
    max-height: 300px;
    overflow-y: scroll;
}

ul.dropdown-menu-form li {
	display:block;
	margin-left:40px;
	padding-right:20px;
}

/* DATATABLES */
ul.pagination {}

/* Row selected */
table.dataTable {
	margin-bottom:20px !important;
	border:1px solid #f0f0f0;
}

table.dataTable tbody tr.selected {}

table thead {
	font-size:15px;
}

div.dataTables_info {
	font-style:italic;
	font-size:12px;
}

/* END DATATABLES */
.debug-box {
	color:white;
	background-color:blue;
	text-align:left;
	margin:auto;
	display:block;
	padding:10px;
	width:100%;
	opacity:0.8 !important;
	border:15px solid #000;
	overflow-y:scroll;
}

.debug-box code {
	color:#fff;
	background-color:#000;
	font-size:11px;
}


/*************************************************************
	SCIOTO VENDING ADMIN SYSTEM STYLESHEET
*************************************************************/
/*
	desaturated blue (ex top bar) : #d0dce5
*/

/* Remove functionality from visibly disabled items */
/* @TODO: this doesnt seem to work reliably, investigate 
  		or handle in js */
/*
a[disabled],
button[disabled],
li[disabled],
li[disabled] a
{ 
	pointer-events: none !important; 
}
*/ 

html {}

body {
	background:#f7f7f8 url('/assets/img/bg_greyzz.png');
	font-family: 'Lato', 'Open Sans', 'Arial', sans-serif !important;
	border-top:7px solid rgba(161,214,242,0.3);
}

div.signin-bg {
	background: url('/assets/img/cafebg.jpg') no-repeat;
	background-size: 100%;
	min-height: 600px !important;	
}

div.signin-form {
	border:1px solid #fff;
	background-color:rgba(255,255,255,0.75);
	padding:20px;
}

div#admin-canvas {
	border-top:2px solid #fff;
	background:rgba(255,255,255,0.95);
	box-sizing:border-box;
}

div#admin-menu {
	box-sizing:border-box;
}

header {
	border:none !important;
}

div.modal-header,
div.modal-footer {
	font-family: 'Lato', 'Open Sans', 'Arial', sans-serif !important;
	background-color:#f0f0f0;

/*	background: #cbd2e2; /* Old browsers */
/*
	background: -moz-linear-gradient(45deg,  #cbd2e2 0%, #e2c9d0 100%); /* FF3.6+ */
/*	background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#cbd2e2), color-stop(100%,#e2c9d0)); /* Chrome,Safari4+ */
/*	background: -webkit-linear-gradient(45deg,  #cbd2e2 0%,#e2c9d0 100%); /* Chrome10+,Safari5.1+ */
/*	background: -o-linear-gradient(45deg,  #cbd2e2 0%,#e2c9d0 100%); /* Opera 11.10+ */
/*	background: -ms-linear-gradient(45deg,  #cbd2e2 0%,#e2c9d0 100%); /* IE10+ */
/*	background: linear-gradient(45deg,  #cbd2e2 0%,#e2c9d0 100%); /* W3C */
/*	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cbd2e2', endColorstr='#e2c9d0',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */	
}

div.modal-body label {
	margin-bottom:1px;
}

.notification-indicator {
	background-color:rgba(194, 47, 88, 1) !important;
	color:#fff !important;
}

div.navbar {
	background:#f7f7f8 url('/assets/img/bg_greyzz.png');
	border-bottom:1px solid #d9d9d9;
	box-shadow: 0 2px 6px rgba(0,0,0,0.15);
}

h1, h2, h3, h4, h5 {
	margin:0px;
	margin-top:10px;
	margin-bottom:15px;
	color:rgba(0,0,20,0.75);
	text-rendering:optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

.sorting_1,
.sorting_2 {
	border-right:1px #d9d9d9 dashed !important;
	border-left:1px #d9d9d9 dashed !important;
}

h1 {
	font-size:46px;
	font-weight:300;
	color:rgba(0,100,200, 0.71);
	display:block;
	padding-bottom:15px;
	margin-bottom:30px;
	border-bottom:1px solid #ddd;
}


h2 {
	opacity:1;
	font-weight:600;
	font-size:21px;
	margin:40px 0px 20px 0px;
	padding-top:0px;	
}

h3 {
	font-size:16px;
}

p {
	font-size:18px;

}


div.df-crud-dialog {
	display:none;
}

a {
	color:#0064cd;
}

div.row.toolbar {
	margin-top:20px;
	margin-bottom:20px;
}

a.navbar-brand {
	font-weight:bold;
}

li.dropdown ul.dropdown-menu {
	border:none !important;
	border-color:transparent !important;
	border-image:none !important;
	outline:none !important;
	margin-right:2px !important;
}

li.dropdown ul.dropdown-menu li {
	font-size:14px;
}

li.dropdown {
	background-color:transparent;
}

li.dropdown:hover {
	background-color:rgba(255,255,255,0.2);
}

li.module_submenu > a {
	color:#fff !important;
	background:#0053a2 !important;
}

li.module_submenu.open > a,
li.module_submenu.open > a:hover,
li.module_submenu.open > a:focus {
	background-color:rgba(194, 47, 88, 1) !important;
}

.navbar-default .navbar-nav>.open>a, 
.navbar-default .navbar-nav>.open>a:hover, 
.navbar-default .navbar-nav>.open>a:focus
{
	background-color:#3987c0;
	color:#fff;
}

.dimmed {
	opacity:0.2;
}

/* Change transparency of placeholder text on inputs */
/*
::-webkit-input-placeholder { 
	opacity:0.6;
	font-style:italic;
	font-weight:300;
}
:-moz-placeholder { 
	opacity:0.6;
	font-style:italic;
}
::-moz-placeholder { 
	opacity:0.6;
	font-style:italic;
}
:-ms-input-placeholder { 
	opacity:0.6;
	font-style:italic;
}
*/

nav {}
select {}
select option {}


/* Bootstrap 3 overrides */
.badge {
	color:#fff;
	background-color:lightblue;
}


.navbar-wrapper {
	background:transparent;
}

.navbar-default {
}

.navbar-nav > li > a {
	line-height:60px;
	font-size:16px;
}

.navbar-nav > li:first-child {
/*	margin-left:50px;*/
}

a.navbar-brand img {
/*	margin-left:20px !important;*/
}


div.navbar-collapse {
}

div.navbar-collapse ul.nav {
}

a.navbar-brand {
	display:block;
	color:#333 !important;
}

ul.nav li {
	-webkit-font-smoothing: antialiased;
	text-rendering:optimizeLegibility;
}

ul.nav li.active a {
	background:#d0dce5 !important;
	color:#fff !important;
}

ul.nav li a {
}

ul.nav li a:hover {
}

div#PageContent {
	padding:20px;
	padding-top:20px;
}

footer {
	text-align:center;
	padding-top:20px;
	padding-bottom:20px;
	background:#1d1d1d;
	color:#fff !important;
	font-style:italic;
	height:100%;
	min-height:100px;
	display:block;
}

footer a {
	color:#16baff !important;
}

footer h5 {
	color:#fff;
}

.form-control {
	margin-bottom:10px;
}

/* DATA TABLES */
div.dataTables_wrapper {
	border:1px solid #d9d9d9;
	border-radius:4px;
	padding:20px;
	width:100%;
}

/*************************************************************
	 PSEUDO STYLES (CLASSES)
*************************************************************/
/* for honeypot - hide off screen */
._hp_input {
	position:absolute;
	left:-9999px;
}

tr.strike td {
	text-decoration: line-through !important;
}

tr.bold td {
	font-weight:bold !important;
}

/* Print styles */
@media print {}

/*==================================================
=            Bootstrap 3 Media Queries             =
==================================================*/

/*==========  Non-Mobile First Method  ==========*/

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {

}

/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {

}

/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {

}

/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
	div.navbar-header {
		min-height:170px !important;
	}
}

/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {

}

/*************************************************************
	 UI COMPONENTS
*************************************************************/
/* WIZARD PROGRESS STEPS AS WITH OPPORTUNITY UI */
.bs-wizard {margin-top: 40px;}

/*Form Wizard*/
.bs-wizard {border-bottom: solid 1px #e0e0e0; padding: 0 0 10px 0; margin-bottom:40px;}
.bs-wizard > .bs-wizard-step {padding: 0; position: relative;}
.bs-wizard > .bs-wizard-step + .bs-wizard-step {}
.bs-wizard > .bs-wizard-step .bs-wizard-stepnum {color: #595959; font-size: 16px; margin-bottom: 5px;}
.bs-wizard > .bs-wizard-step .bs-wizard-info {color: #999; font-size: 14px;}
.bs-wizard > .bs-wizard-step > .bs-wizard-dot {position: absolute; z-index:10; width: 30px; height: 30px; display: block; background: #fbe8aa; top: 50px; left: 50%; margin-top: -15px; margin-left: -15px; border-radius: 50%;} 
.bs-wizard > .bs-wizard-step > .bs-wizard-dot:after {content: ' '; width: 14px; height: 14px; background: #fbbd19; border-radius: 50px; position: absolute; top: 8px; left: 8px; } 
.bs-wizard > .bs-wizard-step > .progress {position: relative; border-radius: 0px; height: 8px; box-shadow: none; margin: 20px 0;}
.bs-wizard > .bs-wizard-step > .progress > .progress-bar {width:0px; box-shadow: none; background: #fbe8aa;}
.bs-wizard > .bs-wizard-step.complete > .progress > .progress-bar {width:100%;}
.bs-wizard > .bs-wizard-step.active > .progress > .progress-bar {width:50%; background:#cae6fc !important;}
.bs-wizard > .bs-wizard-step:first-child.active > .progress > .progress-bar {width:0%;}
.bs-wizard > .bs-wizard-step:last-child.active > .progress > .progress-bar {width: 100%;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot {background-color: #f5f5f5;}
.bs-wizard > .bs-wizard-step.disabled > .bs-wizard-dot:after {opacity: 0;}
.bs-wizard > .bs-wizard-step:first-child  > .progress {left: 50%; width: 50%;}
.bs-wizard > .bs-wizard-step:last-child  > .progress {width: 50%;}
.bs-wizard > .bs-wizard-step.disabled a.bs-wizard-dot{ pointer-events: none; }
/*END Form Wizard*/
/* END WIZARD PROGRESS STEPS */

ul.dropdown-checkbox li label {
	padding-left:5px;
}

/* BUTTONS */
button.btn-primary {
/*	background-image: radial-gradient(circle, #0053a2 80%, #003c76 81%);*/
	border-radius:0px;
	background:#005aab;
}

button.btn-default {
	background:#939598;
	border-radius:0px;
	color:#fff !important;
	/*background-image: radial-gradient(circle, #fcfcfc 80%, #ececec 81%);	*/
}

button.btn-default:hover {
}

button.btn-danger {
	border-radius:0px;
}

.pagination>.active>a, .pagination>.active>span, .pagination>.active>a:hover, .pagination>.active>span:hover, .pagination>.active>a:focus, .pagination>.active>span:focus {
	color: #ffffff;
	background-color: #0053a2;
	border-color: #0053a2;
}

/* DATATABLE */

/* Override jquery additional header sorting icons */
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting
{
	background-image:none !important;
}

.dataTables_wrapper .dataTables_paginate .paginate_button:hover {
	border:none;
	background:none !important;
	color:#333;
}

.paginate_button:hover {
	background:none !important;
	color:#333;
}

/* End overrides */
div.table-responsive input[type=search] {
	border:1px solid #d9d9d9;
}

div.dataTables_wrapper {
	border-radius:2px;
	box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}

table.dataTable thead tr {
	background-color: rgb(230, 230, 230);
	background-image: linear-gradient(rgb(255, 255, 255), rgb(255, 255, 255) 25%, rgb(230, 230, 230));
	color:#000;
}

table.dataTable thead tr th {
	border-right:1px solid transparent;
	text-transform:uppercase;
	border-bottom:1px solid #d9d9d9;
}

table.dataTable thead tr th:hover {
	background-image:none !important;
	background-color:#fcfcfc !important;
}

table.dataTable tbody tr {}

table.dataTable tbody td {
	padding-left:20px;
	font-size:14px;
}

table.dataTable tbody tr:hover {
	background-color:#eee;	
	cursor:pointer;
	cursor:hand;
}

table.dataTable tbody tr.selected {
	-webkit-transition: all 0.2s ease-in-out;
    transition: all 0.4s ease-in-out;
    background-color:#eaf5fa !important;
    color:#000 !important;
}

table.dataTable.no-footer {
	border-bottom:1px solid #d9d9d9;
}

table.dataTable button.dropdown-toggle {
	font-size:10px;
}

table.dataTable.white tbody tr {
	background-color:#f0f0f0;
	color:#333;
}

table.dataTable.white tbody tr.selected {
	background-color:#aaa !important;
	font-weight:bold;
}

table.dataTable.white tbody tr:hover {
	background-color:#ccc !important;
	cursor:pointer;
	cursor:hand;
}

div.panel.white {
	background-color:transparent;
	border:1px solid #fff;
}

/* DASHBOARD COMPONENTS */
div.statbox-container {}

div.statbox {
	display:block;
	min-height:200px;
	color:#111;
	background-color:#ccc;
	padding:20px;
	border-bottom:1px solid #fff;
	margin-bottom:30px;
	opacity:0.9;
}

div.statbox:hover {
	opacity:1;
}

div.statbox .title {
	font-size:26px;
	font-weight: lighter;
}

div.statbox .number {
	font-size:60px;
}


div.statbox .comment {
	font-size:13px;
}

.dp_red,
.dp_blue {
	color:#fff !important;
}

.dp_red {
	background-color:#9b3451 !important;
}

.dp_blue {
	background-color:#144d82 !important;
}

/*************************************************************
	 SUBPAGE STYLES
*************************************************************/
/* Sign in page */
form#frmSignin {
}

html#page_signin h1 {
	margin-bottom:15px;
}

/* responsive image */
.img-r {
	max-width:100%;
}


.nav-submod {
	margin-top:30px;
	margin-bottom:30px;
}

div.parcel-detail-notes {
	border-bottom:1px solid #ccc;
	padding:25px;
	padding-bottom:50px;
}

div.opportunity-engineer-inspection-report {
	padding:15px;
	padding-bottom:40px;
	border-top:1px solid #ccc;
	border-bottom:1px solid #ccc;
}

table.table-datadisplay tr td:first-child {
	font-weight:bold;
}

.table-margined {
	margin-top:50px;
	margin-bottom:50px;
}

div.opportunity-engineer-inspection-report h1 {
	margin-bottom:30px;
}

div.form-group {
	padding:10px;
	border:1px solid rgba(80,80,80,0.12);
	border-radius:5px;
	background-color:rgba(119,200,242,0.12);
}

div.form-group label {
	text-transform: uppercase;
	font-size:14px;
}

ul.nav-tabs li a {
	font-size:18px;
}

ul.nav-tabs.tab-graybg {
	background-color:#f0f0f0;
}

ul.nav-tabs.tab-graybg li {
	border-right:1px solid #d9d9d9;
}

.dashboard-widget {
	background:rgba(240, 240, 242, 0.6);
	padding:10px;
	min-height:200px;
	margin:20px;
	border:1px solid #d9d9d9;
}

.dashboard-widget label {
	font-size:20px;
	display:block;
}

.dashboard_widget_desc {
	display:block;
	color:#aaa;
}

.dashboard_widget_value {
	display:block;
	font-size:36px !important;
	float:right;
	position:absolute;
	right:60px;
	bottom:20px;
}

.dashboard_widget table td {
	border-bottom:1px solid #ddd;
}



/* Extra Small Devices, Phones */ 
@media only screen and (max-width : 480px) {
	.dashboard_widget_value {
		display:block;
		font-size:21px !important;
	}
}
