/*========================== CSS DE BASE ===================================*/
html {
	height: auto;
	background-color: #F0F0F0;
	/*	background-image: url("/img/m-icb-diag-hatch.gif");*/
	background-repeat: repeat;
}

body {
	font-family: Helvetica, Verdana, sans-serif;
	font-size: 0.875em;
	text-align: justify;
	background-color: #FFF; /*#F8F8F8*/
	color: #424242;
	max-width: 85.7855em;
	margin: auto;
	padding-right: 1em;
	height: auto;
}

h1, h2, h3, h4, h5, h6 { color: #D4AF37; padding-bottom: 0.666em; /*margin: 0em;*/}

h1 { font-size: 3.375em; padding: 0.666em; }
h2 { font-size: 2.25em; }
h3 { font-size: 1.5em; }
h4 { font-size: 1.313em; margin: 1em 0em 0em 0em; padding: 0em; }

h1 a { text-decoration: none; }
h1 a:link { text-decoration: none; }
h1 a:hover { text-decoration: none; }
h1 a:active { text-decoration: none; }
h1 a:visited { text-decoration: none; }

ul { list-style-type: none; }

#side-bar a, #top-bar a { text-decoration: none; }
a:link { color: #424242; }
a:hover { color: #424242; text-decoration: underline; }
a:active { color: #424242; }
a:visited { color: #424242; }

img { max-width: 100%; }

/*========================== CSS TOP BAR ===================================*/

#top-bar {
	height: 40px;
	background-color: #D4AF37;
	margin-bottom: 15px;
	margin-right: -1em;
	padding: 0px 20px;
}

#societe {
	width: auto;
	text-align: right;
	font-weight: bold;
	height: 40px;
	display: table-cell;
	vertical-align: middle;
}

#links {
	height: 40px;
	display: table-cell;
	vertical-align: middle;
}

.links-selected {
	background-color: #D4AF37;
}

.links-unselected a, .links-selected a {
	padding: 8px 12px;
	color: white !important;
}

.links-unselected, .links-selected {
	cursor: pointer;
	border-right: 1px solid rgba(0, 0, 0, 0.347656);
	height: 40px;
	display: table-cell;
	vertical-align: middle;
}

#username {
	padding-right: 100px;
	color: #1B637B;
	font-weight: bold;
	height: 40px;
	display: table-cell;
	vertical-align: middle;
}

#locales {
	padding-right: 50px;
	height: 40px;
	display: table-cell;
	vertical-align: middle;
}

#locales .locale {
	display: none;
}

#logout {
	width: auto;
	height: 40px;
	display: table-cell;
	vertical-align: middle;
}

#logo {
	background-image: url("/img/vip-tickets.png");
	background-size: 200px;
	background-repeat: no-repeat;
	background-position: center;
	height: 200px;

}

#title {
	display: none;
}

#side-bar {
	/*background-color: #E8E8E8;*/

	width: 15.95em;
	float: left;
	border-right: dotted 0.198em #598BA9;
	text-align: left;
}

#side-bar ul {
	padding: 0.444em 1em;
	margin: 0.444em 0em;
}

#side-bar ul li a {
	/*font-weight: bold;*/
	border-bottom: 1px solid #CCC;
	width: 172px;
	background: url("/img/menu.png") no-repeat scroll 200% 0% transparent;
	font-size: 13px;
	display: inline-block;
	padding-top: 6px;
	padding-bottom: 6px;
	color: #D4AF37;
	padding-left: 8px;
	margin-left: 10px;
}
#side-bar ul li a:hover {
	background-color: rgba(31, 125, 216, 0.26) !important;
}

#mobile-menu-head { display: none; }

#main {
	margin-left: 18.086em;
	margin-top: 2.5em;
}

.h2-links {
	font-size: 1em;
	color: #D4AF37 !important;
	text-decoration: none;
}

table {
	width: 100%;
	margin: auto;
	margin-bottom: 3em;

	border-collapse: collapse;
}

caption { font-size: 1.5em; }

tr { line-height:  1.5em; }

th { text-align: center; }

