/*<meta />*/

/**
 * filename: acl_styles.css
 * author: paulo_amaral
 * date: 2017-11-09
 * purpose: ratinalized web css for acl academy content
 **/

/* ACL color palette
$purple: 	#53529F
$green:		#42996D
$black: 	#3F3D3C, rgba(63, 61, 60, 1)
$orange: 	#DE4D33
$yellow:	#EABA51
$blue:		#2666AB
$creme:		#E6E3DF
*/

/* Galvanize color palette
$purple:			#785cba
$dark-purple:	#2e143d
$white:				#ffffff
$gold:				#f0a117
$silver:			#cfcfcf

$hb-header-plum: #4b2164
$body-text: #2f3337
*/

/* main body font */

@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Sans:300,400,500');

/*
@font-face {
    font-family: 'IBM Plex Sans';
    src: url('IBMPlexSans-Regular.woff2') format('woff2'), url('IBMPlexSans-Regular.woff') format('woff');
    font-weight: 300,400,500; 
	font-style: normal;
	font-stretch: normal;
}
	*/

/* heading font */

@font-face 
{
	font-family: 'Produkt';
	src: url('Produkt-Regular-Web.woff2') format('woff2'), url('Produkt-Regular-Web.woff') format('woff');
	font-weight: 400;
	font-style: normal;
	font-stretch: normal;
}

@font-face 
{
	font-family: 'Produkt';
	src: url('Produkt-Light-Web.woff2') format('woff2'), url('Produkt-Light-Web.woff') format('woff');
	font-weight: 300;
	font-style: normal;
	font-stretch: normal;
}

/* computer code font  */

