#wrapper {
	min-height: 100%;
	position: relative;
}

#groups {
	border: 1px solid #888;
	padding: 4px;
	margin: 1px 0px 1px 0px;
	background: #eef;
}

.groups-container {
	border: 1px solid #aaa;
	padding: 3px;
	/*	background: #bcb;  */
	background: #fff;
}

.groups-container.headings {
	font-size: .7em;
}

.between {
	list-style-type: none;
	margin: 1px 0px 1px 0px;
	padding-left: 5px;
	padding-right: 2px;
	padding-top: 2px;
	padding-bottom: 5px;
	border: 2px solid #eef;
	background: #fff;
}

.group {
	list-style-type: none;
	margin: 1px 0px 1px 0px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	min-height: 15px;
	border: 1px solid #888;
	background: #fff;
}

.item {
	display: inline-block;
	margin-left: 0.25em;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	margin-right: 0.25em;
	padding-left: .1em;
	padding-right: .1em;
	font-size: 1.5em;
	border-radius: .25em;
	border: 1px solid #bbdefb;
	background: #bbdefb;
/*
	border: 1px solid #dd4;
	background: #ffd;
	*/
	cursor: pointer;
}
.progress {
	margin-bottom: 0.1em;
	margin-top: 0.1;
	margin-left: 0.1;
	margin-right: 0.1;
}
#selected-container {
	margin-bottom: 0.1em;
	margin-top: 0.1;
	margin-left: 0.1;
	margin-right: 0.1;

}
.item-selected {
	display: inline-block;
	margin-left: 0.25em;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	margin-right: 0.25em;
	padding-left: .1em;
	padding-right: .1em;
	font-size: 1.5em;
	border-radius: .25em;
/*	border: 3px solid #FF4500;
*/
border: 3px solid #0d47a1;

	background: #bbdefb;
}

.myitem {
	border: 2px solid #aad;
}

.rank-hidden {
	display: none;
}

.alert {
	color: red;
}


/***** Situation *****/

#situations {
	list-style-type: square;
	margin: 1px 0px 1px 0px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	min-height: 15px;
	border: 1px solid #888;
	background: #fff;
}

.situation {
	margin: 1px 1px 1px 1px;
	padding-left: .15em;
	padding-right: .15em;
	font-size: 1.2em;
	width: 100%;
	display: list-item;
	border: 1px solid #888;
	background: #fff;
}


/*** Plot ***/
#scatter-load {
	position: relative;
/*	height: 90%;
*/
	height: auto;
	width: 95%;
	padding-left: 2%;
	padding-right: 2%;
	padding-top: 0;
	padding-bottom: 0.5em;
}
#graph-svg {
/*	position: absolute; */
	height: 90%;
	width: 95%;
	left: 0;
	top: 0;
	padding: 2%;
	z-index: 0;
}
.name {
	float: right;
	color: #27aae1;
}
.axis {
	fill: none;
	stroke: #666;
	stroke-width: 1px;
	font-family: sans-serif;
	font-size: 0.8em;
	font-weight:lighter;
	color: #f00;
}
.axis-label {
	font-family: Tahoma,sans-serif;
	font-size: 1.2em;
	font-weight:normal;
}
.text {
	stroke: none;
	fill: #f66;
	font-size: 0.8em;
	font-family: sans-serif;
}
#popup {
	border: 2px solid #888;
	border-radius: 0.5em;
	background-color: rgba(255,255,255,0.5);
	color: #333;
	position:absolute;
	width: 50%;
	height: 30%;
	right: 5%;
	top: 5%;
	z-index: 100;
	text-align: center;
}
#popup-header {
	height: 15%;
	padding: 0.5%;
	background-color:  rgba(190,190,190,0.5);
}
#popup-data {
	font-size: 0.8vhmin;
	margin-left: 1%;
}
#popup-text-wrapper {
	height: 80%;
	width: 95%;
	color: #333;
	overflow-y:scroll;
	padding:2%;
	text-align: left;
}
.popup-text {
	border:1px solid #888;
	margin:3px;
	padding:0.5em;
	background-color:rgba(255,255,255,0.5)
}

.label {
	fill: #444;
	font-size: 1.2em;
}

.node {
	cursor: pointer;
	border: 1px solid blue;
}

.dot {
	opacity: 1;
	cursor: pointer;
}

#graph-filters {
	margin-top: 0;
	border: 1px #ccc solid;
	background-color: white;
	z-index: -10;
	height: auto;
	max-height: 25%;
	overflow-y: scroll;
}
.filters-header {
	background: #ddd;
	text-align: center;
	font-size: 1.2em;
	font-family: Tahoma,sans-serif;
}
.filter-box {
	position: relative;
	height: 30%;
	width: 98%;
	border-left: 1px #ccc solid;
/*	overflow-y: auto;
	*/
}

/** </Plot> ***/


/*** Bootstrap Menu Override ***/

.navbar-default {
	background-color: #0000aa;
	border-color: #8888aa;
}

.navbar-default .navbar-brand {
	color: #eeeeee;
}

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

.navbar-default .navbar-text {
	color: #eeeeee;
}

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

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

.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
	color: #ffffff;
	background-color: #8888aa;
}

.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
	color: #ffffff;
	background-color: #8888aa;
}

.navbar-default .navbar-toggle {
	border-color: #8888aa;
}

.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
	background-color: #8888aa;
}

.navbar-default .navbar-toggle .icon-bar {
	background-color: #eeeeee;
}

.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
	border-color: #eeeeee;
}

.navbar-default .navbar-link {
	color: #eeeeee;
}

.navbar-default .navbar-link:hover {
	color: #ffffff;
}
/*
@media (max-width: 767px) {
	.navbar-default .navbar-nav .open .dropdown-menu > li > a {
		color: #eeeeee;
	}
	.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
	.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
		color: #ffffff;
	}
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
	.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
		color: #ffffff;
		background-color: #8888aa;
	}
}
*/

/*** </Bootstrap Menu Overide ***/