#container {
	width:580px;
	padding:0 10px;
	margin:0 auto;
	position:relative;
	z-index:0;
}

#example {
	width:600px;
	height:350px;
	position:relative;
}

#ribbon {
	position:absolute;
	top:-3px;
	left:-15px;
	z-index:500;
}

#frame {
	position:absolute;
	z-index:0;
	width:739px;
	height:500px;
	top:-18px;
	left:-80px;
}

/*
	Slideshow
*/

#slides {
	position:absolute;
	top:0px;
	left:4px;
	z-index:100;
}

#slides_1{
	/*position:absolute;*/
	top:0px;
	left:4px;
	z-index:100;
	/*border: 1px solid #FF0000;*/
    height: 300px;
}

#slides_2{
	/*position:absolute;*/
	top:0px;
	left:4px;
	z-index:100;
	/*border: 1px solid #FF0000;*/
    height: 310px;
}

#slides_3{
	/*position:absolute;*/
	top:0px;
	left:4px;
	z-index:100;
	/*border: 1px solid #FF0000;*/
    height: 300px;
}

#slides_4 {
	/*position:absolute;*/
	top:0px;
	left:4px;
	z-index:100;
	/*border: 1px solid #FF0000;*/
    height: 300px;
}

/*
	Slides container
	Important:
	Set the width of your slides container
	Set to display none, prevents content flash
*/

.slides_container {
	/*width:570px;*/
	overflow: hidden;
	position: relative;
	display: none;
}

.slides_containerbg {
	width:570px;
	overflow: hidden;
	position: relative;
	text-align:center;
	display: none;
	background-color: #000;
	background-image: url(https://www.movieposterexchange.com/javascript/Slides-SlidesJS-1/examples/images-with-captions/img/slidebg.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}

.slides_container1, .slides_container2, .slides_container2a, .slides_container3, .slides_container4 {
	width:950px;
	overflow:hidden;
	position:relative;
	display:none;
}


/*
	Each slide
	Important:
	Set the width of your slides
	If height not specified height will be set by the slide content
	Set to display block
*/

.slides_container div.slide {
	width:570px;
	/*width:950px;*/
	height:430px;
	display:block;
	text-align: center;
}

.slides_container2 div.slide {
	/*width:570px;
	width:950px;*/
	height:280px;
	display:block;
	text-align: center;
}

.slides_container1 div.slide, .slides_container3 div.slide, .slides_container4 div.slide {
	/*width:570px;
	width:950px;*/
	height:330px;
	display:block;
}

.slides_container div.slide img{
	margin:0 auto;
}

.slides_container2 div.slide img, .slides_container2a div.slide img, .slides_container3 div.slide img, .slides_container4 div.slide img{
	margin:0 auto;
}


/*
	Next/prev buttons
*/

#slides .next, #slides .prev {
	position:absolute;
	top:180px;
	left:-39px;
	width:24px;
	height:43px;
	display:block;
	z-index:101;
}

#slides .next {
	left:585px;
}

#slides_1 .next, #slides_1 .prev, #slides_2 .prev, #slides_2 .next, #slides_3 .next, #slides_3 .prev, #slides_4 .prev, #slides_4 .next {
	/*position:absolute;
	top:180px;*/
	left:-39px;
	/*width:24px;
	height:43px;*/
	display:block;
	z-index:101;
	float: left;
}

#slides_1 .prev, #slides_2 .prev, #slides_3 .prev, #slides_4 .prev {
	background-image: url(https://www.movieposterexchange.com/javascript/Slides-SlidesJS-1/examples/images-with-captions/img/gallery_back2.jpg);
	background-repeat: no-repeat;
	height: 20px;
	width: 20px;
	margin-right:10px;	
}

#slides_1 .next, #slides_2 .next, #slides_3 .next, #slides_4 .next {
	background-image: url(https://www.movieposterexchange.com/javascript/Slides-SlidesJS-1/examples/images-with-captions/img/gallery_fwd2.jpg);
	background-repeat: no-repeat;
	height: 20px;
	width: 20px;
	/*left:585px;*/
}


/*
	Pagination
*/

.pagination {
	margin:26px auto 0;
	/*width:400px;*/
}

  /*
   Optional:
   Reset list default style
  */
  .pagination {
   list-style:none;
   margin:0;
   padding:0;
  }

.pagination li {
	float:left;
	margin:0 1px;
	list-style:none;
}

.pagination li a {
	display:block;
	width:12px;
	height:0;
	padding-top:12px;
	background-image:url(https://www.movieposterexchange.com/javascript/Slides-SlidesJS-1/examples/images-with-captions/img/pagination.png);
	background-position:0 0;
	float:left;
	overflow:hidden;
}

.pagination li.current a {
	background-position:0 -12px;
}



  /*
   Optional:
   Show the current slide in the pagination
  */
  .pagination .current a {
   color:red;
  }


/*
	Caption
*/

.caption {
	z-index: 500;
	position: absolute;
	bottom: -35px;
	left: 0;
	/*height:30px;*/
	padding: 5px 20px 0 20px;
	background: #000;
	background: rgba(0,0,0,.5);
	width: 540px;
	font-family: 'open_sansregular';
	font-style: normal;
	font-size: 15px;
	line-height: 15px;
	color: #fff;
	border-top: 1px solid #000;
	text-shadow: none;
	text-transform: capitalize;
	text-align: left;
}

  /*
   Load CSS before JavaScript
  */

  /*
   Slides container
   Important:
   Set the width of your slides container
   Set to display none, prevents content flash
  */
  .slides_container1 slider1{
   width:950px;
   height:300px;
   display:none;
   /*border:1px solid #ff0000;*/
  }
  
  .slides_container2 slider2{
   width:950px;
   height:300px;
   display:none;
   /*border:1px solid #ff0000;*/
  }
  
  .slides_container3 slider3{
   width:950px;
   height:300px;
   display:none;
   /*border:1px solid #ff0000;*/
  }

  /*
   Each slide
   Important:
   Set the width of your slides
   If height not specified height will be set by the slide content
   Set to display block
  */
  .slides_container1 slider1 div.slide {
   width:470px;
   display:block;
  }
  
  .slides_container2 slider2 div.slide {
   width:470px;
   display:block;
  }
  
  .slides_container3 slider3 div.slide{
   width:470px;
   display:block;
  }

  /*
   Set the size of your carousel items
  */
  .item {
   float:left;
   width:226px;
   /*height:310px;*/
   height:auto;
   margin:0 12px 0 0;
   /*background:#0000ff;*/
   border:1px solid #c7c7c7;
   text-align: center;
  }