td {
	border-top: solid 1px #424242;
	border-bottom: solid 1px #424242;

	text-align: center;
}

fieldset {
    border: none;
    border-top: solid 2px #424242;
    margin-top: 1em;
}

form[disabled] fieldset {
	border: solid 2px #848484;
	color: #848484;
}

legend {
	font-size: 1.313em;

	padding: 0 0.296em;
}

label {
	display: inline-block;
	width: 11.391em;
	padding-right: 1em;
    padding-left: 12.5px;

	text-align: right;
}

fieldset label { padding-left: 0; }

span.obligatory {
	color: #C62626;
}

input, select { width: 18em; }

button, input {
	color: #424242;
	border: solid 1px #424242;
    border-radius: 2px;
	background-color: #fcfcfc;
    box-sizing: border-box;

	padding: 0.296em;
	max-width: 18em;
}

input[type=file] {
	background-color: inherit;
	border: none;
}

input[type=text][readonly] {
	margin-left: 1px;
	margin-right: 1px;
	border: none;
	background-color: #F8F8F8;

	font-style: italic;
}

form[disabled] input[type=text], input[type=text][disabled] {
	border: solid 1px #F8F8F8;
	background-color: #F8F8F8;
}

input[type=checkbox] { width: auto; }

input[type=radio] { width: auto; }

button,
input[type=submit] {
	width: auto;
	padding: 0.296em;

	font-weight: bold;
}

button[disabled],
form[disabled] input[type=submit], input[type=submit][disabled] {
	border: solid 1px #F8F8F8;
	background-color: #F8F8F8;
	color: #848484;
}

button:active,
input[type=submit]:active {
	background-color: #C8C8C8;
}

button[type=submit].submit-link {
	margin: 0em;
	margin-left: 1em;
	padding: 0em;

	font-weight: normal;

	color: #1B7B58;

	border: none;
	background-color: inherit;
}

button[type=submit].submit-link:hover {
	text-decoration: underline;
	cursor: pointer;
}

select {
	color: #424242;
	border: solid 1px #424242;
    border-radius: 2px;
	background-color: #fcfcfc;

	padding: 0.296em;
	max-width: 18em;
	width: 100%;
}

