@charset "UTF-8";
/* http://www.menucool.com */

#sliderFrame, #sliderFrame div {
    box-sizing: content-box;
}

#sliderFrame 
{
    position:relative;
    width:700px;
    margin: 0 auto; /*center-aligned*/
}

/* 
#slider, #slider div.sliderInner {
    width:700px;height:306px;/- Must be the same size as the slider images -/
}
*/

/* make video and audio to have rounded corners */
#slider iframe, #slider div.video, #slider audio { border-radius:4px; }


#slider {
    /*background:#fff url(loading.gif) no-repeat 50% 50%;*/
    position:relative;
	transform: translate3d(0,0,0);
    box-shadow: 0px 1px 5px #999999;
}


/* image wrapper */
#slider a.imgLink, #slider div.video
{
	z-index:2;
	cursor:pointer;
	position:absolute;
	top:0px;left:0px;border:0;padding:0;margin:0;
	width:100%;height:100%;
}
#slider .video {
	background:transparent url(video.png) no-repeat 50% 50%;
}

/* Caption styles */
#slider div.mc-caption-bg, #slider div.mc-caption-bg2 {
	position:absolute;
	width:100%;
	height:auto;
	padding:10px 0;/* 10px will increase the height.*/
	left:0px; /*if the caption needs to be aligned from right, specify by right instead of left. i.e. right:20px;*/
	bottom:0px;/*if the caption needs to be aligned from top, specify by top instead of bottom. i.e. top:150px;*/
	z-index:3;
	overflow:hidden;
	font-size: 0;
	border-radius: 0 0 4px 4px;/*round caption bottom corners */
}
#slider div.mc-caption-bg {
    /* NOTE: Its opacity is to be set through the sliderOptions.captionOpacity setting in the js-image-slider.js file.*/
	background:Black;/* or any other colors such as White, or: background:none; */
}
#slider div.mc-caption-bg2 {
    background:none;
}
#slider div.mc-caption {
	font: bold 14px/20px Arial;
	color:#EEE;
	z-index:4;
	text-align:center;
    background:none;
}
#slider div.mc-caption a {
	color:#FB0;
}
#slider div.mc-caption a:hover {
	color:#DA0;
}


/* ------ built-in navigation bullets wrapper ------*/
/* Note: check themes\2\js-image-slider.css to see how to hide nav bullets */
#slider div.navBulletsWrapper  {
	top:320px;/* Its position is relative to the #slider */
	text-align:center;
	background:none;
	position:relative;
	z-index:5;
}

/* each bullet */
#slider div.navBulletsWrapper div 
{
    width:11px; height:11px;
    font-size:0;color:White;/*hide the index number in the bullet element*/
    background:transparent url(bullet.png) no-repeat 0 0;
    display:inline-block; *display:inline; zoom:1;
    overflow:hidden;cursor:pointer;
    margin:0 6px;/* set distance between each bullet*/
}

#slider div.navBulletsWrapper div.active {background-position:0 -11px;}

/* --------- Others ------- */


#slider div.loading 
{
    width:100%; height:100%;
    /*background:transparent url(loading.gif) no-repeat 50% 50%;*/
    filter: alpha(opacity=60);
    opacity:0.6;
    position:absolute;
    left:0;
    top:0; 
    z-index:9;
}


#slider img, #slider>b, #slider a>b {
	position:absolute; border:none; display:none;
}

/*
#slider div.sliderInner {
	overflow:hidden; 
	-webkit-transform: rotate(0.000001deg);/- fixed the Chrome not crop border-radius bug-/
	position:absolute; top:0; left:0;
}
*/
#thumbs .thumb-content {float:left;width:110px;padding-left:18px;}

/* Captions in #thumbs .thumb-content */
#thumbs .thumb-content p {font-weight:bold; color:#BF5D9B; margin:0 0 3px;padding:0;}
#thumbs .thumb-on .thumb-content p {color:#BB0000;}

/* Babson-specific overrides */
#sliderFrame {
  width: 100% !important;
}

