﻿html {    
    font-size: 0.88em;

    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
}

body {
    font-family: "Noto Sans", Helvetica,Arial,sans-serif;
    font-size: 0.88em;
    margin: 0;
    line-height: normal;
    color: #000;
}

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 {
  font-weight: 500;
  line-height: 1.1;
}

select::-ms-expand {
    width:12px;
    border:none;
    background:#fff;
}

/* Disable up/down arrows in chrome MC20160601 */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0; 
}

/* Disable up/down arrows in firefox MC20160601 */
input[type='number'] {
    -moz-appearance:textfield;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

label {
    font-weight:600;
}

h1 {
    text-transform: uppercase;
    font-size:1em;
    color: rgba(0, 59, 134, 1);
}

input, select, textarea, button {
    color: rgba(71, 70, 86, 1);
    font-style: normal;
    line-height: 1.16em;
    letter-spacing: 0em;
    border: 1px solid rgb(204, 204, 204);
    border-radius: 4px;
    padding:4px;
}

input[type="checkbox"], input[type="radio"] {
    border: 1px solid #0064a4;
    margin: 0;
}

select ~ .form-control-feedback {
    margin-right: 15px;
}

select[multiple] ~ .form-control-feedback {
  margin-right: 0;
}

span.form-control-feedback.glyphicon.glyphicon-asterisk  {
    color:#a94442;
}

pre {
    font-family: "Noto Sans", Helvetica,Arial,sans-serif;
    background: transparent;
}

.modal-title {
    font-weight:600;
}

.modal-header, .modal-heading {
    font-size:16px;
    color: #333;
    font-weight:normal;
}

.form-header {
    font-size:1.2em;
    color: #474656;
    margin-bottom:20px;
    border-bottom:solid 1px #e5e5e5;
    padding-bottom:10px;
}

.form-control {
    font-size:1em;
}

.control-label {
	text-align: left !important;
    font-weight:normal;
}

.modal-footer {
    border-top:1px solid #e5e5e5;
}

/***************************
*
* Legacy support
*
***************************/

@media (min-width: 992px) {
    div.standardpadding {
        padding: 40px;
    }
}

@media (max-width: 991px) {
    div.standardpadding {
        padding: 10px;
    }
}

h1 
{
	margin-bottom:0;
	padding-bottom:0;
	margin-top:0;
	padding-top:0;
	font-size:2em;
	font-weight:normal;
}

p.underh1 
{
	padding-bottom:10px;
	margin-right:50px;
}

div.notesunderh1 
{
    width: 700px;
    padding: 10px 10px 15px 20px;
    margin-bottom: 15px;
    background-color: #eef3f7;
    border: 1px solid #b3c5d2;   
    border-radius:6px;
}

div.notesunderh1 div.notesheader {
    font-weight: 600;
    padding-bottom: 5px;
    font-size: 14px;
}


/* Button Overrides */
.btn-primary:disabled {
    background-color: #7597bc;
    border-color: #7597bc;
    color:#fff;
}

.btn-primary:disabled:hover {
    background-color: #7597bc;
    border-color: #7597bc;
}

.btn-primary {
    background-color: #003f84;
    border-color: #003f84;
    color: #fff;    
}

.btn-primary:hover{
    background-color: #003f84;
    border-color: #0064a4;
    color: #fff;    
}

.btn-secondary{
    background-color: #FFFFFF;
    color: rgba(0, 100, 164, 1);
    border-color: rgb(0, 100, 164);
}

.btn-secondary:hover{
    color: rgba(0, 100, 164, 1);
    background-color: #FFFFFF;
    border-color: rgb(0, 100, 164);
}

.btn-warning{
    background-color: #ffbe00;
    border-color: #ffbe00;
}

.btn-warning:hover {
    background-color: #ffbe00;
    border-color: #ffbe00;
    color: #fff;
}

h2 
{
	margin-bottom:0;
	padding-bottom:0;
	margin-top: 25px;
	padding-top:0;
	font-size:1.7em;
}

h3 {
    padding:0; 
    margin: 0; 
    font-size:1.5em; 
    font-weight:bold; 
    margin-bottom:5px;
    margin-top: 15px;
}

h4 {
    padding:0; 
    margin: 0; 
    font-size:1.3em; 
    font-weight:normal; 
    margin-bottom:5px;
    margin-top: 10px;
}

h5 
{
	font-size:1em;
    font-weight: bold;
	padding:5px 0 10px 0;
	margin:0;
	
}

h6 
{
	font-size:1em;
    font-weight: normal;
    text-decoration: underline;
	padding:5px 0 10px 0;
	margin:0;
}

div.smallbutton 
{
	background:url(Images/tabback2.jpg) repeat-x scroll center center #EEEEEE;
	padding:2px 3px;
	border:solid 1px #aaa;
	font-size:11px;
	cursor:pointer;
	min-width:70px;
}

div.smallbutton.hover 
{
	background-image:url(Images/tabback2_highlight.jpg);
}

div.smallbutton .down 
{
	background:url(Images/arrowdown.gif) no-repeat right center; 	
}

div.smallbutton .up 
{
	background:url(Images/arrowdown.gif) no-repeat right center; 	
}

div.smallbuttonoptions 
{
	padding-right:5px;
	padding-bottom:5px;
	background:url(Images/shadow.png) no-repeat bottom right;
	z-index: 9999;
}

div.smallbuttonoptions .inner 
{
	background:white;
	border:solid 1px #aaa;
	padding:2px;
	width:150px;
}

div.smallbuttonoptions .inner .item 
{
	border-top:solid 1px #aaa;
	padding:3px;
}

div.smallbuttonoptions .inner :first-child 
{
	border-top:none;
}

div.smalltabset {
    margin-bottom: 12px;
    min-height: 26px;
    padding-top: 4px;
}

div.smalltabset div.tab 
{
    color: rgba(71, 70, 86, 1);
    text-align: center;
    line-height: 0.75em;
    letter-spacing: 0.03em;
    border-bottom: 2px solid rgb(175, 174, 193);
    padding-left: 44px;
    padding-right: 44px;
    padding-top: 11px;
    padding-bottom: 11px;
    float: left;
}

div.smalltabset div.tab.selected {
    color: rgba(35, 82, 143, 1);
    border-bottom: none;
    border-left:  2px solid rgb(175, 174, 193);
    border-top:  2px solid rgb(175, 174, 193);
    border-right:  2px solid rgb(175, 174, 193);
}

div.smalltabsetpage 
{
	padding:20px;
	display:none;
}

input[type=file] 
{
	background:#fff;
}

ul,ol
{
	/*margin:0;
	padding: 0px 0 3px 25px;*/
}

li 
{
	margin:0;
	padding:0;
}

a {
    color:rgba(0, 100, 164, 1);
}

b,strong {
    font-weight:600;
}

/*div.filterbox {
    padding:5px;
}*/


/*.ui-slider-horizontal {
	border: 1px solid #ccc !important;
	height: 2px !important;
    margin-top: 10px;
}

.ui-slider-horizontal .ui-slider-handle {
	top: -.9em !important;
}

.ui-slider .ui-slider-handle {
    background: #0064a4 !important;
    color: #FFF !important;
    width: 48px !important;
    height: 25px !important;
    Border-radius: 4px !important;
    margin: -5px -24px auto !important;
    font-family: "Noto Sans", Helvetica,Arial,sans-serif !important;
    Font-Size: 0.75em !important;
    Font-Style: normal !important;
    Text-Align: center !important;
    Line-Height: 1.16em !important;
    Letter-Spacing: 0 !important;
    padding-top: 4px !important;;
    z-index: 2 !important;;
}

.ui-slider .ui-slider-handle i{
    padding: 3px;
    margin:0;
}

.ui-slider .ui-slider-handle label{
    padding: 2px;
    margin:0;
}*/


/* File Upload, Profile Photo Change */

.drop-box {
    background: no-repeat url(Images/picker_sprite-v107.png);
    background-position: -35px -390px;	
    border: 5px dashed #DDD;
    width: 74px;
    height: 86px;
    text-align: center;
    padding-top: 6px;
    margin: auto;
}
.dragover {
	opacity: 1.0 !important;
}

.drag-photo-here-icon{
    background: no-repeat url(Images/picker_sprite-v107.png);
    opacity: .4;
    background-position: -35px -390px;
    width: 74px;
    height: 86px;
    /* cursor: pointer; */
    display:inline-block;
}



/* Page Loading Hover Container */

div.hovercontainer {
    height:20em;
    position: relative; 
}

div.hovercontainer .sk-circle {
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-right: -50%;
    transform: translate(-50%, -50%); 
}

/* Pagination */
.pagination > .active > a, .pagination > .active > a:focus, .pagination > .active > a:hover, .pagination > .active > span, .pagination > .active > span:focus, .pagination > .active > span:hover {
    background-color: #003B86; 
    border-color: #003B86;
}

.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
    color: #003B86;
}

