/* $Id$ */

/*
 * Style sheet for Advisor profile reports.
 */
@import "https://fonts.googleapis.com/css?family=Roboto";
@import "https://fonts.googleapis.com/css?family=Roboto:500";
@import "https://fonts.googleapis.com/css?family=Roboto:700";
@import "AdvisorBrand.css";

body
{
	margin: 0;	/* For simplifying fixed frame calculations */
	font-weight: normal;
	color: black;
	background-color: white;
	font-family: Roboto,Arial,Helvetica,sans-serif;
	cursor: default;
	font-size: 83.33%  /* 13.33px (10pt) */;
	/*
	 * Main colors used throughout -- for reference only.
	 * (Most browsers since 3/2016 support var(), but not IE)
	 */
	--color-banner-blue:	#255892; /* belarc.com blue banner */
	--color-accent-stripe:	#b0242b; /* belarc.com red stripe */
	--bkgd-pale-blue:		#a3c9f5; /* hsl(212, 80%, 80%), belarc.com greenish-blue */
	--bkgd-pale-orange:		#ffcd7f; /* .color-complement-1 */
	--bkgd-pale-yellow:		#fff17f; /* hsla(53, 100%, 75%, 1) */
	--bkgd-pale-gray:		#cccccc;
	--color-link:			#337cbb; /* belarc.com link color */
	--color-link-hover:		#23547f; /* belarc.com link color */
}

/*
 * Use undecorated links, same color as belarc.com.
 */
a:link, a:visited {
	color: #337cbb;
	font-weight: bold;
	text-decoration: none;
}
a:hover, a:active {
	color: #23547f;
	text-decoration: underline;
}

a img {
	border: 0;
}

/* Default element styles */
div {
	padding: 0;
	margin: 0;
}
table {
	width: 100%;
	border: 0;
	border-collapse: collapse;
}
tr {
	vertical-align: top;	/* Top is generally best for data */
}
td, th {
	text-align: left;
	padding-left: 0.5em;
	padding-right: 0.5em;
	padding-top: 0;
	padding-bottom: 0;
}

/*
 * Main page elements
*/
#pageHeader
{
	position: fixed;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100px;	/* = H1 (header height) */
	background-color: #255892;
	overflow: hidden;
}
#leftNavBar
{
	position: fixed;
	top: 100px;			/* (H1) */
	bottom: 0px;
	left: 0px;
	width: 175px;			/* = W2 (leftNavBar width) */
	background-color: white;
	overflow-y: auto;
	overflow-x: hidden;
}
#pageFooter {
	position: fixed;
	bottom: 0px;
	left: 175px;	/* (W2) */
	right: 0px;
	height: 25px;	/* = H3 (footer height) */
	font-size: 11px;  /* (must be <= H3/2) */
	text-align: center;
	background-color: white;
	padding: 5px 0px;	/* = H3p (footer vertical padding) */
}
#pageBody
{
	position: fixed;
	top: 100px;			/* (H1) */
	left: 175px;		/* (W2) */
	bottom: 35px;		/* (H3 + 2*H3P) */
	right: 0px;
	overflow-y: auto;
	overflow-x: hidden;
	scroll-behavior: smooth;
	padding: 0 25px;
}

/*
 * Components of main page elements.
 */
/*________ page header ________*/
div.productName
{
	float: left;
	height: 100%;
	overflow: hidden;
	font-size: 28px;  /* (~H1/4) */
    letter-spacing: 1px;
    color: white;
    background-color: inherit;
    margin-left: 0.5em;
	margin-right: 60px;
	margin-top: 55px;
}
div.productName a { color:inherit; text-decoration: none; font-weight: normal; }

div.belarcLogo
{
	float: right;
	overflow: hidden;
    margin-right: 10px;
	margin-left: 55px;
	margin-top: 25px;
	vertical-align: center;
}
div.belarcLogo img { width: 114px; height: 54px; } /* actual width="114" height="54" */

div.belarcRedStripe
{
	position: absolute;
	bottom: 0;
	width: 100%;
	height: 6px;	/* = H5 (stripe height) */
	background-color: #b0242b;
}

div.licenseNotice
{
	background-color: #a3c9f5;
	padding: 2px 8px;	/* = H4p W4p */
	margin: 15px 40px;	/* = H4m W4m */
	text-align: left;
	font-size: 90% /* 12px */;
	max-height: 60px;	/* (H1 - H5 - 2*(H4p + H4m)) */
	overflow-y: auto;
}

