/*******************************************************************************
This adjustment to body prevents scrollbars from switching to transparent
mode and overlaying text and images in Internet Explorer.
*******************************************************************************/
body {
    -ms-overflow-style: scrollbar;
}

footer {
    margin-bottom: 10px;
    color: #00a587;
    text-align: center;
}

/*******************************************************************************
This provides us with the space we need for the Comtrol
banner at the top of each page.
*******************************************************************************/
.banner {
    margin-top: 10px;
    margin-bottom: 10px;
    color: #00a587;
	background-color: #fff;
}

/*******************************************************************************
Navigation bar color schemes for P+F Comtrol
*******************************************************************************/
.navbar-default {
	background-color: #00a587;
	border: none
}

.navbar-default .navbar-brand {
	color: #fff
}

.navbar-default .navbar-brand:focus,
.navbar-default .navbar-brand:hover {
	color: #fff;
}

.navbar-default .navbar-text {
	color: #fff
}

.navbar-default .navbar-nav>li>a {
	color: #fff
}

.navbar-default .navbar-nav>li>a:focus,
.navbar-default .navbar-nav>li>a:hover {
	color: #333;
	background-color: transparent
}

.navbar-default .navbar-nav>.active>a {
	color: #8d9095;
	background-color: #fff;
	border: 1px solid #fff
}

.navbar-default .navbar-nav>.active>a:focus,
.navbar-default .navbar-nav>.active>a:hover {
	color: #333;
	background-color: #fff
}

.navbar-default .navbar-nav>.disabled>a,
.navbar-default .navbar-nav>.disabled>a:focus,
.navbar-default .navbar-nav>.disabled>a:hover {
	color: #fff;
	background-color: transparent
}

.navbar-default .navbar-nav>.open>a,
.navbar-default .navbar-nav>.open>a:focus,
.navbar-default .navbar-nav>.open>a:hover {
	color: #333;
	background-color: #00cca7;
	border-color: #00cca7
}

.navbar-default .navbar-toggle,
.navbar-default .navbar-toggle:focus,
.navbar-default .navbar-toggle:hover {
	border-color: #fff;
	background-color: #fff
}

.navbar-default .navbar-toggle .icon-bar {
	background-color: #00a587
}

.dropdown-menu .divider {
	background-color: #cccccc
}

.dropdown-menu>li>a {
	color: #00a587;
}

.dropdown-menu>li>a:focus,
.dropdown-menu>li>a:hover {
	color: #333;
	text-decoration: none;
	background-color: transparent
}

@media (max-width:767px) {
	.navbar-default {
		border: 1px solid transparent;
		border-width: 0 0 1px;
		border-color: #cccccc;
	}

	.navbar-default .navbar-collapse,
	.navbar-default .navbar-form {
		background-color: #fff
	}

	.navbar-default .navbar-nav>li>a {
		color: #00a587
	}

	.navbar-default .navbar-nav>.open>a,
	.navbar-default .navbar-nav>.open>a:focus,
	.navbar-default .navbar-nav>.open>a:hover {
		color: #333;
		background-color: transparent;
		border-color: transparent
	}
}

/*******************************************************************************
Alert Panels for P+F Comtrol
*******************************************************************************/
.alert-success {
	color: #2b552b;
	background-color: #c2e2b6;
	border-color: #bcdba3
}

.alert-danger,
.alert-warning,
.alert-info {
	color: #214a5f;
	background-color: #d5ebf6;
	border-color: #abe2ed
}

/*******************************************************************************
This class is used to hide form fields on a page for spam prevention.
*******************************************************************************/
.required {
    display: none;
}

/*******************************************************************************
For placing a "welcome user" banner on the navigation bar.
*******************************************************************************/
.glyphicon.glyphicon-welcome-user {
    color: #fff;
    font-size: 16px;
}

.navbar-text.navbar-text-welcome-user {
    color: #fff;
    margin-right: 0;
    margin-left: 0;
}

@media (max-width:767px) {
	.glyphicon.glyphicon-welcome-user {
		color: #00a587;
	}

	.navbar-text.navbar-text-welcome-user {
		color: #00a587;
	}
}

/*******************************************************************************
Standard element adjustments - all P+F Comtrol
*******************************************************************************/
h1 {
    padding-bottom: 9px;
    margin: 5px 0 10px 0;
    border-bottom: 1px solid #00a587;
    font-size: 26px;
    font-family: arial;
    font-weight: normal;
    color: #00a587;
    text-transform: uppercase;
}

