/*/*
 * Copyright (c) 2015 Silver Peak Systems, Inc.
 * All rights reserved.
 */

html, body {
  height:100%;
  width:100%;
  position:relative;
  overflow:hidden;
}
body {
  font-family: tahoma, Arial, Helvetica, sans-serif;
  line-height: 1.2em;
  font-size: 11px;
  font-weight: normal;
  margin: 0px;
  color: #444;
}
/* lighten default font color for theme */
.ui-widget-content {
    color: #444 !important;
}
body.print {
  margin: 8px;
  background: #FFFFFF;
}
p {
  margin:0px;
}
p, li, td, th, label {
  font-size: 11px;
}
ul,ol,li{
  border:0;
  outline:none;
  margin:0;
  padding:0;
}
ul {
  list-style:none;
}
label {
  vertical-align:middle;
  display:inline-table;
  line-height: 24px;
}
.font12px {
    font-size: 12px;
}
.label_color {color:#606060;}
/* put any labels here that shouldn't be vertically spaced and assigned widths */
.ui-multiselect-checkboxes label, .mega-menu label, .appCheckbox ~ label, #customizeTable label {
  line-height:normal !important;
  vertical-align:inherit !important;
  display:inline !important;
}

.label_xsmall {
  width:80px;
}
.label_small {
  width:100px;
}
.label_med {
  width:160px;
}
.label_large {
  width:200px;
}
p.tbl_hdr {
  color: #FFFFFF;
  font-size: 11px;
  font-weight: bold;
}
p.tbl_data {
  font-size: 11px;
}
/* get rid of webkit outlines 
*:focus {
  outline: ;
}*/
A {
  text-decoration : none;
  color : #5555AA
}
A:hover {
  text-decoration : none;
  color : rgb(0, 176, 240);
}*
H2 {
  font-size: 19px;
  margin-bottom: 5px
}
H3 {
  font-size: 16px;
  margin-bottom: 5px
}
FORM {
  padding-top: 0px;
  padding-bottom: 0px;
  border-top: 0px;
  border-bottom: 0px;
  margin-top: 3px;
  margin-bottom: 3px;
}
/*layout helpers: spacers*/
.margin_5_imp{
  margin: 5px!important;
}
.margin_top2 {
  margin-top:2px;
}
.margin_top5 {
  margin-top:5px;
}
.margin_top10 {
  margin-top:10px;
}
.margin_top15 {
  margin-top:15px;
}
.margin_top20 {
  margin-top:20px;
}
.margin_top25 {
  margin-top:25px;
}
.margin_top30 {
  margin-top:30px;
}
.margin_top40 {
  margin-top:40px;
}
.margin_top50 {
  margin-top:50px;
}
.margin_bottom10 {
  margin-bottom:10px;
}
.margin_bottom5 {
  margin-bottom:5px !important;
}
.margin_bottom25{
  margin-bottom:25px !important;
}
.margin_left5 {
  margin-left: 5px;
}
.margin_left10 {
  margin-left:10px;
}
.margin_left15 {
  margin-left:15px;
}
.margin_left20 {
  margin-left:20px;
}
.margin_left30 {
  margin-left:30px;
}
.margin_left40 {
  margin-left:40px;
}
.margin_left50 {
  margin-left:50px;
}
.padding_left10 {
  padding-left: 10px;
}
.padding_left30 {
  padding-left: 30px;
}
.padding_left5 {
  padding-left:5px;
}
.padding_btm_5 {
  padding-bottom:5px
}
.padding_btm20 {
  padding-bottom:20px;
}
.margin_right5 {
  margin-right: 5px;
}
.margin_right10 {
  margin-right: 10px;
}
.margin_right15 {
    margin-right: 15px;
}
.margin_right20 {
  margin-right: 20px;
}
.margin_right30 {
  margin-right: 30px;
}
.min_width15em {
  min-width: 15em;
}
.min_width30em {
  min-width: 30em;
}
.width140 {
    width:140px;
}
.centerTxt {
    text-align:center;
}
.text_right {
  text-align: right;
}
/************************/
.content_pane_title {
  font-size: 16px;
  font-weight: bold;
  padding:0px 0px 5px 5px;
  color:#545454;
}
.inlineContainer {
  display:inline-block;
  vertical-align:top;
}
/*for table layout*/
.table {
  display:table;
  border-top:1px solid #ddd;
  border-left:1px solid #ddd;  
 }
 .th {
   display:table-header-group;
}
.tr {
  display:table-row;
}
.td {
  display:table-cell;
  border-right:1px solid #ddd;
  border-bottom:1px solid #ddd;
  padding: 2px 10px;
}
tr.hdr {
  background: #053868;
}
input, select, textarea {
  font-size: 11px;
  border:1px solid #ccc;
  border-radius: 2px;
  margin-bottom:2px;
  vertical-align: middle;
  color: #555;
}
input {
  padding-left:4px;
  
}
input[type='file'] {
  padding:0;
  border:none;
}
select::-ms-expand { /* style IE arrow button  */
  border: none;
  width: 12px;
  margin-left: 4px;
  color: #333;
  background:none;
}
[placeholder]/*, -moz-placeholder.DHCP_IP, -ms-input-placeholder.DHCP_IP*/ { 
  font-size:8px !important; 
}
/*remove placeholder text on focus*/
input:focus::-webkit-input-placeholder { color:transparent; }
input:focus:-moz-placeholder { color:transparent; }
input:focus::-moz-placeholder { color:transparent; }
input:focus:-ms-input-placeholder { color:transparent; }

.txt-nrml {
  font-weight: normal;
}
form {
  margin: 0px;
}
div.dividerline {
  background-color: #999999;
  height: 1px
}
.navtbl {
  font-size: 11px;
  background-color: #fbfcfd;
  border: 1px solid #9faab1;
  padding-bottom: 12px;
}
.rowlinet {
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: #999999;
}
.rowlineb {
  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: #999999;
}
div.nav {
  line-height: 160%;
  font-size: 11px;
}
div.nav ul {
  margin: 0 0 10px 0;
  padding: 0;
  list-style-type: none;
}
div.nav li {
  margin: 0 0 0 0;
  padding: 0;
  list-style-type: none;
  display: inline;
}
div.nav li.active {
  display:block;
  width:16em;
  font-weight: bold;
  font-size: 10px;
  background-color: #C9D0E0;
}
div.nav li.title {
  display: block;
  color: #ffffff;
  font-weight: bold;
  padding: 1px 0 1px 6px;
  margin: 0;
  background-color: #5979a5;
}
div.nav a:link, div.nav a:visited {
  padding: 0 0 0 16px;
  margin: 0;
  color: #434d68;
  text-decoration: none;
  display: block;
}
div.nav a:hover, div.nav a:visited:hover {
  color: #434d68;
  background-color: #C9D0E0;
}
td.white {
  font-size: 11px;
  font-weight: normal;
  padding: 4 3 3 5;
  background: #ffffff;
}
td.whitenopadding {
  font-size: 11px;
  font-weight: normal;
  background: #ffffff;
}
td.tabval {
  color: #000000;
  background-color: #ffffff;
  font-weight: normal;
  font-size: 13px;
}
td.tabhead {
  color: #ffffff;
  font-weight: bold;
  font-size: 13px;
}
/* TABLE--------------------------------------------------------------*/
.panelTable {
  width:100%;
  cellpadding:0px;
  cellspacing:0px;
  border:0px;
  background-color:#FBFCFD;
}
.panelTable1 {
  cellpadding:0px;
  cellspacing:0px;
  border:0px;
  background-color:#FBFCFD;
}
/* SITE hEADER DEFINITIONS-------------------------------------------------------*/
.siteheader {
  width:100%;
  min-width:960px;
  height:55px;
  background-image:url(../img/header.png);
  background-repeat: no-repeat;
  background-color: #505461;
  border-bottom: 1px solid #bbb;
}
.headerlinks {
  float:right;
  margin-top:5px;
  margin-bottom:5px
}
.headerLabel {
  font-size:11px;
  color:#fff;
  text-wrap:none;
  padding:0px 5px 0px 15px;
}
.headerData {
  font-size:11px;
  color:#FFF;
  text-wrap:none;
  padding-right:5px;
  font-weight:bold;
}
.headerData a {
  color:#53A9FF
}

/* Using div id styling and !important - jquery ui overrides the button styles. I couldn't figure out how to override. If you know how to, please fix it */
#appliances_discovered {
    font-weight: bold !important;
    border-radius: 3px !important;
    border: 1px solid #bbb !important;
    z-index: 20 !important;
    padding: 6px 20px !important;
    position: relative !important;
    top: 20px !important;
    right: 20px !important;
    font-size: 11px !important;
    font-family: Arial, Helvetica, sans-serif !important;
	background-color: #59EA43 !important;
	background-image:none;
}

