:root {
	--ri-fs-default: 1.00rem; /* 14.0px */
	--ri-fs-size-up-1: 1.14rem; /* 15.96px */
	--ri-fs-size-up-2: 1.29rem; /* 18.06px */
	--ri-fs-size-up-3: 1.57rem; /* 21.98px */
	--ri-fs-size-up-4: 1.87rem; /* 26.04px */
	--ri-fs-size-up-5: 2.15rem; /* 30.1px */
	--ri-fs-size-dwn-1: 0.87rem; /* 12.18px */
	--ri-fs-size-dwn-2: 0.79rem; /* 11.06px */

	--ri-lineh-normal: normal;
	--ri-lineh-compact: 1.1;
	--ri-lineh-lvl-1: 1.3;
	--ri-lineh-lvl-2: 1.4;
	--ri-lineh-lvl-3: 1.5;
	--ri-lineh-lvl-4: 1.6;

	--stepper-primary: LightGrey;
	--stepper-secondary: LightSlateGrey;
}

html,
body {
	padding: 0px !important;
	font-size: 14px;
}

/** Font Size Modifiers */
.fs-up-5{
	font-size: var(--ri-fs-size-up-5); 
	line-height: var(--ri-lineh-normal);
}
.fs-up-4{
	font-size: var(--ri-fs-size-up-4); 
	line-height: var(--ri-lineh-normal); 
}
.fs-up-3{
	font-size: var(--ri-fs-size-up-3); 
	line-height: var(--ri-lineh-normal); 
}
.fs-up-2{
	font-size: var(--ri-fs-size-up-2); 
	line-height: var(--ri-lineh-normal); 
}
.fs-up-1{
	font-size: var(--ri-fs-size-up-1); 
	line-height: var(--ri-lineh-lvl-1); 
}
.fs-default{
	font-size: var(--ri-fs-default); 
	line-height: var(--ri-lineh-lvl-2); 
}
.fs-dwn-1{
	font-size: var(--ri-fs-size-dwn-1);
	line-height: var(--ri-lineh-lvl-3); 
}
.fs-dwn-2{
	font-size: var(--ri-fs-size-dwn-2); 
	line-height: var(--ri-lineh-lvl-4);
}

/** Line Height Modifiers */
.line-height-default {
	line-height: var(--ri-lineh-normal); 
}
.line-height-compact {
	line-height: var(--ri-lineh-compact);
}
.line-height-roomy {
	line-height: var(--ri-lineh-lvl-4); 
}

.navbar li > a > img {
	margin-top: -3px;
	margin-right: 5px;
}

.navbar-inner, .navbar-inverse .navbar-inner {
	filter: progid:DXImageTransform.Microsoft.gradient(enabled=false) !important;
}

#history-body .purchaseCertificate {
	display: none;
}

/* Hide weird spinner buttons in Chrome */
input[type=date]::-webkit-outer-spin-button,
input[type=date]::-webkit-inner-spin-button {
	-webkit-appearance: none;
}
/* Fixes Chrome date picker display when spinners are hidden*/
input[type=date]::-webkit-calendar-picker-indicator {
  display: inline-block;
}

/* Activity Titlebar (Title and Mode) formatting */
#activity-titlebar {
	color: #c0c0c0;
	margin-bottom: 19px;
}
#activity-titlebar .activity-title{
	font-size: 24px;
	line-height: 26px;
}
#activity-titlebar .mode-title{
	font-size: 16px;
	line-height: 28px;
	font-style: italic;
}

#side-content {
	position: sticky;
	top: 0;
}

#side-content .printer-friendly {
	font-size: 110%;
	font-weight: bold;
	margin-bottom: 30px;
	text-align: center;
	text-transform: capitalize;
}

#side-content .block {
	background: #fafafa;
	border-radius: 4px;
	margin-bottom: 10px;
	padding: 10px;
}
#side-content .block .block-header {
	color: #777073;
	box-sizing: border-box;
	font-weight: bold;
	padding: 5px;
	text-align: center;
}
#side-content .block .block-section {
	box-sizing: border-box;
	border-top: solid 1px #fff;
	padding: 5px;
}

#side-content .recommendations .rec-ends,
#side-content .recommendations .rec-credit {
	color: #777073;
	font-size: .85em;
}
#side-content .recommendations .rec-credit {
	text-align: right;
}

.toc > .reference{
	margin-left: 4px;
	margin-top: 12px;
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2; /* number of lines to show */
	-webkit-box-orient: vertical;
}
.toc.visible-phone > .reference {
	font-size: 85%;
	margin-top: 4px;
}
.toc > .toc-H3,
.toc > .toc-H4,
.toc > .toc-FIGURE{
	margin-left: 12px;
}
.toc > .toc-FIGURE{
	margin-left: 12px;
	-webkit-line-clamp: 1; /* number of lines to show */
}