h2 {
    color: #00a587;
    font-size: 22px;
    margin: 20px 0 10px 0;
}

h3 {
    color: #00a587;
    font-size: 16px;
    font-style: italic;
    font-weight: bold;
    margin: 20px 0 10px 0;
}

h3.panel-title {
    font-style: normal;
    font-weight: normal;
}

h3.panel-title > a,
h3.panel-title > a:active,
h3.panel-title > a:hover,
h3.panel-title > a:focus {
    color: #333;
}

h4 {
    color: #00a587;
    font-size: 16px;
    font-style: italic;
    border-bottom: 1px solid #00a587;
    border-top: 1px solid #00a587;
    padding-bottom: 10px;
    padding-top: 10px;
    margin-top: 20px;
    margin-bottom: 15px;
}

h5 {
    font-family: arial !important;
    font-size: 16px !important;
    font-weight: bold;
    padding: 0px !important;
    border-bottom: 1px solid #00a587;
    line-height: 22px;
    clear: both;
    text-align: left;
}

ul.no-indent {
	padding: 0;
	margin-left: 1em;
}

a {
	color: #00a587;
}

a:active,
a:hover {
    color: #333;
	text-decoration: underline;
}

a.uhllspec:active,
a.uhllspec:hover {
    text-decoration: underline;
}

abbr.uhllspec,
abbr.uhllspec:active,
abbr.uhllspec:hover {
    color: #00a587;
}

/* We need a smaller, more readable font when generating
   tables with billing information.
*/
th.report,
td.report
{
    font-family: verdana;
    font-size: 8pt;
}

/* Give tooltips and popovers a P+F Comtrol theme */
.tooltip.in {
	filter: alpha(opacity=100);
	opacity: 1
}

.tooltip-inner {
	background-color: #00a587;
}

.tooltip.top-right .tooltip-arrow,
.tooltip.top-left .tooltip-arrow,
.tooltip.top .tooltip-arrow {
	border-top-color: #00a587
}

.tooltip.right .tooltip-arrow {
	border-right-color: #00a587
}

.tooltip.left .tooltip-arrow {
	border-left-color: #00a587
}

.tooltip.bottom-left .tooltip-arrow,
.tooltip.bottom-right .tooltip-arrow,
.tooltip.bottom .tooltip-arrow {
	border-bottom-color: #00a587
}

.popover-title {
	color: #fff;
	background-color: #00a587;
	border-color: #00a587;
}

.popover-content {
    white-space: pre-wrap;
}

/*******************************************************************************
An alert box has been added to the login card to display a message when the
user logs out or the session times out. This class just makes things look
pretty on the page.
*******************************************************************************/
.alert-logout {
    text-align: center;
    margin-top: 20px;
}

/*******************************************************************************
A narrow version of an alert makes its one line height the same as a button.
This makes things line up nicely when placed side by side with a button or
in situations where vertical space is limited.
*******************************************************************************/
.alert-narrow {
    padding: 6px 12px;
    margin-bottom: 0;
}

/* Size the panel border to match the panel content. */
.alert-trim {
    display: inline-block;
}

/*******************************************************************************
Daveka has create this new class to allow for a vertically stacked menu that
can be placed in a column anywhere on the page.
*******************************************************************************/
.nav-menu-stacked {
    margin-bottom: 15px;
}

.nav-menu-stacked > li {
    float: none;
}

.nav-menu-stacked > li > a {
    border-radius: 4px;
    background-color: #f8f8f8;
    border-color: #e7e7e7;
    color: #00a587;
}

.nav-menu-stacked > li + li {
    margin-top: 2px;
    margin-left: 0;
}

.nav-menu-stacked > li > a:hover,
.nav-menu-stacked > li > a:focus {
    color: #333;
    background-color: #f8f8f8;
}

.nav-menu-stacked > li.active > a,
.nav-menu-stacked > li.active > a:hover,
.nav-menu-stacked > li.active > a:focus {
    color: #555;
    background-color: #e7e7e7;
}

/*******************************************************************************
Comtrol panels have their own unique color schemes.
*******************************************************************************/
.panel {
    border-color: #00a587;
}

.panel-heading {
    color: #fff;
	background-color: #00a587;
}

.panel-footer {
	background-color: #f2f2f2;
	border-top: 1px solid #cccccc;
}

