@charset "UTF-8";


/*----------------------------*/

.clearout { clear: both; font-size: 0; line-height: 0; margin: 0px; padding: 0px; }

.spacer { position: relative; margin: 0px; padding: 0px; width: 0px; height: 0px; }

#slideshowbox {}


/*******************  hp slideshow  ******************/

#slideshow { position:relative; width: 100%; max-width: 1300px; top: 40px; margin: 0px auto 0px auto; padding: 0px; overflow:hidden; display: block; background-color: #333333; }

#slideshow #slideshell { max-height: 450px; width: 100%; 
	position: relative; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; vertical-align: bottom; }

#slideshow #slideshell>.slide { position: absolute; vertical-align: bottom; 
	bottom: 0px; left: 0px; width: 100%; height: auto; max-height: 450px; padding: 0px 0px 0px 0px; overflow: hidden; display: block; z-index: 9; visibility: visible; }

#slideshow #slideshell>.slide>.ss_image { position: relative; width: 100%; max-height: 450px; overflow: hidden; padding: 0px; float: left;background-position: right top; background-size: 100%; background-repeat: no-repeat; }

#slideshow #slideshell>.slide>.ss_image img { width: 100%; height: auto; padding: 0px; margin: 0px; border: none; visibility: hidden;}

div.slide.active { z-index: 10; display: block;}

#slideshow .morelink { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 1em; line-height: 1em; color: #FFFFFF; font-weight: bold; text-transform: uppercase; text-decoration: none; white-space: nowrap; }

#slideshow .morelink a:hover, #slideshow .morelink a:active { color: #FFF; }

/*#slideshow #slideshell div.ss_content { position: absolute; width: 30%; right: 0px; bottom: 0px; margin: 0px 0px 0px 0px; padding: 30px; text-align: left; overflow: hidden; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 18px; line-height: 1.5em; color: #FFFFFF; font-weight: lighter; border: none; background: url(https://www.bard.edu/images/tints/80black.png) repeat; z-index: 30; }*/

#slideshow #slideshell div.ss_content  { position:absolute; min-height: 150px; left: 0%; top: 40%; width: 100%; font-size: 1.2em; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-weight: 500;margin: 0 auto 0 auto; padding: 0px; text-align: center; color:#ffffff; z-index: 50; }

#slideshow #slideshell div.ss_content .ss_text  { display: block; margin: 0 auto 10px auto; width: 80%; text-shadow: 2px 2px 2px #000;}

#slideshow #slideshell div.ss_content .ctabutton  { font-size: 0.8em; letter-spacing: 3px; margin: 20px auto; padding: 1% 2%; text-align: center; color:#ffffff; background: #ad1a1f; z-index: 50; text-shadow: none; }
#slideshow #slideshell div.ss_content .ctabutton a:active,
#slideshow #slideshell div.ss_content .ctabutton a:hover { color: #FFF; text-decoration: underline; }

#slideshow #slideshell .title { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 1.9em; color: #FFFFFF; font-weight: 100; line-height: 1.2em; letter-spacing: 0px; margin: 0px 0px 5px 0px; padding: 0px 0px 0px 0px; text-shadow: 2px 2px 2px #000; }

#slideshow #slideshell div.ss_image .ss_caption,
#slideshow #slideshell div.ss_content .ss_caption { margin: 20px 0px 0px 0px; overflow: hidden; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 11.5px; font-style: italic; line-height: 12px; text-align: left; color: #FFFFFF;}

#slideshow #slideshell h3,



#slideshow #slidenav { position: absolute; width: 300px; bottom: 20px; left: 87px; z-index: 100; }
#slideshow #slidenav a.ss_button { display: block; width: 38px; height: 32px; padding: 2px 0 0 0; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 24px; line-height: 1em; font-weight: bolder; color: #FFFFFF; text-align: center; text-decoration: none; outline: none; border-width: 1px 1px 1px 1px; border-color: #FFFFFF; border-style: solid; background: none; }
#slideshow #slidenav a.ss_button:visited { color: #FFFFFF; }
#slideshow #slidenav a.ss_button:hover,
#slideshow #slidenav a.ss_button:active { color: #FFF; }
#slideshow #slidenav a.back{ float: left; }
#slideshow #slidenav a.fwd { float: left; margin-right: 12px; border-width: 1px 1px 1px 0px; }

#slideshow #slidenav ul { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style-type: none; }
#slideshow #slidenav ul li { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 0; line-height: 0; text-indent: -9999px; color: #FFFFFF; text-align: center; width: 13px; height: 13px; margin: 10px 10px 5px 0px; float: left; }
#slideshow #slidenav ul li a { display: block; width: 13px; height: 13px; color: #FFFFFF; text-decoration: none; outline: none; padding: 0px; background-repeat: no-repeat; background-position: left top; }
#slideshow #slidenav ul li a:visited { color: #FFFFFF; text-decoration: none; }
#slideshow #slidenav ul li a:active { color: #FFFFFF; text-decoration: none; }
#slideshow #slidenav ul li a:hover { color: #FFFFFF; text-decoration: none; }
#slideshow #slidenav ul li a.default { background-image: url(../images/nav_circle1.png); }
#slideshow #slidenav ul li a.selected { background-image: url(../images/nav_circle2.png); }
#slideshow #slidenav ul li a:hover { background-image: url(../images/nav_circle3.png); }