hr { border: none; border-bottom: solid 1px #424242; }

p { margin: 0.666em 0em }

/*========================== CSS TOP BAR ===================================*/

.discreet { color: #999; }

/*========================== CSS ALERT ===================================*/

.icon-info { width: 1em; margin-right: 0.444em; margin-left: 0.444em; }
.input-info .icon-info, .input-extra .icon-info { margin-left: 0em; }

.alert {
	margin: 0;
	padding: 0.198em;

	background-color: #E8E8E8;

	font-weight: bold;
	font-size: 1.313em;
	text-align: center;
}

.hidden {
	height: 0em;
	padding: 0em;
	margin: 0em;
	visibility: hidden;
}

.error { color: #C62626 !important; }
.alert-warning { color: #C3BB2C !important;}
.info { color: #D4AF37 !important; }
.good { color: green !important; }


#map {
	float: left;
	margin: 0px 1em 1em 1em;
	width: 25.629em;
	height: 25.629em;
}

#contact-infos {
	margin-left: 27.629em;
}

dt {
	display: inline-block;
	float: left;

	width: 7.594em;
	padding-right: 1em;

	font-weight: bold;
	text-align: right;
}

dd {
	margin-left: 8.594em;
	margin-bottom: 0.444em;
}

#clock-container { background-color: #F8F8F8; }

.input-info {
	margin-left: 1.615em;
	font-style: italic;
}

.input-extra { padding-left: 1em; }

.locale {
	display: inline-block;

	padding: 0.444em;
	margin: 0em;
}

.locale a {
	display: inline-block;

	height: 24px;
}

#bottom-bar {
	clear: both;
	text-align: center;
	padding: 0.296em;
	bottom: 0px;
	left: 0px;
	right: 0px;
	height: auto;
	margin-top: 25px;
}

.label-textarea {
	vertical-align: top;
	padding-top: 0.296em;
}

textarea {
	margin: 0em;
	padding: 0.296em;
	width: 27em;
	height: 10em;

	color: #424242;
	border: solid 1px #424242;
	background-color: #fcfcfc;

	font-family: Helvetica, Verdana, sans-serif;
}

#recaptcha_widget_div { margin-left: 12.391em; }
.recaptchatable .recaptcha_input_area #recaptcha_response_field {
	padding: 0.296em!important;
	width: 146px!important;

	border: solid 1px #424242;
}

.well {
	/* width: 45.2857em; */
	width: 57.70em;

	background-color: #F0F0F0;
}

.button, .button:link, .button:hover, .button:active, .button:visited {
	display: inline-block;

	/*width: 7.594em;*/
	padding: 1em;

	color: #F8F8F8;
	background-color: #1B6371;

	font-size: 1.5em;
	font-weight: bold;
	text-align: center;
}

.button.white, .button.white:link, .button.white:hover,
.button.white:active, .button.white:visited {
	background-color: #CCC;
}

.button.warning, .button.warning:link, .button.warning:hover,
.button.warning:active, .button.warning:visited {
	background-color: #C3BB2C;
}

.button.error, .button.error:link, .button.error:hover,
.button.error:active, .button.error:visited {
	background-color: #C62626;
}

.button.good, .button.good:link, .button.good:hover,
.button.good:active, .button.good:visited {
	background-color: green;
}

.button.info, .button.info:link, .button.info:hover,
.button.info:active, .button.info:visited {
	background-color: #1B7B58;
}

.explanation {
	padding: 1em;

	font-size: 1.5em;
}

.inline { display: inline-block; }
.inline label { width: 8.1em; }

.info-panel {
	display: inline-block;

	width: 25.2em;

	padding: 1em;
	margin-right: 1.5em;
	margin-bottom: 1.5em;

	border-top: solid 0.197em #1B7B58;
	border-top: solid 0.296em #1B7B58;

	text-align: center;
	vertical-align: top;
}

.info-panel p { text-align: left; }

.info-panel h3 {
	padding: 0em;
	margin-bottom: 0.444em;

	color: #1B7B58;

	text-align: left;
}

.info-panel img {
	width: 12em;
	height: 12em;
}

.info-panel .info-panel-image a {
	display: block;

	width: 25.2em;
	height: 12em;

}

.info-panel-image {
	background-repeat: no-repeat;
	background-position: center;
	background-width: 12em;
	background-height: 12em;

	margin-bottom: 0.444em;
}

.info-panel-image-manageaccess { background-image: url("/img/system-lock-screen.svg"); }
.info-panel-image-openhours { background-image: url("/img/appointment-new.svg"); }
.info-panel-image-remotecontrol { background-image: url("/img/preferences-desktop.svg"); }
.info-panel-image-multiplesite { background-image: url("/img/applications-internet.svg"); }
.info-panel-image-help { background-image: url("/img/help-browser.svg"); }
.info-panel-image-network { background-image: url("/img/system-users.svg"); }
.info-panel-image-useraccess { background-image: url("/img/go-home.svg"); }
.info-panel-image-newuser { background-image: url("/img/contact-new.svg"); }
.info-panel-image-unitsaccess { background-image: url("/img/emblem-readonly.svg"); }
.info-panel-image-centrals { background-image: url("/img/drive-harddisk.svg"); }

.toc {
	/* background-color: #F0F0F0; */
	border-left: solid 0.198em #1B7B58;

	width: 15.086em;
	padding: 1em;
	margin: 0.666em 0em 0.666em 1em;

	float: right;
}

.toc ul {
	padding-left: 1em;
	margin: 0.444em 0em;
}

.question p {
	margin: 0.444em 0em 0.666em 0em;
}

.question a { text-decoration: none; }
.question a:link { text-decoration: none; }
.question a:hover { text-decoration: none; color: #D4AF37; }
.question a:active { text-decoration: none; }
.question a:visited { text-decoration: none; }

.menus { margin-top: 25px;}

.radioLabel { text-align: left; width: 50px; padding-left: 10px; }

.sid { width: 9.391em; }

.big-map {
	height: 380px;
	margin: 1.5em auto 3em auto;
}

th.left-align, td.left-align {
	padding-left: 2em;
	text-align: left !important;
}

th.right-align, td.right-align {
	text-align: right !important;
	padding-right: 2em;
}

#graph {
	width: 100%;
	height: 1100px;

	border: none;
}

/* fond blanc pour le menu */
div#locales a {color:#000000}
div#locales ul {padding: 0; margin:0px;}

div#locales ul li {position:relative; list-style: none; margin: 0.444em 0em; }
div#locales ul ul {position: absolute; top: 20px; left: 0px; display:none}

div#locales li a {
	color: #1B637B;
	font-weight: bold;
	display:block;
}
div#locales ul.niveau1 li.sousmenu:hover ul.niveau2,
div#locales ul.niveau2 li.sousmenu:hover ul.niveau3 {display:block;}

