#slide-wrapper {
  display: flex;
  justify-content: stretch;
}
#slideshow {
  flex: 0 1 410px;
  position:relative;
  height:190px;
  overflow: hidden;
}
#slideshow div {
  position:absolute;
  top:0;
  left:0;
}
#slideshow div.active {
	visibility: visible;
}
#slideshow div img {
  display: block;
  width: 410px;
  border: 0;
  margin-bottom: 10px;
	position:relative;
	z-index:1;
}
#slideshow div.inactive {
	visibility:hidden;
}
#slideshow div.overlay {
	position: absolute;
	z-index: 2;
	top: 0px;
	left: 0px;
	width: 34%;
	height: 100%;
  background-color: rgba(0, 0, 0, 0.4);
	padding-top: 60px;
	padding-left: 10px;
	padding-right: 10px;
	font-weight: bold;
}
#slideshow a.slide-title {
	color: white;
	font-size: 16px;
	font-weight: bold;
}
#slideshow span {
	display: block;
	color: white;
	font-size: 12px;
	padding-top: 10px;
}
#slideshow a.more {
	display: block;
	color: white;
	font-size: 12px;
	padding-top: 5px;
}
#labels {
  height: 190px;
  flex: 0 1 30%;
  min-width: 100px;
  display: flex;
  flex-direction: column;
  justify-content: stretch;
}
#labels div{
  flex: 0 0 25%;
  display: flex;
  justify-content: stretch;
}
#labels div img {
  margin-left: -24px;
	z-index: 5;
}
#labels div.current_label > img {
	visibility: visible;
}
#labels div.hidden_label > img {
	visibility: hidden;
}
#labels a {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
	background-image: url("images/slide-bg.jpg");
	color: white;
	border: none;
	padding-left: 10px;
	text-decoration: none;
	font-size: 15px;
}
#labels div.hilite {
	width: 152px;
	height: 44px;
	border: 2px solid darkgray;
}
#labels a:hover {
	/* width: 152px; */
	/* height: 44px; */
	border: 2px solid darkgray;
}
@media (max-width: 520px) {
  #labels a {
    font-size: 12px;
  }
}