.pagination > li > a, .pagination > li > span {
    color: #003B86;
}

.sidbartabs {
    border:solid 1px #ccc;
    background-color:#eee;
    padding:0px;
    color: rgba(54, 52, 70, 1);
    height:100%;
}

.sidbartabs ul {
    width:100%;
}

.sidbartabs li {
    border-bottom:solid 1px #ccc;
    background-color:#eee;
    margin:0px;
}

.sidbartabs li > a{
    color: rgba(54, 52, 70, 1);
}

.sidbartabs li+li {
     margin:0px;
}

.sidbartabs li.active>a {
    background-color:#fff;
    border-radius: 0px;
    color: rgba(54, 52, 70, 1);
    margin-right: -1px;
}

.sidbartabs li.active>a:focus, .sidbartabs li.active>a:hover {
    background-color:#fff;
    border-radius: 0px;
    color: rgba(54, 52, 70, 1);
    margin-right: -1px;
}

.sidbartabs li > a:focus, .sidbartabs li > a:hover {
    background-color:#fff;
    border-radius: 0px;
    color: rgba(54, 52, 70, 1);
    margin-right: -1px;
}

.sidbartabs-btn {
    color:rgba(54, 52, 70, 1);
    background-color: #fff;
    border: solid 1px #ccc;
    border-radius: 0px;
    margin:0px;
}

