.graph-div {
	margin: 0px 0px 21px 0px;
	padding: 4px;
	height: {{graphion_group_height}};
	overflow: auto;
	box-sizing: border-box;
	border: solid 1px #dddddd;
}
.graph-timeline {
	stroke: darkgrey;
	stroke-width: 1;
}
.graph-intertimeline {
	stroke: lightgrey;
	stroke-width: 1;
}
.graph-subtimeline {
	stroke: blue;
	stroke-width: 1;
}
.graph-timeline-label {
	fill: rgb(176, 176, 176);
	font-family: Arial;
	font-size: 12px;
}
.graph-histogram-ssl {
	fill: #FFC30F; fill-opacity: 1;
	stroke: #FFC30F; stroke-width: 1;
}
.graph-histogram-data {
	fill: #FF5733; fill-opacity: 1;
	stroke: #FF5733; stroke-width: 1;
}
.graph-histogram-sig {
	fill: #C70039; fill-opacity: 1;
	stroke: #C70039; stroke-width: 1;
}
.graph-histogram-udp {
	fill: #900C3F; fill-opacity: 1;
	stroke: #900C3F; stroke-width: 1;
}
.graph-histogram-count {
	fill: #581845; fill-opacity: 1;
	stroke: #581845; stroke-width: 1;
}
.graph-histogram-tag {
	stroke: black; stroke-width: 1;
}
.graph-histogram-overflow {
	fill: darkgrey; fill-opacity: 1;
	stroke: darkgrey; stroke-width: 1;
}
.graph-segment-0 {
	fill: #306627; fill-opacity: 1;
}
.graph-segment-1 {
	fill: #506B20; fill-opacity: 1;
}
.graph-segment-2 {
	fill: #546E26; fill-opacity: 1;
}
.graph-segment-3 {
	fill: #63822C; fill-opacity: 1;
}
.graph-segment-4 {
	fill: #719532; fill-opacity: 1;
}
.graph-segment-5 {
	fill: #80A938; fill-opacity: 1;
}
.graph-segment-6 {
    fill: #8FBD3E; fill-opacity: 1;
}
.graph-segment-7 {
	fill: #9AC64F; fill-opacity: 1;
}
.graph-segment-8 {
	fill: #A6CD61; fill-opacity: 1;
}
.graph-segment-9 {
	fill: #caed8a; fill-opacity: 1;
}

.graph-segment-log-highlight {
	stroke:black; stroke-width:1; opacity:1
}

.graph-segment-appletv {
	fill: rgb(143, 143, 143);
}
.graph-segment-disneyplus {
	fill: rgb(13, 20, 120);
}
.graph-segment-youtube {
	fill: rgb(197, 27, 31);
}
.graph-segment-primevideo {
	fill: rgb(1, 167, 227);
}
.graph-segment-netflix {
	fill: rgb(140, 5, 13);
}
.graph-segment-twitch {
	fill: rgb(145, 70, 255);
}
.graph-segment-salto {
	fill: rgb(3, 3, 55);
}
.graph-segment-pluto {
	fill: rgb(255, 44, 210);
}
.graph-segment-molotov {
	fill: rgb(247, 187, 7);
}
.graph-segment-rakuten {
	fill: rgb(186, 0, 0);
}
.graph-segment-canalplus {
	fill: rgb(0, 0, 0);
}
.graph-segment-itv {
	fill: rgb(24, 173, 183);
}
.graph-segment-bbc {
	fill: rgb(0, 0, 0);
}
.graph-segment-other {
	fill: rgb(220, 220, 220);
}
.graph-segment-unknown {
	fill: rgb(231, 221, 221);
}
.graph-segment-ignored {
	fill-opacity: 0.2;
}
.graph-segment-hash-web {
    fill: url(#diagonalHatchWeb);
}
.graph-segment-hash-unknown {
    fill: url(#diagonalHatchUnknown);
}
.graph-label {
	fill: black;
	font-family: Courier;
	font-size: 11px;
}