.ui-datepicker {
    z-index:10000 !important;
    padding: 5px !important;
}
.ui-datepicker button {
    opacity:1 !important;
    font-weight: normal !important;
}
.ui-timepicker-div {
    padding: 0 5px !important;
}
.ui-datepicker-buttonpane {
    padding: 5px !important;
}
/* Alarm Panal ----------------------------*/
.alarmLabel, .alarmN, .alarmC, .alarmMa, .alarmMi, .alarmW, .alarmWnorm, .alarmH {
  width:auto;
  height:25px;
  min-width: 60px;
  border-left:1px solid #ddd;
  padding: 0 5px;
  cursor:pointer;
  text-align:center;
  float:left;
  overflow:hidden;
  display:table-cell;
  vertical-align:middle;
}
.alarmBar .alarmN, .alarmBar .alarmC, .alarmBar .alarmMa, .alarmBar .alarmMi, .alarmBar .alarmW, .alarmBar .alarmWnorm, .alarmBar .alarmH {
  min-width: 30px!important;
}

#tab_alarm .alarmLabel, #tab_alarm .alarmN, #tab_alarm .alarmC, #tab_alarm .alarmMa, #tab_alarm .alarmMi, #tab_alarm .alarmW, #tab_alarm .alarmWnorm, #tab_alarm .alarmH {
  width:100%;
  height:100%;
  border: none;
  border-radius:2px;
}
.alarmLabel {
  background-color:#f1f1f1;
  font-weight:bold;
  border-left:1px solid #bbb;
}
.alarmN, .alarmTableN {
  color:#888;
  background-color:#f1f1f1;
}
.alarmC, .alarmTableC {
  color:#fff;
  background-color:red;
  font-weight:bold;
}
.alarmMa, .alarmTableMa {
  color:#000;
  background-color:orange;
  font-weight:bold;
}
.alarmMi, .alarmTableMi {
  color:#000;
  background-color:yellow;
  font-weight:bold;
}
.alarmW, .alarmTableW {
  color:#000;
  background-color:cyan;
  font-weight:bold;
}
.alarmH, .alarmTableH {
  color:#fff;
  background-color:#0daf0d;
  font-weight:bold;
}
.alarmWnorm {
  color:#888;
  background-color:#f1f1f1;
  border-right:none;
}
.alarmPanel {
  height:25px;
  float:right;
  display:none;
}
.alarmTxt {
  line-height:22px;
}
.alarmTableC, .alarmTableMa, .alarmTableMi, .alarmTableW {
  border-bottom:1px solid #999 !important;
}

/*Pause Orchestration List ------------------------------------------------------*/
#appliancePauseList {
    line-height:22px;
    display: inline-block;
    float: right;
  }

#appliancePauseList a{
  font-size:12px;
  color:#888;
  background-color:#f1f1f1;
  cursor:pointer;
}

/* MENU DEFINITIONS--------------------------------------------------------------*/
.menutable {
  min-width:960px;
  height:25px;
  cellpadding:0px;
  cellspacing:0px;
  padding:0px;
  background-color:#f1f1f1;
  border:1px solid #bbb;
  border-top:none;
}
.menulinks {
  border:0px
}
.menu {
  background-color:#f1f1f1;
} 
.mega-menu > li > a {
  background:none !important;
  padding-top: 6px !important;
}
/*override megamenu*/
#view_tabs li {
  white-space:nowrap;
}
.megaSubHeading {
  font-size:.8em;
  color:#555;
  margin-left:5px;
}
.mega-menu li .sub {
padding: 0px 8px !important; 
}
.megaSubIndent {
  margin-left:10px;
}
.mega-hdr-a {
  cursor:default !important;
}
.mega-menu li .sub li.mega-hdr {
  margin: 8px 5px 0 5px !important; 
  padding-bottom: 5px;
}
.mega-menu li .sub li.mega-hdr a.mega-hdr-a, .mega-menu li .sub li.mega-hdr a.mega-hdr-a:hover {
  padding: 2px 10px !important;
  background: #5FA1E6 !important;
  color: #fff !important;
  border-radius: 1px !important;
  border: 1px solid #5FA1E6 !important;
}
/*.mega-menu * {
  border-radius: 1px !important;
}*/
#view_tabs .mega-hdr:nth-of-type(2) a { /* extend Monitoring > Bandwidth category to 2 columns */
  width: 180px !important;
}
.mega-menu .sub li.mega-hdr li a {
  padding: 3px 5px 3px 15px !important;
  white-space: nowrap;
}
.mega-menu .sub li.mega-hdr li a:hover {
  color: #000; 
  background: #C4E1FF !important;
}
/*SP styles for section/sub-menus*/
.sp_section_menu {
  padding: 2px 10px;
  margin-top: 5px; 
  background: #5FA1E6;
  text-transform: uppercase; 
  color: #fff;
  border-radius:1px;
  font-style:italic;
  border:1px solid #5FA1E6;
}
.sp_sub_menu {
  padding: 1px 4px;
  margin: 6px 0 0 0;
  /*background:#f9f9f9;
  background: linear-gradient(#fff,#f7f7f7);*/
  color: #333;
  border-radius: 1px;
  font-style: italic;
  font-size:12px;
  border: 1px solid #ccc;
}
.separator-after {
  border-bottom:1px solid #ccc;
  margin-bottom:3px !important;
  padding-bottom:3px !important;
 }
 /* super fish menu override */
.sf-menu a {
  padding-top: .25em !important;
  padding-bottom: .25em !important;
}
  .hostname {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: bold;
  color: #000000;
  padding-right: 10px;
  padding-left: 10px;
  background-color:#ffffff
}

.search_menu {
  width: 280px;
  height: 18px;
  font-size:13px !important;
  font: inherit;
  color: #777;
  margin: 2px 0 0 1px;
  border: 1px solid #eee;
  padding-left:15px;
}
/* PAGE HEADER DEFINITIONS-------------------------------------------------------*/
.page_table {
  width:98%;
  border-bottom:1px solid #CCCCCC;
  margin:10 10 0 10px;
}
.page_title {
  FONT-WEIGHT: bold;
  FONT-SIZE: 13px;
  FONT-FAMILY: arial, helvetica, sans-serif, tahoma
}
/* CONTENT_LAYOUT DEFINITIONS--------------------------------------------------*/
FIELDSET {
  border:1px solid #cccccc;
  border-width:0;
  margin:0px 5px 5px 5px;
  padding:4px 5px 20px 5px;
}
LEGEND, .tab-title {
  color:#555;
  padding:1;
  FONT-WEIGHT: bold;
  font-size:1.1em;
  margin-left: -10px;
}
FORM {
  MARGIN: 0px
}
.buttons {
  margin:10px 20px;
  padding:5px;
}
.label_norm {
  padding: 5px;
}
.label_bold {
  FONT-WEIGHT: bold;
  padding: 5px;
}
.logs {
  margin:5 0 0 20;
  padding:5
}
.sp_dlg_content .data_label {
  color:#777;
  padding-right:15px;
  min-width:8em;
}
/* DATA TABLE LAYOUT DEFINITIONS-------------------------------------------------*/
TR.hdr {
  BACKGROUND: #0966BE
}
P.tbl_hdr {
  FONT-WEIGHT: bold;
  COLOR: #ffffff
}
P.tbl_data {
  FONT-SIZE: 11px
}
/* MESSAGING DEFINITIONS-------------------------------------------------------*/
.info_large {
  color: #009900;
  font-weight: bold;
  font-size: xx-large;
}
.info_small {
  color: #009900;
  font-weight: bold;
  font-size:12px;
}
.warning_large {
  color: #FF0000;
  font-weight: bold;
  font-size: xx-large;
}
.warning_small {
  color: #FF0000;
  font-weight: bold;
  font-size:12px;
}
.important {
  color:#f00;
}
.required {
  color: #D2691E;
  font-weight: bold;
}
.frozen {
  color:#777;
}
/* FOOTER DEFINITIONS------------------------------------------------------------*/

/* QoS - Route Maps DEFINITIONS------------------------------------------------------------*/
.lineqos {
  border-top-width: 1px;
  border-top-style: solid;
  border-top-color: #cccccc;
}
#policyTabPane.ui-widget-content {
  border:none;
}
.linediv {
  BACKGROUND: #ffffff
}
.reportbars {
  border: 1px solid #cccccc;
}
/*
tbody tr.odd {
        background-color: #F2F5F8;
}

tbody tr.even {
        background-color: #FFFFFF;
}
*/
table.sortable tr.odd td {
  background-color: #DEEEFD;
}
table.sortable tr.even td {
  background-color: #FFFFFF;
}
table.sortable tr.pink td {
  background-color: #FFC0CB;
}
table.sortable tr.orange td {
  background-color: #fdc084;
}
td.numeric, th.numeric {
  text-align: right;
}
.widgetTitle {
  font-family:Arial, Helvetica, sans-serif;
  font-size:1.3em;
  color:#333;
  /*  font-weight:bold; */
  overflow:visible;
  margin-bottom:3px;
}
#shaperGroupsContainer .widgetTitle {
    font-weight:bold;
}

