@semi-opaque-fallback:		#464646;
@semi-opaque:				rgba(0,0,0,0.75);
@semi-opaque-fallback-fade:	#686868;
@semi-opaque-fade:			rgba(0,0,0,0.35);
@white-fallback:			#ffffff;
@white:						rgba(255,255,255,1);
@white-fallback-fade:		#cdcdcd;
@white-fade:				rgba(255,255,255,0.7);

.mediumTransition {
	-moz-transition-duration:0.3s;
	-webkit-transition-duration:0.3s;
	-o-transition-duration:0.3s;
	-ms-transition-duration:0.3s;
	transition-duration:0.3s;
}

.slowTransition {
	-moz-transition-duration:0.6s;
	-webkit-transition-duration:0.6s;
	transition-duration:0.6s;
}

.bu-slideshow-container {
	overflow:hidden;
	position:relative;
	min-height: 100px;

	.slideshow-loader{

		display: none;
		position: absolute;
		margin:-40px;
		top:50%;
		left:50%;
		height: 80px;
		color: #CC0000;
		text-align: center;

		.loader-animation {
			margin:auto;
			display: inline-block;
			width: 30px;
			height: 30px;
			border: 8px solid #CC0000;
			border-right-color: transparent !important;
			border-radius: 50%;
			-webkit-animation: spin .8s linear infinite;
			-moz-animation: spin .8s linear infinite;
			-ms-animation: spin .8s linear infinite;
			-o-animation: spin .8s linear infinite;
			animation: spin .8s linear infinite;
			// box-shadow: 0 0 25px 2px #eee;
		}

		&.active {
			display: block;
		}

		p {
			display: none;
			padding: 10px;
		}

		@-webkit-keyframes spin {
			from { -webkit-transform: rotate(0deg); opacity: 0.4; }
			50%  { -webkit-transform: rotate(180deg); opacity: 1; }
			to   { -webkit-transform: rotate(360deg); opacity: 0.4; }
		}

		@-moz-keyframes spin {
			from { -moz-transform: rotate(0deg); opacity: 0.4; }
			50%  { -moz-transform: rotate(180deg); opacity: 1; }
			to   { -moz-transform: rotate(360deg); opacity: 0.4; }
		}

		@-ms-keyframes spin {
			from { -ms-transform: rotate(0deg); opacity: 0.4; }
			50%  { -ms-transform: rotate(180deg); opacity: 1; }
			to   { -ms-transform: rotate(360deg); opacity: 0.4; }
		}

		@-o-keyframes spin {
			from { -o-transform: rotate(0deg); opacity: 0.4; }
			50%  { -o-transform: rotate(180deg); opacity: 1; }
			to   { -o-transform: rotate(360deg); opacity: 0.4; }
		}

		@keyframes spin {
			from { transform: rotate(0deg); opacity: 0.2; }
			50%  { transform: rotate(180deg); opacity: 1; }
			to   { transform: rotate(360deg); opacity: 0.2; }
		}
	}

	.arrowBgStyles {
		background-color:transparent;

		cursor:pointer;
		display:block;
		height: 4em;
		line-height:normal;
		min-width:2.2em;
		position: absolute;
		top:50%;
		width: 5%;
		z-index:1000;
		.slowTransition;

		&:hover, &:active {
			.slowTransition;

			background-color:@semi-opaque-fallback;
			background-color:@semi-opaque;
			-moz-transition-property:background-color;
			-webkit-transition-property:background-color;
			transition-property:background-color;
		}
	}

	.arrowStyles {
		border-style: solid;
		border-width: 0.75em;
		border-top-color:transparent;
		border-bottom-color:transparent;
		content: "";
		height: 0;
		position: absolute;
		top: 1.4em;
		width: 0;
	}

	.bu-slideshow-arrow-left {
		.arrowBgStyles;

		border-right-color:@semi-opaque-fallback-fade;
		border-right-color:@semi-opaque-fade;
		border-radius: 0 4px 4px 0;
		left:0;
		-moz-transition-property:border-right-color;
		-webkit-transition-property:border-right-color;
		transition-property:border-right-color;

		&:hover {
			border-right-color:@white-fallback-fade;
			border-right-color:@white-fade;
		}

		&:after {
			.arrowStyles;

			border-left-color:transparent;
			border-right-color:inherit;
			right:1em;
		}
	}

	.bu-slideshow-arrow-right {
		.arrowBgStyles;

		border-left-color:@semi-opaque-fallback-fade;
		border-left-color:@semi-opaque-fade;
		border-radius: 4px 0 0 4px;
		right:0;
		-moz-transition-property:border-left-color;
		-webkit-transition-property:border-left-color;
		transition-property:border-left-color;

		&:hover {
			border-left-color:@white-fallback-fade;
			border-left-color:@white-fade;
		}

		&:after {
			.arrowStyles;

			border-left-color:inherit;
			border-right-color:transparent;
			left: 1em;
		}
	}

	.bu-slideshow-slides {

		.bu-slideshow {
			width:100% !important;
			height:auto;
			list-style:none !important;
			margin:0;
			padding:0;
			position:relative !important;
			background: none !important;

			li {
				left: 0; // flexi indents lists with left positioning.
				list-style-type: none !important;
				margin-left: 0;
				margin-right: 0;
				width:100% !important;
				height:auto;
				background: none;
				padding:0;

				// these styles are the base values from which animate-in values animate
				.bu-slide-container {
					height:auto;
					width:100%;

					img {
						max-width: 100%;
						display:inline;
					}

					.bu-slide-caption {
						background:@semi-opaque-fallback;
						background:@semi-opaque;
						bottom: 20%;
						display:inline;
						list-style:none;
						margin:0;
						padding: 1%;
						position:absolute;
						right: 6%;
						width:35%;
						z-index:12;

						p {
							color:#ffffff;
							font-size:1em;
							line-height:1.4;
						}

						a {
							color:#bcbcbc;
							text-decoration:none;

							&:hover {
								text-decoration:underline;
							}
						}

						.bu-slide-caption-title {
							font-size: 1.3em;
							font-family: 'Helvetica','Arial',sans-serif;
							color:#bcbcbc;
							margin-bottom: .5em;
							padding: 0;
						}

						.bu-slide-caption-text {
							font-size: .85em;
							margin: 0;
						}
					}
					.caption-bottom-right{
						bottom: 15%;
						right: 6%;
					}
					.caption-bottom-center {
					  top: auto;
					  bottom: 15%;
					  margin: 0 auto;
					  left:50%;
					  margin-left:-19%;
					  text-align:center;
					}
					.caption-bottom-left{
						bottom: 15%;
						left: 6%;
					}
					.caption-top-left{
						top: 15%;
						left: 6%;
						bottom:auto;
					}
					.caption-top-center {
					  top: 15%;
					  bottom: auto;
					  margin: 0 auto;
					  left:50%;
					  margin-left:-19%;
					  text-align:center;
					}
					.caption-top-right{
						top: 15%;
						right: 6%;
						bottom:auto;
					}
				}
			}
		}

		.animate-slide-default {
			left:100%;
			position:absolute;
			-webkit-transition-duration: 1s;
			-moz-transition-duration: 1s;
			-o-transition-duration: 1s;
			-ms-transition-duration: 1s;
			transition-duration: 1s;
		}

		.animate-slide-in {
			left:0;
			-webkit-transition-duration: 1s;
			-moz-transition-duration: 1s;
			-o-transition-duration: 1s;
			-ms-transition-duration: 1s;
			transition-duration: 1s;
		}

		.animate-slide-out {
			left:-100%;
			-webkit-transition-duration: 1s;
			-moz-transition-duration: 1s;
			-o-transition-duration: 1s;
			-ms-transition-duration: 1s;
			transition-duration: 1s;
		}

		.animate-fade-default {
			opacity:0;
			position:absolute;
			-webkit-transition-duration: 1.5s;
			-moz-transition-duration: 1.5s;
			-o-transition-duration: 1.5s;
			-ms-transition-duration: 1.5s;
			transition-duration: 1.5s;
		}

		.animate-fade-in {
			opacity:1.0;
			-webkit-transition-duration: 1.5s;
			-moz-transition-duration: 1.5s;
			-o-transition-duration: 1.5s;
			-ms-transition-duration: 1.5s;
			transition-duration: 1.5s;
		}

		.animate-fade-out {
			opacity:0;
			-webkit-transition-duration: 1.5s;
			-moz-transition-duration: 1.5s;
			-o-transition-duration: 1.5s;
			-ms-transition-duration: 1.5s;
			transition-duration: 1.5s;
		}

		.transition-slide {

			.bu-slide-container {
				.animate-slide-default;
			}

			.animate-in {

				.bu-slide-container {
					.animate-slide-in;
				}

			}

			.animate-out {

				.bu-slide-container {
					.animate-slide-out;
				}

			}

		}

		.transition-fade {

			.bu-slide-container {
				.animate-fade-default;
			}

			.animate-in {

				.bu-slide-container {
					.animate-fade-in;
				}

			}

			.animate-out {

				.bu-slide-container {
					.animate-fade-out;
				}

			}
		}
	}

	.bu-slideshow-navigation-container {

		display: none;

		.bu-slideshow-navigation {
			bottom:1em;
			left:0;
			list-style:none;
			margin:0;
			padding:0;
			position:absolute;
			text-align:center;
			width:100%;
			z-index:13;

			li {
				display:inline;
				left:0; // flexi indents lists with left positioning, so.
				margin:0; // make sure theme list styles don't accidentally separate
				background:none !important;
			}

		}

		.nav-icon {

			li {

				a {
					display:inline-block;
					text-indent:-9999em;
					border-radius:50%;
					padding:2px;
					background: @white-fallback-fade;
					background: @white-fade;
					border:3px solid;
					border-color: @semi-opaque-fallback-fade;
					border-color: @semi-opaque-fade;
					height:0.8em;
					width:0.8em;

					span {
						display:block;
						height:100%;
						width:100%;
						border-radius:50%;
						.mediumTransition;
					}

					&:hover span, &:active span, &.active span {
						background-color: @semi-opaque-fallback-fade;
						background-color: @semi-opaque-fade;
						-moz-transition-property:background-color;
						-webkit-transition-property:background-color;
						transition-property:background-color;
						.mediumTransition;
					}

				}
			}
		}

		.nav-number {

			li {
				list-style-type: none;
				margin-left: 0.3em;

				a {
					background-color: @semi-opaque-fallback-fade;
					background-color: @semi-opaque-fade;
					color: @white-fallback-fade;
					color: @white-fade;
					display:inline-block;
					font-size:0.9em;
					line-height: normal;
					opacity:0.75;
					padding:.5em .7em .25em;
					text-decoration:none;
					.mediumTransition;

					&:hover, &.active {
						background-color:@semi-opaque-fallback;
						background-color:@semi-opaque;
						color: @white-fallback;
						color: @white;
						opacity: 1;
						-moz-transition-property:background-color color opacity;
						-webkit-transition-property:background-color color opacity;
						transition-property:background-color color opacity;
						.mediumTransition;
					}
				}
			}
		}

	}

}

// make left/right arrows obvious on touchscreens
html.touch .bu-slideshow-arrow-left,
html.touch .bu-slideshow-arrow-right {
	background-color:@semi-opaque-fallback;
	background-color:@semi-opaque;
}

html.touch .bu-slideshow-arrow-left {
	border-right-color:@white-fallback-fade;
	border-right-color:@white-fade;
}

html.touch .bu-slideshow-arrow-right {
	border-left-color:@white-fallback-fade;
	border-left-color:@white-fade;
}

// for BU's Content Banner
.banner-container {

	.bu-slideshow-slides {

		.bu-slideshow {

			li.slide {

				.bu-slide-container {

					.bu-slide-caption {

						.bu-slide-caption-title {
							font-size: 14.4px;
						}

						.bu-slide-caption-text {
							font-size: 12px;
						}

					}

				}

			}

		}

	}

}

// ie7 hacks
*+html {

	.bu-slideshow-navigation-container {

		.nav-icon {

			li {

				a {
					display:block;
					float:left;
					margin-right: 0.6em;
				}

			}

		}

		.nav-number {

			li {

				a {
					color: @white-fallback-fade;
				}

			}

		}

	}

	.bu-slideshow-arrow-right {

		background: url("../img/arrows.png") no-repeat scroll 0 6px transparent;

		&:hover {
			background: url("../img/arrows.png") no-repeat scroll 0 -24px transparent;
		}

	}

	.bu-slideshow-arrow-left {

		background: url("../img/arrows.png") no-repeat scroll -100px 6px transparent;

		&:hover {
			background: url("../img/arrows.png") no-repeat scroll -100px -24px transparent;
		}

	}

}