/* Tooltip
-----------*/

	i[data-tooltip='1'],
	span[data-tooltip='1'],
	div[data-tooltip='1'] {
		cursor: default;
	}

	.tooltip {
		display: none;
		position: fixed;
		background-color: #2c3237;
		border-radius: 5px;
		color: #FFFFFF;
		padding: 10px 20px;
		line-height: 20px;
		cursor: default;
		font-weight: 300;
		margin-right: 20px;
		max-width: 400px;
		font-size: 14px;
		-webkit-box-shadow: 0px 0px 13px 1px rgba(0,0,0,0.75);
		-moz-box-shadow: 0px 0px 13px 1px rgba(0,0,0,0.75);
		box-shadow: 0px 0px 13px 1px rgba(0,0,0,0.75);
	}

	.tooltip.arrow-top:after {
		content: '';
		display: block;
		position: absolute;
		height: 20px;
		width: 20px;
		top: -20px;
		border: 5px solid #2c3237;
		border-top-color: transparent;
		border-right-color: transparent;
		border-bottom-color: #2c3237;
		border-left-color: transparent;
	}



	.tooltip.top-left:after {
		content: '';
		display: block;
		position: absolute;
		height: 15px;
		width: 15px;
		background-color: #2c3237;
		top: 10px;
		left: 0;
		transform: rotate(45deg);
		transform-origin: top left;
	}

	.tooltip.blue,
	.tooltip.blue:after {
		background-color: #009cdf;
	}

	.tooltip * {
		color: #FFFFFF;
		font-weight: 300;
	}