/* Clickable Area */
a.clickableArea {
	/* Hide the link text offscreen, so only the background image appears clickable */
	/* NOTE: You must set height and width on your anchor tag, to make this work */
	display: inline-block;	/* inline-block enables area clickable (size of <a> width X height); block - only link text is clickable */
	text-indent: 100%;		/* shove link text out of the containing box (to the right) */
	white-space: nowrap;	/* keep link text from wrapping back into the box */
	overflow: hidden;		/* clipped; hide content outside the element's box */
}

/* Twitter Bootstrap Carousel */
/*
.twitterBootstrapCarousel, .twitterBootstrapCarousel * {
	box-sizing: border-box;
}
*/
/* Prevent the slide from outstretching the container (you do, however, lose the left & right borders) */
.carousel.slide {
    max-width: 868px;	/* max container width (including border) - span9 on large screen */
    min-width: 260px;	/* min container width - iPhone 3G */
    overflow: hidden;
}
/* Carousel Inner */
.twitterBootstrapCarousel .carousel-inner {
	/* Carousel Border - Maroon outer bevel */
	border-style: outset;
	border-color: #801D38;
	border-width: 3px;

	/* Rounded corners for the carousel and each slide */
	border-radius: 12px;
	background-color: transparent;	/* #FF0000 #CFA23E;	#294256;	TODO: pick a color from our pallette */

	/* Dynamically center the slide */
	width: 858px;		/* max visible slide area = max container width - left & right border widths */
	left: 50%;
	margin-left: -432px; /* -(carousel.slide max-width)/2 */
}
/* Carousel Inner (the slide; excludes indicators and controls) */
.twitterBootstrapCarousel .item {
	border-radius: 6px;
    text-align: center;
    z-index: 10;		/* beneath carousel controls & indicators */
}

/* Carousel indicators (slide navigation dots) */

/* Place indicators middle bottom */
/* Styles manually applied from bootstrap 3.2.3 */
.twitterBootstrapCarousel .carousel-indicators {
	/* display: inline-block; */
	text-align: center;
	width: 60%;
	/* override bootstrap top-right alignment */
	top: inherit;	/* override bootstrap top alignment */
	right: inherit;	/* override bootstrap right alignment */
	bottom: 0em;	/* place at the bottom with a small margin */
	/* the combination of left and margin-left centers the icons  */
	left: 50%;			/* start the ul at the 50% mark */
	margin-left: -30%;	/* then scoot it left by 30% */
	line-height: 4em;	/* some breathing room */
	z-index: 100;		/* interactive - need to be on top of the carousel-caption */
}
.twitterBootstrapCarousel .carousel-indicators li {
	display: inline-block;	/* keep indicators from stacking */
	float: none;			/* override bootstrap - keep indicators from floating left */
}
/* End: Place indicators middle bottom */
/* End: Carousel indicators */

/* Carousel Control (prev & next arrows) */
/* (styles manually applied from bootstrap 3.2.3) */
.twitterBootstrapCarousel .carousel-control {
	opacity: 0.5;
	background: transparent;	/* my overrides; bootstrap default = #222222; */
	border: 0;					/* override bootstrap default of 3px solid #ffffff */
	/* override bootstrap default of 40x40 to accommodate font-awesome instead of bootstrap glyphicon */
	width: 60px;
	height: 60px;
	border-radius: 30px;	/* bootstrap default = 23px */
    z-index: 100;	 		/* prev & next controls on top */
}
.carousel-control:hover {
	opacity: 0.75;
	background: #222222;
}
/* End: Carousel Control */

/* Slide Headline */
.twitterBootstrapCarousel .carousel-slide-heading {
	opacity: 0.75;
	text-indent: 0;
	text-align: left;
	padding: 0.75em 75% 0.75em 1em;
	padding: 0.75em 35% 0.75em 35%;

	position: absolute;
	right: 0;	/* 65%; */
	top: 0;
	left: 0;
	z-index: 10;
	/* border-radius: 12px; */
	color: #ffffff;
	font-style: oblique;
	text-align: center;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
	/* background: rgba(0, 0, 0, 0.33) */
	font-size: 1.8em;

background: -webkit-linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0.75)); /* For Firefox 3.6 to 15 */
background: radial-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0) 10); /* Standard syntax */
background: linear-gradient(to right, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0)); /* For Firefox 3.6 to 15 */
background: linear-gradient(rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0) 90%); /* For Firefox 3.6 to 15 */
}
.twitterBootstrapCarousel h2.carousel-slide-heading {	/* must be specific to override h2 in main */
	margin: 0;
}
/* END: Slide Headline */

