﻿
.scroll-drag
{
	cursor: -webkit-grab;
	cursor: -moz-grab;
	cursor: grab;
	height: 200px;
	overflow: scroll;	// Add scroll bars for all devices otherwise scrolling will be jerky (no-touch will override to hide scroll bars for mouse driven devices).
-ms-scroll-chaining: none;
	background-color: #fff;
}

.scroll-drag:active
{
	cursor: -webkit-grabbing;
	cursor: -moz-grabbing;
	cursor: grabbing;
}

.no-touch .scroll-drag
{
	overflow: hidden; // Hide the scroll bars on mouse driven devices.
}

/* sm */
@media (min-width: 768px)
{
	.scroll-drag
	{
		height: 333px;
	}
}

/* md */
@media (min-width: 992px)
{
	.scroll-drag
	{
		height: 400px;
	}
}

/* lg - small */
@media (min-width: 1200px)
{
	.scroll-drag
	{
		height: 480px;
	}
}

/* lg - big */
@media (min-width: 1300px)
{
	.scroll-drag
	{
		height: 520px;
	}
}

.scroll-img
{
	border: 5px double #fff;
}

.legend
{
	margin-top: 20px;
	padding-bottom: 20px;
}

.legend > h2
{
	margin-bottom: 30px;
}

.legend span
{
	font-size: 16px;
}