/* Carousel CSS */

.image-magnify-box
{
	border: solid black 1px;
	position:absolute;
	overflow:hidden;
	margin:0 20%;
}

.image-magnify-box img
{
	position:relative;
	z-index:99;
}

.image-carousel
{
  float: left;
	width: 100%;
	cursor:zoom-in;
}
.active
{
	float:left;
	width:100%;
}

.carousel .item
{
  background:#CCCCCC;
  overflow:hidden;
  padding:5px;
}

.carousel-inner > .item > img:hover
{
}

.info-slide-title, .info-slide-caption
{
  width: 100% !important;
  text-align: center !important;
  color: hsl(240, 29%, 47%) !important;
  border: 1px solid #494949;
  border-radius: 3px;
  padding: 5px;
  resize: none;
}

.aspect-ratio, .underlay
{
  visibility: hidden;
}

.aspect-ratio
{
	height:800px;
}

.overlay
{
  position: relative;
  visibility: visible;
  z-index: 99;
}

.c-indicators
{
  z-index: 999;
}

.carousel-sort-area, .carousel-thumbs
{
  float: left;
  list-style-type:none;
  width: 100%;
  background-color: #FFFFFF;
  border: solid #494949 1px;
  min-height: 110px;
  margin-top: 10px;
  padding-left: 17px;
  display: inline;
}

.carousel-sort-area li, .carousel-thumbs li
{
  float: left;
  width:100px;
  height:100px;
  margin: 4px;
  border-radius: 5px;
}

.carousel-sort-area li img, .carousel-thumbs li img
{
  position:absolute;
  border-radius: 5px;
	cursor:pointer;
}

.ui-state-highlight .sort-place
{
  width: 100px;
  height: 100px;
}

/* carousel features */
.carousel-image
{
  position: absolute;
  margin: 0pt 3px;
  padding: 2px;
  height: none;
  width:  100%;
  padding: 0;
  margin: 0;
}

.ordering-header
{
  display: inline;
}

.carousel-active
{
	float: right;
	margin: 10px 5px 0 0;
}

.active-title
{
	float: left;
}

.carousel-progress
{
  width: calc(100% - 150px);
}

.carousel-completion
{
  width: calc(76% - 150px);
}

.container
{
	display:inline;
}

.mobile-captions
{
	display:none;
}

#mobile-captions
{
	float:left;
	width:100%;
	display:none;
	text-align:center;
	color:#0C0D0F;
}
	.centred-carousel-image
	{
		max-width: unset !important;
		width: auto !important;
		height: 100% !important;
		margin: 0 20% !important;
		bottom:5% !important;
		float: unset;
	}

/* mobile friendly styles */
@media screen and (max-width: 1010px)
{
	.carousel-thumbs
	{
		display:none;
	}
	.centred-carousel-image
	{
		max-width: unset !important;
		width: auto !important;
		height: 100% !important;
		margin: 0 20% !important;
		float: unset;
	}
	.aspect-ratio
	{
		height:auto!important;
	}
	.mobile-captions
	{
		display:inline;
	}
	.container
	{
		display:none;
	}
	#mobile-captions
	{
		display:inline;
	}
}