li.sousmenu{
	padding: 2px;
}

.top {
	color: #F8F8F8 !important;
}

.easylogo {
	width: 100%;
	margin-top: 50px;
}

.print {
	text-align: right;
	width: 180px;
	height: 19px;
	margin-left: 24px;
}

.print img {
	width: 1.3em;
}

.monospace {
	font-family: Monaco, Courrier, monospace;
	font-size: 0.875em;
}

/*========================== CSS NAGIOSGRAPH ===================================*/


#ngzZoomInfo {
	padding-top: 2px;
	padding-left: 8px;
	opacity: 0.3;
	font-weight: bold;
	font-size: 1.5em;
}
#ngzZoomBox {
	background-color: #ffdd00;
	border-left: 2px solid black;
	border-right: 2px solid black;
}
#ngzZoomPanel {
	background-color: #dda;
}

.legende-left {
	border: 1px dashed #CCC;
	margin: 40px 10px 10px 10px;
	padding: 10px;
	display: inline-block;
}

.legende-top {
	border: 1px dashed #CCC;
	margin: 10px;
	padding: 10px;
	display: inline-block;
}

.legende-left h3, .legende-top h3 {
	text-align: center;
	margin: 0px;
}

.legende-left p, .legende-top p {
	margin: 0px;
}

/*========================== CSS NAVIGATION ===================================*/
.img-graph {
	display: inline;
	width: 79%;
	height: 207px;
}
.img-graph img {
	width: 80%;
	margin-bottom: 25px;
	display: inline;
	float: right;
	height: inherit;
}

.img-graph a {
	height: inherit;
}

.info-graph {
	text-align: center;
	margin-top: 20px;
}

.info-graph-rrd {
	width: 19.8%;
	height: inherit;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
}

.info-graph-rrd h3 {
	margin: 0px;
	padding: 0px;
}

.navigation {
	width : 100%;
	height : 30px;
	display: table;
	border: 1px dashed #CCC;
}

.navigation.rrd { height: 207px; }
.navigation.google { height: 442px; }

.info-graph-rrd .left {
	width : 27px;
	height: 30px;
	padding-top: 10px;
}

.info-graph-rrd .right {
	width: 27px;
	height: 30px;
	text-align: right;
	display: inline;
	float: right;
}

.info-graph-rrd .center {
	height : 30px;
	font-size: 13px;
	padding-top: 10px;
	text-align: right;
}
.info-graph-rrd .img-left { background-size: 30px; background-image: url("/img/arrow_left.png"); background-repeat: no-repeat; width: 100%; height: 100%; float:left; text-decoration: none; margin-left: 20px; }
.info-graph-rrd .img-right { background-size: 30px; background-image: url("/img/arrow_right.png"); background-repeat: no-repeat; width: 100%; height: 100%; display: inline; float: right; text-decoration: none; margin-right: 20px; margin-top: 9px;}

.menuSensor {
	width: 100%;
	padding: 1em;
	margin: 0.666em 0em 0.666em 1em;

}

.menuSensor ul {
	padding-left: 1em;
	margin: 0.444em 0em;
}