/*
 * Article Formatting
 * .wf-content #main-content, #main-content article
 */
#main-content article > h2:nth-of-type(n+2),
#main-content article > section:nth-of-type(n+2) > h2 {
	margin-top: 3em;
}
#main-content article h3 {
	margin-top: 2em;
}
#main-content article h2 {
	border-bottom: solid 1px #bbb;
	padding-bottom: 0.5em;
}
#main-content article figure {
	background-color: #f9f9f9;
	border: solid 1px #bbb;
	border-radius: 8px;
	padding: 20px;
	margin: 2em 0;
}
#main-content article figure img{
	max-width: 100%;
	width: auto;
}
#main-content article figure figcaption {
	opacity: 80%;
	margin-top: 1em;
}
#main-content article ul {
	margin-bottom: 2em;
	margin-top: 2em;
}
#main-content article li {
	margin-top: .6em;
}



#main-content #continueForm {
	margin-top: 10px;
}

.wf-overview-page #activity-titlebar > div.activity-title {
	color: #5A5A5A;
}

/* Responsive Images */
.img-responsive {
	display: block;
	/* Set a maximum relative to the parent */
	max-width: 100%;
	/* Scale the height according to the width, otherwise you get stretching */
	height: auto;
}

.notify-block {
	background-color: #f9f9f9;
	border-radius: 8px;
	box-sizing: border-box;
	margin-top: 30px;
	padding: 0;
	width: 100%;
}
.notify-block > div {
	box-sizing: border-box;
	display: table-cell;
	padding: 20px;
	vertical-align: top;
}
.notify-block > div:first-child {
	border-bottom-left-radius: 8px;
	border-top-left-radius: 8px;
	vertical-align: middle;
}
.notify-block .icon {
	display: inline-block; 
	padding: 10px; 
	font-size: 64px; 
	color: #f9f9f9; 
	background-color: #e2e2e2; 
	border-radius: 8px; 
	min-width: 60px; 
	text-align: center;
}
.notify-block.notify-block-dark  > div:first-child {
	background-color: #e2e2e2; 
}

.progress-stepper ul {
	list-style: none;
	margin: 10px;
	padding: 0;
	/*font: normal 16px/22px Arial;*/
	color: #999;
}
.progress-stepper li {
	overflow: hidden;
	position: relative;
	padding: 0 0 26px 35px;  /* adjust vertical and horizontal line heights */
}
.progress-stepper li::before {
	content: '';
	position: absolute;
	left: 9px;
	top: 9px;
	width: 20px;
	height: 999px;
	border: 2px solid var(--stepper-primary);
	border-width: 2px 0 0 2px;
}
.progress-stepper li:last-child::before {
	border-width: 2px 0 0;
}
.progress-stepper li::after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 16px;
	height: 16px;
	background: #fff;
	border: 2px solid var(--stepper-primary);
	border-radius: 50%;
}
.progress-stepper li.active,
.progress-stepper li.visited {
	color: #000;
}
.progress-stepper li.active {
	font-weight: bold;
}
.progress-stepper li.active::before {
	border-top-color: var(--stepper-secondary);
}
.progress-stepper li.active::after,
.progress-stepper li.visited::after {
	border-color: var(--stepper-secondary);
	background: var(--stepper-secondary);
}
.progress-stepper li.active::after {
	border-color: var(--stepper-secondary);
	border: 7px solid var(--stepper-secondary);
	background: white;
	width: 7px;
	height: 7px;
}
.progress-stepper li.visited::before,
.progress-stepper li.visited::after {
	border-color: var(--stepper-secondary);
}

@media screen and (max-width: 979px) {
	.navbar-fixed-top, .navbar-fixed-bottom, .navbar-static-top {
		margin-left: 0px;
		margin-right: 0px;
	}
	
	.navbar, .menu-bar {
		margin-bottom: 0px !important;
	}
	
	.navbar .brand, .navbar .welcome {
		display: none;
	}
			
	#activity-titlebar .activity-title { 
		font-size: 12px;
		line-height: 16px;
	}
	
	#activity-titlebar .mode-title {
		font-size: 10px;
		line-height: 20px;
	}

	.notify-block .icon {
		padding: 6px; 
		font-size: 48px; 
		min-width: 48px; 
	}
}
@media screen and (max-width: 640px) {
	.notify-block .icon {
		padding: 6px; 
		font-size: 36px; 
		min-width: 36px; 
	}
}
