/********************************************************
*********************************************************
**                                                     **
**  Compendium CSS File - use however you like!        **
**                                                     **
**  EB-WI-0100                                         **
**  "Customize the Visual Style of a Process Library"  **
**                                                     **
*********************************************************
********************************************************/

/* Updated for Rev D */

/* Step 1.2: Custom "Fine Print" on Each Title Page */
#title-page-fine-print::before {
	content: "BUSINESS CONFIDENTIAL AND [TECH COMPANY] PROPRIETARY: Not for public release; distribution is limited to intended parties who receive this document directly from [Tech Company] or its agents. Material and information relates to, or is associated with, [Tech Company] or affiliates' products, business, or activities, including but not limited to financial information, data or statements, trade secrets, product research and development, existing and future product designs and performance specifications.";
}

/* Step 1.3: Logo */
/* Put the referenced image file in the "assets" folder... */
div.header p.header-p img {
	content:url("TechCompanyLogo.png");
}

/* Step 1.4: Adjust Header Widths */
div.header td#header-left {	width: 35%; }
div.header td#header-right { width: 65%; }

/* Step 1.5 Custom Font and Font Sizes */
@font-face {
	font-family: techCompany;
	src: url(../assets/SpaceGrotesk-VariableFont_wght.ttf);
}
html, body { font-family: techCompany; font-size: 0.85em;}

/* Step 1.6 Customize Colors */
#revision-page thead,
#requirements-page thead,
div.action-sequence thead,
#roles thead,
#non-conformances table thead,
.csv-table-container thead,
#calibration thead {
	background-color: #004080;
	color: #FAFAFA;
}

.section-title {
	background-color: #00C2C3;
	color: #0081A7;
}

/* Section 2 */

/* Step 2.1 All CSS lines in this section should be copied/pasted into separate files
Consider making separate CSS files, e.g.
- ITAR.css			could be applied to Unclassified processes that include export-controlled tech data
- Secret.css		could be applied to processes that include information with maximum classification of Collateral Secret
- Proprietary.css	could be applied to processes that include company proprietary information
- CUI.css			could globally mark documents CUI
- CUI-PROPIN.css	could globally mark documents CUI // SP-PROPIN
*/

/* Step 2.2 Header and Footer */ 
.classification p {	color: #0081A7; font-weight: bolder;}
.classification p::before { content: "UNCLASSIFIED // PROPIN"; }

/* Authority block for classified */
/* Step 2.4 Classification Authority Block */
/* Uncomment for other classifications besides UNCLASSIFIED
#title-page-fine-print { border: 1px solid black; padding: 5px; font-size: 1.3em; width: fit-content; }
#title-page-fine-print::before {
	content: "Classified By: OCA Name and Position Title \a Reason: 1.4(c) \a Downgrade to: CONFIDENTIAL on 20251231 \a Declassify On: 20280916";
	white-space: pre;
}
*/
/* see https://www.archives.gov/files/isoo/training/classification-authority-block.pdf */

/* CUI Designation block (for CUI) */
/*
#title-page-fine-print { border: 1px solid black; padding: 5px; font-size: 1.3em; width: fit-content; }
#title-page-fine-print::before {
	content: "Controlled by: \a CUI category: \a Distribution statement: \a POC: ";
	white-space: pre;
}
*/
/* see https://www.dodcui.mil/Training/CUI-Designation-Indicator-Block/ */