@import url('https://fonts.googleapis.com/css?family=Merriweather:400');

@media (min-width: 430px) {
	.site-content {
		margin-left: 5%;
		width: 90%;
	}

}

@media (min-width: 768px) {
	.site-content {
		margin-left: 15%;
		width: 70%;
	}

}

@media (min-width: 1200px) {
	.site-content {
		margin-left: 15%;
		width: 70%;
	}
}

/* Disable deeplink on larger screens */
a.app.disabled {
	pointer-events: none !important;
	cursor: default !important;
	color: #282F35 !important; 
	text-decoration: none !important;
}
a.app.disabled::after {
	content: none !important;
	display: none !important;
}

html {

	font-size: 1em;
	font: -apple-system-body;
}

/* Hide Article Features */

.site-sidebar {
	display:none;
}

.toolbar {
	display:none;
}

.featured-content-label {
    display:none;
}

.portal-contents featured-content {
    display:none;
}

.portal-contents .inner {
    display:none;
}

/* Hide TOC Landing Page Features */


.portal-header {
	display:none !important;
}

.portal-footer {
	display: none !important;
}

.publication-icon {
	display: none !important;
}

.portal-single-publication {
	width:100%;
	min-height:1px;
	padding-right:15px;
	text-align: left;
	margin-bottom: 0px;
}

.portal-single-publication a {

	color: #555;
	display: inline-block;
	padding: 5px 5px;
	width: 100%;
	height: 100%;
	background-color: #fff;
	box-shadow: 0 0px 0px rgba(0,0,0,0);
}

.portal-single-publication a:hover {
	text-decoration: none;
	box-shadow: 0 0px 0px rgba(0,0,0,0);

}

.portal-publications {
	margin-top: 0px;
}

/*

.portal-body-container {
	padding-right:15px;
	padding-left: 25%;
	margin-right: auto;
	margin-left: auto;
}


.portal-publications::before {
    content: "Table of Contents";
    font-size: 28px;
    line-height: 36px;
    font-family: 'Merriweather', serif;
    color: #0F3541;
    margin-top:0px;
    text-rendering: optimizeLegibility;
}
*/

.portal-body-row::before {
	background: url("image/portal-logo.png") no-repeat 0 0;
	content: " ";
	display: inline-block;
	width: 300px;
	height: 109px;
	background-size: 300px 109px;
}

.portal-single-publication h3 {
	margin: 1.2em 0 0 20px;
	font-size: 16px;
	display:list-item;
}

/* Styles and Branding */

h1 {
    font-size: 28px;
    line-height: 36px;
    font-family: 'Merriweather', serif;
    color: #0F3541;
    margin-top:0px;
    text-rendering: optimizeLegibility;
}

.inner h1 {
	color: #ffffff;
}

h2, h3 {

    font-size: 22px;
    line-height: 28px;
    font-family: 'Merriweather', serif;
    color: #0F3541;
    margin-top:10px;
    text-rendering: optimizeLegibility;

}

p {
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
    color: #282F35; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
}

.listitem {
	font-size: 16px;
}

b, strong {
	color: #0F3541;
}

a {
	color: #0080A3;
	text-decoration: underline;
	font-style: italic;
}

a.glossterm {
	color: #0080A3;
	font-weight: bold;
	text-decoration: underline;
	text-decoration-color: #B0DEEA;
	text-decoration-thickness: 2.5px;
	font-style: normal;
}

a.glossterm:focus, a.glossterm:hover {
	background-color: rgba(176, 222, 234, 0.4);
}

a.app, a.web, .portal-single-publication a {
	font-style: normal;
}

a.web::after {
	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d20c7d.svg);
	background-size: 70%;
	background-repeat: no-repeat;
	width:20px;
	height:23px;
	left: 5px;
	right: 5px;
	top: 12px;
	position: relative;
}

a.app::after {

	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d1e108.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	width:25px;
	height:25px;
	left: 3px;
	top: 3px;
	right: 5px;
	vertical-align: bottom;
	position: relative;

}

.important {

    border-color: #923133;
    border-width: 1px;
    border-radius: 6px;
    border-style: solid;
    padding: 28px;
    background-color: #ffffff;

}

.important::before {
	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d23924.svg);
	background-size: 80%;
	background-repeat: no-repeat;
	width:24px;
	height:24px;
	left: 30px;
	top: 30px;
	right: 5px;
	vertical-align: bottom;
}

