/*
 * Base structure
 */

/* Move down content because we have a fixed navbar that is 3.5rem tall */
body {
  font-family: Arial;
  padding-top: 55px;
  font-size: 0.85rem;
}

/*
 * Typography
 */

h1 {
  margin-bottom: 20px;
  padding-bottom: 9px;
  border-bottom: 1px solid #eee;
}

a {
	color: #066CA5;
}

a:hover {
	color: #3498DB;
}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
    color: #066CA5;
}

/* Sidebar */
.sidebar {
  position: fixed;
  top: 51px;
  bottom: 0;
  left: 0;
  z-index: 1000;
  padding: 20px;
  overflow-x: hidden;
  overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
  border-right: 1px solid #eee;
}

/* Sidebar navigation */
.sidebar {
  padding-left: 0;
  padding-right: 0;
}

.sidebar .nav {
  margin-bottom: 20px;
}

.sidebar .nav-item {
  width: 100%;
}

.sidebar .nav-item + .nav-item {
  margin-left: 0;
}

.sidebar .nav-link {
  border-radius: 0;
}

/*  Bootstrap overrides */

.bg-primary {
    background-color: #3e3f3a !important;
}

.bg-secondary {
    background-color: #8e8c84 !important;
}

.form-group {
  margin-bottom: 0.5rem;
}

.navbar {
	padding-top: 4px;
	padding-bottom: 4px;
}

.nav-link {
  color: #ffffff;
}

.navbar-dark .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
	color: #ee4723;
}

.bg-dark .dropdown-menu {
	background-color: #f2f2f2;
};

.bg-dark .dropdown-menu .dropdown-item, .bg-dark .dropdown-menu .dropdown-item:focus {
	background-color: #f2f2f2;
}

.bg-dark .dropdown-menu .dropdown-item {
	color: #000000;
}

 /* Placeholders */
.placeholders {
  padding-bottom: 3rem;
}

.placeholder img {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}

#content {
	padding: 10px;
}

.control-label {
	font-weight: 600;
	font-size: 0.85em;
}

.required-label {
	color: red;
	font-weight: bold;
}

.error, .validationError {
	color: red;
	font-weight: bold;
	font-size: .75rem;
}

/*   AJAX loading css */

/* Start by setting display:none to make this hidden.
   Then we position it in relation to the viewport window
   with position:fixed. Width, height, top and left speak
   for themselves. Background we set to 80% white with
   our animation centered, and no-repeating */
   
.loader {
    display:    none;
    position:   fixed;
    z-index:    1000;
    top:        0;
    left:       0;
    height:     100%;
    width:      100%;
    background: rgba( 0, 0, 0, .2 ) 
                url( "images/spinningGear.gif" ) 
                50% 50% 
                no-repeat;
}

/* Anytime the body has the loading class, modal element will be visible */
body.loading .loader {
    display: block;
}

/*  App-specific styles */

.ATS-orange {
	color: #EE4723;
}

.background-ats-orange {
	background-color: #EE4723;
}

.summary-label {
	font-weight: bold;
}

.summary-label2 {
	font-weight: bold;
	font-size: 0.85em;
}

.pass-label {
	font-weight: bold;
	color: green;
}

.fail-label {
	font-weight: bold;
	color: red;
}

.priorityDiv
{
	border: thin #EE4723 solid;
	text-align: center;
}
.priorityHead
{
	font-weight: bold;
}
.priority1
{
	background-color: #FF0000;
	padding: 4px;
	font-weight: bold;
}
.priority1label
{
	color: #FF0000;
	font-weight: bold;
}
.priority1sensor
{
	color: #FF0000;
	font-weight: bold;
	background-color: #B2A1C7;
	padding: 6px 6px 6px 6px;
}
.priority2
{
	background-color: #FF7F00;
	padding: 4px;
	font-weight: bold;
}
.priority2label
{
	color: #FF7F00;
	font-weight: bold;
}
.priority2sensor
{
	color: #FF7F00;
	font-weight: bold;
	font-size: .8em;
	background-color: #B2A1C7;
	padding: 6px 6px 6px 6px;
}
.priority3
{
	background-color: #FFD700;
	padding: 4px;
	font-weight: bold;
}
.priority3label
{
	color: #FFD700;
	font-weight: bold;
}
.priority3sensor
{
	color: #FFD700;
	font-weight: bold;
	background-color: #B2A1C7;
	padding: 6px 6px 6px 6px;
}
.priority4
{
	background-color: #009900;
	padding: 4px;
	font-weight: bold;
}
.priority4label
{
	color: #009900;
	font-weight: bold;
}
.priority4sensor
{
	color: #009900;
	font-weight: bold;
	background-color: #B2A1C7;
	padding: 6px 6px 6px 6px;
}
.priority5
{
	color: black;
	padding: 4px;
	font-weight: bold;
}
.priority5label
{
	color: black;
	font-weight: bold;
}
.priority5sensor
{
	color: black;
	font-weight: bold;
	background-color: #B2A1C7;
	padding: 6px 6px 6px 6px;
}
.priority6
{
	color: black;
	padding: 4px;
	font-weight: bold;
}
.priority6label
{
	color: black;
	font-weight: bold;
}
.priority6sensor
{
	color: black;
	font-weight: bold;
	background-color: #B2A1C7;
	padding: 6px 6px 6px 6px;
}
.orangeTitle
{
	color: #EE4723;
	font-weight: bold;
}
.limeGreen {
	color: #97C93D;
}
.sensor {
	/* background-color:  #B2A1C7; */
	border:  3px solid #B2A1C7;
	padding: 4px;
}
.sensor-row {
	border: 3px solid #B2A1C7 !important;
}
.grid-row {
	padding: 3px;
}

/*  Detail Table Formatting */

table.details {
	/* background-color: #E6E6E6; */
	/* border: 1px solid #97C93D; */
	width: 100%;
}
table.details thead tr th, table.details tfoot tr th {
	/* background-color: #E6E6E6; */
	border: 1px solid #97C93D;
	color: #666;
}
table.details thead tr .header {
	border: 1px solid #97C93D;
}
table.details tbody td {
	color: #3D3D3D;
	background-color: #FFF;
	border: 1px solid #97C93D;
	padding: 4px;
}
table.details tbody tr.odd td {
	background-color:#F0F0F6;
	border: 1px solid #97C93D;
}

.details-label {
	font-weight: bold;
}