#loss_container .widgetTitle {
  min-height:30px;
}
.title_sm {
  font-size:1.1em;
}
.dash_widget {
  float:left;
  margin:0px 25px 15px 0px;
  overflow:visible;
  position:relative;
}
.chart_sel {
  background-color:#f0f0f0;
  border-radius:6px;
}
.chart_small {
  width:275px;
  height:175px;
}
#bw_container .chart_small {
  margin-right:20px;
  width:285px;
}
.chart_medium {
  width:360px;
  height:180px;
}
.chart_big {
  width:570px;
  height:260px;
}
#Bandwidth_placeholder_big {
  margin-right:30px;
}
.legendRow {
  margin-left:5px;
  vertical-align:middle;
}
.chart-tab-title {
  position:relative;
  top:-10px;
  font-size:1em;
  padding-bottom:0px;
}
.chart-time-range {
  font-size:.85em;
  color: #666;
  position:absolute;
  top:21px;
  right:15px;
}
.widgetLegend {
  margin:0 0px 0 0;
  float:right;
  vertical-align:middle;
}
.widget_link {
  font-size:12px;
  color:#1C6EF2 !important;
  cursor:pointer;
  padding: 2px 8px;
  border: 1px solid transparent;
  border-radius: 3px;    
}
.widget_link:hover {
    border-color: #1C6EF2;
}
.widget_link_disabled {
  font-size:11px;
  color:#aaa !important;
  cursor:pointer;
}
.chart_controls .widget_link, .med_widget_link {
  font-size:11px;
}
.small_widget_link {
  font-size:10px;
  color:#1C6EF2 !important;
  cursor:pointer;
  padding: 0px 2px;
  border: 1px solid transparent;
  border-radius: 3px;
}
.small_widget_link:hover {
  border-color:#1C6EF2;
}
.dynRadio {
  margin-left:15px;
}
.tFlowsTypeLabel {
  color:#777;
}
.reportTitleLabel {
  color:#777;
  font-size: 12px
}
.reportTitleValue {
  font-size: 14px;
}
.data_unavail {
  position:absolute;
  top:35%;
  left:35%;
  z-index:10;
  font-size:12px;
  color:#555;
  background-color:rgba(255,255,255,.8);
  padding:2px 5px 2px 10px;
  text-align:center;
  border-radius:4px;
}
.data_unavail_box {
  height:80%;
  width:80%;
  min-height:100px;
  margin-left:48px;
  margin-top:20px;
  border:1px solid #aaa;
  clear:both;
  position:relative;
}
.data_none_returned {
  height:50%;
  width:80%;
  z-index:10;
  font-size:1.1em;
  font-style:italic;
  color:#555;
  background-color:rgba(255,255,255,.8);
  padding-top:15%;
  text-align:center;
  border:1px solid #aaa;
  margin: 0 35px 0px 55px;
}
.rArrows {
  font-size:18px;
}
.legend {
  font-size:12px;
  font-weight:bold;
}
.wizSumData {
  color:#000;
  float:left;
  margin-left:10px;
}
.wizContentContainer {
  padding: 25px 0 10px 80px;
  vertical-align: middle;
}
.autotunnel {
  font-size: 11;
  font-style: italic;
  font-weight: normal;
}
.header_cell_height {
  height: 85px;
}
.optional {
  font-style: italic;
  font-weight: normal;
  color: #777;
}
.legendColorBox {
  padding: 0px;
}
.legendLabel {
  padding: 0px 2px 0px 1px;
}
td.legendColorBox > div {
  padding:0px;
}
td.legendColorBox > div > div:hover {
  cursor:pointer;
}
.rebootText {
  font-size:16px;
  font-style:italic;
  font-weight:bold;
}
.rebootTextSmall {
  font-size:12px;
  font-style:italic;
  font-weight:bold;
}
.rotateContent {
/*  background-repeat:no-repeat; */
}
.rContent {
  margin:10px 40px;
  width:420px !important;
}
.rotateContent ul li {
  font-size:15px;
  line-height:1.2em;
  color:#000;
}
.rotator_text1 {
  font-size:15px;
  color:#000;
  line-height:1.1em;
}
.qTips {
  font-size:16px;
  color:#F60;
  font-style:italic;
  font-weight:bold;
  text-align:center;
}
.loginMsg {
  font-size:16px;
  font-weight:bold;
  line-height:1.1em;
}
.footer {
  color:#666;
  font-size:11px;
  padding:10px;
  border-width:1px 0 0;
  border-style:solid;
  border-color:#999;
  margin-top:1px;
}
table .ui-widget-content, #rightPane > .ui-widget-content {
  border-color:#e1e1e1;
  border-width:1px 1px;
  border-top:none;
  border-bottom:none;
  border-left:none;
  border-right:none;
}
tr .ui-widget-header {
  border-width:0 1px 1px 0;
}
#menutabs > ul {
  background:none;
  border-width:0 0 1px 0;
}
#editlink {
  text-decoration:none;
  color:rgb(0, 176, 240);
}

/* jquery overrides */

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
  border: 1px solid #aaa;
  color: #505050;
  background: rgb(241,241,241);
}
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
  background: #fff;
}
.ui-state-hover,.ui-widget-content .ui-state-hover,.ui-widget-header .ui-state-hover {
  border:1px solid rgb(0,176,240);
  background:#fff;
  color:rgb(0,176,240);
}

.ui-widget-header:last-child {
  border-width:0 0 1px 0;
}
.ui-dialog .ui-widget-header {
  border-width:0 0 1px 0;
}
.ui-dialog {
  -webkit-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  -ms-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  -o-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  border-color:#aaa !important;
  width:auto;
}
.ui-dialog.ui-corner-all {
  -moz-border-radius: 1px !important;
  -webkit-border-radius: 1px !important;
  border-radius: 1px !important;
}
.ui-dialog .ui-dialog-title {
  line-height:1.1;
}
button.ui-dialog-titlebar-close {
  border:none !important;
  background:none !important;
}
.extraLargeInput {
  width:50em;
}
.largerInput {
    width:20em;
}
.largeInput {
  width:17em;
}
.medInput {
  width:12em;
}
.medSelect {
  width:10.5em;
}
.smInput {
  width:4em;
}
.xSmInput {
  width:3em;
}
.inputMask {
  width:2em;
}
.ui-dialog-txt {
  font-size:1em;
  line-height:1.2em;
}
#ServerInfoPanel input[disabled] {
  background-color: #fff;
  border:none;
  padding-left:15px;
  color:#000;
}
#NESystemConfigDetailPanel input[disabled] {
  background-color: #fff;
  border:none;
  color:#000;
}
#dbFileTable tr {
  cursor:pointer;
}
.ui-dialog td {
  padding-right:5px;
  white-space:nowrap;
}

#applianceTable td {
  white-space:normal !important;
}
.sp_dlg_ftr {
  height:25px;
  margin:5px 0 0 0;
  padding:10px 15px;
  border-top:1px solid #ccc;
}
.btn_container {
  float:right;
  min-height:25px;
}
.sp_dlg_ftr_btn {
  padding:3px 10px;
}
.ui-dialog-content {
  padding:0 !important;
}
.sp_dlg_content {
  padding:15px;
}
.dialog_status {
  display:inline-block;
  font-style:italic;
}
.ui-tabs .ui-tabs-nav {
  margin: 0;
  padding: 3px 5px 0 10px !important;
}
.ui-button.ui-state-active {
    border-color: rgb(0, 176, 240);
    color: rgb(0, 176, 240);
}

.ui-tabs .ui-tabs-nav span {
  padding:0 !important;
}
.ui-tabs-panel {
  height:calc(100% - 40px);
  -moz-height:calc(100% - 40px);
  overflow:auto;
  overflow-x:auto;
}

#splitterContainer {
  width:100%;
  position:absolute;
  top:82px;
  bottom:0px;
}
#leftPane {
  width:260px;
  height:100%;
  display:inline-block;
  overflow-y: auto;
  border-right:2px solid #eee;
}
#tree {
  height:calc(100% - 45px);
  margin:5px 0 0 5px;
}

.applianceChartIcon {
  display: none;
  margin-right: 5px;
  padding: 0 2px;
}
.applianceMenuIcon {
  display: none;
  margin-right:2px;
  padding: 0 2px;
}
.applianceIconsContainer {
  position: absolute;
  right: 0;
  padding:0 2px;
  top: 0px;
  background: rgba(255,255,255,.95);
  border-radius: 1px;
}
.applianceIconsContainer * {
    box-sizing:border-box;
}
.applianceTreeIcon:hover {
  border: 1px solid rgb(0,176,240);
}

