.detailcard{
  box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12);
  margin: 0px 0px 25px 0px;
}
.detailheader{
  background-color: #f0f2f4;
  padding: 10px 20px; 
}

.signalSearchControl {
  margin-top: 5px;
  margin-right: 5px;
  display: inline-flex;
}

/*********************** STYLES FOR COLLAPSIBLE PANELS ************************/

.panel-title a {
  display: inline-block;
  width: 100%;
}
.panel-title a[aria-expanded="true"]:after {
  font-family: 'Font Awesome 5 Free';
  content: "\f054";
  font-weight: 400;
  float: right;
  padding-left: 5px;
}

.panel-title a[aria-expanded="false"]:after {
  font-family: 'Font Awesome 5 Free';
  content: "\f078";
  font-weight: 400;
  float: right;
  padding-left: 5px;
}

/*********************** STYLES FOR ERROR PAGE ************************/
.coverBG {
  color: #fff;
  text-align: center;
  text-shadow: 0 2px 4px rgba(0,0,0,.5);
  box-shadow: inset 0 0 75pt rgba(0,0,0,.8);
  background-color: #21232a;
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  vertical-align: middle;
}

.cover {
  margin: 50px;
}

/*********************** STYLES FOR LOADER ANIMATION ************************/

#pageloader {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 1;
  height: 150px;
  margin: -75px 0 0 -75px;
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;
  width: 120px;
  height: 120px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

 /*********************** FOOTER ************************/
.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important}

html, body, #root, #patriot-root, #patriot-container {
  height: 100%;
  margin: 0;
}

#patriot-body {
  min-height: 100%;
  margin-bottom: -80px; /* the bottom margin is the negative value of the footer's height */
}

#footer, .footerSpacer {
  margin-top: 5px;
  height: 75px;
}

#footer {
  width: 100%;
  text-align: center;
}

#footer > p {
  margin: 0px;
}

 /*********************** SIDEBAR ************************/

.sideBarMenuContainer {
  width: 100%;
  height: auto;
  margin-right: 0px;
  margin-left: 0px;
  font-size: 1.1em;
}

.sideBarMenuContainer .navbar-toggle {
  float:left;
  margin-left: 14px;
}

.sidebar .navbar-nav > li > a:hover {
  background-color: #c0ccd0;
}

.sidebar.navbar {
  margin-bottom: 0px;
}

/* Pad the parent items */
nav.sidebar li a {
  padding-left: 10px;
  padding-right: 0px;
  padding-top: 15px;
  padding-bottom: 15px;
}

/* Pad the parent items */
nav.sidebar li.active a {
  padding-bottom: 10px;
}

nav.sidebar li .nav li a {
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 20px;
}

nav.sidebar li .nav li.active a {
  background-color: #D8DADD;
}

nav.sidebar li .nav li.active a:hover {
  background-color: #D8DADD;
}

nav.sidebar li .nav li a:hover {
  background-color: #D8DADD;
}

/* Add some space between the active parent nav link and the active children */
li.active .toplevelnav {
  padding-bottom: 10px;
}

/* Gives active sidemenu item a border to indicate it is selected */
nav.sidebar li.active {
  border-left-style: solid;
  border-left-width: 5px;
  border-color: #999;
}

/* Remove border style from any child links */
nav.sidebar li.active li {
  border-style: none;
  border-width: 0;
  padding-left: 0px;
}

nav.sidebar .navbar {
  min-height: 0px;
  border: 0px;
}

.list-heading {
  background-color: #D0D0D4;
}

/* Default lists have a lot of vertical padding between items, so reduce this. */
.list-group-item {
  padding: 2px 15px;
}

.call-order-group {
  margin-bottom: 4px;
}

/* Default button styles have a lot of vertical padding, so reduce this. */
.btn-padding-sm {
  padding: 4px 10px;
}

/*------------------------------------------------------*/

.btn-padding-xs {
  padding: 1px 10px;
}

/*------------------------------------------------------*/

 /* Now change for big screen: make sidebar nav vertical */ 
@media (min-width: 768px) {
  .sideBarBuffer {
    margin-left: 220px;
  }
  .sideBarMenuContainer {
    width: 220px;
  }
  nav.sidebar .container-fluid {
    padding-left:0px;
    padding-right:0px;
  }
  nav.sidebar .navbar-collapse {
    padding-left:0px;
    padding-right:0px;
  }
}