#slideshow #slidenav ul li a.selected:hover { background-image: url(../images/nav_circle2.png); }

#slideshow #slidenav {display:none;}

/*------- SCROLLER -----------*/
#slideshow div.scroller { position: relative; position: absolute; width: 426px; right: 0px; top: 0px; z-index: 99; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; }
#slideshow .scrollshell { /*clear: both;*/}
/*#slideshow div.scroller > div.scrollshell { opacity: .5; -moz-opacity: .5; -khtml-opacity: .5; filter: alpha(opacity=50); }
#slideshow div.scroller > div.scrollshell:hover { opacity: 1; -moz-opacity: 1; -khtml-opacity: 1; filter: alpha(opacity=100); }*/
#slideshow .scrollarea { position: relative; width: 426px; height: 555px; margin: 0px 0px 0px 0px; padding: 15px 0px 0px 0px; border-width: 0px 0 0px 0px; border-color: #FFFFFF; border-style: solid; /*float: left;*/ /*background-color: #49453c; background-repeat: repeat; background-position: left top; background-image: url(../images/bg_layer_dark.png);*/}
#slideshow .scrollsubshell { position: absolute; left: 0px; width: 426px; height: 570px; overflow: hidden; }
#slideshow .scroll { position: absolute; left: 0px; top: 0px; width: 426px; height: 20000px; overflow: hidden; }
#slideshow .scrollsection { float: none; clear: both; }
#slideshow ul.scrollitems { margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; list-style-type: none; }
#slideshow ul.scrollitems li { display: block; width: 198px; height: 124px; font-size: 0; line-height: 0; /*text-indent: -9999px;*/
	margin: 0px 15px 15px 0px; padding: 0px; border-width: 0 0 0px 0; border-color: #FFFFFF; border-style: solid; float: left; }
#slideshow ul.scrollitems li a,
#slideshow ul.scrollitems li a.default { display: block; width: 198px; height: 124px; font-size: 0; line-height: 0; /*text-indent: -9999px;*/
	outline: none; margin: 0px 0px 0px 0px; padding: 0px; border: none; /*float: left;*/
	overflow: hidden; }
#slideshow ul.scrollitems li a:hover,
#slideshow ul.scrollitems li a.selected { width: 194px; height: 120px; border-width: 2px 2px 2px 2px; border-color: #FFF; border-style: solid; }
#slideshow ul.scrollitems li a img,
#slideshow ul.scrollitems li a.default img { width: 198px; height: auto; margin: 0px 0px 0px 0px; padding: 0px; border: none; }
#slideshow ul.scrollitems li a:hover img,
#slideshow ul.scrollitems li a.selected img { margin: -2px 0px 0px -2px; }
#slideshow .scrollback { position: absolute; top: 0px; left: 0px; width: 442px; height: 12px; /*background-image: url(../images/scrollbar_bg.jpg); background-repeat: repeat-y; background-position: right top;*/
	background-image: url(../images/scrollbar_up.jpg); background-repeat: no-repeat; background-position: center center; }
#slideshow .scrollback a { /*background-image: url(../images/arrow_back_n.png);*/}
#slideshow .scrollback a:hover { /*background-image: url(../images/arrow_back_u.png);*/}
#slideshow .scrollfwd { position: absolute; bottom: 0px; left: 0px; width: 442px; height: 12px; /*background-image: url(../images/scrollbar_bg.jpg); background-repeat: repeat-y; background-position: left top;*/
	background-image: url(../images/scrollbar_down.jpg); background-repeat: no-repeat; background-position: center center; }
#slideshow .scrollback, .scrollfwd { visibility: hidden; z-index: 15; opacity: 0; -moz-opacity: 0; -khtml-opacity: 0; filter: alpha(opacity=0); }
#slideshow .scrollfwd a { /*background-image: url(../images/arrow_fwd_n.png);*/}
#slideshow .scrollfwd a:hover { /*background-image: url(../images/arrow_fwd_u.png);*/}
#slideshow .scrollback a, .scrollfwd a { display: block; width: 442px; height: 15px; font-size: 0; line-height: 0; text-indent: -9999px; outline: none; margin: 0px 0px 0px 0px; padding: 0px; background-repeat: no-repeat; background-position: left top; }
#slideshow #scrollernav { font-weight: bold; text-align: right; }





/* ------------------------ responsive styles ------------------------ */