.cell #sliderFrame {
  width: 100vw !important;
  max-width: 100%;
}

#sliderFrame #slider {
  /*background-image: url(/_layouts/15/images/Babson/responsive_redesign/loading_resized.gif);*/
  background-position: 50% 50% !important;
  -webkit-background-size: 100% auto !important;
  -moz-background-size: 100% auto !important;
  -ms-background-size: 100% auto !important;
  background-size: 100% auto !important;
  background-repeat: no-repeat !important;
  -webkit-box-shadow: none !important;
    -ms-box-shadow: none !important;
    box-shadow: none !important;
  height: 200px;
  width: 100%;
}


#sliderFrame .mcSlc {
    -webkit-background-size: 100% auto !important;
    -ms-background-size: 100% auto !important;
    background-size: 100% auto !important;
  background-position: 50% 50% !important;
  width: 100% !important;
    -moz-min-width: 100% !important;
    -ms-min-width: 100% !important;
    -o-min-width: 100% !important;
    -webkit-min-width: 100% !important;
    min-width: 100% !important;
}

#sliderFrame .mc-caption {
  line-height: 1.2 !important;
  font-size: 12px !important;
  font-weight: normal !important;
  padding: 1em 4em !important;
  text-align: left !important;
  width: 100% !important;
}
#sliderFrame .mc-caption a:link, #sliderFrame .mc-caption a:visited, #sliderFrame .mc-caption a:hover, #sliderFrame .mc-caption a:active {
  color: #ffbb00;
}
#sliderFrame .title {
  position: relative;
  color: #dad6cc;
  font-size: 1.6em;
  font-weight: normal;
  text-transform: lowercase;
  margin-bottom: 0;
  width: 95%;
}
@media (min-width: 40em) {
  #sliderFrame .title {
    font-size: 2.5em;
  }
}
#sliderFrame .description {
  text-transform: uppercase;
  width: 95%;
}

div.mc-caption-bg {
  background-color: #6c6f70 !important;
}

.navBulletsWrapper {
  display: none;
}

#slider {
  height: 87px !important;
}

.mcSlc {
  height: 87px !important;
}

@media screen and ( min-width: 350px ) {
    #slider,
    .mcSlc {
        height: 129px !important;
    }
}

@media screen and ( min-width: 460px ) {
    #slider,
    .mcSlc {
        height: 150px !important;
    }
}

@media screen and ( min-width: 540px ) {
    #slider,
    .mcSlc {
        height: 180px !important;
    }
}

@media (min-width: 40em) {
  #slider {
    height: 200px !important;
  }

  .mcSlc {
    height: 200px !important;
  }
}
#thumbs {
  display: none;
}

#thumbs .thumb {
  background: #EEE;
  border: none !important;
  display: inline-block;
  margin: 1em;
  padding: 0 !important;
}

#thumbs .thumb-on {
  background: #FFF;
}

#thumbs img {
  border: 1px solid #DDD;
  cursor: pointer;
  width: 70px;
  height: 44px;
}

#thumbs .frame {
    float: left;
  padding: 2px;
  border: 1px solid #CCC;
  background: white;
    -ms-border-radius: 3px;
    border-radius: 3px;
  -webkit-box-shadow: 0 0 3px #BBB;
    -ms-box-shadow: 0 0 3px #BBB;
    box-shadow: 0 0 3px #BBB;
  font-size: 0;
  line-height: 0;
}

#thumbs .thumb-content {
  float: left;
  width: 110px;
  padding-left: 18px;
}

#thumbs .thumb-content p {
  font-weight: 900;
  color: #BF5D9B;
  margin: 0 0 3px;
  padding: 0;
}

#thumbs .thumb-on .thumb-content p {
  color: #BB0000;
}

/* 
For this version only, we are removing the automatic captions.
The ALT text on the image becomes the alt text.
For whatever reason we see it fit to embed the text directly in the image,
so we can't have the ALT text showing up.
There are many things wrong with this approach, but for now...
*/
.mc-caption-bg,
.mc-caption-bg2 
{
    display: none;
}