span.unreachableClass a{
  border: 1px solid #ff0000 !important;
  border-radius:2px !important;  
}

span.unknownStateClass a{
  border: 1px solid #ff00ff !important;
  border-radius:2px !important;  
}

span.unsupportedVersionClass a{
    border: 1px solid #00ffff !important;
    border-radius:2px !important;
}

span.syncInProgressClass a{
  border: 1px solid #8c008c !important;
  border-radius:2px !important;
}

span.outOfSyncClass a{
  border: 1px solid #ffa500 !important;
  border-radius:2px !important;
}


span.dynatree-expanded a {
    border:1px solid white;
}

span.dynatree-node span + a  {
    width: calc(100% - 40px);
}
.dynatree-container > li > ul {
    padding: 0 0 0 20px !important;
}

#rightPane{
  position:absolute;
  top:0;
  bottom:0;
  right:0;
  padding-top: 5px;
  border:none;
  height:100%;
  display:inline-block;
  width: calc(100% - 262px);
  -moz-width:calc(100% - 245px);
}

#leftPane > .ui-resizable-e {
  background: #eee;
  right: -5px;
  z-index:auto !important;
  width: 10px;
}
#rightPane li .ui-icon-close {
  float: left;
  margin: 0.3em 0 0 0;
  cursor: pointer;
}
#rightPane li .ui-icon-close {
  position:absolute;
  right:0px;
  top:0px;
  cursor: pointer;
}
.ui-tabs .ui-tabs-nav li a {
  padding: 3px 16px 3px 10px !important;
}
.ui-tabs .ui-tabs-nav li a[href="#Topology"] {
  padding-right: 12px !important;
}
.ui-tabs .ui-corner-top {
  border-top-left-radius: 3px;
  border-top-right-radius: 3px;
}
.settings_btn {
  background:url(../img/settings.png) no-repeat center rgb(245,245,245);
  opacity:.4;
  height:18px;
  width:40px;
  border:1px solid #aaa;
  border-radius:2px;
  cursor:pointer;
}
.settings_report_btn {
  background:url(../img/settings_reports.png) no-repeat center;
  opacity:.4;
  height:18px;
  width:30px;
  border-radius:2px;
  cursor:pointer;
}
.settings_container {
  float:left;
  margin: 2px 0 0 25px;
}
.old_settings {
  position:absolute;
  top:50px;
  right:10px;
}
.more_settings_btn {
  border-radius:2px;
  cursor:pointer;
  padding:0 5px;
  border:1px solid #aaa;
  position:relative;
  background-color:#fff;
  /*
   * Be careful when setting this z-index. topo elem z-index increases.
   * After adjustment, verify that the following bugs are not broken as a result:
   *     bugs 18847, 19610
   */
  z-index:20;
}
.less_state {
  /*opacity:.8;
  background:url(../img/less_settings.png) no-repeat 90% rgb(245,245,245);*/
}
.fade1 {
  opacity: .4;
}
.settings {
  border:1px solid #ccc;
  position:absolute;
  border-radius:2px;
  padding: 8px;
  background-color:rgba(255, 255, 255, 1);
  z-index:20;
  right: 0px;
}
.settings_report {
  float:right;
  height:15px;
  width:150px;
  float:right;
  border-radius:2px;
  padding: 1px;
  background-color:rgba(255, 255, 255, .9);
  z-index:20;
  margin-bottom:5px;
  display:none;
}
.ui-buttonset .ui-button-text-only .ui-button-text, .ui-button .ui-button-text {
  padding: .1em .6em !important;
}
.ui-buttonset .ui-button {
  margin-right: -5px !important;
}
.ui-buttonset .ui-button.ui-state-active + input + .ui-button.ui-state-default {
    border-left-color: rgb(0, 176, 240);
}
.ui-widget .ui-widget {
  font-size:11px !important;
}
.ui-tabs .ui-tabs-nav li a {font-size: 12px !important;}
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
  font-size:11px !important;
}
.ui-button-text {
  /*font-size:.9em !important;*/
}
#Share .ui-button-text {
  padding: .1em 1.2em 0 3.0em !important;
  font-size: .95em !important;
  color:#000;
}
#Share .ui-button-icon-primary {
  left: 1.1em !important;
}
#Share {
  border-radius:0;
  border-width:0 1px 0 0;
  height:100%;
  margin:0;
  background:#f1f1f1;
  padding:0;
}
#Share:hover {
  background:#e5e5e5;
}
.mega-menu > .dc-mega-li:hover {
  background:#e5e5e5;
}
/* jquery ui custom button icons*/
.ui-button .ui-icon.ui-icon-share {
  background-image: url(../img/share_gray.png);
}
.ui-button.ui-state-hover .ui-icon.ui-icon-share {
  background-image: url(../img/share_blk.png);
}
input.ui-button {
  padding: .3em 0.9em !important;
}
.inline_btn {
  float:left;
  height:18px;
  margin:1px 5px;
  font-size:.95em !important;
}
.noBorderBtn {
  border:none;
  background:none !important;
}
.smallIconBtn .ui-icon, .smallIconBtn.ui-icon{
  padding:1px !important;
  background-image: url(images/ui-icons_31B2E5_256x240.png) !important;
  cursor:pointer;
}
.ui-state-hover .ui-icon {
    background-image: url(images/ui-icons-256-240-454545.png) !important;
}
.ui-state-focus .ui-icon, .ui-state-active .ui-icon {
    background-image: url(images/ui-icons-256-240-454545.png);
}
.lighterIcon {
    background-image: url(images/ui-icons_888888_256x240.png) !important;
}
.ui-icon-pin {
  cursor: default !important;
  position: absolute;
  left: 0px;
  top: 0px;
  float: right;
  margin: 0.3em 0 0 0;
  background-position: -142px -146px;
}
.tab_content_container {
  margin:15px 0px 0px 15px;
  position:relative;
}
.content_container {
  margin:20px auto;
}
.chart_controls {
  min-width:800px;
  border-bottom:1px solid #ddd;
  background-color:#fafafa;
  padding:12px 10px 10px 15px;
}

.chart_controls  form  label, .chart_controls  form  select {
	vertical-align:baseline;
	line-height: none;
}

#chromeHeadlessContainer .chart_controls {
  height: 0 !important;
  visibility: hidden !important;
  padding: 0 !important;
}

#chromeHeadlessContainer .table_title {
  font-size: 16px;
}
.chart_controls .ui-button-text {
  font-size:10px !important;
}
.report_container {
  margin:15px 0 0 15px;
}
.reportGridSizer {
  position:relative;
  height: calc(100% - 110px);
  height: -moz-calc(100% - 140px);
}
.reportGridSizerNoCtrlBar {
  position:relative;
  height: calc(100% - 125px);
  height: -moz-calc(100% - 125px);
}

#rightPane .gridPosition {
  position: absolute;
  top: 10px;
  right: 20px;
  bottom: 60px;
  left: 15px;
}
#rightPane .gridPosition.hasLegend {
  top:20px;
}

#chromeHeadlessContainer .gridPosition {
  position: relative;
  margin: 15px 30px 5px 15px;
}

.alert_container {
  margin:15px 20px 20px 15px;
}
.table_title {
  font-size:1.3em;
  color:#333;
  vertical-align:middle;
}
.table_container {
  margin:10px 0 0 0;
}
li.ui-tabs-selected .ui-icon-close, li.ui-state-hover .ui-icon-close.no-touch {
  visibility:visible !important;
}
.ui-progressbar {
  position:relative;
  width: 100%;
  height: 1.6em /*!important*/;
  margin-top:5px;
}

.progressbarLabel {
    position: absolute;
    left:calc(50% - 25px);
    -moz-left:calc(50% - 25px);
    width:50px;
    text-align:center;
    top: -15px;
}

.progressbar {
  width: 200px;
  z-index:20;
  height: 5px !important;
  overflow:visible !important;
  position: fixed;
  top: calc(50% - 30px);
  left: calc(50% - 20px);
}

.grid-header .progressbar {
    position: absolute;
    left:calc(50% - 100px);
    -moz-left:calc(50% - 100px);
    top: 13px;
    z-index:20;
    height: 5px !important;
    overflow:visible !important;
}

.progressbar .ui-progressbar-value {
    background-color: #36F !important;
}

