/*
================================================
Created by Mark Fredriksen
Last updated on 11-06-2025
Notes: This stylesheet applies to NHGRI's Animal Proteome DataBase (AniProtDB) project and include styles that pertain only to the AniProtDB Web resource.  This stylesheet should be used alongside NHGRI's front-end__responsive.css.

================================================
Contents:
	01 Project-Specific Variables
	02 Proteome Pipeline SVG

================================================
*/


/* 01 Project-Specific Variables
--------------------------------------------- */


/* 02 Proteome Pipeline SVG
--------------------------------------------- */
.container-svg {
	position: relative;
  display: flex; /*inline-flex to justify left*/
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
	text-align: center;
	margin: 1rem;
}

svg#pipeline-overview {
	margin-top: 1.25rem;
	width: 20rem;
	max-width: 20rem;
}

svg#pipeline-overview text {
	font-size: 0.875em;
	font-family: Helvetica, "Helvetica Neue", Gotham, Arial, "sans-serif";
	font-weight: 400;
	letter-spacing: normal;
	line-height: normal;
	fill: #000;
}

svg#pipeline-overview text .small {
	font-size: 0.75em;
}

svg#pipeline-overview text .em {
	font-style: italic;
}

svg#pipeline-overview rect,
svg#pipeline-overview polygon {
	display: block;
	stroke: #2f528f;
	stroke-width: 3;
	stroke-miterlimit: 8;
}

svg#pipeline-overview rect.box-blue,
svg#pipeline-overview polygon.box-blue {
	fill: #b4c7e7;
}

svg#pipeline-overview rect.box-orange,
svg#pipeline-overview polygon.box-orange {
	fill: #f8cbad;
}

svg#pipeline-overview rect.box-gray,
svg#pipeline-overview polygon.box-gray {
	fill: #f2f2f2;
}

svg#pipeline-overview a:hover rect,
svg#pipeline-overview a:hover polygon {
	transition: .3s fill;
	fill: #336699;
	cursor: pointer;
}

svg#pipeline-overview a:hover text {
	transition: .3s fill;
	fill: #fff;
}

svg#pipeline-overview .arrow-block {
	fill: #2f528f;
	stroke: none;
}

#pipeline-overview a.trigger {
  cursor: pointer;
}