.important h2{
	font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #923133; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
    padding-left: 32px;
    margin-top:0px;
}

.important h3 {
	font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #923133; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
    padding-left: 32px;
    margin-top:-10px;
}

.important p {
	font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #923133; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
}


.important b, .important strong {
	color: #923133;
}

.box {

    border-color: #ffffff;
    border-width: 1px;
    border-radius: 6px;
    border-style: solid;
    padding: 28px;
    background-color: #ffffff;
    filter: drop-shadow(#A6B4BA 1px 2px 6px);
    margin-bottom: 40px;
    margin-top: 40px;
}

.box h2, .box h3 {
	font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #0F3541; 
    line-height: 20px; 
    text-rendering: optimizeLegibility;
    margin-top: 0px;
}

.box p {
	font-size: 14px;
    font-family: 'Roboto', sans-serif;
    color: #0F3541; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
}

.story {

    border-left-color: #0E98BE;
    border-left-width: 2px;
    border-left-style: solid;
    background-color: #ffffff;
    padding-left: 28px;
    padding-right: 28px;
}

.story h2, .story h3 {
	font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #0F3541; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
    margin-top: 0px;
}

.story p {
	font-size: 14px;
    font-family: 'Merriweather', serif;
    color: #0F3541; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
}

.story p::before {
	content: '“';
	font-size: 20px;
	font-family: 'Merriweather', serif;
	color: #0E988E;
}

.story p::after {
	content: '”';
	font-size: 20px;
	font-family: 'Merriweather', serif;
	color: #0E988E;
}

.popover {

	background-color: #F2F8FA;
	left: 0px !important;
	width: 100%;
	max-width: 100%;
}

h3.popover-title {
	font-size: 16px;
	line-height: 24px;
	font-family: 'Roboto', sans-serif;
	font-weight: bold;
	font-style
	color: #0F3541;
	background-color: #F2F8FA;
	border-bottom: none;
}


.popover-content {
	color: #0F3541;
	background-color: #F2F8FA;	
}

.popover-title {
	background-color: #F2F8FA;	
}

.arrow {
	color: #F2F8FA;		
}

table {
	width: 100%;
}

.informaltable th p {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 12px;
	line-height: 15px;
	text-transform: uppercase;
	color: #78868E;
}

.informaltable td p {
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	line-height: 20px;
	color: #282F35;
}

.informaltable td p bold, .informaltable td p strong, .informaltable tr td:nth-child(1) p {
	color: #0080A3;
	font-weight: normal;
	line-height: 20px;
} 



.informaltable td p a {
	font-style: normal;
	text-decoration: underline;
}

.informaltable tr {
	height: 72px;
}

.informaltable tr:nth-child(odd) {
	background-color: #F2F8FA;
}

.rules-rows td, .rules-rows th {
	border-top-style: none;
	border-bottom-style: none;
}

.rules-rows th {
	background-color: white;
}

.table-footnote {
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
	line-height: 20px;
}

/* Resizer Letters */

.container {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	flex-direction: column;
	margin: 20px auto;
	padding: 0 20px;
}

.container .buttons {
	width: 100%;
	display: flex;
	justify-content: flex-end;
	align-items: flex-end;
	margin-bottom: 20px;
}

.container .buttons .btnx {
	padding: 4px 8px 4px;
	display: inline-flex;
	background: #FFF;
	color: #0F3541;
	font-weight: 400;
	margin-left: 10px;
	border-radius: 4px;
	cursor: pointer;
}

.container .buttons .btnx.active {
	background: #F2F8FA;
	color: #0080A3;
	font-weight: 500;
	font-family: 'Roboto', sans-serif;
}

.container .buttons .btnx:nth-child(2) {
	font-size: 1.5em;
	padding: 1px 8px 1px;
}

.container .buttons .btnx:nth-child(3) {
	font-size: 1.75em;
	padding: 0px 8px 0px;

}

.container .content {
	font-size: 1em;
	color: #0F3541;
}

.container .content h2, .container .content h3, .container .content p {
	transition: 0.5s
}



/* Large */


.large h1 {
    font-size: 42px;
    line-height: 48px;
    font-family: 'Merriweather', serif;
    color: #0F3541;
    margin-top:0px;
    text-rendering: optimizeLegibility;
}


.large h2, .large h3 {

    font-size: 33px;
    line-height: 40px;
    font-family: 'Merriweather', serif;
    color: #0F3541;
    margin-top:10px;
    text-rendering: optimizeLegibility;

}

.large p {
    font-size: 24px;
    font-family: 'Roboto', sans-serif;
    color: #282F35; 
    line-height: 32px; 
    text-rendering: optimizeLegibility;
}

.large .listitem {
	font-size: 24px;
}

.large a.web::after {
	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d20c7d.svg);
	background-size: 90%;
	background-repeat: no-repeat;
	width:20px;
	height:23px;
	left: 4px;
	right: 8px;
	top: 8px;
	position: relative;
}

