* {
	box-sizing: border-box; // so the scrolls aren't shown in an empty screen
}

.gx-db-widget>img {
	max-width: 100%;
	max-height: 100%;
}

body {
	margin: 0;
}

.gx-db-not-selected-element {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: transparent;
	background: none;
}

.gx-db-not-mouseover-element {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: transparent;
}

.gx-db-dependsOn-element {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: darkseagreen;
	background: none;
	box-shadow: 0px 0px 5px darkseagreen;
}

.gx-db-impacts-element {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: lightcoral;
	background: none;
	box-shadow: 0px 0px 5px lightcoral;
}

.gx-db-selected-element {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: cornflowerblue;
	background: rgba(100, 149, 237, 0.1);
	box-shadow: 0px 0px 5px cornflowerblue;
}

.gx-db-mouseover-element {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: cornflowerblue;
}

.gx-db-not-selected-table {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: lightgray;
	background: none;
}

.gx-db-not-mouseover-table {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: lightgray;
}

.gx-db-selected-table {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: cornflowerblue;
	background: rgba(100, 149, 237, 0.1);
	box-shadow: 0px 0px 5px cornflowerblue;
}

.gx-db-mouseover-table {
	cursor: pointer;
	border-style: solid !important;
	border-width: 2px !important;
	border-color: cornflowerblue;
}

.gx-db-no-padding {
	padding: 0 !important;
}

.gx-db-no-margin {
	margin: 0 !important;
}

.gx-db-no-border {
	border-width: 0 !important;
	border-style: none !important;
	border-color: transparent !important;
}

.gx-db-dropTarget-outside {
}

.gx-db-dropTarget-inside {
	background-image: url(images/drop-background.png);
}

.gx-db-dropTarget-right {
	background-image: url(images/drop-background.png);
	background-repeat: repeat-y;
	background-position: right;
}

.gx-db-dropTarget-left {
	background-image: url(images/drop-background.png);
	background-repeat: repeat-y;
	background-position: left;
}

.gx-db-dropTarget-right-middle {
	border-style: dashed solid dashed dashed;
	background-image: url(images/drop-background.png);
	background-size: 5px;
	background-repeat: repeat-y;
	background-position: right;
}

.gx-db-dropTarget-left-middle {
	border-style: dashed dashed dashed solid;
	background-image: url(images/drop-background.png);
	background-size: 5px;
	background-repeat: repeat-y;
	background-position: left;
}

.gx-db-dropTarget-top {
	background-image: url(images/drop-background.png);
	background-repeat: repeat-x;
	background-position: top;
}

.gx-db-dropTarget-bottom {
	background-image: url(images/drop-background.png);
	background-repeat: repeat-x;
	background-position: bottom;
}

.gx-db-dropTarget-top-middle {
	background-image: url(images/drop-background.png);
	background-repeat: repeat-x;
	background-position: top;
	background-size: 5px;
}

.gx-db-dropTarget-bottom-middle {
	background-image: url(images/drop-background.png);
	background-repeat: repeat-x;
	background-position: bottom;
	background-size: 5px;
}

.gx-db-flex-table {
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
}

.gx-db-flex-row {
	display: flex;
	flex-direction: row;
	flex-shrink: 0;
	border-color: inherit;
}

.gx-db-flex-cell {
	flex-grow: 1;
	border-style: dashed !important;
	border-color: inherit;
	border-width: 0px;
	min-width: 30px;
	vertical-align: top;
	position: relative;
}

.gx-db-flex-row-100 {
	flex-grow: 1;
}

.gx-db-flex-cell-1 {
	flex-basis: 8.33%;
}

.gx-db-flex-cell-2 {
	flex-basis: 16.66%;
}

.gx-db-flex-cell-3 {
	flex-basis: 25%;
}

.gx-db-flex-cell-4 {
	flex-basis: 33.33%;
}

.gx-db-flex-cell-5 {
	flex-basis: 41.66%;
}

.gx-db-flex-cell-6 {
	flex-basis: 50%;
}

.gx-db-flex-cell-7 {
	flex-basis: 58.33%;
}

.gx-db-flex-cell-8 {
	flex-basis: 66.66%;
}

.gx-db-flex-cell-9 {
	flex-basis: 75%;
}

.gx-db-flex-cell-10 {
	flex-basis: 83.33%;
}

.gx-db-flex-cell-11 {
	flex-basis: 91.66%;
}

.gx-db-flex-cell-12 {
	flex-basis: 100%;
}

.gx-db-flex-cell-order-1 {
	order: 1;
}

.gx-db-flex-cell-order-2 {
	order: 2;
}

.gx-db-bottom-border {
	border-bottom-width: 1px !important;
}

.gx-db-right-border {
	border-right-width: 1px !important;
}

.gx-db-widget {
	height: 100%;
}

.gx-db-widget-placeholder {
	color: darkgray;
	font-size: medium;
	text-align: center;
	padding: 10px;
}

.gx-db-title {
	font-size: 20pt;
}

.gx-db-widget-frame {
	width: 100%;
}

.gx-db-widget-frame-collapse-image:after {
  font-family: "Glyphicons Halflings";
  content: "\e114";
  float: right;
  margin-left: 15px;
  cursor: pointer;
}

.gx-db-widget-frame-collapse-image.collapsed:after {
  content: "\e080";
}

.gx-db-collapse-container {
	display: grid;
	grid-template-rows: 25px 1fr;
	width: 100%;
	height: 100%;
}

.gx-db-collapse-container>div:first-child {
	grid-row: 1/2;
	margin-left: 5px;
}

.gx-db-collapse-container>div:nth-child(2) {
	grid-row: 2/3;
	margin: 5px;
	margin-top: 0px;
	display: grid;
}

.gx-db-collapsed {
	overflow: hidden;
	text-overflow: ellipsis;
}

.gx-db-collapsed img {
	vertical-align: sub;
}