.sidbartabs-btn[disabled] {
    color:#ccc;
    cursor:default;
}

@media (max-width: 992px) {
  .sidbartabs-btn {
    width:100%;
  }
}
.sidbartabs-tabcontainer {
    height:calc(100% - 36px);
    overflow-y:auto;
    overflow-x:hidden;
}

@media (max-width: 992px) {
  .sidbartabs-tabcontainer {
    height:calc(100% - 108px);
  }
}

input[type="submit"]:disabled, button:disabled{
    background-color: #fff;
    border: 1px solid #ccc;
    color: #ccc;
}

.validated-input:after{
    position: absolute;
    font-family: "FontAwesome";
    top:10px;
}

.validated-input.percentage:after{
    content: "\f295";
    right: 30px;
}

.validated-input.required:not(.ok):not(.loading):not(.clear) > select,
.validated-input.required.ok:not(.loading):not(.clear) > select {
    -webkit-appearance: none;
}

.validated-input.select.required:not(.ok):not(.loading):not(.clear):before,
.validated-input.select.required.ok:not(.loading):not(.clear):before {
    content: "▼";
    position: absolute;
    top: 0;
    right: 30px;
    height: 100%;
    font-size: 70%;
    padding: 10px 7px;
    pointer-events: none;
    z-index: 1000;
}