/*________ left nav bar ________*/
div.navGroup		/* A group of navItems */
{
	margin: 8px 0px 8px 8px;
}
a.navItem		/* A navbar link */
{
	display: block;
	padding: 0.1em 0.25em;
	margin-top: 1px;
    color: black;
	background-color: #a3c9f5; /* light blue */
}
a.navHdr		/* A navbar group header */
{
	display: block;
	padding: 0.25em 0.25em;
	margin-top: 1px;
    color: white;
	background-color: #255892; /* dark blue */
}
a.navLev1 { padding-left: 1em; }
a.navItem { font-weight: normal; }
a.navItem:hover { color: white; text-decoration: none; }
a.navHdr:hover { text-decoration: none; }

div.blurb		/* For promotional  links */
{
	clear: both;
	width: 90%;
	text-align: center;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 150% /* 16px */;
	font-weight: bold;
	padding: 1em 5%;
}

/*________ page body ________*/
/*
 * Styles for the System Security Status section.
 */
div.sss { margin: 15px 18%; padding-right: 5%; background-color: white; font-size:90%; }
div.sss table { width: 100%; border: 0; border-spacing: 10px 0px; border-collapse: separate; }
div.sss th.sssTitle { text-align:left; vertical-align: middle; font-size:120%; font-weight: 500; padding: 0; }
div.sss th.sssItemHeader { text-align: center; vertical-align: middle; background-color: #a3c9f5; padding: 2px 6px; font-weight: 500; font-variant: small-caps; }
div.sss td.sssItemStatus { text-align: center; vertical-align: top; background-color: whitesmoke; padding: 2px 6px; }
div.sss td.sssFootnotes { text-align: left; background-color: inherit; font-style: italic; }

img.sssItemImg { width: 24px; height: 24px; padding-top: 4px; }
div.sssItemNote { color: black; padding: 0.25em; font-size: 88%; font-weight: normal; font-style: italic; }

td.sssItemStatus a { display: block; }
td.sssItemStatus a:hover { text-decoration: none; }
td.sssItemHasLink:hover { box-shadow: 0px 0px 6px 0px black; }

/*
 * Styles for the main profile report.
 */
div.report
{
	font-family: Verdana,Arial,Helvetica,sans-serif;
	font-size: 80% /* 10.67px (8pt) */;
}
div.reportWatermark
{
	clear: both;
	position: relative;
	left: 0;
	white-space: nowrap;
	display: block;
	height: 0;
	transform-origin: 0 120px;
	transform: rotate(50deg);
	font-size: 937%	/* 100px */;
	opacity: 0.25;
	letter-spacing: 8px;
	color: gray;
	z-index:99;
	font-weight: bold;
	pointer-events: none;
}

/* Report title */
h1.reportTitle
{
	display: block;
	text-align: center;
	vertical-align: middle;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	font-size: 150% /* 16px */;
	background-color: #a3c9f5;
}

/* Report header */
table.reportHeader {
	margin-top: 1em;
}
table.reportHeader th { text-align: right; font-style: italic; font-weight: normal; }
table.reportHeader td { text-align: left; padding-left: 0; }

/* Report footer */
div.reportFooter {
	width:95%;
	text-align: left;
	margin-top: 1em;
	padding-left: 1em;
	padding-right: 5%;
}


/* Report sections */
div.reportSection {	/* Base styles of all report sections */
	float: none;
	clear: both;
	width: 100%;
	text-align: center;
}
div.rsLeft {			/* modifies div.reportSection */
	float: left;
	clear: both;
	width: 49%;
	margin-right: 1%;
	overflow: hidden;
}
div.rsRight {		/* modifies div.reportSection */
	float: left;
	clear: none;
	width: 49%;
	margin-left: 1%;
	overflow: hidden;
}
h2.reportSectionHeader {
	display: block;
	margin-top: 8px;
	margin-bottom: 2px;
	height: 1.5em;
	line-height: 1.5em;
	text-align: center;
	padding-top: 2px;
	font-size: inherit;
	font-weight: bold;
 	background: #cccccc;
}
h2.rshSup {		/* modifier for use when header contains superscripts */
	line-height: 1.0em;
}
span.rshNote {
	font-weight: normal;
	font-size: 95%;
}
div.reportSectionBody {
	text-align: left;
	padding-left: 0.5em;
	padding-right: 0.5em;
}
div.rsFooter {
	float: none;
	clear: both;
	text-align: center;
	margin-top: 0.5em;
	padding-left: 5%;
	padding-right: 5%;
}
div.footnoteList {	/* Nest inside div.rsFooter for multi-line footnotes. */
	display: inline-block;
	text-align: left;
}

/*
 * Special mouse-over behavior
 */
.hasInfo:hover {		/* item has 'title' info to show */
	background-color: #fff17f;	/* orange */
	cursor: help;
}

/*
 * Styles for Software Versions section.
 */
span.swLinkI {		/* for the blueish "i" */
	color: #005399;
	font-weight: bold;
	font-family: Verdana,Arial,Helvetica,sans-serif;
}
span.swLinkBar {		/* for the reddish vertical bars */
	color: #bf311a;
	font-weight: bold;
	font-family: Arial,Helvetica,sans-serif;
	text-decoration: none;
}
span.swBits {		/* for the greenish "(64-bit)" suffix */
	color: green;
	font-weight: bold;
	font-size: 80%	/* 9px */;
	white-space: nowrap;
}

/*
 * Styles for Network Map section.
 */
#LanSectTable > tbody > tr:nth-child(odd) { background: white; }
#LanSectTable > tbody > tr:nth-child(even) { background: whitesmoke; }

/*
 * Styles for the Benchmark reports.
 */
table.bkReportHeader {
	width: 85%;
	float: left;
}
table.bkReportHeader  th { text-align: left; padding: 2px; font-weight: bold; font-size: 110%; }
table.bkReportHeader  td { text-align: left; padding: 2px; }

div.bkReportToggle {
	text-align: right;
	clear: left;
}

#bkReport {
	width: 69%;
}
#bkHelp {
	float: right;
	width: 30%;
	margin-right: -17px;
	margin-top: 8px;
	font-size: 80% /* 10.67px */;
	background-color: #fff17f;
}
#bkReport .blurb {
	clear: none;	/* to prevent clearing floating #bkHelp */
}

