@font-face {
    font-family: "FontAwesome";
    font-style: normal;
    font-weight: 400;
    src: url("/css/fonts/awesome/fa-solid-900.6.woff") format("woff");
}

.FA {
	font-family: FontAwesome;
}

#ItemOptionBar A {
	font-size: 12px;
	display: inline-block;
	margin: 0 10px 0 10px;
}
#ItemOptionBar A:first-of-type {
	margin-left: 0;
}
#ItemOptionBar A:disabled {
	color: #808080;
}

.RetryButton {
	border: solid 1px #808080;
	background: #C0C5E6;
	border-radius: 4px;
	padding: 5px 12px;
	font-size: 16px;
}

H1 {font-size: 36px; font-weight: bold; margin: 0 0 20px 0;}
H1 .CFlag {
	width: 40px;
	height: 30px;
	margin: 0 10px 0 0;
}

.Wait {
	width: 50px;
	height: 30px;
	background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 135 140' xmlns='http://www.w3.org/2000/svg' fill='%230000c0'%3E%3Crect y='10' width='15' height='120' rx='6'%3E%3Canimate attributeName='height' begin='0.5s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite' /%3E%3Canimate attributeName='y' begin='0.5s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite' /%3E%3C/rect%3E%3Crect x='30' y='10' width='15' height='120' rx='6'%3E%3Canimate attributeName='height' begin='0.25s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite' /%3E%3Canimate attributeName='y' begin='0.25s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite' /%3E%3C/rect%3E%3Crect x='60' width='15' height='140' rx='6'%3E%3Canimate attributeName='height' begin='0s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite' /%3E%3Canimate attributeName='y' begin='0s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite' /%3E%3C/rect%3E%3Crect x='90' y='10' width='15' height='120' rx='6'%3E%3Canimate attributeName='height' begin='0.25s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite' /%3E%3Canimate attributeName='y' begin='0.25s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite' /%3E%3C/rect%3E%3Crect x='120' y='10' width='15' height='120' rx='6'%3E%3Canimate attributeName='height' begin='0.5s' dur='1s' values='120;110;100;90;80;70;60;50;40;140;120' calcMode='linear' repeatCount='indefinite' /%3E%3Canimate attributeName='y' begin='0.5s' dur='1s' values='10;15;20;25;30;35;40;45;50;0;10' calcMode='linear' repeatCount='indefinite' /%3E%3C/rect%3E%3C/svg%3E");
	background-repeat: no-repeat;
}

.ImpactHigh {color: crimson;}
.ImpactMedium {color: orange;}
.ImpactLow {color: #808080;}

.VolatilityMarker.ImpactHigh {background: crimson;}
.VolatilityMarker.ImpactMedium {background: orange;}
.VolatilityMarker.ImpactLow {background: #808080;}

.Bullish {color: #008000; font-weight: bold;}
.Bearish {color: crimson; font-weight: bold;}

.VolatilityMarker {
	display: inline-block;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	margin: 0 10px 0 0;
}


.MetricsBar {
	display: flex;
	max-width: 100%;
	overflow: hidden;
	flex-wrap: wrap;
}

.MetricsBox {display: inline-block; margin: 0 20px 10px 0; text-align: center; min-width: 75px; border: solid 1px #808080; border-radius: 4px; background: #ffffff;}
.MetricsBoxCaption {font-size: 12px; padding: 3px 0 3px 0; border-bottom: solid 1px #808080;}
.MetricsBoxValue {font-size: 16px; padding: 10px 10px 10px 10px; height: 25px; line-height: 25px;}

.MetricsBox.Bullish, .MetricsBox.Bearish {font-weight: bold;}
.MetricsBox.Bullish {background: #E0FFE0;}
.MetricsBox.Bearish {background: #FFE0E0;}


#ForecastHistoryChartContainer {
	width: 500px;
	max-width: 100%;
	height: 200px;
	overflow: hidden;
}

.CandleChartBlock, .SentimentChartBlock {
	width: 500px;
	max-width: 100%;
	height: 230px;
	overflow: hidden;
	display: inline-block;
	margin: 0 40px 20px 0;
}

.CandleChartBlockTitle, .SentimentChartBlockTitle {
	height: 30px;
	line-height: 28px;
	overflow: hidden;
	font-weight: bold;
	text-align: center;
	font-weight: 14px;
}

.CandleChartContainer, .SentimentChartContainer {
	height: 200px;
}

.OccurrenceChartsTitle {
	margin: 30px 0 10px 0;
	font-size: 18px;
	font-weight: bold;
	border-bottom: solid 1px #c0c0c0;
	padding-bottom: 4px;
}

.OccurrenceChartsTitle SELECT {
	font-size: 18px;
}

.PastEventRow {
	display: flex;
	flex-direction: row;
	margin: 4px 0 4px 0;
}

.PastEventDate {
	width: 200px;
	overflow: hidden;
}

.PastEventValue {
	width: 75px;
	text-align: right;
}

.PastEventHeader {
	color: #808080;
	font-size: 12px;
	font-weight: bold;
}


.AboutTable TH, .AboutTable TD {
	text-align: left;
	padding: 3px 0 3px 0;
}

.AboutTable TH {
	padding-right: 20px;
}

.RelatedEventList TD {
	padding: 3px 0 3px 0;
	vertical-align: middle;
}
.RelatedEventList .RelatedCountry {
	padding-right: 20px;
}

.RelatedEventList .RelatedName {
	padding-left: 20px;
}

.RelatedEventList .RelatedFlag {
	padding-right: 5px;
}

.RelatedEventList .RelatedFlag .CFlag {
	width: 20px;
	height: 15px;
}

.HistoricOcccurenceCharts {
	margin: 0 0 0 30px;
}

.PastEventExpanded {
	font-weight: bold;
	cursor: default;
	margin-top: 10px;
}

.PastEventExpanded .PastEventExpand {
	display: none;
}

.PastEventExpand BUTTON {
	margin-right: 5px;
	height: 20px;
	width: 20px;
	background: #f0f0ff;
	border: solid 1px #808080;
	border-radius: 4px;
	cursor: pointer;
}

.HistoricOcccurenceCharts .OccurrenceChartsTitle {
	margin-top: 10px;
}

#TrueRangeHistoryChartContainer {
	width: 500px;
	max-width: 100%;
	height: 200px;
	overflow: hidden;
}

#LiveChart {
	max-width: 100%;
	width: 100%;
	height: 400px;
	border: 0;
	display: block;
}

#lblNextEventCountdown {
	display: inline-block;
	margin-left: 30px;
	border-radius: 4px;
	color: white;
	padding: 3px 10px;
	display: none;
	background: #808080;
}

.ImpactMedium #lblNextEventCountdown{
	background: orange;
}

.ImpactHigh #lblNextEventCountdown{
	background: crimson;
}


#UpdateToActual {
	z-index: 1000;
	position: fixed;
	width: 400px;
	left: calc(50% - 200px);
	height: 300px;
	top: 50px;
	background: #fff3e0;
	border-radius: 4px;
	overflow: hidden;
	padding: 20px;
	border: solid 1px #808080;
	box-sizing: border-box;
	box-shadow: 0 0 10px 3px rgba(128,128,128,0.3);
}