.validated-input.required:not(.ok):not(.error):not(.loading):not(.clear):after{
    color: #a94442;
    content: "\f069";
    font-size: 10px;
    z-index: 1000;
    right: 20px;
}

.validated-input.ok:after{
    color: green;
    content: "\f00c";
    right: 20px;
}

.validated-input.error:after{
    color: #a94442;
    content: "\f00d";
    z-index:1000;
    right: 20px;
}

.validated-input.loading:not(.select):after{
    color: #ccc;
    content: "\f1ce";
    -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);
  }
}

select[required] option {
    color: #555;
}
select[required] option:nth-child(1) {
    color: rgb(169,169,169);
}
select[required][value=""] {
    color: #aaa;
}

.button.save{
    position: relative;
}

.button.save:after{
    position: absolute;
    font-family: "FontAwesome";
    top:10px;
    right: -15px;
}

.button.save.ok:after{
    color: green;
    content: "\f00c";
}
.button.save.error:after{
    color: red;
    content: "\f00d";
}
.button.save.loading:after{
    color: #ccc;
    content: "\f1ce";
    -webkit-animation: spin 1000ms infinite linear;
     animation: spin 1000ms infinite linear;
}

.form-group > label.has-error {
  color: #a94442;
}

.help-block.has-error {
  color: #a94442;
}

/**
* #.# toggle-switch
*
* css for toggles created by the angular <toggle></toggle> directive
*/
.toggle-switch {
    overflow: hidden;
    position: relative;
    cursor: pointer;
    text-align: center;
    width: 38px; 
    height: 20px;
    margin-top: 4px;
}

.toggle-switch-container {
    position: absolute;
    top: 0;
    left: 0;
    padding:0;
    margin:0;
    transition: left 0.35s;
	-webkit-transition: left 0.35s;
	-moz-user-select: none;
	-webkit-user-select: none;
    height: 100%;
    width: 150%;
}

.toggle-switch-container.off {
    left: -50%;
}

.toggle-switch-handle {
    height: 100%;
    position: absolute;
    padding:0;
    border-width: 0 1px 0 1px;
    left: 50%;
    width: 20px; 
    height: 18px; 
    margin: 0 0 0 -10px;
}

.toggle-switch-on {
    width:20px;
    position: absolute;
    left: 0;
    right: 50%;
    border: 0;
    padding: 0 2px 0 0;
    text-transform: uppercase;
    border-radius: 0;
    font-size: 7px;
    text-align: center;
    vertical-align: middle;
    height: 18px; 
    line-height: 18px;
}

.toggle-switch-off {
    width:20px;
    position: absolute;
    right: 0;
    border: 0;
    border-radius: 0;
    font-size: 7px;
    text-align: center;
    padding: 0 0 0 2px;
    text-transform: uppercase;
    height: 18px; 
    line-height: 18px;
}

.toggle-switch-container.standby {
    left: -25%;
}

.toggle-switch-container.standby .toggle-switch-on{
    background-color: #d4d4d4;
    color: #d4d4d4;
}

.toggle-switch-container.standby .toggle-switch-off{
    background-color: #d4d4d4;
    color: #d4d4d4;
}



/**
* #.# Model Sizes
*
* Additional model size classes xl (extra large) and fs (full screen)
*/

.modal-fs {
    width: 100%;
    margin: 0;
    padding: 20px;
}

.modal-xl {
    width: 80%;
}

.modal-body {
    width: 100%;
}

/**
* #.# table-fixedheader
*
* Fixed headers for bootstrap tables
*/

/*
Force table width to 100%
*/
table.table-fixedheader {
  width: 100%;
}