h2.bkReportSectionGroup {
	display: block;
	margin: 0;
	text-align: center;
	font-size: inherit;
} 

table.bkReportSection {
	width: 100%;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
table.bkReportSection > thead  tr { background-color: #f4f4f4; vertical-align: middle; }
table.bkReportSection > thead  th { text-align: left; padding: 2px; font-weight: bold; }
table.bkReportSection > thead  td { text-align: right; white-space: nowrap; }
table.bkReportSection > tbody  th { text-align: right; padding-left: 0; font-weight: normal; }
table.bkReportSection > tbody  td { text-align: left; }
table.bkReportSection .noshade { background-color: white; }

div.bkWarningBox {
	width: 50%;
	margin-left: 0;
	font-weight: bold;
	border: 1px solid red;
	color: red;
	text-align: center;
	padding: 5px;
}

button.bkCtl {		/* button containing only a small image (+/-) */
	margin: 0;
 	padding: 0;
	border: none;
	cursor: pointer;
	background-color: inherit;
	font-size: 0; /* so will shrink to fit image */
}


/*
 * Attribute classes
*/
.caution {
	font-weight: bold !important;
}
.warning {
	font-weight: bold !important;
	color: #a80000 !important;
}
.alert {
	color: #a80000 !important;
}
span.new {
	font-weight: bold;
	color: #a61c21; /* darker red */
}

/*
 * Content for screen readers that should be invisible.
 */
.accessible {
	position: absolute;
	left: -10000px;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

/*
 * Use CSS animation to call attention to targeted section headers and paragraphs.
 */
#bkScoring:target,
div.reportSection:target > h2.reportSectionHeader,
div.blurb:target + div.reportSection > h2.reportSectionHeader
{
  animation: blink 6 0.35s;
}
@keyframes blink {
  50% {background-color: #ffcd7f;}
}


/*
 * Adjustments for printing
*/
@media print
{
	body 
	{
		margin: 0;			/* don't waste any page space when printing. */
		font-size: 10pt;
	}

	a:link, a:visited 
	{
		color: black;
		text-decoration: none;
		font-weight: normal;
	}

	#pageHeader
	{
		position: static;
		height: auto;
		background-color: inherit;
	}

	#pageBody
	{
		position: static;
		height: auto;
		width: auto;
		margin: 0;
		overflow: hidden;
	}

	#pageFooter
	{
		position: static;
		height: auto;
	}

	#leftNavBar, #bkHelp
	{
		display: none;		/* not relevant when printing */
	}
	
	#bkReport
	{
		width: auto;
	}

	div.productName
	{
		overflow: visible;
		color: black;
	}

	div.belarcLogo img {
		padding-bottom: 10px;
		filter: invert(100%);
	}

	div.belarcRedStripe
	{
		display: none;
	}

	div.licenseNotice		/* No navbar so use full width of page */
	{
		clear: both;
		max-height: none;
		margin: 15px;
	}

	div.report
	{
		font-family: "Bookman Old Style",Georgia,"Times New Roman",Times,serif;

	}

	div.reportWatermark
	{
		font-size: 40pt;
	}

	div.reportSection
	{
 		line-height: 1em;
		word-spacing: 0.1em;
	}

	/*
	 * Add borders to these elements since background graphics may be dropped
	 */
	div.licenseNotice, div.reportSectionHeader, th.sssItemHeader, td.sssItemStatus, h1.reportTitle
	{
		border: 1px solid lightgray;
	}
	#LanSectTable > tbody > tr
	{
		border-bottom: 1px dashed lightgray;
	}

	span.rshNote {
		display: none;		/* not relevant when printing */
	}
}