/* Slide Caption (Subheadline & Summary) */

.twitterBootstrapCarousel .carousel-caption {
box-sizing: border-box;
	position: absolute;
	/* right: 15%; */
	bottom: 0;
	/* left: 15%; */
/* width: 100%; */
line-height: 1.3em;
	z-index: 10;
	padding: 6px 0 30px 0;	/* padding-bottom is enough to include the carousel indicators */
	/* border-radius: 12px; */
	color: #ffffff;
	text-align: center;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
	/* background: rgba(0, 0, 0, 0.33); */
background: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75)); /* For Safari 5.1 to 6.0 */
background: -o-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75)); /* For Opera 11.1 to 12.0 */
background: -moz-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75)); /* For Firefox 3.6 to 15 */
background: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.75)); /* Standard syntax */

	/* Dynamically center the slide */
	position: absolute;
	width: 860px;		/* max slide width */
	left: 50%;
	margin-left: -430px;
	/* so text will resize with container */
	padding-left: 25%;
	padding-right: 25%;
}

.twitterBootstrapCarousel .carousel-caption h3 {
	text-align: center;
}

/* Slide Subheadline */
.twitterBootstrapCarousel .carousel-slide-subheadline {
	margin: 1em 0 0.5em 0;
	color: #ffffff;
	opacity: 0.75;
	font-style: oblique;
	text-align: center;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
/* END: Slide Subheadline */

/* Slide Summary */
.twitterBootstrapCarousel .carousel-slide-summary {
	margin: 1em 6em 0.5em 6em;
	color: #ffffff;
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
}
/* END: Slide Summary */

/* END: Slide Caption (Subheadline & Summary) */


/* Tool tip (Photo by) */

/* Full-Slide Clickable - Make as much of the slide clickable as possible */
/* NOTE: You must set height & width on <a> to make this work */
/* (The xlst generates inline styles using carousel height & width properties) */
.twitterBootstrapCarousel a.clickableArea {
	z-index: 50;			/* beneath carousel controls & indicators, above image & all text */
}

/* Image Attribution */
.twitterBootstrapCarousel div.imageAttributionTeaser {

	color: #ffffff;
	background: rgba(0, 0, 0, 0.33);
	text-shadow: 0 1px 2px rgba(0,0,0,.6);
	opacity: 0.75;
	padding: .75em;
	border-radius: 6px;
	z-index: 10;

	position: absolute;
	top: 4%;
	right: 1%;
	left:60%;
	text-align: left;
	text-indent: 0;
}

/* Advanced Tooltip anchor Not Hovering */
.twitterBootstrapCarousel div.imageAttribution {
	display: block;
		position: absolute;
		top: 0;
		left: 0;
		height: 100%; width: 400%; 
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	text-decoration: none;
}
/* Advanced Tooltip anchor Hover */
.twitterBootstrapCarousel div.imageAttribution:hover
{
	display: inline-block;
	color: #ffffff;
	opacity: 0.75;
	text-indent: 0;
	text-align: right;
	padding: 1.5em 2em;
}
/* Advanced Tooltip span Not Hovering */
.twitterBootstrapCarousel div.imageAttribution span.imageAttributionTooltip {	
	display: none;
	color: #fff;
	background: rgba(51,51,51,0.75);
	padding: 1em;
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	width: 20%;			/* Note: doesn't adjust with different text */
	position: absolute;
	text-align: right;
	z-index: 10;
}
/* Advanced Tooltip span Hover */
.twitterBootstrapCarousel div.imageAttribution:hover span.imageAttributionTooltip {
	display: inline-block;
}

/* End: Tool tip */

/* Carousel Print behavior */
/* Print image in place of carousel */
@media print {
    .twitterBootstrapCarousel {
        display: none;
    }
    .twitterBootstrapCarousel:after {
        content: url(/media/797582/Capitol-Buidling-from-Rotunda-435x870.jpg);
    }
}
/* End: Carousel Print behavior */

/* End: Twitter Bootstrap Carousel */




/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */