@charset "UTF-8";
	
  article.colbased
	{
		padding-left: 40px;
		padding-right: 40px;
		padding-top: 10px;
		padding-bottom: 40px;
		width: 100%;
		display: block;
	}
  article.colbased .contentcols
	{
  	text-align: center;
	}
  article.colbased .inline-columns
	{
  	height: 100%;
	}

  article.colbased .contentcols article,
  article.colbased .captionside.outer,
  article.colbased .contentside.outer
	{
		padding: 20px;
		width: auto;
		display: inline-block;
  	height: 100%;
	}
  article.colbased .captionside.outer,
  article.colbased .contentside.outer
	{
  	vertical-align: top;
		box-sizing: border-box;
		height: 100%;
  }
  
  article.colbased.c2 .captionside.outer,
  article.colbased.c2 .contentside.outer
  {
  	width: 50%;
  }
  article.colbased.reverse .contentside.outer 
  {
		position: relative;
		left: -50%;
	}
  article.colbased.reverse .captionside.outer 
  {
		position: relative;
		left: 50%;
	}
  article.colbased.bottom .contentside.outer,
  article.colbased.bottom .captionside.outer
  {
  	vertical-align: bottom;
  }
  
  article.colbased.c2 article
	{
  	width: calc(50% - 100px);
  }
  article.colbased.c3 article
	{
  	width: calc(33% - 90px);
  	margin-right: 30px;
  }
	article.colbased.c4 article 
	{
	  width: calc(25% - 90px);
	  margin-right: 20px;
	}
  article.colbased article .contentelements article
	{
  	width: 100%;
  }

	article.centercontent .contentelements
	{
		display: inline-block;
		text-align: center;
	}
	
  article.rollup div.artdetail
	{
		height: 0;
		display: none;
	}
  article.rollup.open div.artdetail
	{
		height: auto;
		display: revert;
  }	
	article.rollup h1.itemhead
	{
		font-weight: normal;
		cursor: pointer;
	}
	
	article.rollup h1.itemhead:before
	{
		content: "▶ ";
		padding-right: 20px;
	}
	article.rollup.open h1.itemhead:before
	{
		content: "▼ ";
		padding-right: 20px;
	}

	article.carousel div.carouselitems.outer
	{
		display: block;
		position: relative;
		min-height: 400px;
	}


	article.carousel ul.carouselselector
	{
		position: absolute;
	  bottom: 0;
	  text-align: center;
	  width: 100%;	
	  padding: 0;
	}	
	article.carousel ul.carouselselector li
	{
		display: inline-block;
		list-style: inside;
		cursor: pointer;
		padding: 5px;
	}
	article.carousel ul.carouselselector li.flipleft,
	article.carousel ul.carouselselector li.flipright
	{
		padding-left: 20px;
		padding-right: 20px;
	}
	
	article.carousel ul.carouselselector li:before
	{
		content: "●";
	}
	article.carousel ul.carouselselector li.flipright:before
	{
		content: "▶";
	}
	article.carousel ul.carouselselector li.flipleft:before
	{
		content: "◀";
	}
	article.carousel div.carouselitem.outer
	{
		position: absolute;
		display: inline-block;
		width: 0;
		top: 0;
		left: 0;
		opacity: 0;
	}
	article.carousel div.carouselitem.outer.selected
	{
		width: 100%;
		opacity: 1;
		transition: opacity 1s;
	}
	article.carousel div.carouselitem.inner
	{
		padding-left: 40px;
		padding-right: 40px;
	}
	article.carousel ul.carouselselector li.selectoritem.selected
	{
		color: red;
	}



	
	@media (max-width: 1000px)
	{
		article.colbased article
		{
			width: auto !important;
			padding: 10px;	
		}
	
	}