#UpdateToActual_Inner {
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
}

#UpdateToActualSpacer {
	flex-grow: 1;
	flex-shrink: 1;
}

#UpdateToActualExplanation {
	text-align: center;
}

#ActualReleaseContainer {
	font-weight: bold;
}

.ActualBetterThanForecast #ActualReleaseContainer .MetricsBox {
	background: #E0FFE0;
	color: #008000;
}
.ActualWorseThanForecast #ActualReleaseContainer .MetricsBox {
	background: #FFE0E0;
	color: crimson;
}

.ActualBetterThanForecast #UpdateToActualExplanation {
	color: #008000;
	font-weight: bold;
}

.ActualWorseThanForecast #UpdateToActualExplanation {
	color: crimson;
	font-weight: bold;
}

/* Blue button */

.btn-blue, .DialogCancelButton {
	border: 0;
	text-align: center;
	background: linear-gradient(180deg, #84BEF7 0%, #4A82B8 100%);
	display: inline-block;
	
	color: white;
	border-radius: 2px; 
	cursor: pointer;
	text-transform: uppercase;
	font-size: 13px; 
	line-height: 18px; 
	padding: 5px 15px 5px 15px;
}
A.btn-blue {
	text-decoration: none;
}

.btn-blue:hover, .btn-blue:focus, .DialogCancelButton:hover, .DialogCancelButton:focus {
	background: linear-gradient(180deg, #A2DDFF 0%, #61AAF2 100%);
}

.btn-blue:active, .DialogCancelButton:active {
	background: linear-gradient(180deg, #6AB5FF 0%, #376DA1 100%);
}

.btn-blue:disabled, .DialogCancelButton:disabled {
	background: linear-gradient(180deg, #959595 0%, #606060 100%);
	color: white;
}


.ReplayButton {
	border: solid 1px #808080;
	background: #f6edc0;
	font-size: 16px;
	border-radius: 4px;
	padding: 4px 12px;
	width: 150px;
}

.HistoricOcccurenceCharts .ReplayContainer {
	margin-bottom: 30px;
}

.OtherAnnouncementTable TD, .OtherAnnouncementTable TH {
	padding: 3px;
}
.OtherAnnouncementTable TD:first-of-type {
	padding-left: 0;
}

.OtherAnnouncementTable TH {
	font-weight: bold;
	color: #808080;
	font-size: 11px;
}

TH.OAActual, TD.OAActual {
	text-align: right;
	padding-left: 10px;
}
TH.OAPrevious, TD.OAPrevious {
	text-align: right;
	padding-left: 20px;
}

.OAFlag .CFlag {
	width: 24px;
	height: 18px;
}


TD.OAItemName {
	padding-right: 20px;
}

@media screen and (max-width: 500px) {
	.PastEventPrevious {
		display: none;
	}
	.PastEventRevised {
		display: none;
	}

	.OAPrevious, .OAActual {
		display: none;
	}

	.CandleChartBlock, .SentimentChartBlock {
		margin-right: 0;
	}
	
	H1 {
		font-size: 24px;
	}
	
	H2, .StripedPageSection H2 {
		font-size: 20px;
	}
	
	H1 .CFlag {
		width: 32px;
		height: 24px;
		margin: 0 10px 0 0;
	}

	#UpdateToActual {
		z-index: 1000;
		position: fixed;
		width: calc(100% - 20px);
		left: 10px;
		top: 75px;
	}
}

BODY.BarePage {background: white;}
BODY.BarePage .NotBare {display: none !important;}
BODY.BarePage .PageAdUnit {display: none;}

@media screen and (max-width: 900px) {
	BODY.BarePage .StripedPageSectionIndent {
		padding-left: 20px;
		padding-right: 20px;
	}
}