.ui-tooltip {
	background: white;
	border: 0.1px solid black;

	text-align: center;
	width: 17%;
	padding: 10px 20px;
	border-radius: 5px;
	box-shadow: 0 0 5px black;
}

.info-tooltip{
	width: 10em !important;
	float: left;
}

#summary {
	text-align: left;
}

#summary label {
	text-decoration: underline;
	text-align: center;
	font-weight: bold;
	margin: 0px 0px 10px 0px;
	padding: 0px;
}

.summary_right {
	text-align: right !important;
	margin-top: -16px;
}

#carte{
	height: 300px;
	margin: auto;
}

/*========================== CSS services and hosts status ===================================*/
.status-up, .status-ok {
	border: 2px solid #33EE33;
	background-color: #33EE33;
	display: inline;
	padding: 1px 5px;
	margin: 0px 1px;
}
.status-down, .status-critical {
	border: 2px solid #F66;
	background-color: #F66;
	display: inline;
	padding: 1px 5px;
	margin: 0px 1px;
}
.status-warning {
	border: 2px solid #EEE216;
	background-color: #EEE216;
	display: inline;
	padding: 1px 5px;
	margin: 0px 1px;
}
.status-pending {
	border: 2px solid #808080;
	background-color: #808080;
	display: inline;
	padding: 1px 5px;
	margin: 0px 1px;
}
.status-unreachable, .status-unknown {
	border: 2px solid #FFA500;
	background-color: #FFA500;
	display: inline;
	padding: 1px 5px;
	margin: 0px 1px;
}
.status-up-zero, .status-ok-zero {
	border: 2px solid #33EE33;
	display: inline;
	padding: 1px 5px;
	margin: 0px 1px;
}
.zero {
	border: 2px solid #33EE33;
	display: inline;
	padding: 1px 5px;
	margin: 0px 1px;
	opacity: 0 !important;
}
.unreachable, .unknown {
	background-color: #FFA500;
	color: #FFA500;
}
.pending, .gray {
	background-color: #808080;
	color: #808080;
}
.warning {
	background-color: #EEE216;
	color: #EEE216;
}
.green, .up, .ok{
	background-color:#33EE33;
	color: #33EE33;
}
.circle{
	border-radius : 50%;
	width: 1.5em;
	height: 1.5em;
	display: inline-block;
}
.red, .down, .critical{
	background-color:#F66;
	color: #F66;
}

a.ok {
	background-color: inherit;
	color: #33EE33;
}

a.warning {
	background-color: inherit;
	color: #EEE216;
}

a.critical {
	background-color: inherit;
	color: #F66;
}

a.unknown {
	background-color: inherit;
	color: #FFA500;
}

a.pending {
	background-color: inherit;
	color: #808080;
}

.green-status{
	background-color:#33EE33;
	color: #33EE33;
}
.red-status{
	background-color:#EE3333;
	color: #EE3333;
}
.gray-status{
	background-color: #808080;
	color: #808080;
}
.orange-status{
	background-color: #FFA500;
	color: #FFA500;
}

/*============================== Glyphicons =========================*/

.glyphicons {
	font-size: 20px;
	text-decoration: none;
}

.glyphicons:hover {
	text-decoration: none;
}

.glyphicons-circle-info {
	text-decoration: none;
	font-size: 15px;
	margin-right: 10px;
	padding-left: 5px;
	font-style: normal;
	font-weight: normal;
}

.glyphicons-remove-2, .glyphicons-circle-remove, .glyphicons-circle-minus, .glyphicons-stop-sign {
	color: red !important;
}

.glyphicons-circle-plus, .glyphicons-ok-2 {
	color: green !important;
}

.glyphicons-chevron-down, .glyphicons-chevron-up {
	font-size: 10px;
	vertical-align: middle !important;
	top: 0px !important;
}

.glyphicons-edit {
	margin-top: -2px;
}

.glyphicons-print {
	color: #0D67B5;
	font-size: 18px !important;
}

.glyphicons-undo {
	font-size: 30px;
}

#rootUserMenu {
	display: none;
}

ul#arbre {
	margin-left: 10px;
	opacity: 0;
}