/*
Set table elements to block mode.  (Normally they are inline).
This allows a responsive table, such as one where columns can be stacked
if the display is narrow.
*/
table.table-fixedheader,
table.table-fixedheader>thead,
table.table-fixedheader>tbody,
table.table-fixedheader>thead>tr,
table.table-fixedheader>tbody>tr,
table.table-fixedheader>thead>tr>th,
table.table-fixedheader>tbody>td {
  display: block;
}


table.table-fixedheader>thead>tr:after,
table.table-fixedheader>tbody>tr:after {
  content: ' ';
  display: block;
  visibility: hidden;
  clear: both;
}

/*
When scrolling the table, actually it is only the tbody portion of the
table that scrolls (not the entire table: we want the thead to remain
fixed).  We must specify an explicit height for the tbody.  We include
100px as a default, but it can be overridden elsewhere.

Also, we force the scrollbar to always be displayed so that the usable
width for the table contents doesn't change (such as becoming narrower
when a scrollbar is visible and wider when it is not).
*/
table.table-fixedheader>tbody {
  overflow-y: scroll;
  height: 100px;
}

/*
We really don't want to scroll the thead contents, but we want to force
a scrollbar to be displayed anyway so that the usable width of the thead
will exactly match the tbody.
*/
table.table-fixedheader>thead {        
  overflow-y: scroll;
}

/*
For browsers that support it (webkit), we set the background color of
the unneeded scrollbar in the thead to make it invisible.  (Setting
visiblity: hidden defeats the purpose, as this alters the usable width
of the thead.)
*/
table.table-fixedheader>thead::-webkit-scrollbar{
  background-color: inherit;
}

/*
We want to set <th> and <td> elements to float left.
We also must explicitly set the width for each column (both for the <th>
and the <td>).  We set to 20% here a default placeholder, but it can be
overridden elsewhere.
*/
table.table-fixedheader>thead>tr>th,
table.table-fixedheader>tbody>tr>td {
        width: 20%;
        float: left;
}

.loading-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    cursor: progress;
}

.interval-selector-type {
    width: 180px;
    margin-right:5px;
    float:left;
}

.interval-selector-string {
    float:left;
    display:table;
}

.interval-selector-auto-picker {

  position: absolute;
  z-index: 1000;
  padding: 5px 0;
  margin: 2px 0 0;
  font-size: 14px;
  text-align: left;
  list-style: none;
  background-color: #fff;
  -webkit-background-clip: padding-box;
          background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
          box-shadow: 0 6px 12px rgba(0, 0, 0, .175);
}

.interval-selector-auto-picker-item {
    cursor: pointer;
    display: block;
    padding: 3px 20px;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
}

.interval-selector-auto-picker-item:hover {
    color: #262626;
    text-decoration: none;
    background-color: #f5f5f5;
}

.advanced-select-active {
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7;
}

.advanced-select-active:hover {
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7;
}

.advanced-select-item-container {
    border-radius: 0px !important;
    border: 1px solid #1e90ff !important;    
    font-size: 0.88em !important;
    padding: 0px !important;
}

.advanced-select-item-container .advanced-select-item-paging
{
    padding: 4px;
    background: #f7f7f7;
}

.advanced-select-item-container .advanced-select-item-paging > *
{
    margin-left: 2px;
    margin-right: 2px;
}

.advanced-select-item-container .advanced-select-item-paging .display 
{
    display: inline-block;
}

.advanced-select-item-container .advanced-select-item-paging button
{
    width: 24px;
}

.advanced-select-item-container .advanced-select-item-table {
    height: 200px;
    overflow-y: auto;
    overflow-x: hidden;
}

.advanced-select-item-container .advanced-select-item-row {
    cursor: pointer;
    border-bottom: 1px solid #ccc;
}

.advanced-select-item-container .advanced-select-item-row.item-selected {
    background-color: #1e90ff;
    color: #fff;
}

.advanced-select-item-container .advanced-select-item-column {
    padding: 4px;
    overflow: hidden;
	white-space: nowrap;
}