﻿/*for indicator info box*/

.indicator-info {
	width: 100%;
	padding-top: 18px;
	margin-bottom: 50px;
}

	.indicator-info > p,
	.indicator-info > div {
		margin-top: 0;
		margin-bottom: 6px;
	}

	.indicator-info .export-links-label {
		margin-right: 9px;
	}

	.indicator-info .tag-container {
		margin-right: 2px;
		margin-bottom: 2px;
		display: inline-block;
	}

	.indicator-info .indicator-info-collapsible {
		position: relative;
		margin-top: 10px;
	}

		.indicator-info .indicator-info-collapsible span {
			cursor: pointer;
			padding-right: 20px;
		}

			.indicator-info .indicator-info-collapsible span:hover {
				color: #288ECD;
			}

			.indicator-info .indicator-info-collapsible span span:after {
				content: '';
				border-top: 5px solid transparent;
				border-bottom: 5px solid #121212;
				border-left: 5px solid transparent;
				border-right: 5px solid transparent;
				position: absolute;
				margin-left: 3px;
			}

			.indicator-info .indicator-info-collapsible span:hover span:after {
				border-bottom-color: #288ECD;
			}

		.indicator-info .indicator-info-collapsible.indicator-info-collapsed span span:after {
			border-top: 5px solid #121212;
			border-bottom: 5px solid transparent;
			margin-top: 7px;
		}

		.indicator-info .indicator-info-collapsible.indicator-info-collapsed span:hover span:after {
			border-top-color: #288ECD;
		}

		.indicator-info .indicator-info-collapsible.indicator-info-collapsed ul {
			display: none;
		}

	.indicator-info ul {
		margin: 6px 0;
		padding-left: 20px;
	}

	.indicator-info .indicator-info-hfa-link {
		margin-top: 20px;
	}

		.indicator-info .indicator-info-hfa-link a {
			display: inline-block;
			background-color: #00558F;
			border: none;
			font-weight: 400;
			font-size: 18px;
			color: #ffffff;
			padding: 1px 8px;
			line-height: 36px;
			width: 100%;
			text-align: center;
		}

			.indicator-info .indicator-info-hfa-link a:visited {
				color: #ffffff;
			}

			.indicator-info .indicator-info-hfa-link a:hover {
				background-color: #00497A;
			}

		.indicator-info .indicator-info-hfa-link p {
			font-size: 12px;
			color: rgb(136, 143, 149);
		}


@media (min-width: 701px) {
	.indicator-info {
		border: 1px solid rgb(210, 216, 221);
		-moz-box-shadow: 0 2px 3.68px 0.32px rgba(0, 0, 0, 0.08);
		-webkit-box-shadow: 0 2px 3.68px 0.32px rgba(0, 0, 0, 0.08);
		box-shadow: 0 2px 3.68px 0.32px rgba(0, 0, 0, 0.08);
		padding: 18px 22px 30px 22px;
	}
}

@media (min-width: 700px) and (max-width: 800px) {

	.indicator-info .indicator-info-hfa-link a {
		font-size: 16px;
	}
}

@media (min-width: 750px) and (max-width: 800px) {

	.indicator-info .export-link {
		padding: 6px 14px 5px 10px;
	}
}

@media (min-width: 700px) and (max-width: 750px) {

	.indicator-info .export-link {
		padding: 6px 6px 5px 4px;
		margin-right: 4px;
		font-size: 12px;
	}
}