@media screen and (max-width: 1370px) {

	#slideshow #slideshell div.ss_image { 	max-width: 100%; }
	#slideshow #slideshell div.ss_image img { 	width: auto; }
	#slideshow #slideshell div.ss_image img { 	height: auto; width: 100%; }

}



/* --------------------------------------------  STYLES ------------------------------------ */
@media screen and (max-width: 3000px) {


	
}



/* --------------------------------------------  STYLES ------------------------------------ */
@media screen and (max-width: 950px) {  }

	#slideshow {top: 0px;}
}



/* -------------------------------------------- TABLET  STYLES ------------------------------------ */
@media screen and (max-width: 768px) {

	#slideshell { 	margin: 0px 0px 0px 0px; }

	#slideshow {top: 0px;}
	
	#slideshow #slideshell div.ss_image img { 	height: auto; width: 100%; }

	#slideshow #slideshell h3 { 	font-size: 20px; }

	#slideshow div.scroller { 	display: none; }

}

/* -------------------------------------------- MOBILE ONLY  STYLES ------------------------------------ */
@media screen and (max-width: 565px) { 
	
	#slideshowbox { }
	#slideshowbox { position: relative; top: 0px; height: auto !important; overflow: visible; margin: 0 0 0 0; display: block; }
	
	#slideshow { position:relative; width: 100%; top: 0px; height: auto !important; margin: 0px; padding: 0px; }
	
	
	#slideshow #slideshell { height: 300px; max-height: 300px; width: 100%; position: relative; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; vertical-align: bottom; }

	#slideshow #slideshell .slide { position: absolute; top: 0px; left: 0px; width: 100%; height: auto !important; max-height: 320px; padding: 0px; margin: 0; overflow: visible; display: block; z-index: 9; visibility: visible;background: #FFF; height: auto;  }
	
	#slideshow #slideshell .slide div.ss_image { width: 100%; height: auto; padding: 0px; margin: 0; overflow: visible; max-height: 300px; }
	
	#slideshow #slideshell .slide div.ss_content { position: absolute; top: 120px; width: 96%; height: auto !important; right: 0px; bottom: 0; margin: 0px; padding: 2%; text-align: center; overflow: visible; font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 18px; line-height: 1.5em; color: #222; font-weight: lighter; border: none; background:#FFF; z-index: 30; }
	
	#slideshow #slideshell .slide div.ss_content .title { font-size: 20px; line-height: 1.2em; color: #222; padding: 1%; font-weight: 800; }

	#slideshow #slideshell div.ss_content .ss_text  { display: block; color: #222; margin: 0 auto 0px auto; text-shadow: none; font-size: 0.9em;}
	
	#slideshow #slideshell div.ss_content a.morelink {	width: auto; font-size: .7em; line-height: .7em; text-align: left; display: inline; float:left; color: #FFF; }
	
	#slideshow #slideshell div.ss_content a.morelink:hover { color: #FFF; }
	
	#slideshow #slideshell div.ss_content .ctabutton  { font-size: 1.0em; letter-spacing: 3px; margin: 0px auto; padding: 1% 2%; text-align: center; color:#ffffff; background: #ad1a1f; z-index: 50; text-shadow: none; }

	#slideshow #slideshell .title { font-family: "Source Sans Pro", "SourceSans", Helvetica, Arial, sans-serif; font-size: 1.9em; color: #FFFFFF; font-weight: 100; line-height: 1.2em; letter-spacing: 0px; margin: 0px 0px 5px 0px; padding: 0px 0px 0px 0px; text-shadow: none; }

	#slideshow #slidenav a.ss_button {	width: 28px; height: 22px; padding: 1px 0 0 0; font-size: 18px;	line-height: 1em;  margin-top:10px;}
	
	#slideshow #slidenav { position: absolute;	width: 100%; bottom: 7px; left: 10px; z-index: 100; }

}

/*@media only screen and (min-width: 1370px) {

	#slideshow { 	border: 1px solid #FFF; }
	#slideshell { 	width: auto !important; max-width: 100%; max-height: 600px; margin: 0px 0px 0px 0px; border: 1px solid #FFF; }
	div.slide {max-width: 1500px; }
	
	#slide_image {max-width: 1500px; }

	#slideshow #slideshell div.ss_image { 	width: 100%; 
	}
	#slideshow #slideshell div.ss_image img { 	width: 100%; border: 1px solid blue; }

}*/


/* ------------------------ preload styles ------------------------ */


div.slideshow_preload { height: 0px; overflow: hidden; background-repeat: no-repeat; background-position: -9999px top; }

div.slideshow_preload .plimg1 { background-image: url(../images/nav_circle1.png); }
div.slideshow_preload .plimg2 { background-image: url(../images/nav_circle2.png); }
div.slideshow_preload .plimg3 { background-image: url(../images/nav_circle3.png); }