.pblabel {
  position: absolute;
  display: block;
  width: 100%;
  text-align: center;
  line-height: 1.7em;
}
.ui-progressbar-value {
  overflow: hidden;
  margin:0 !important;
  background-color:#C4E1FF !important;
  border:none !important;
}
.ui-progressbar-value .pblabel {
  position: relative;
  font-weight: normal;
  color: #1C6EF2;
}
.sp_status {
  border:1px solid #aaa;
  border-radius:2px;
  overflow:auto;
  padding:5px;
  line-height:1.2em;
}
.sp_status font {
  font-family: tahoma, arial, helvetica, sans-serif !important;
}
input.button_up {
  background-image: url('../img/button_up.gif'); /* 16x16 px */
  background-color: transparent;
  background-repeat: no-repeat;
  cursor: pointer;
  border: none;
  height: 16px;
  width:  20px;
  padding-left: 16px;
  vertical-align: middle;
}
input.button_down {
  background-image: url('../img/button_down.gif'); /* 16x16 px */
  background-color: transparent;
  background-repeat: no-repeat;
  cursor: pointer;
  border: none;
  height: 16px;
  width:  20px;
  padding-left: 16px;
  vertical-align: middle;
}
input.button_right {
  background-image: url('../img/button_right.gif'); /* 16x16 px */
  background-color: transparent;
  background-repeat: no-repeat;
  cursor: pointer;
  border: none;
  height: 18px;
  width:  20px;
  padding-left: 16px;
  vertical-align: middle;
}
input.button_left {
  background-image: url('../img/button_left.gif'); /* 16x16 px */
  background-color: transparent;
  background-repeat: no-repeat;
  cursor: pointer;
  border: none;
  height: 16px;
  width:  20px;
  padding-left: 16px;
  vertical-align: middle;
}
.handle {
  margin: 0.8em;
  border-radius: 0.2em;
  width: 75%;
  height: 0.7em;
  cursor: move;
  box-shadow: 0px 0px 7px #bbb;
  background-color: rgb(243, 243, 243);
  -o-box-shadow: 0px 0px 7px #bbb;
  -webkit-box-shadow: 0px 0px 7px #bbb;
  -moz-box-shadow: 0px 0px 7px #bbb;
  -moz-border-radius: 0.2em;
}
.handlehover {
  box-shadow: 0px 0px 7px #ffc171;
  -o-box-shadow: 0px 0px 7px #ffc171;
  -webkit-box-shadow: 0px 0px 7px #ffc171;
  -moz-box-shadow: 0px 0px 7px #ffc171;
}
/*Right click menu*/
 .vmenu {
  border:1px solid #aaa;
  position:absolute;
  background:#fff;
  display:none;
  font-size:0.75em;
}
.vmenu .first_li span {
  width:100px;
  display:block;
  padding:5px 10px;
  cursor:pointer
}
.vmenu .inner_li {
  display:none;
  margin-left:120px;
  position:absolute;
  border:1px solid #aaa;
  border-left:1px solid #ccc;
  margin-top:-28px;
  background:#fff;
}
.vmenu .sep_li {
  border-top: 1px ridge #aaa;
  margin:5px 0
}
.vmenu .fill_title {
  font-size:11px;
  font-weight:bold;
  height:15px;
  overflow:hidden;
  word-wrap:break-word;
}
.select_container {
  float: left;
  padding: 3px;
}
.select_container list_select {
  width: 15em;
}
.select_low {
  position: relative;
  width: 2em;
}
.cell_right {
  text-align: right;
}
.cell_left {
  text-align: left;
}
.cell_center {
  text-align: center;
}

.cell_error {
    color: #fff !important;
    background-color: red;
}

.cell_success {
    color: #fff !important;
    background-color: #0daf0d;
}

.cell_center{
  text-align: center;
}
.cell_readOnly{
  color: #888;
}

.cell_right_readOnly {
  color: #888;
  text-align: right;
}
.red_bg {
  background-color: #f00 !important;
  color: #fff !important;
  font-weight:bold !important;
}
.row_select {
  background-color: #A0CAFF !important;
}
/* css for timepicker */
.ui-timepicker-div .ui-widget-header {
  margin-bottom: 8px;
}
.ui-timepicker-div dl {
  text-align: left;
}
.ui-timepicker-div dl dt {
  height: 25px;
  margin-bottom: -25px;
}
.ui-timepicker-div dl dd {
  margin: 0 10px 10px 65px;
}
.ui-timepicker-div td {
  font-size: 90%;
}
.ui-tpicker-grid-label {
  background: none;
  border: none;
  margin: 0;
  padding: 0;
}
/* BAD BAD BAD!. But temp fix as 90% of tabs are using a div with this id to show 'Please select an appliance' when no appliances are selected in the tree*/
#selectApplianceMsg {
    position:absolute;
    top:125px;
    bottom:60px;
    right:20px;
    left:10px;
}
.report_mode {
    padding: 40px;
    font-size:1.6em;
    color:#999;
    font-style:italic;
    line-height:2em;
}
.no_ne_selected {
  padding-top: 150px;
  padding-left: 50px;
  font-size:1.6em;
  color:#999;
  font-style:italic;
  line-height:2em;
}
.dash_widget.small_div {
  margin-left: 5px;
}
#tab_application .small_div .fg-toolbar {
  height:0px;
  padding:0px;
  border-bottom:hidden;
}
.no-wrap {
  white-space:nowrap;
}
.tnlName {
  font-size:.9em;
  color:#666;
}
.msgBox {
  padding:1px 3px;
  z-index:999;
  color: #555;
  border-radius: 3px;
  font-size:.9em;
  background-color:#fff;
}
.msgBoxBg {
  background-color:#FFd;
  z-index:-1;
  position:absolute;
  width:100%;
  height:100%;
  top:0px;
  left:0px;
  border-radius: 3px;
}
.globalMsgBox {
  display:none;
  padding:5px 8px;
  position:absolute;
  border:1px solid #aaa;
  top:5px;
  left:45%;
  font-size:1.1em;
  -webkit-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  -moz-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  -ms-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  -o-box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
  box-shadow: 0 2px 20px rgba(0, 0, 0, 0.6);
}
.msgBoxTopo {
  position:absolute;
  top:0px;
  right:500px;
  z-index:100;
}
.chart_limit_msg {
  position:relative;
  top:-18px;
  left:25%;
  font-size:1.1em;
  color:#777;
  z-index:100;
  font-style:italic;
}
/* hide the close x on the loading screen */
.waitingDialogWindow .ui-dialog-titlebar-close {
  display: none;
}
.waitingDialogText {
  font-family:Arial, Helvetica, sans-serif;
  font-size:1.5em;
  line-height:1.1em;
  color:#666;
  white-space:normal;
}
.info_txt_gray {
  font-size:1.3em;
  color:#888;
  font-style:italic;
  line-height:1.5;
}
.wizSummary {
  font-size:1.1em;
  line-height:1.5em;
  height:150px;
  width:500px;
  overflow-y: auto;
  font-family:Arial, Helvetica, sans-serif;
  color:#777;
  padding: 10px 15px;
}
.wizSumSel {
  width:70px;
  height:20px;
  font-size:10px;
  float:left;
  margin-top:3px;
}
.wizSumLabel {
  color:#666;
  float:left;
  margin-left:10px;
  width:180px;
  clear:both;
}
.wizSumData {
  color:#000;
  float:left;
  margin-left:10px;
}
.centerDiv {
  margin-left: auto;
  margin-right: auto;
  margin-top: auto;
  margin-bottom: auto;
}
.spGridDraggable {
  cursor: pointer !important;
}
/*override fine file uploader progress bar class*/
.qq-upload-list li {
  border-radius:2px !important;
  background-color:#efefef !important;
}
.qq-upload-list li.qq-upload-success {
  background-color: #5DA30C !important;
  color: #FFFFFF;
}
.qq-upload-list li.qq-upload-fail {
  background-color: #D60000 !important;
  color: #FFFFFF;
}
.qq-progress-bar {
  height: 10px !important;
  border-radius: 2px !important;
  background: #36F !important;
}
.qq-upload-spinner {
  display:none !important;
}
.qq-upload-list li.qq-upload-success {
  background-color: #5DA30C;
}

.help-link {
  border:none !important;
  background: #6CABFF !important;  /*#6CABFF #4285F4*/
  margin-left: 3px !important;
  color: #fff !important;
  border-radius: 50% !important;
  padding: 0px 5px 2px !important;
  -moz-padding-bottom: 0px !important;
  font-size: 12px !important;
}

#rightPane .help_expander {
  /*z-index:1005;*/
  display: inline;
  vertical-align:middle;
}

#chromeHeadlessContainer .help_expander {
  display: none;
}

.help-content {
  margin-top:5px !important;
  margin-bottom: 3px !important;
  line-height:1.5em !important;
  max-width:700px;
  border: 2px solid rgb(230, 230, 230) !important;
  background: rgb(251, 251, 251) !important;
  display:none;
  position: relative;
  white-space:normal;
  color: #6a6a6a !important;
  z-index:20;
}
.help-content, .help-content p, .help-content li, .help-content ol {
  font-size: 12px !important;
}
.ui-accordion .ui-accordion-content {
  padding: 15px 30px 20px !important;
  border-top: 0;
  overflow: auto;
}
.help-close {
  cursor:pointer;
  float: right;
  margin: -5px -20px 0 0;
}
.help-content ol, .help-content ul {
  margin-left:20px;
}
.helpTerm {
  font-weight:bold;
}
.helpDef {
}
.help_title {
}
.sectionTitle {
  font-size: 1.2em;
}
.sectionHeading {
  font-size:18px;
  color: #6f6f6f;
}
.sectionContent {
  font-size:13px;
  color: #6f6f6f;
}
.sectionLabel {
  width: 105px;
  font-size: 12px;
  font-weight:bold;
  color: #666;
}
.subSettings {
  font-weight:bold;
  font-size:1em;
}
input[type='checkbox'] + label, input[type='radio'] + label {
  border-radius:2px;
  padding:0 5px;
  cursor:pointer;
}
.chkLabel {
  border-radius:2px;
  padding:0;
  cursor:pointer;
}
/*input[type='checkbox'][role!='button'] + label:hover,  input[type='radio'][role!='button'] + label:hover, .chkLabel:hover {*/
  /*background:#DEEEFD;*/
/*}*/
input[type='checkbox'] {
  margin-right: -2px;
}
.mega label {
  font-size: 12px;
}
td>label {
    line-height:inherit;
}
/* slick grid changes, grouping, column picker, etc. */
.slick-row:last-child {border-bottom:1px solid #eee !important;}

.slick-cell select {
  max-width:100%;
}
.slick-second-header-columns {
  text-align:center;
}
.slick-header-columns {
  /*background: ;*/
    /*border-bottom: 1px solid silver;*/
}

.slick-header-column {
  /*background: ;*/
  border-right: 1px solid silver;
  text-align: center;
}

.slick-header-column.ui-state-default {
  position: relative;
  display: inline-block;
 /*box-sizing: content-box !important; use this for Firefox! */ 
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  height: 16px;
  line-height: 16px;
  margin: 0;
  padding: 4px;
  border-right: 1px solid silver;
  border-left: 0px;
  border-top: 0px;
  border-bottom: 0px;
  float: left;
}

.slick-header-column:hover, .slick-header-column-active {
  background: white ;
}
.slick-preheader-panel {
    border-width: 1px 0 0 0;
    color: #767676;
    box-sizing: border-box;
    padding: 0;
}
.slick-preheader-panel .ui-droppable {
}

.slick-preheader-panel .ui-droppable.ui-state-hover {
    background: white !important;
}

.slick-preheader-panel .ui-droppable.ui-sortable.ui-state-default {
    border: none;
    background: none;
}
.slick-group-toggle {
    cursor: pointer;
}
.slick-group-toggle-all.expanded {
    width: 9px;
    height: 9px;
    position: absolute;
    display: inline-block;
    right: 10px;
}
.slick-dropped-grouping {
    display: inline-block;
    margin-right: 15px;
    vertical-align: middle;
    cursor: pointer;
}
.slick-groupby-remove {
    padding: 0px 10px 4px 2px;
    vertical-align: middle;
}
/*.slick-groupby-remove:hover {
    border: 1px solid #aaa;
}*/
.slick-cell, .slick-headerrow-column {
    border-bottom-color: #eee;
}
.slick-cell, .slick-headerrow-column, .slick-footerrow-column {
    border-right: 1px solid #ddd;
    border-bottom-color: #eee;
}
.slick-cell.active {
    border-color: #c7c7c7;
}

.slick-columnpicker {
  border: 1px solid #ccc;
  background: #fff;
  padding: 10px;
  -moz-box-shadow: 2px 2px 2px #aaa;
  -webkit-box-shadow: 2px 2px 2px #aaa;
  min-width: 100px;
  cursor: default;
  position:absolute;
  z-index:900;
  overflow:auto;
  resize: both;
}

.slick-columnpicker > .close {
  float: right;
  cursor: pointer;
}
.slick-columnpicker > .close:hover {
  border: 1px solid rgb(0,176,240);
  background:#fff;
  color:rgb(0,176,240);
  box-shadow: none;
}

.slick-columnpicker .title {
  font-size: 16px;
  width: 60%;
  border-bottom: none;
  margin-bottom: 15px;
}

.slick-columnpicker li {
  list-style: none;
  margin: 0;
  padding: 0;
  background: none;
}

.slick-columnpicker li:hover, .slick-columnpicker li label:hover {
  background: #DEEEFD;
}

.slick-columnpicker li label {
  cursor: pointer;
  width: 100%;
}

.slick-columnpicker input {
  margin: 4px;
}

.slick-columnpicker li a {
  display: block;
  padding: 4px;
  font-weight: bold;
}

.slick-columnpicker li a:hover {
  background: white;
}
/* end slick-grid */


.not_ok {
  border:1px solid red;
}
#flowCorrectionDialog td {
  white-space:normal;
  max-width: 500px;
}
.notify {
  position:fixed;
  bottom: 5px;
  background: #FFF5A9;
  padding:7px 10px;
  width: 90%;
  left:0;
  margin-left:4%;
  text-align:center;
  z-index: 10000;
  border-radius:2px;
  font-size:1.1em;
}
.notify_info {
  background: #FFF5A9;
}
.notify_success {
  background:#67F067;
}
.notify_problem {
  background:#ff4040;
  color:#fff;
}
.notify_cell_invalid {
  border-color:red;
}
#msgClose {
  float:right;
  padding:0 3px;
  height:16px;
  border:none;
  background:none;
}
.notify_problem .ui-icon {
  background-image: url(../img/ui-icons_ffffff_256x240.png) !important;
}
.license_hdr_txt {
  position: absolute;
  top: 20px;
  left: 420px;
  color: #FB0505;
  font-size: 12px;
  font-weight: bold;
  background-color: white;
  padding: 5px 15px;
  border-radius: 3px;
  z-index: 1000;
}
.notification_txt {
  position: absolute;
  top: 27px;
  transform:translate(-50%,-50%);
  left: 50%;
  font-size: 12px;

  background-color: white;
  padding: 5px 15px;
  border-radius: 3px;
  z-index: 100;
  white-space: nowrap;
}
.notificationData_txt {
  display: inline-block;
  max-width: 650px;
  max-height: 40px;
  vertical-align: middle;
  white-space: normal;
}
.authorInfo_txt{
  margin-left:5px;
  color: darkorange;
}

#infoWindow {
  width:180px;
  height:80px;
}
.geo_label {
  text-align:center;
}

.slick-nodata {
    text-align: center;
    padding-top: 3px;
}
abbr {
    border-bottom: none;
}

.iframe_container {
    height: calc(100% - 15px);
    width: calc(100% - 5px);
    border: none;
    margin-top:10px;
}

.ui-autocomplete {
    height: 200px;
    overflow-y: scroll;
    overflow-x: hidden;
}

.ui-autocomplete a {
    color:#000;
    border:none !important;
    border-radius:0;
}
.ui-autocomplete .ui-state-focus {
    background: #C4E1FF !important;
}

/*  */
.trendsChartContainer {
    margin: 0 5px 0 0;
    padding: 10px 10px 10px 0px;
    position: relative;
    display:inline-block;
}

.trendsLargeCharts {
    width:650px;
    height:260px;
}

.trendsSmallCharts {
    width:360px;
    height:175px;
}

.resetZoomContainer{
    position:absolute;
    left: 60px;
    bottom: 5px;
    color:rgb(0, 176, 240) !important;
    z-index: 1;
}

.hideVisibility{
    visibility: hidden
}

.noData-chart-div {
    top: 10px;
    width: 100%;
    height: 96%;
    z-index: 70;
    position: absolute;
    background: #FFFFFF;
}

.noData-small-chart-inner-div {
    top: 20px;
    left: 20px;
    font-size: 20px;
    width: 225px;
    height: 115px;
    position: absolute;
    margin: 0px 20px 20px 40px;
    border: #bbbbbb solid thin;
    color: #ccc;
}

.noData-large-chart-inner-div {
    top: 20px;
    left: 20px;
    width: 550px;
    height: 210px;
    font-size: 20px;
    position: absolute;
    margin: 0px 20px 20px 40px;
    border: #bbbbbb solid thin;
    color: #ccc;
}

.noData-small-chart-span {
    padding: 50px 60px;
    display: table-cell;
    vertical-align: middle;
}

.noData-large-chart-span {
    display: table-cell;
    padding: 100px 250px;
    vertical-align: middle;
    white-space: nowrap;
}

.spinner-small-chart-outer-div {
    width: 345px;
    height: 150px;
    position: relative;
    display: inline-block;
    margin: 35px 5px 15px 25px;
}

.spinner-small-chart-inner-div {
    width: 300px;
    height: 110px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    border: #bbbbbb solid thin;
}

.spinner-lager-chart-outer-div {
    width: 640px;
    height: 250px;
    position: relative;
    display: inline-block;
    margin: 35px 20px 0px 20px;
}

.spinner-lager-chart-inner-div {
    width: 600px;
    height: 200px;
    margin-left: 28px;
    text-align: center;
    display: table-cell;
    vertical-align: middle;
    border: #bbbbbb solid thin;
}

.charts-pair {
     white-space: nowrap;
     border:2px solid #eaeaea;
     display: inline-block;
     margin: 3px 0px 12px 10px;
 }

.charts-container {
    border:2px solid #bbbbbb;
    display: inline-block;
    margin: 3px 0px 12px 10px;
}

.popup-charts-pair {
    white-space: nowrap;
    border:2px solid #eaeaea;
    margin: 3px;
}
.charts-show-underlay-link {
    padding: 0 0 2px 5px;
}

#appliancesTreeConfig .ui-button-text {
    font-size: 11px !important;
}

.settings-link{
  position:absolute;
  top:3px;
  right:3px;
}
.settings-link > .ui-state-default {border-color:transparent; background:none;}
.settings-link > .ui-accordion-header {padding: 1px !important;}
.settings-link > .ui-accordion-header:hover {border:1px solid rgb(0, 176, 240);}
.settings-link .help-close {
  margin: 0 -22px 0 0 !important;
}

.input_help_txt {
    font-size: 11px;
    color: #888;
}

.settings-content.ui-accordion-content {
  border: 1px solid rgb(179, 179, 179) !important;
  padding: 0 25px 15px 15px !important;
  display:none;
  position: relative;
  text-align:left;
  z-index: 1;
}
.settings-content-left{
  left: 10px
}

.autocomplete-bg-color {
  background-color: #ffe;
}

.cell-red-border {
  border-color: red !important;
}

.appliance-deleted-span {
    color: #999;
    font-size: 20px;
    padding: 130px 0px 0px 70px;
    display: table-cell;
    vertical-align: middle;
}


.sg_incell_label {
  margin-right: 3px;
}

.sg_incell_data {
  font-size: 12px;
  color: #1C6EF2;
}

.matchCriteriaDiv {
  cursor: pointer;
}

.slick-cell.disabled > .matchCriteriaDiv {
  cursor: default;
}

.slick-cell.disabled .sg_incell_data {
  font-size: 12px;
  color: #666;
}

.slick-cell.disabled > .matchCriteriaDiv > .matchEditIcon {
  display: none;
}

.navLinksContainer{
    display: inline;
    margin-left: 10px;

}

.disable_nav_links {
    font-weight:normal;
    font-style: italic;
    color: #888;
    font-size: 11px;
}

.lightLabel {
    color:#777;
}

.notyButton {
  font-size: 11px !important;
  margin: 0px 2px 0px 2px;

}

.noty_type__releaseNotification, .noty_type__statsRetentionNotification{
  background: white;
  border: solid 1px gray;
}

.noty_type__messageError {
  background:#ff4040;
  color:#fff;
  text-align: center;
  font-size: 14px;
}

.noty_type__messageInfo {
  background: #FFF5A9;
  text-align: center;
  font-size: 14px;
}

.noty_type__messageSuccess {
  background:#67F067;
  text-align: center;
  font-size: 14px;
}

.tip_alarm .alarmC, .tip_alarm .alarmW, .tip_alarm .alarmH, .tip_alarm .alarmMa,  .tip_alarm .alarmMi{
  line-height:18px;
  height: 18px;
}

.warningTxtOrange {
  color: darkOrange;
}

.toggleOn{
    border: 1px solid rgb(0,176,240) !important;
    color: rgb(0,176,240);
}

.toggleOff{
    border: 1px solid rgba(138, 151, 151, 0.6) !important;
    background-color: #fbfbfb;

}

.toggleDiv {
    background-color:#fff;
    border-color: #ddd;
    border-style: solid;
    border-width: 1px;
    border-radius: 2px;
}

/* introJS mods */
.introjs-tooltip, .introjs-tooltip ul li, .introjs-tooltip ol li {
    color: #6c6c6c !important;
    font-size: 13px !important;
}
.introjs-helperLayer {
    background-color: #fff;
}

/* needed for health map tooltip expansion */
.ui-tooltip {
    max-width: 360px;
}


.alarm-content {
  top: 55px;
  right: 10px;
  margin-top:30px !important;
  margin-bottom: 3px !important;
  margin-right: -5px !important;
  line-height:1.5em !important;
  max-width:700px;
  border: 2px solid rgb(230, 230, 230) !important;
  background: rgb(251, 251, 251) !important;
  display:none;
  position: absolute;
  white-space:normal;
  color: #6a6a6a !important;
  z-index:20;
}

.alarmBar {
  display: block!important;
  border: 0px!important;
  padding: 0!important;
  margin-top: 0px!important;
  float: right!important;
}

.custom_noty_message{
  font-weight:normal;
}

/*link status used in grid cell*/
span.status_bg_colors{
    width: 100%;
    height: 100%;
    text-align: center;
    float: left;
    display: table-cell;
    vertical-align: middle;
    font-weight: bold;
    box-sizing: border-box;
    border-radius: 2px;
}

span.statusEstablished {
  color: #fff !important;
  background-color: #0daf0d;
}

span.statusNotEstablished {
  color: #fff !important;
  background-color: red;
}

span.statusAdminDown {
  color: #000 !important;
  background-color: orange;
}

span.statusNotActive {
  color: #000 !important;
}

span.statusApplianceUnreachable {
  color: lightgrey !important;
}

.legendGroup {
  display: inline-block;
  margin-left: 25px;
}

.legendItem {
  display: inline-block;
  margin-left: 5px;
}

.legendLine {
  height: 6px;
  width: 30px;
  vertical-align: top !important;
  display: inline-block;
}
/* Toggle Button */
/* The switch - the box around the toggleBtn */
.switch {
    position: relative;
    display: inline-block;
    width: 30px;
    height: 12px;
    margin: 5px 0 10px 0;
}

/* Hide default HTML checkbox */
.switch input {display:none;}

/* The toggle button */
.toggleBtn {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    transition: .4s;
}

.toggleBtn:before {
    position: absolute;
    content: "";
    height: 8px;
    width: 8px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .4s;
    transition: .4s;
}

input:checked + .toggleBtn {
    background-color: #2196F3;
}

input:checked + .toggleBtn:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}

/* Rounded toggle button */
.toggleBtn.round {
    border-radius: 34px;
}

.toggleBtn.round:before {
    border-radius: 50%;
}

div.specialRule {
  color: darkorange !important;
}

div.orchTmpRuleLegend {
  background-color: darkorange;
  height: 12px !important;
  width: 20px !important;
  vertical-align: middle;
  border-radius: 2px;
}

.matchSuccessText {
  color: green;
}

/* Standard CSS animation syntax */
@keyframes progressPulse {
    0% {color: rgb(0,176,240);}
    35% {color: rgb(0,176,240);}
    50% {color: transparent;}
    65% {color: rgb(0,176,240);}
    100% {color: rgb(0,176,240);}
}
/* Safari 4.0 - 8.0 */
@-webkit-keyframes progressPulse {
    0% {color: rgb(0,176,240);}
    35% {color: rgb(0,176,240);}
    50% {color: transparent;}
    65% {color: rgb(0,176,240);}
    100% {color: rgb(0,176,240);}
}

.orchProgressContainer {
  height: 19px;
  vertical-align: middle;
  float: right;
  margin: 4px 15px;
  display: none;
  position: relative;
  cursor: pointer;
  border-radius: 2px;
  box-sizing: border-box;
  padding: 0px 3px;

}

.orchProgressSpan {
  vertical-align: middle;
  font-size: 11px;
  color: rgb(0,176,240);
  -webkit-animation-name: progressPulse; /* Safari 4.0 - 8.0 */
  -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
  animation-name: progressPulse;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}

.disabledOpacity {
  opacity: .15;
}

/*link completion used in grid cell at audit log*/
span.completion_status_bg_colors{
  width: 100%;
  height: 100%;
  text-align: center;
  float: left;
  display: table-cell;
  vertical-align: middle;
  font-weight: bold;
  box-sizing: border-box;
  border-radius: 2px;
}

span.completionStatusFailed {
  color: #fff !important;
  background-color: red;
}

/* for Appliance Bandwidth Trends, DSCP Trends, Shaper Trends, Appliance Flow Trends */
.trendsChartTableLegend{
  float: right;
  margin-right: 30px;
  padding-bottom: 10px;
  position: relative;
  z-index:20;
}

.shaperTrendsChartTableLegend{
  float: right;
  padding-bottom: 10px;
  position: relative;
  z-index:20;
}

.trendsChartTableLegend .wanPayload {
  background-color: rgba(0, 0, 107, 1);
  height:16px;
  border:1px solid rgba(0, 0, 107, 1);
}