#Central_label {
	width: auto !important;
}

.unit_noscript {
	display: none;
}

#dashboard {
	display: table-cell;
	vertical-align: middle;
}

#chart {
	width: 100%;
	text-align: center;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.chart-options {
	min-height: 47px;
}

.chart-options .glyphicons.glyphicons-undo {
	padding-top: 8px;
}

.chart-options .button, .chart-options span .button {
	width: 4em;
	font-size: 1.2em;
	padding: 0.8em;
	margin-right: 1em;
	background-color: #D4AF37;
}

.chart-options .button.label {
	background-color: #FFF;
	color: #424242;
}

.chart-options span .button.toggle-visibility {
	width: auto;
	background-color: #424242;
	margin-right: 1em;
	text-decoration: underline;
	visibility: hidden;
}

.chart-options span .show-hover {
	display: inline-block;
	height: 3em;
}

.chart-options span .show-hover:hover .button.toggle-visibility {
	cursor: pointer;
	visibility: visible;
}

.toggle-visibility span.glyphicons { margin-left: 0.5em; }

.chart-options span .button.now-chart {
	width: auto;
	background-color: #424242;
	margin-right: 1em;
}

.chart-options span .button.toggle-chart {
	width: auto;
	background-color: #424242;
	margin-right: 1em;
}

.chart-options span .button.toggle-chart.rrd-to-google {
	margin-right: 0em;
}

.chart-options span .button.download {
	width: 6em;
	background-color: #424242;
	margin-right: 0;
	visibility: hidden;
}

.inline-form label {
	width: 16.15em;
}

.inline-form input {
	width: 42em;
	max-width: none;
	margin-left: 1.615em;
}

.inline-form input.submit {
	width: auto;
}

.inline-form button {
	width: auto;
	font-size: 1.1em;
}

.pull-right { float: right; }

th.annotation-date { width: 15%; }
th.annotation-value { width: 15%; }
th.annotation-actions { width: 8%; }

tr.selected { background-color: #F0F0F0; }

a.annotation-edit { cursor: pointer; }
a.annotation-delete {
	cursor: pointer;
	color: #424242 !important; /* Overwrite default color */
}

#annotation-form span.show-hover {
	display: inline-block;
	height: 1.1em;
}

#annotation-form span.show-hover button#hide-sample {
	visibility: hidden;
}

#annotation-form span.show-hover:hover button#hide-sample {
	visibility: visible;
}

#interactive-map { position: relative; overflow-x: auto; }
#interactive-map #interactive-background { width: 948px; }
#interactive-map #interactive-background.grabbing { cursor: none; cursor: -webkit-none; }
#interactive-map .interactive-item { cursor: move; cursor: -webkit-move; }
#interactive-map .interactive-item.grabbing { cursor: none; cursor: -webkit-none; }

#interactive-map .static-item, #interactive-map .interactive-item {
	position: absolute;
	background-color: inherit;
	font-size: 1em;
	color: #D4AF37;
	/*text-shadow: 1px 0 #424242, 0 1px #424242, -1px 0 #424242, 0 -1px #424242;*/
}

#interactive-map .static-sensor {
	border: solid 3px;
	border-radius: 6px;
}

#interactive-map .static-item.ok,
#interactive-map .static-item.up {
	border-color: #1B7B58;
	color: #1B7B58;
}

#interactive-map .static-item.warning {
	border-color: #C3BB2C;
	color: #C3BB2C;
}

#interactive-map .static-item.critical,
#interactive-map .static-item.down {
	border-color: #C62626;
	color: #C62626;
}

#interactive-map .static-item.unknown,
#interactive-map .static-item.unreachable {
	border-color: #FFA500;
	color: #FFA500;
}

#interactive-map .static-item.pending {
	border-color: #B3B3B3;
	color: #B3B3B3;
}

.static-item.warning, .static-item.critical, .static-item.down,
.static-item.unknown, .static-item.unreachable, .static-item.pending {
	border-width: 4.5px !important;
}