.large a.app::after {

	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d1e108.svg);
	background-size: 110%;
	background-repeat: no-repeat;
	width:25px;
	height:25px;
	left: 3px;
	top: -2px;
	right: 5px;
	vertical-align: bottom;
	position: relative;

}

.large .important {

    border-color: #923133;
    border-width: 1px;
    border-radius: 6px;
    border-style: solid;
    padding: 28px;
    background-color: #ffffff;

}

.large .important::before {
	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d23924.svg);
	background-size: 90%;
	background-repeat: no-repeat;
	width:24px;
	height:24px;
	left: 30px;
	top: 30px;
	right: 5px;
	vertical-align: bottom;
}

.large .important h2 {
	font-size: 24px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #923133; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
    padding-left: 32px;
    margin-top:0px;
}

.large .important h3 {
	font-size: 24px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #923133; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
    padding-left: 32px;
    margin-top:-10px;
}

.large .important p {
	font-size: 21px;
    font-family: 'Roboto', sans-serif;
    color: #923133; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
}


.large .box {

    border-color: #ffffff;
    border-width: 1px;
    border-radius: 6px;
    border-style: solid;
    padding: 28px;
    background-color: #ffffff;
    filter: drop-shadow(#A6B4BA 1px 2px 6px);
    margin-bottom: 40px;
    margin-top: 40px;
}

.large .box h2, .large .box h3 {
	font-size: 24px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #0F3541; 
    line-height: 28px; 
    text-rendering: optimizeLegibility;
    margin-top: 0px;
}

.large .box p {
	font-size: 21px;
    font-family: 'Roboto', sans-serif;
    color: #0F3541; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
}

.large .story {

    border-left-color: #0E98BE;
    border-left-width: 2px;
    border-left-style: solid;
    background-color: #ffffff;
    padding-left: 28px;
    padding-right: 28px;
}

.large .story h2, .large .story h3 {
	font-size: 24px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #0F3541; 
    line-height: 24px; 
    text-rendering: optimizeLegibility;
    margin-top: 0px;
}

.large .story p {
	font-size: 24px;
    font-family: 'Merriweather', serif;
    color: #0F3541; 
    line-height: 32px; 
    text-rendering: optimizeLegibility;
}

.large .story p::before {
	content: '“';
	font-size: 30px;
	font-family: 'Merriweather', serif;
	color: #0E988E;
}

.large .story p::after {
	content: '”';
	font-size: 30px;
	font-family: 'Merriweather', serif;
	color: #0E988E;
}

.large h3.popover-title {
	font-size: 24px;
	line-height: 24px;
	font-family: 'Roboto', sans-serif;
	font-weight: bold;
	font-style
	color: #0F3541;
	background-color: #F2F8FA;
	border-bottom: none;
}

.large .informaltable th p {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 18px;
	line-height: 18px;
	text-transform: uppercase;
	color: #78868E;
}

.large .informaltable td p {
	font-family: 'Roboto', sans-serif;
	font-size: 21px;
	line-height: 21px;
	color: #282F35;
}

.large .table-footnote {
	font-family: 'Roboto', sans-serif;
	font-size: 21px;
	line-height: 21px;
}

.large dt a.glossterm {
	font-size: 24px;
	color: #0080A3;
	font-weight: bold;
	text-decoration: underline;
	text-decoration-color: #B0DEEA;
	text-decoration-thickness: 2.5px;
	font-style: normal;
}


/* X-Large */


.xlarge h1 {
    font-size: 49px;
    line-height: 59px;
    font-family: 'Merriweather', serif;
    color: #0F3541;
    margin-top:0px;
    text-rendering: optimizeLegibility;
}


.xlarge h2, .xlarge h3 {

    font-size: 38.5px;
    line-height: 49px;
    font-family: 'Merriweather', serif;
    color: #0F3541;
    margin-top:10px;
    text-rendering: optimizeLegibility;

}

.xlarge p {
    font-size: 28px;
    font-family: 'Roboto', sans-serif;
    color: #282F35; 
    line-height: 42px; 
    text-rendering: optimizeLegibility;
}

.xlarge .listitem {
	font-size: 28px;
}

.xlarge a.web::after {
	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d20c7d.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	width:20px;
	height:23px;
	left: 5px;
	right: 5px;
	top: 5px;
	position: relative;
}

.xlarge a.app::after {

	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d1e108.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	width:30px;
	height:30px;
	left: 3px;
	top: -3px;
	right: 5px;
	vertical-align: bottom;
	position: relative;

}

.xlarge .important {

    border-color: #923133;
    border-width: 1px;
    border-radius: 6px;
    border-style: solid;
    padding: 28px;
    background-color: #ffffff;

}

.xlarge .important::before {
	content: " ";
	display: inline-block;
	background-image: url(/portal/universal/Styles/en/image/166be3c8d23924.svg);
	background-size: 100%;
	background-repeat: no-repeat;
	width:24px;
	height:24px;
	left: 30px;
	top: 30px;
	right: 5px;
	vertical-align: bottom;
}

.xlarge .important h2 {
	font-size: 28px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #923133; 
    line-height: 28px; 
    text-rendering: optimizeLegibility;
    padding-left: 32px;
    margin-top:0px;
}

.xlarge .important h3 {
	font-size: 28px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #923133; 
    line-height: 28px; 
    text-rendering: optimizeLegibility;
    padding-left: 32px;
    margin-top:-10px;
}

.xlarge .important p {
	font-size: 24.5px;
    font-family: 'Roboto', sans-serif;
    color: #923133; 
    line-height: 32px; 
    text-rendering: optimizeLegibility;
}


.xlarge .box {

    border-color: #ffffff;
    border-width: 1px;
    border-radius: 6px;
    border-style: solid;
    padding: 28px;
    background-color: #ffffff;
    filter: drop-shadow(#A6B4BA 1px 2px 6px);
    margin-bottom: 40px;
    margin-top: 40px;
}

.xlarge .box h2, .xlarge .box h3 {
	font-size: 28px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #0F3541; 
    line-height: 32px; 
    text-rendering: optimizeLegibility;
    margin-top: 0px;
}

.xlarge .box p {
	font-size: 24.5px;
    font-family: 'Roboto', sans-serif;
    color: #0F3541; 
    line-height: 32px; 
    text-rendering: optimizeLegibility;
}

.xlarge .story {

    border-left-color: #0E98BE;
    border-left-width: 2px;
    border-left-style: solid;
    background-color: #ffffff;
    padding-left: 28px;
    padding-right: 28px;
}

.xlarge .story h2, .xlarge .story h3 {
	font-size: 28px;
    font-family: 'Roboto', sans-serif;
    font-weight: bold;
    color: #0F3541; 
    line-height: 28px; 
    text-rendering: optimizeLegibility;
    margin-top: 0px;
}

.xlarge .story p {
	font-size: 24.5px;
    font-family: 'Merriweather', serif;
    color: #0F3541; 
    line-height: 36px; 
    text-rendering: optimizeLegibility;
}

.xlarge .story p::before {
	content: '“';
	font-size: 35px;
	font-family: 'Merriweather', serif;
	color: #0E988E;
}

.xlarge .story p::after {
	content: '”';
	font-size: 35px;
	font-family: 'Merriweather', serif;
	color: #0E988E;
}

.xlarge h3.popover-title {
	font-size: 28px;
	line-height: 28px;
	font-family: 'Roboto', sans-serif;
	font-weight: bold;
	font-style
	color: #0F3541;
	background-color: #F2F8FA;
	border-bottom: none;
}

.xlarge .informaltable th p {
	font-family: 'Roboto', sans-serif;
	font-weight: 700;
	font-size: 21px;
	line-height: 21px;
	text-transform: uppercase;
	color: #78868E;
}

.xlarge .informaltable td p {
	font-family: 'Roboto', sans-serif;
	font-size: 24.5px;
	line-height: 24.5px;
	color: #282F35;
}

.xlarge .table-footnote {
	font-family: 'Roboto', sans-serif;
	font-size: 24.5px;
	line-height: 24.5px;
}

.xlarge dt a.glossterm {
	font-size: 28px;
	color: #0080A3;
	font-weight: bold;
	text-decoration: underline;
	text-decoration-color: #B0DEEA;
	text-decoration-thickness: 2.5px;
	font-style: normal;
}