nav.sidebar .navbar-brand {
    margin-right: 0px;
}

/*Remove rounded corners*/
nav.sidebar :global(navbar) {
    border-radius: 0px;
}

nav.sidebar {
    -webkit-transition: margin 200ms ease-out;
    -moz-transition: margin 200ms ease-out;
    -o-transition: margin 200ms ease-out;
    transition: margin 200ms ease-out;
}

/* .....NavBar: Icon only with coloring/layout.....*/
nav.navbar-inverse {
  margin-bottom: 0px;
}

@media ( min-width : 768px) {
    

    /*gives sidebar width/height*/
    nav.sidebar {
        width: 220px;
        height: 100%;
        float: left;
        margin-bottom: 0px;
    }

    nav.sidebar li {
        width: 100%;
    }

    nav.sidebar:hover {
        margin-left: 0px;
    }
    :global(.forAnimate) {
        opacity: 0;
    }
}

/* .....NavBar: Fully showing nav bar..... */
@media ( min-width : 1330px) {

    /*Show all nav*/
    nav.sidebar {
        margin-left: 0px;
        float: left;
    }
    /*Show hidden items on nav*/
    nav.sidebar :global(.forAnimate) {
        opacity: 1;
    }
}

nav.sidebar :global(.navbar-nav) :global(.open) :global(.dropdown-menu)>li>a:hover, nav.sidebar :global(.navbar-nav) :global(.open) :global(.dropdown-menu)>li>a:focus
    {
    color: #222;
    background-color: transparent;
}

nav:hover :global(.forAnimate) {
    opacity: 1;
}

 /*********************** CUSTOM CLASSES ************************/
.leftAlignList
{
  max-width: 720px;
}

.nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus {
    color: #fff;
    background-color: #306080;
}

.patriotGreyBG
{
  background-color: #b4c8d1;
}

.btn-toolbar > button, .btn-toolbar > a {
  margin-left: 5px;
}

.form-horizontal .btn-group {
  vertical-align: top
}

.contactInfo {
  margin: 4px 0px 4px 0px;
}
.contactLabel {
  margin-left: 4px;
}

.callOrderLabel {
  margin: 4px 0px 0px 0px;
  background-color: #8a9ec1;
  color: white;
  padding: 4px 10px;
  border-radius: 4px;
}

.armedColor
{
	color: #C05050;
}

.disarmedColor
{
	color: #20B020;  
}

.testModeColor
{
	color: #FF7221;  
}

.rightSpacer {
  margin-right: 6px;
}

.signalContainer {
  margin-right: 10px;
  display: inline;
}

.action-plan-icon {
  margin-right: 10px;
}

.search-form {
  margin-top: 10px;
  margin-bottom: 10px;
}

 /*********************** GENERAL STYLES ************************/
.table th {
    background-color: #b2bdc3;
}
a {
  text-decoration: none;
}
a:hover,
a:focus {
  text-decoration: underline;
}
.text-primary {
  color: #904049;
}
@media (min-width: 768px) {
  .dl-horizontal dt {
    float: left;
    clear: left;
    text-align: right;
  }
  .dl-horizontal dd {
    margin-left: 170px;
  }
}

@media screen and (max-width: 600px) {

    .custom-header h1 {
        display:none;
    }

    .custom-header h2 {
        display:none;
    }

    .custom-header img {
	    height: 36px;
	    width: auto;
    }

    h2 {
      font-size: 25px;
    }

    /* Hide non-essential table column(s) */
    .table-detail-column {display:none;}
    
}
.table > thead > tr > th,
.table > tbody > tr > th {
  vertical-align: bottom;
  border-bottom: 2px solid #ddd;
  background-color: #b4c8d1
}
.navbar {
  min-height: 44px;
  border: 1px solid transparent;
  border-radius: 0;
}

.navbar-nav {
  margin: 0px;
}

.custom-header h1{
    color: #F0F0F0;
    font-size: 2em;
    margin: 0; 
    display:inline;
}

.custom-header h2{
    color: #B0B0B0;
    font-size: 1.0em;
}

.custom-header img{
    vertical-align:bottom;
    padding: 0px 10px 0px 0px;
    display:inline;
}

.custom-header {
    margin: 0px;
    padding: 16px;
    text-align: center;
    background-color: #50616b;
}

.dl-horizontal dt 
{
   white-space: normal;
   width: 160px;
   margin-right: 15px;
}