@import url('https://fonts.googleapis.com/css?family=IBM+Plex+Mono:300,400');
@namespace MadCap url(http://www.madcapsoftware.com/Schemas/MadCap.xsd);

/*
@font-face {
    font-family: 'IBM Plex Mono';
    src: url('IBMPlexMono-Regular.woff2') format('woff2'), url('IBMPlexMono-Regular.woff') format('woff');
    font-weight: 300,400; 
	font-style: normal;
	font-stretch: normal;
} */

/* Default body styling for site */

body
{
	color: #2f3337;
	font-family: 'IBM Plex Sans', Arial, Helvetica, sans-serif;
	font-weight: normal;
	padding: 0 1.5em .75em 1.5em;
	max-width: 50em;
	margin: .5em auto;
	line-height: 135%;
}

/* end body styling */
/* text styling */

p
{
	line-height: 150%;
	margin: .75em 0 .5em;
	padding: 0;
}

p.center-text,
div.center-text,
.center-text
{
	text-align: center;
}

span.syntax-highlight,
span.red-icon
{
	color: #FF0000;
}

span.syntax-command
{
	color: #0000FF;
}

span.syntax-parameter
{
	color: #0099FF;
}

span.syntax-comment,
span.green-icon
{
	color: #008000;
}

.email_body,
.email_details
{
	margin: .375em 3em 0;
	color: #000;
	text-align: justify;
}

.email_body
{
	font-family: 'IBM Plex Mono', 'Courier New', Courier, 'Lucida Sans Typewriter', 'Lucida Typewriter', monospace;
	font-size: 0.8em;
}

.email_details
{
	line-height: 0.75em;
	font-size: 0.624em;
}

div.supporting-docs
{
	margin: 1.25em 1em 1em 0;
	background-color: #fff;
	border: .075em solid #888888;
	-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 30px rgba(0, 0, 0, 0.1) inset;
	-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 30px rgba(0, 0, 0, 0.1) inset;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 30px rgba(0, 0, 0, 0.1) inset;
	padding: 1.5em 1.5em 1.5em 1.5em;
}

.acl-purple
{
	color: #150b48;
}

.acl-green
{
	color: #42996D;
}

.acl-black
{
	color: #3F3D3C;
}

.acl-orange
{
	color: #DE4D33;
}

/* end text styling */
/* hyperlink styles*/

a
{
	color: #1A70C5;
	text-decoration: none;
}

a:link,
a:visited,
a:active
{
	color: #2789B1;
}

a:hover
{
	color: #294772;
}

MadCap|dropDownHotspot
{
	color: #1A70C5;
}

/* end hyperlink styling */
/* start heading styles */

h1,
h2,
h3,
h4,
h5,
h6
{
	font-family: 'IBM Plex Sans', sans-serif;
	line-height: 1em;
	font-weight: 400;
}

MadCap|dropDownHead.h2,
MadCap|dropDownHead.h3,
MadCap|dropDownHead.h4
{
	font-family: 'IBM Plex Sans', sans-serif;
	line-height: 1em;
	font-weight: 400;
}

h1
{
	font-family: 'Produkt', 'IBM Plex Sans', sans-serif;
	font-size: 3em;
	font-weight: 100;
	margin: 0 0 0.5em 0;
	padding-top: 0.2em;
	color: rgba(47, 51, 55, 0.8);
}

h1.purple_banner
{
	color: #fff;
	background-color: #785cba;
	margin: .5em -5em .5em -5em;
	padding: .75em 4.5em .75em 4.5em;
}

h1.supporting-docs
{
	font-size: 1.6em;
	color: #3F3D3C;
	margin: .25em 0 .75em 0;
}

h2
{
	font-size: 1.802em;
	margin: 1.25em 0 0.5em 0;
}

MadCap|dropDownHead.h2
{
	font-size: 1.802em;
	margin: 1.25em 0 0.5em 0;
}

h3
{
	font-size: 1.423em;
	margin: 1.25em 0 0.5em 0;
}

MadCap|dropDownHead.h3
{
	font-size: 1.423em;
	margin: 1.25em 0 0.5em 0;
}

h4
{
	font-size: 1.125em;
	margin: 1.25em 0 0;
}

MadCap|dropDownHead.h4
{
	font-size: 1.125em;
	margin: 1.25em 0 0;
}

h5
{
	font-size: 1em;
	font-weight: 500;
	margin: 1em 0 0.25em;
}

h6
{
	font-size: .889em;
	font-weight: 500;
	margin: 1em 0 0;
}

/* solution guide card styling */

div.cards h3
{
	font-family: 'Produkt', 'IBM Plex Sans', sans-serif;
	font-size: 1.4em !important;
	text-decoration: none;
	margin: 18px 0;
}

/* end heading styles */
/* list styling */

ul
{
	list-style-type: circle;
	margin: .5em 0 .5em 1.25em;
	padding: 0 0 0 .50em;
}

/* alternating list type styles for nested ul lists */

ul ul
{
	list-style-type: disc;
}

ul ul ul
{
	list-style-type: circle;
}

ul ul ul ul
{
	list-style-type: disc;
}

li
{
	margin: .5em 0;
}

ul ul li
{
	margin: .35em 0;
}

ol
{
	margin: .5em 0 .5em 1.25em;
	padding: 0 0 0 .50em;
	line-height: 120%;
}

ol ol
{
	list-style-type: lower-alpha;
}

ol ol ol
{
	list-style-type: lower-roman;
}

li > p
{
	margin-top: 0;
	margin-bottom: 0;
}

/* end list styling */
/* start computer code styling */

div.computer_code,
pre
{
	font-family: 'IBM Plex Mono', 'Lucida Console', monospace;
	font-weight: 300;
	padding: 0.05em .5em 0.05em 1em;
	font-size: 0.79em;
	color: #666;
	margin: .05em 0;
	border-left: 0.5em solid #cfcfcf;
	background-color: #F0F0F0;
	line-height: 135%;
}

.computer_code p
{
	margin: .95em 0;
}

code
{
	font-family: 'IBM Plex Mono', 'Lucida Console', monospace;
	font-weight: 300;
	font-size: .79em;
	color: #666;
	padding: 3px;
	background: #F0F0F0;
	border: 1px solid #cfcfcf;
	border-radius: 5px;
}

/* end computer code styling */
/* float container wrapper styles */

.float-container
{
	overflow: hidden;
	margin: 0 0 0 0;
	padding: 0 0 0 0;
}

/* float container styling */
/* video wrapper styles */

.videoWrapper iframe
{
	position: absolute;
	top: 1.5em;
	left: 0;
	width: 100%;
	height: 100%;
}

/* end video wrapper styles */
/* image styling */
/*remove max-width when turning on lightbox - 439 max-width: 100%;*/

img
{
	margin: .75em .5em;
	border: none;
}

li img
{
	margin: .25em;
	padding: 0;
	vertical-align: middle;
}

img.inline-icon
{
	padding: 0;
	margin: 0;
	max-height: 1.5em;
}

/* image width styles */

img.ten
{
	max-width: 10%;
}

img.twenty-five
{
	max-width: 25%;
}

img.fifty
{
	max-width: 50%;
}

img.seventy-five
{
	max-width: 75%;
}

/* end image styling */
/* table styling */

table
{
	border-spacing: 0;
	border-collapse: collapse;
	margin: .75em 0 .85em;
	width: 100%;
	font-size: .889em;
}

thead
{
	line-height: 110%;
}

td,
th
{
	padding: 0 .75em;
	text-align: left;
	vertical-align: top;
	border: .1em solid #d7d7d7;
}

td li
{
	line-height: 150%;
}

td.not-applicable
{
	background-color: #cfcfcf;
}

table p
{
	margin: .45em 0;
}

table.purple th
{
	vertical-align: middle;
	background-color: #e6e6e6;
}

table.info
{
	border: .1em solid #f0a117;
}

table.info th
{
	background-color: #f0a117;
	color: #000000;
	font-size: 1.125em;
	text-align: center;
	padding: .65em .5em;
}

table.info td
{
	padding: .75em 1em;
}

table.uses th,
table.uses td
{
	color: #3F3D3C;
	font-size: 1em;
	width: 50%;
}

table.uses th
{
	margin: .25em;
}

table.uses td
{
	padding: .25em .75em;
}

table.result
{
	margin: .75em .25em;
	font-family: 'Droid Sans Mono';
	font-size: .889em;
	color: #3F3D3C;
	font-size: 1em;
}

table.result th,
table.result td
{
	border: .15em solid #D3D3D3;
}

table.result th
{
	text-align: center;
}

table.purpleall,
table.greenall,
table.orangeall
{
	table-layout: fixed;
	font-size: 10px;
	margin: 0;
}

table.purpleall td,
table.greenall td,
table.orangeall td,
td.purpleall,
td.greenall
{
	color: #000000;
}

table.purpleall th,
th.purpleall
{
	background-color: #b6b5d5;
}

table.purpleall td,
td.purpleall
{
	background-color: #d6d6e7;
}

table.greenall th,
th.greenall
{
	background-color: #a2d2ba;
}

table.greenall td,
td.greenall
{
	background-color: #d9eae1;
}

table.orangeall th
{
	background-color: #DE4D33;
	color: #fff;
}

table.orangeall td
{
	background-color: #f1dcb9;
}

table.reference
{
	margin: .05em 0 0 0;
	color: #3F3D3C;
	width: 60em;
	font-size: .702em;
}

table.reference th,
table.reference td
{
	padding: 0 0 0 .250em;
	line-height: .05em;
}

td.current-record
{
	background-color: #9AF0C4;
}

td.padded-td
{
	padding-top: 0.75em;
	padding-bottom: 0.75em;
}

.table-wrap
{
	overflow-x: auto;
}

/* end table styling */
/* note styling */

div.note,
div.tip,
div.caution,
div.important
{
	color: #2e143d;
	font-size: 1em;
	margin: .5em 0 .5em .25em;
	padding: .25em .5em .25em .75em;
	border: 0;
}

div.note
{
	color: #2f3337;
	border-left: solid 0.5em #6790CC;
}

div.tip
{
	border-left: solid 0.5em #3E8914;
}

div.caution,
div.important
{
	border-left: solid 0.5em #c13420;
}

span.notetitle,
p.notetitle,
span.tiptitle,
p.tiptitle
{
	margin: 0.25em 0 0 .25em;
	font-weight: 500;
}

div.note p,
div.note ol li,
div.note ul li,
div.tip p,
div.tip ol li,
div.tip ul li,
div.caution p,
div.caution ol li,
div.caution ul li,
div.important p,
div.important ol li,
div.important ul li
{
	margin: 0.25em 0 .25em .25em;
}

/* end note styling */
/* activity styles */

div.activity,
div.practice-block
{
	margin: 1em 0 .5em;
	page-break-inside: avoid;
}

div.activity > *,
div.practice-block > *
{
	padding: 0 1.5em 0.5em;
}

div.activity
{
	background-color: #DBEBB0;
}

div.activity MadCap|dropDownHotspot
{
	font-family: 'IBM Plex Sans', sans-serif;
	line-height: 1em;
	font-weight: 700;
	color: #2f3337;
}

div.activity > h2,
div.practice-block > h2,
div.activity > h3,
div.practice-block > h3,
div.activity > h4,
div.practice-block > h4,
div.activity > h5,
div.practice-block > h5,
div.activity > h6,
div.practice-block > h6
{
	padding: .15em;
	text-align: center;
	font-size: 1.266em;
	line-height: 135%;
	letter-spacing: 0.01em;
	font-weight: 500;
	color: #fff;
	margin: 0;
}

div.activity > h2,
div.activity > h3,
div.activity > h4,
div.activity > h5,
div.activity > h6
{
	background-color: #A6CE39;
}

div.practice-block > h2,
div.practice-block > h3,
div.practice-block > h4,
div.practice-block > h5,
div.practice-block > h6
{
	background-color: #007dc5;
}

/* end activity styles */
/* LEGACY activity styles LEGACY  */

div.activityH,
.activityH,
div.practicetitle,
.practicetitle
{
	padding: .25em;
	text-align: center;
	font-size: 1.266em;
	color: #FFF;
	background-color: #A6CE39;
	margin: 1em 0 0 0;
}

div.activityB,
.activityB,
div.practice,
.practice
{
	margin: 0 0 .5em 0;
	padding: .5em 1.5em .5em 1.5em;
}

div.practice MadCap|dropDownHotspot
{
	font-family: 'IBM Plex Sans', sans-serif;
	line-height: 1em;
	font-weight: 700;
	color: #2f3337;
}

div.activityH,
.activityH
{
	background-color: #A6CE39;
	margin: 1em 0 0 0;
}

div.activityB,
.activityB
{
	background-color: #DBEBB0;
}

div.practicetitle,
.practicetitle
{
	background-color: #007DC5;
	margin: .75em 0 0 0;
}

div.practice,
.practice
{
	background-color: #94BBE4;
}

.activityB .computer_code,
.practice .computer_code
{
	background-color: transparent;
}

/* end activity styles  */
/* float styles */

.left,
img.left,
p.left,
div.left,
table.left
{
	float: left;
	margin: .625em;
}

.right,
img.right,
p.right,
div.right,
table.right
{
	float: right;
	margin: .625em;
}

div.acda-float-wrapper > p.right
{
	max-width: 20%;
}

div.acda-float-wrapper > p.right > img
{
	position: relative;
	bottom: -5em;
}

div.acda-float-wrapper > div.left
{
	max-width: 75%;
}

/* end float styles */

MadCap|dropDown
{
	mc-image-position: right;
	mc-closed-image: url('../images/icons/toggle_closed.png');
	mc-open-image: url('../images/icons/toggle_open.png');
	margin: 0.25em 0;
}

.MCDropDown_Image_Icon
{
	margin: .25em 0;
}

.dropDownHead.dropDownHeadh2,
.dropDownHead.dropDownHeadh3,
.dropDownHead.dropDownHeadh4
{
	margin-top: 0.2em;
	margin-bottom: 0;
}

.whatdoyousee
{
	margin: 1.5em 0 .5em;
	padding: 1em 1.5em;
	color: #666;
	column-span: all;
	border-bottom: thick solid #F0F0F0;
	border-top: thick solid #F0F0F0;
}

a.button-academy	/* styles pulled from academy CSS */
{
	display: inline-block;
	margin: 1em .5em .5em;
	text-align: center;
	vertical-align: middle;
	cursor: pointer;
	color: #333333;
	border: 1px solid #cfcfcf;
	-webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
	-moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
	box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 1px 2px rgba(0,0,0,.05);
	padding: 11px 19px;
	font-size: 16.25px;
	border-radius: 6px;
	background-color: #f5f5f5;
	background-image: -moz-linear-gradient(top,#fff ,#e6e6e6 );
	background-image: -webkit-linear-gradient(top,#fff ,#e6e6e6 );
	background-image: -o-linear-gradient(top,#fff ,#e6e6e6 );
	background-image: linear-gradient(to bottom,#fff ,#e6e6e6 );
	background-repeat: repeat-x;
	border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
}

pre
{
	/* styling for word wrapping code blocks without line breaks */
	white-space: pre-wrap;
	word-wrap: break-word;
}

/******************** two column pages TO BE REPLACED WITH MORE FLEXIBLE AND REUSABLE FLOATED DIV LAYOUT ********************/

div.two-column
{
	-moz-column-count: 2;
	-moz-column-gap: 20px;
	-webkit-column-count: 2;
	-webkit-column-gap: 20px;
	column-count: 2;
	column-fill: auto;
	column-gap: 3em;
	-moz-column-fill: balance;
	overflow: hidden;
	margin-top: 2rem;
}

/* hack to handle uneven column heights */

.two-column > h3:first-of-type,
.two-column > h2:first-of-type
{
	margin: 0;
}

/* end two column pages */
/* Force breaks before or avoid breaks within an element */

.no-break
{
	page-break-inside: avoid;
	break-inside: avoid;
	-webkit-column-break-inside: avoid;
	padding: 0;
	margin: 0;
}

.force-break
{
	page-break-before: always;
	break-before: always;
	-webkit-column-break-before: always;
	break-before: column;
	padding: 0;
	margin: 0;
}

/* End force breaks avoid breaks */

/* Styles for MadCapFlare variables

.aclResults_lite_module,
.aclStrategy_module,
.aclResults_module,
.aclReports_module,
.aclProjects_module,
.aclACL_Analytics,
.aclAnalytics_exchange,
.aclMissionControl_module,
.aclACL_Robotics,
.aclRobots_module
{
	font-style: italic;
}
*/

/* End styles for MadCapFlare variables*/
/* Styles for the tabbed UI */

div.tabbed
{
	overflow: hidden;
	border: .01em solid #cfcfcf;
	margin: 1em 0 0 0;
	background-color: #f1f1f1;
}

/* Style the buttons inside the tab */

div.tabbed button
{
	background-color: inherit;
	float: left;
	border-right: none;
	border-left: none;
	border-top: .01em solid #cfcfcf;
	border-bottom: .01em solid #cfcfcf;
	outline: none;
	cursor: pointer;
	padding: 14px 16px;
	transition: 0.3s;
	font-size: 1.125em;
	color: rgba(47,51,55,.8);
	font-family: inherit;
}

div.tabbed button:first-child
{
	border-left: .01em solid #cfcfcf;
}

/* Change background color of buttons on hover */

div.tabbed button:hover
{
	background-color: #ddd;
}

/* Create an active/current tablink class */

div.tabbed button.active
{
	background-color: #cfcfcf;
}

/* Style the tab content */

.tab-content
{
	display: none;
	padding: 1.5em 2em 1.5em 2em;
	border: .01em solid #cfcfcf;
	border-top: none;
}

/* End styles for the tabbed UI */
/* Styles for links and crossreferences styled as buttons */

MadCap|xref.btn-primary-tr,
MadCap|xref.btn-primary-tr:visited
{
	-webkit-transition: background-color 300ms ease-out;
	transition: background-color 300ms ease-out;
	font-size: 16px;
	padding: 14px 20px;
	text-decoration: none;
	border: 1px solid #fff;
	color: #fff;
	border-radius: 3px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-weight: 500;
	margin-top: 18px;
	display: inline-block;
	background: #f0a117;
}

MadCap|xref.btn-primary-tr:hover
{
	background: rgba(0,0,0, 0.3);
	border: .01em solid #fff;
	color: #fff;
	border-radius: 3px;
	font-family: 'IBM Plex Sans', sans-serif;
}

a.btn-primary-tr,
a.btn-primary-tr:visited
{
	-webkit-transition: background-color 300ms ease-out;
	transition: background-color 300ms ease-out;
	font-size: 16px;
	padding: 14px 20px;
	text-decoration: none;
	border: 1px solid #fff;
	color: #fff;
	border-radius: 3px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-weight: 500;
	margin-top: 18px;
	display: inline-block;
	background: #f0a117;
}

a.btn-primary-tr:hover
{
	background: rgba(0,0,0, 0.3);
	border: 1px solid #fff;
	color: #fff;
	border-radius: 3px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-weight: 500;
}

a.link-block
{
	display: block;
}

/* End styles for link and crossreference buttons */
/* Styles for What's Next? page */

section.level div.track,
section.level div.track-header,
section.level div.course
{
	margin-bottom: 0.702em;
}

div.track
{
	background-color: #f6f6fa;
	border-radius: 5px;
	padding: 0 0.702em;
	border: 2px solid #a5ccec;
	border-top-color: #a5ccec;
}

div.track.grc
{
	border-color: #a2d2ba;
	background-color: #e7f3ed;
}

.track-button
{
	float: right;
	margin: 0;
}

div.course
{
	padding: 0.8em 0em;
	border-width: 2px;
	border-style: solid;
	border-radius: 5px;
	background-color: #fff;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
}

div.course.analytics
{
	border-color: #53529F;
}

div.course.grc
{
	border-color: #42996D;
}

div.course > div
{
	display: flex;
	flex: 1 0 0;
	padding: 0em 0.8em;
	word-break: break-word;
	width: 100%;
	display: inline-block;
}

div.course .name
{
	flex-grow: 2;
}

div.course .description
{
	flex-grow: 5;
}

div.course .cpe
{
	text-align: right;
	justify-content: right;
}

/* End styles for What's Next? page */
/* Styles for description lists */

dt
{
	float: left;
	clear: left;
	width: auto;
	text-align: right;
	margin: 0 10px 0 0;
}

dd
{
	margin: 0 0 0 30%;
	padding: 0 0 0.5em 0;
}

/* End styles for description lists*/
/* Styles for image expander */

.zoom-overlay
{
	display: inline-block;
	margin: 0 1em 1em 0;
	position: relative;
}

.zoom-overlay:hover span.overlay-content
{
	opacity: 1;
}

span.overlay-content
{
	background: rgba(63,61,60,0.5);
	color: #fff;
	display: table;
	cursor: default;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
	border-radius: 5px;
	padding: 0.702em;
	margin: 0.702em;
	-webkit-transition: opacity 500ms;
	-moz-transition: opacity 500ms;
	-o-transition: opacity 500ms;
	transition: opacity 500ms;
}

span.overlay-content span
{
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

/* Styles for image expander modal */

.expanded
{
	display: block;
	max-width: none;
	margin: auto;
}

.popup
{
	width: 100%;
	height: 100%;
	display: none;
	position: fixed;
	top: 0px;
	left: 0px;
	background: rgba(0,0,0,0.75);
}

.popup-inner
{
	width: 90%;
	height: 90%;
	padding: 20px 10px 10px;
	position: absolute;
	top: 50%;
	left: 50%;
	border-radius: 3px;
	background: #fff;
	box-shadow: 0px 2px 6px #000;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
}

.popup-inner div
{
	height: 100%;
	width: 100%;
	overflow: auto;
	display: flex;
	align-items: center;
}

.popup-close
{
	display: inline-block;
	height: 30px;
	padding: 4px;
	position: absolute;
	top: 20px;
	right: 30px;
	text-align: center;
	line-height: 100%;
	transition: ease 0.25s all;
	-webkit-transform: translate(50%, -50%);
	transform: translate(50%, -50%);
}

/* End styles for image expander */
/* Styles for inputs */

input.wide-input
{
	width: 100%;
}

input.narrow-input
{
	width: 40px;
}

/* End styles for inputs*/
/* Styles for subtitle tracks */

video::cue
{
	color: #E6E3DF;
	background-color: #3F3D3C;
	font-size: 22px;
}

/* End styles for subtitle tracks */
/* Styles for panels */

.panel
{
	border: 1px solid #cfcfcf;
	border-radius: 5px;
	margin: 30px 0;
}

.panel .panel-heading
{
	margin: 0.25em 0.5em;
}

.panel .MCDropDown
{
	margin: 0.25em 0.75em;
}

/* End styles for panels */
/* solution guide card style */

div.card-one,
div.card-two,
div.card-three,
div.card-four,
div.card-five,
div.card-six,
div.card-seven
{
	display: block;
	float: none;
	width: 20rem;
	min-height: 15rem;
	margin: 30px 0;
}

/* Card headers */

div.hcp-card-header
{
	height: 3.5rem;
	width: 18rem;
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	background-color: #5d7599;
}

div.role-based-card-header
{
	height: 3.5rem;
	width: 18rem;
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	background-color: #ffb400;
}

div.tutorial-card-header
{
	height: 2rem;
	width: 18rem;
	border-top-left-radius: 0.5rem;
	border-top-right-radius: 0.5rem;
	background-color: #2e143d;
	opacity: 0.5;
}

/* Solution guide card styling */

div.cards
{
	display: inline-block;
}

div.two-cards
{
	display: inline-block;
}

/* Ensures content in solution guide cards is not displayed as a link */

div.card-one a,
div.card-two a,
div.card-three a,
div.card-four a,
div.card-five a,
div.card-six a,
div.card-seven a
{
	color: rgb(47, 51, 55);
	text-decoration: none;
}

/* Hover card properties */

div.card-one:hover,
div.card-two:hover,
div.card-three:hover,
div.card-four:hover,
div.card-five:hover,
div.card-six:hover,
div.card-seven:hover
{
	box-shadow: 0 5px 15px rgba(0,0,0,0.3);
	cursor: pointer;
}

/* Cards 1-6 properties */

div.card-one,
div.card-two,
div.card-three,
div.card-four,
div.card-five,
div.card-six,
div.card-seven
{
	min-height: 19.5rem;
	max-width: 18rem;
	float: left;
	border-radius: 0.5rem;
	margin-left: 0;
	margin-right: 1rem;
	margin-bottom: 2rem;
	box-shadow: 0 3px 3px rgba(0,0,0,0.15);
	transition: all 0.1s ease-in-out;
}

div.card-content
{
	padding: 1rem;
	text-align: left;
	margin-top: 5px;
}

div.card-content p
{
	margin-left: 0 !important;
	margin-top: 0px;
	margin-bottom: -15px;
	text-decoration: none;
}

div.caution
{
	border-left: solid 0.5em #D64933;
}

div.important
{
	border-left: solid 0.5em #eaa14b;
	color: #2f3337;
}

a:active
{
	color: #1A70C5;
}

a:link
{
	text-decoration: none;
}

a:visited
{
	color: #785cbe;
}

div.practice-block > h2
{
	background-color: #6790cc;
}

div.practice-block > h3
{
	background-color: #6790cc;
}

div.practice-block > h4
{
	background-color: #6790cc;
}

div.practice-block > h5
{
	background-color: #6790cc;
}

div.practice-block > h6
{
	background-color: #6790cc;
}

div.practicetitle
{
	background-color: #6790cc;
}

div.practice
{
	background-color: #a5ccec;
}

th.purpleall
{
	background-color: #b2b2b2;
}

div.grc
{
	background-color: #ffffff;
}

@media screen and (max-width: 1175px)
{
	div.card-one,
	div.card-two,
	div.card-three,
	div.card-four,
	div.card-five,
	div.card-six,
	div.card-seven
	{
		border-radius: 0.5rem;
		margin: 1rem;
		box-shadow: 0 3px 3px rgba(0,0,0,0.15);
		transition: all 0.1s ease-in-out;
		display: inline-block;
	}

	div.cards
	{
		display: inline-block;
		width: 100%;
		margin: 0 auto;
	}

	div.two-cards
	{
		display: block;
		width: 640px;
		height: 20rem;
		margin: 0 auto;
	}

	div.intro-statement
	{
		
	}

	h2
	{
		text-align: left;
	}

	a.landing-page-link
	{
		display: table;
		margin-left: auto;
		margin-right: auto;
	}

	div.return-home,
	div.product-access
	{
		float: none;
		position: static;
		margin-left: auto;
		margin-right: auto;
		max-width: 80%;
	}

	div.product-access
	{
		margin-top: 8rem;
	}
}

@media screen and (max-width: 657px)
{
	div.card-one,
	div.card-two,
	div.card-three,
	div.card-four,
	div.card-five,
	div.card-six,
	div.card-seven
	{
		display: inline-block;
		float: none;
	}

	div.cards
	{
		display: block;
		width: 23rem;
		height: auto;
	}

	div.two-cards
	{
		display: block;
		width: 18rem;
		height: auto;
		margin: 0 auto;
	}

	h2
	{
		text-align: left;
	}

	div.landing-page-banner .search-bar._Skins_search_bar.mc-component
	{
		max-width: 95%;
	}
}

/* End of solution guides card properties */
/* Lightbox image CSS */

a.lightbox-me > img
{
	cursor: zoom-in;
	max-width: 100%;
}

body.lb-disable-scrolling
{
	overflow: hidden;
}

.lightboxOverlay
{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 9999;
	background-color: black;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	opacity: 0.8;
	display: none;
}

.lightbox
{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 10000;
	text-align: center;
	line-height: 0;
	font-weight: normal;
	outline: none;
}

.lightbox .lb-image
{
	display: block;
	height: auto;
	max-width: inherit;
	max-height: none;
	border-radius: 3px;
	/* Image border */
	border: 4px solid white;
}

.lightbox a img
{
	border: none;
}

.lb-outerContainer
{
	position: relative;
	*zoom: 1;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	border-radius: 4px;
	/* Background color behind image.
	   This is visible during transitions. */
	background-color: white;
}

.lb-outerContainer:after
{
	content: "";
	display: table;
	clear: both;
}

.lb-loader
{
	position: absolute;
	top: 43%;
	left: 0;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
}

.lb-cancel
{
	display: block;
	width: 32px;
	height: 32px;
	margin: 0 auto;
	background: url(images/loading.gif) no-repeat;
}

.lb-nav
{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
}

.lb-container > .nav
{
	left: 0;
}

.lb-nav a
{
	outline: none;
	background-image: url('data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==');
}

.lb-prev,
.lb-next
{
	height: 100%;
	cursor: pointer;
	display: block;
}

.lb-nav a.lb-prev
{
	width: 34%;
	left: 0;
	float: left;
	background: url(images/prev.png) left 48% no-repeat;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	-webkit-transition: opacity 0.6s;
	-moz-transition: opacity 0.6s;
	-o-transition: opacity 0.6s;
	transition: opacity 0.6s;
}

.lb-nav a.lb-prev:hover
{
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1;
}

.lb-nav a.lb-next
{
	width: 64%;
	right: 0;
	float: right;
	background: url(images/next.png) right 48% no-repeat;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
	opacity: 0;
	-webkit-transition: opacity 0.6s;
	-moz-transition: opacity 0.6s;
	-o-transition: opacity 0.6s;
	transition: opacity 0.6s;
}

.lb-nav a.lb-next:hover
{
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1;
}

.lb-dataContainer
{
	margin: 0 auto;
	padding-bottom: 5px;
	*zoom: 1;
	width: 100%;
	border-bottom-left-radius: 4px;
	border-bottom-right-radius: 4px;
}

.lb-dataContainer:after
{
	content: "";
	display: table;
	clear: both;
}

.lb-data
{
	padding: 0 4px;
	color: #ccc;
}

.lb-data .lb-details
{
	width: 85%;
	float: left;
	text-align: left;
	line-height: 1.1em;
}

.lb-data .lb-caption
{
	font-size: 13px;
	font-weight: bold;
	line-height: 1em;
}

.lb-data .lb-caption a
{
	color: #4ae;
}

.lb-data .lb-number
{
	display: block;
	clear: left;
	padding-bottom: 1em;
	font-size: 12px;
	color: #999999;
}

.lb-data .lb-close
{
	display: block;
	float: right;
	width: 30px;
	height: 30px;
	background: url(images/close.png) top right no-repeat;
	text-align: right;
	outline: none;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
	opacity: 0.7;
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	-o-transition: opacity 0.2s;
	transition: opacity 0.2s;
}

.lb-data .lb-close:hover
{
	cursor: pointer;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
	opacity: 1;
}

ul.checklist
{
	display: block;
	list-style-position: outside;
}

ul.checklist > li::marker
{
	content: '☐';
}

ul.checklist > li
{
	padding-left: 0.5em;
}

ul.checklist > li > ul > li::marker
{
	content: '☐';
}

ul.checklist > li > ul > li
{
	padding-left: 0.5em;
}

ul.checklist > li > ul > li > ul > li::marker
{
	content: '☐';
}

ul.checklist > li > ul > li > ul > li
{
	padding-left: 0.5em;
}

ul.checklist > li > ul > li > ul > li > ul > li::marker
{
	content: '☐';
}

ul.checklist > li > ul > li > ul > li > ul > li
{
	padding-left: 0.5em;
}

ul.checklist-table
{
	display: block;
	list-style-position: outside;
}

ul.checklist-table > li::marker
{
	content: '☐';
}

ul.checklist-table > li
{
	padding-left: 0.75em;
}

ul.checklist-table > li > ul > li::marker
{
	content: '☐';
}

ul.checklist-table > li > ul > li
{
	padding-left: 0.75em;
}

ul.checklist-table > li > ul > li > ul > li::marker
{
	content: '☐';
}

ul.checklist-table > li > ul > li > ul > li
{
	padding-left: 0.75em;
}

ul.checklist-table > li > ul > li > ul > li > ul > li::marker
{
	content: '☐';
}

ul.checklist-table > li > ul > li > ul > li > ul > li
{
	padding-left: 0.75em;
}

a.button-academy:hover
{
	background-image: none;
	background-color: #e6e6e6;
}

p.print-footer
{
	font: inherit;
	font-size: 10pt;
	color: #A9A9A9;
}