.static-item.unknown, .static-item.unreachable, .static-item.pending { z-index: 10; }
.static-item.warning { z-index: 20; }
.static-item.critical, .static-item.down { z-index: 30; }

th.headerSortUp {
	background-image: url(/img/desc.gif) !important;
	background-color: #C9D4E0;
}

th.headerSortDown {
	background-image: url(/img/asc.gif) !important;
	background-color: #C9D4E0;
}

th.header {
	background-image: url(/img/bg.gif);
	cursor: pointer;
	font-weight: bold;
	background-repeat: no-repeat;
	background-position: center right;
}

.button_not_remove {
	display: inline-block;
	text-decoration: none;
	background-color: #C71E1C;
	letter-spacing: .5px;
	padding: 9px 33px;
	text-align: center;
	text-shadow: 0 -1px 0 rgba(0,0,0,.08);
	font-size: 13px;
	cursor: pointer;
	color: #FFFFFF;
	margin: 20px;
}

.button_not_remove:hover, .button_not_remove:link, .button_not_remove:active, .button_not_remove:visited {
	color: #FFFFFF;
	text-decoration: none;
}

.button_remove {
	display: inline-block;
	text-decoration: none;
	background-color: #7ddc1f;
	letter-spacing: .5px;
	padding: 9px 33px;
	text-align: center;
	text-shadow: 0 -1px 0 rgba(0,0,0,.08);
	font-size: 13px;
	cursor: pointer;
	color: #FFFFFF;
	margin: 20px;
}

.button_remove:hover, .button_remove:link, .button_remove:active, .button_remove:visited {
	color: #FFFFFF;
	text-decoration: none;
}

.button_container {
	text-align:center;
	width: 100%;
}

.info-graph .img-left, .img-right {
	position:relative;
	top:1px;
	display:inline-block;
	font-family:'Glyphicons Regular';
	font-style:normal;
	font-weight:normal;
	line-height:1;
	vertical-align:top;
	-webkit-font-smoothing:antialiased;
	-moz-osx-font-smoothing:grayscale;
	font-size: 20px;
	text-decoration: none;
}
.img-left:hover, .img-right:hover {
	text-decoration: none;
}

.info-graph .img-left:before {content: "\E225"}
.info-graph .img-right:before {content: "\E224"}

.left {
	height : 100%;
	width : 3.7%;
	float : left;
	margin :auto;
	text-align : center;
}
.right {
	height : 100%;
	width : 3.7%;
	float: left;
	margin :auto;
	text-align : center;
}
.info-graph .center {
	width : 92.6%;
	float : left;
	text-align : center;
	font-size : 22px;
	margin-bottom: 20px;
}

#interactive-controls {
	text-align: right;
}

#interactive-controls .button {
	width: 4em;
	font-size: 1.2em;
	padding: 0.8em;
	margin-right: 1em;
	background-color: #D4AF37;
	text-decoration: underline;
}

#interactive-controls .button:hover {
	cursor: pointer;
}

#interactive-controls .button.disabled {
	background-color: #424242;
}

.overview-controls .button {
	width: 6em;
	padding: 0.42em;
	margin-left: 0.42em;
	margin-bottom: 0.42em;
	background-color: inherit;
	color: #D4AF37;
}