/*******************************************************************************
Comtrol accordion panels have their own unique color schemes.
*******************************************************************************/
.panel.accordion {
  border-color: #cccccc;
}

.panel.accordion > .panel-heading {
  color: #262626;
  background-color: #e6e6e6;
  border-color: #d9d9d9;
}

.panel.accordion > .panel-heading + .panel-collapse > .panel-body {
  border-top-color: #cccccc;
}

.panel.accordion > .panel-footer + .panel-collapse > .panel-body {
  border-bottom-color: #cccccc;
}

.panel.panel-uhllspec {
    border-color: #000000;
}

/*******************************************************************************
Comtrol buttons have their own unique color schemes.
*******************************************************************************/
.btn {
    color: #fff;
    background-color: #00a587;
    border-color: #00997d;
}

.btn:hover,
.btn:focus {
	color: #fff;
	background-color: #008068;
}

.btn:active,
.btn:active:hover,
.btn:active:focus {
	color: #fff;
	background-color: #004d3e;
}

/* Color udpates for pill tabs */
.nav-pills>li.active>a,
.nav-pills>li.active>a:focus,
.nav-pills>li.active>a:hover {
	color: #fff;
	background-color: #00a587
}

.list-group-item.active>.badge,
.nav-pills>.active>a>.badge {
	color: #00a587;
	background-color: #fff
}

/* Default checkboxes have too much spacing above and below for some scripts. */
.checkbox.checkbox-compact {
    margin-top: 0px;
    margin-bottom: 2px
}

/*******************************************************************************
Comtrol tables need to revert to a smaller font and use the global text
color.
*******************************************************************************/
.table {
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
    font-size: 14px;
    color: #333;
}

.table.table-uhllspec {
    border: 1px solid #000000;
    padding: 5px;
}

.table-uhllspec>thead>tr>th,
.table-uhllspec>tbody>tr>td,
.table-uhllspec>tfoot>tr>td { 
    border: 1px solid #000000;
    padding-top: 6px;
    padding-bottom: 6px;
}

.table.table-borderless,
.table-borderless>thead>tr>th,
.table-borderless>tbody>tr>td,
.table-borderless>tfoot>tr>td {
    border: none;
}

.table.table-compact {
    margin-bottom: 0;
}

.table-compact>thead>tr>th,
.table-compact>tbody>tr>td,
.table-compact>tfoot>tr>td {
    padding-top: 3px;
    padding-bottom: 3px;
}

.table.table-wide,
.table-wide>thead>tr>th,
.table-wide>tbody>tr>td,
.table-wide>tfoot>tr>td {
    padding-left: 0;
    padding-right: 0;
}

.uhllspec-notes {
    padding-left: 1em;
}

.uhllspec-notes>li {
    margin-bottom: 5px;
}

th.uhllspec-dfids-dfid,
td.uhllspec-dfids-dfid {
    width: 4%;
    text-align: center;
}

th.uhllspec-dfids-name,
td.uhllspec-dfids-name {
    width: 15%;
    text-align: left;
}

th.uhllspec-dfids-out,
th.uhllspec-dfids-in,
th.uhllspec-dfids-req,
td.uhllspec-dfids-out,
td.uhllspec-dfids-in,
td.uhllspec-dfids-req {
    width: 3%;
    text-align: center;
}

th.uhllspec-dfids-category,
td.uhllspec-dfids-category {
    width: 8%;
    text-align: center;
}

th.uhllspec-dfids-format,
td.uhllspec-dfids-format {
    width: 8%;
    text-align: center;
}

th.uhllspec-dfids-notes,
td.uhllspec-dfids-notes {
    width: 56%;
    text-align: left;
}

.mark.uhll-spec {
    color:#a94442;
    background-color:#f2dede;
}

.nav-tabs {
    border-bottom: 1px solid #00a587;
}

.nav-tabs>li>a {
    color: #00a587;
}

.nav-tabs>li>a:hover,
.nav-tabs>li>a:focus {
    color: #333;
    border-color: #fff #fff #00a587;
    background-color: #fff;
}

.nav-tabs>li.active>a,
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
    color: #8d9095;
    border: 1px solid #00a587;
    border-bottom-color: transparent
}

.glyphicon-spin {
    -webkit-animation: spin 1000ms infinite linear;
    animation: spin 1000ms infinite linear;
}

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

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