.trendsChartLegend{
  height: 12px !important;
  width: 20px !important;
  border-radius: 2px;
}

.trendsChartLegendLine {
  vertical-align: top;
}

.trendsChart_no_ne_selected{
  padding-top: 80px;
  padding-bottom: 60px;
  padding-left: 50px;
  font-size: 1.6em;
  color: #999;
  font-style: italic;
  line-height: 2em;
}

.softwareSummary{
  font-size: 12px;
  font-weight: bold;
}

.attention {
  color: #FF0000;
}

#overlayConfirmDialog td {
  white-space: normal;
}

.maitenanceModeSpan
{
  position: absolute;
  left: -24px;
  text-align: center;
  width: 20px;
}

.maitenanceModeSpan img {
  position: relative;
  width: 19px !important;
  height: 14px !important;
}

.ui-tabs-nav .ui-icon-pin
{ opacity: .5; margin-left: -3px; margin-top: 4px; }


.haIconContainer {
    position: relative;
    padding: 0px 7px;
}

.haIconContainer img{
    position: absolute;
    left: 0px;
    width: auto !important;
    height: auto !important;
}

/* Tree and Tree Filter */

/* Hide folder icon */
.dynatree-expanded img[src*="icon_grp.png"] {
  display: none !important;
}

ul.dynatree-container img[src*="icon_grp.png"]
{
  visibility: hidden;
  display: none;
}

.dynatree-selected .applianceCount{
  color: #999;
}

/* Appliance Counts in Groups */
.applianceCount {
  cursor: pointer;
  position:relative;
  display: inline-block;
  padding-left: 7px;
  color: #888;
  horiz-align: right;
}

/* Filters */
#showTagsDiv {
  right: 5px;
  top: 17px;
  position: absolute;
  white-space: nowrap;
}

#expandCollapseAll {
  position: absolute;
  left: 10px;
}

#currentTagsDiv {
  margin: 16px 5px 8px 8px;
  border-bottom: 1px solid #eee;
  padding-bottom: 10px;
}

.tagListElem {
  cursor: pointer;
  display:inline-block;
  border: 1px solid rgb(230,230,230);
  border-radius: 3px;
  padding: 1px 4px;
  font-size:11px;
  margin: 2px 0px;
  color: #777;
  display: inline-block;
}

.tagListElem:hover {
  border-color: #1C6EF2 !important;
  color: #1C6EF2 !important;
}

.tagActive {
  color: rgb(0,176,240);
  border-color: rgb(0,176,240);
  position: relative;
}

.tagActive:hover::after {
  position: absolute;
  content: 'X';
  font-size: 10px;
  color: #888;
  background-color: white;
  border-radius: 3px;
  right: -3px;
  top: -6px;
}

.treeFilter .dynatree-selected{
  position: relative;
}

.treeFilter .dynatree-selected:hover::after {
  position: absolute;
  content: 'X';
  font-size: 10px;
  color: #888;
  background-color: white;
  border-radius: 3px;
  right: -1px;
  top: -3px;
}

#expandCollapseTag, #expandCollapseTree {
  cursor: pointer;
  color:#1C6EF2 !important;
  font-size:12px !important;
  font-family:Arial, sans-serif;
}

.treeFilter ul.dynatree-container a {}

.treeFilter span.dynatree-node span + a {
  width: auto;
  cursor: pointer;
  display: inline-block;
  border: 1px solid rgb(220,220,220);
  border-radius: 3px;
  padding: 1px 4px;
  font-size: 10px;
  font-family: Tahoma, sans-serif;
  margin: 1px 1px;
  color: #888;
}

.treeFilter .dynatree-expander+.tagListElem {
  border-color: transparent !important;
  color: #666;
  font-style: italic;
  font-size: 11px;
}

.treeFilter .dynatree-selected .tagListElem {
  border-color: rgb(0,176,240);
  background-color: white;
  color: rgb(0,176,240);
}

.treeFilter ul li ul {
  padding: 0 0 4px 18px !important;
  white-space: normal;
}

.treeFilter li li {
  display: inline-block;
  margin-left: 1px;
}

.treeFilter li .dynatree-connector {
  display: none;
}

.treeTagCount{
  color: #aaa;
}

/* slim scrollbar */
#leftPane::-webkit-scrollbar {
  width: 5px;
  height: 5px;
}

#leftPane::-webkit-scrollbar-button {
  width: 0px;
  height: 0px;
}

#leftPane::-webkit-scrollbar-track {
  background: #fafafa;
  border: thin solid #ececec;
  box-shadow: 0px 0px 3px #ebebeb inset;
  border-radius: 10px;
}

#leftPane::-webkit-scrollbar-thumb {
  background: #cecece;
  border: thin solid #cdcdcd;
  border-radius: 0px;
}

#leftPane::-webkit-scrollbar-thumb:hover {
  background: #d1d1d1;
}

.progressBarContainer {
  text-align: center;
  position: absolute;
  left: calc(50% - 150px);
  bottom: 17px;
  width: 300px;
  font-size: 0.75em !important;
}
.progressBar {
  height: 4px;
  border: none;
  background: #f1f1f1;
  position: absolute;
}
.progressBarLabel {
  position: absolute;
  left: 47%;
  background: rgba(255,255,255,.85);
  border-radius: 2px;
  padding: 0 2px;
}

.progressBar .ui-progressbar-value {
  background-color: #1C6EF2 !important;
}

.gridProgressBarContainer {
  text-align: center;
  position: absolute;
  left: calc(50% - 150px);
  top: 9px;
  width: 300px;
  font-size: 0.75em !important;
}

.loadingSpinner {
    position: absolute;
    left: calc(50% - 10px);
    top: calc(50% - 10px);
    border: 2px solid #f0f0f0;
    border-radius: 50%;
    border-top: 2px solid #1C6EF2;
    border-right: 2px solid #1C6EF2;
    border-bottom: 2px solid #1C6EF2;
    width: 20px;
    height: 20px;
    -webkit-animation: spin 1s linear infinite; /* Safari */
    animation: spin 1.5s linear infinite;
}

span.loadingSpinner {
    position: relative;
    top: auto;
    left: auto;
    width: 10px;
    height: 10px;
    vertical-align: middle;
    display: inline-block;
}

.slick-cell .loadingSpinner {
    width: 15px;
    height: 15px;
}

.copy-icon{
  cursor: pointer;
  display: inline-block;
  margin: 0px 0px -3px 0;
}
.small-spinner{
  width: 15px;
  height: 15px;
  left: 200px;
}

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

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

.redist-select{
  width:210px;
}

/* Tooltip info icon */
.tooltipInfo {
  position: relative;
  display: inline-block;
}
.tooltipInfoText {
  display: none;
  text-align: start;
  word-wrap: normal;
  font-size: 11px;
  color: #999;
  width: 160px;
  background-color: white;
  border: 1px solid #aaa;
  border-radius: 5px;
  padding: 6px 8px;
  position: absolute;
  z-index: 1;
  bottom: 125%;
  margin-left: -60px;
  opacity: 0;
  transition: opacity 0.1s;
}
.tooltipInfoText::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 35%;
  border: 5px solid;
  border-color: #aaa transparent transparent;
}
.tooltipInfoIcon {
  width: 14px;
  height: 14px;
}
.tooltipInfoIcon:hover ~ .tooltipInfoText {
  display: block;
  opacity: 1;
}

.noty_theme__broadcastMessageAlarm.noty_bar {
  margin: 4px 0;
  overflow: hidden;
  border-radius: 2px;
  position: relative;
}
.noty_theme__broadcastMessageAlarm.noty_bar .noty_body {
  padding: 10px;
}
.noty_theme__broadcastMessageAlarm.noty_type__error {
  margin-bottom: 10px;
  background-color: white;
  border: 2px solid #E25353;
  border-top: 10px solid #E25353;
  color: black;
}
.noty_theme__broadcastMessageAlarm.noty_bar .noty_buttons {
  padding: 5px 10px;
}
.noty_theme__broadcastMessageAlarm.noty_bar {
   margin: 4px 0;
   overflow: hidden;
   border-radius: 2px;
   position: relative;
 }
.noty_theme__broadcastMessageAlarm.noty_bar .noty_body {
  padding: 10px;
}
.disable_div {
  opacity: 0.5;
  pointer-events: none;
}

.scConnected, .scNotConnected {
  width:auto;
  height:25px;
  min-width: 60px;
  border-left:1px solid #ddd;
  padding: 0 5px;
  cursor:pointer;
  text-align:center;
  float:left;
  overflow:hidden;
  display:table-cell;
  vertical-align:middle;
  width:100%;
  height:100%;
  border: none;
  border-radius:2px;
}

.scNotConnected {
  color:#fff;
  background-color:red;
  font-weight:bold;
}

.scConnected {
  color: #fff !important;
  background-color: #0daf0d;
  font-weight:bold;
}