.overview-controls .button.blank { background-color: #FFF; color: #FFF; border: solid 1px #FFF; }

.overview-controls .button.ok,
.overview-controls .button.up { color: #1B7B58; background-color: inherit; border: solid 1px #1B7B58; }
.overview-controls .button.ok.active,
.overview-controls .button.up.active { color: #F8F8F8; background-color: #1B7B58; }

.overview-controls .button.warning { color: #C3BB2C; background-color: inherit; border: solid 1px #C3BB2C; }
.overview-controls .button.warning.active { color: #F8F8F8; background-color: #C3BB2C; }

.overview-controls .button.critical,
.overview-controls .button.down { color: #C62626; background-color: inherit; border: solid 1px #C62626; }
.overview-controls .button.critical.active,
.overview-controls .button.down.active { color: #F8F8F8; background-color: #C62626; }

.overview-controls .button.unknown,
.overview-controls .button.unreachable { color: #FFA500; background-color: inherit; border: solid 1px #FFA500; }
.overview-controls .button.unknown.active,
.overview-controls .button.unreachable.active { color: #F8F8F8; background-color: #FFA500; }

.overview-controls .button.pending { color: #B3B3B3; background-color: inherit; border: solid 1px #B3B3B3; }
.overview-controls .button.pending.active { color: #F8F8F8; background-color: #B3B3B3; }


.toggle-show-nixes { cursor: pointer; font-size: 1.14em; }
.toggle-show-nixes:hover { font-size: 1.14em; }

.overview-controls-show-nixes { display: none; }
.overview-controls-show-nixes .button {
	color: #D4AF37;
	background-color: inherit;
	border: solid 1px #D4AF37;
	width: auto;
	font-size: 1.14em;
}
.overview-controls-show-nixes .button.active { color: #F8F8F8; background-color: #D4AF37; }

.user-account .button {
	padding: 0.42em;
	margin-left: 2em;
	margin-bottom: 0.42em;
	background-color: inherit;
	color: #D4AF37;
	font-size: 1em;
}

.user-account .button.pending.active {
	color: #F8F8F8;
	background-color: #B3B3B3;
}

.sensor-label, .sensor-sid, .unit-label, .unit-profile, .nix1-sid, .nix1-label, .profile-label {
	text-align: left;
	width: 35%;
	padding-left: 2em;
}

.nix1-unit {
	text-align: left;
	width: 24%;
	padding-left: 2em;
}

.sensor-sample {
	text-align: right;
	width: 20%;
	padding-right: 2em;
}

.friend-firstname, .friend-lastname {
	text-align: left;
	width: 30%;
	padding-left: 2em;
}

.sensor-action {
	width: 10%;
}

th.sensor-status {
	width: 12.5%;
}

td.sensor-status {
	text-align: left;
}

tbody tr:hover {
	background-color: #EEE;
}

.red-font {
	color: red;
}

.button.curve-button {
	margin-left: 0.42em;
	font-size: 1.1em;
	padding: 0.296em;
	float: right;
}

.multi-columns {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
    text-align: left;
}

.column {
    margin: 0;
    padding: 0.5em;
    box-sizing: border-box;
    background: #F8F8F8;
    border-radius: 4px;
    flex: 1;
    margin: 0 0.5em 0.5em 0;
}

.column-item {
    border: 1px solid lightgray;
    border-radius: 3px;
    padding: 0.5em;
    box-sizing: border-box;
    background: #FEFEFE;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    font-family: sans-serif;
    margin-top: 0.5em;
}

.item-row {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}

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

.item-project {
    font-weight: lighter;
    font-size: 14px;
}

.item-time {
    font-weight: lighter;
    font-size: 12px;
}

.column h3 {
    margin: 0;
    margin-top: 0.2em;
    padding: 0;
}

.column p {
    font-style: italic;
}

.blob {
    display: flex;
    background-color: #f4f4f4;
    border-radius: 4px;
    filter: drop-shadow(2px 2px 1px #ccc);
    border: 1px solid #eee;
    margin-bottom: 1em;
}

.blob-content {
    flex-grow: 1;
    padding: 0 1.5em;

    display: flex;
    flex-direction: column;
}

.blob-content-subject {
    font-size: 1.5em;
    font-weight: bold;
}

.blob-content-meta {
    margin-top: auto;
    font-size: 0.8rem;
    font-style: italic;
}

.blob-content > .blob-content-meta {
    margin-top: .5em;
}

.blob-contact {
    display: flex;
    flex-direction: column;
    border-left: 2px solid #ddd;
    padding: 1em 1.5em 1em 1.5em;
    line-height: 2em;
}

.blob-contact-profile {
    text-align: center;
    filter: drop-shadow(0 0 1px #424242);
}
.blob-contact-profile img {
    width: 8em;
    filter: brightness(120%);
    clip-path: circle(52px at center);
}

.blob-contact-fullname { text-weight: bold; }
.blob-contact-username { font-style: italic; }