.highlight .synopsis { background: url(http://static.singup.org.s3.amazonaws.com/images/global/home-synopsis-bg.png); position: relative; bottom: 0px; min-height: 76px; }
.grid_5-5 .synopsis { width: 668px; }
.grid_4-5 .synopsis { width: 548px; min-height: 90px; }
.grid_4 .synopsis { width: 440px; min-height: 90px; }
.synopsis a { color: #FFF; font-size: 1.2em; text-decoration: underline; }
.synopsis p a { font-size: 1em; }
.synopsis a:hover { text-decoration: underline; }

.carousel-video-button { background: url(http://static.singup.org.s3.amazonaws.com/images/global/play.png) no-repeat center; width: 100%; height: 145px; }

.highlight .jcarousel-control { position: absolute; z-index: 100; margin-left: 100%; left: -68px; margin-top: 155px; padding: 20px 10px 20px 5px;}
.highlight .jcarousel-control span { float: left; margin: 0 0 0 2px; }
.highlight .jcarousel-control span a { background: url(http://static.singup.org.s3.amazonaws.com/images/global/synopsis-circles.png) 0px -10px; width: 10px; height: 0px; padding: 10px 0 0 0; display: block; overflow: hidden; }
.highlight .jcarousel-control span a:hover, .highlight .jcarousel-control span .current { background-position: 0px 0px; }

.jcarousel-control span { display: none; } /* BR: if JS enabled then it shows this element. If disabled then we want to keep it hidden since its js functionality */

.infiniteCarousel {
    width: 460px;
}

.homecarousel.infiniteCarousel {
  width: 568px;
  position: relative;
}

.infiniteCarousel .wrapper {
  width: 460px; /* .infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
  overflow: hidden;
  height: 270px;
  position: absolute;
  top: 0;
}

.homecarousel.infiniteCarousel .wrapper {
  width: 568px; /* .infiniteCarousel width - (.wrapper margin-left + .wrapper margin-right) */
  overflow: hidden;
  height: 270px !important;
  position: absolute;
  top: 0;
}


.infiniteCarousel .wrapper ul {
  width: 460px; /* single item * n */
  list-style-image:none;
  list-style-position:outside;
  list-style-type:none;
  margin:0;
  padding:0;
  position: absolute;
  top: 0;
}

.homecarousel.infiniteCarousel .wrapper ul {
  width: 568px; /* single item * n */
}

.infiniteCarousel ul li {
  display:block;
  float:left;
  height: 270px;
  width: 460px;
}

.homecarousel.infiniteCarousel ul li {
  display:block;
  float:left;
  height: 270px;
  width: 568px;
}

.highlight.grid_4-5, .highlight.grid_4 { 
    width: auto; 
    margin: 0 10px 0 0;
}

.highlight.grid_4 { background-color: transparent; }

.infiniteCarousel .synopsis { 
    padding: 10px;
    height: 90px;
    margin-top: 160px;
}

#arrows { position: absolute; top: 100px; left: 100px; background-color: #fff; height: 50px; width: 40px; }
