
.clearBoth {
	clear: both ;
}

table.TableAdmin tr td, table.TableAdmin tr th {
	text-align: center !important ;
	margin: 0 !important ;
	padding: 0.35rem 0.1rem !important ;
}

table.SuperCompact tr td, table.SuperCompact tr th {
	padding: 0.1rem 0.1rem !important ;
}

table.TableAdmin tr th {
	font-weight: bold !important ;
}

table.TableAdmin tr.ListRowWeek td {
	background-color: #DDD !important ;
}

input.AdminInputShort {
	width: 6rem !important ;
	max-width: 6rem !important ;
	text-align: center !important ;
}

td.VectorLinkSelected {
	background-color: lightgreen !important ;
}

td.EndOfYear {
	border-right: 1px solid black !important ;
}

td.Weekend { background-color: #DBDBDB !important ; }

div.AdminCatSelect, div.AdminCatSelected {
	float: left ;
	width: 5.5rem ;
	text-align: center ;
	font-size: 0.8rem ;
	padding: 0.4rem ;
}

div.AdminCatSelect:hover {
	cursor: pointer ;
	background-color: #DDD ;
	transition: all 0.5s ;
}

div.AdminCatSelected {
	background-color: #40c799 ;
}

div.AdminVectorThumbBox {
	float: left ;
	width: 33% ;
	padding: 0.2em ;
	margin-bottom: 0.5em ;
	border-bottom: 1px solid #DDD ;
	transition: all 0.5s ;
}

.GreenPerc {
	font-size: 0.9rem ;
	color: green ;
}

.RedPerc {
	font-size: 0.9rem ;
	color: red ;
}

div.PrevNextContainer {
	background-color: white ;
	border: 1px solid #CCC ;
	border-radius: 0.4rem ;
	margin-top: 1rem ;
	margin-bottom: 1rem ;
	padding: 0.75rem ;
}

.PrevNext {
	padding: 0.5rem ;
	background-color: #CCC ;
	border-radius: 0.25rem ;
	transition: all 0.5s ;
}

.PrevNext:hover {
	background-color: #DDD ;
}
div.BPIndexContainer {
	display: flex ;
	flex-flow: row wrap ;
}

	div.BPIndexItemContainer {
		flex: 1 ;
		min-width: 180px ;
		max-width: 225px ;
		padding: 1em ;
		text-align: center ;
		transition: all 0.5s ;
	}

	div.BPIndexItemContainer:hover {
		background-color: white ;
	}

		span.BPIndexItemTitle {
			float: left ;
		}

		span.BPIndexItemCount {
			float: right ;
			font-size: 0.9em ;
		}

		img.BPIndexGroupImage {
			margin-top: 0.1em ;

			width: 100% ;
			min-width: 150px ;
			max-width: 200px
			padding: 0.5rem ;
		}

img.BPViewImage {
	margin: 0 auto ;
	background-color: white ;
	padding: 1rem ;
	border: 1px solid #DDD ;
	border-radius: 0.3rem ;
	max-width: 100% ;
	height: auto ;
	box-sizing: border-box ;
}

div.BPViewImageScaledNotice {
	position: absolute ;
	top: 2rem ;
	right: 1rem ;
	width: 15rem ;
	background-color: #EEE ;
}

	div.BPViewImageScaledNotice a {
		font-size: 1.5em ;
		line-height: 2em ;
	}

	div.BPViewImageScaledNotice a span {
		font-size: 1em ;
	}

div.BPViewSingleContainer {
}
div.FPIDSearchResults {
	position: absolute ;
	top: 4rem ;
	text-align: left ;
	display: none ;
	background-color: white ;
	box-shadow: 0 0 5px 0 #888 ;
	padding: 0.4rem ;
	border-radius: 0.25rem ;
	z-index: 100 ;
	width: 100% ;
}

		div.IDSearchResultLine {
			padding-left: 1rem ;
		}

		div.IDSearchResultLine:hover {
			background-color: #f0c60c ;
			transition: background-color 0.5s ;
		}

div.ClientList {
	display: flex ;
	flex-flow: row nowrap ;
	align-items: center ;
  	justify-content: center ;
	overflow: auto ;
	max-width: 1280px ;
}

	div.ClientListItem {
		flex: 1 ;
		flex-basis: 120px ;
		min-width: 120px ;
		max-width: 120px ;
		padding: 0 0.7rem ;
		transition: all 0.5s ;
		text-align: center ;
		border-radius: 0.5rem ;
	}

	div.ClientListItem:hover {
		background-color: white ;
	}

		div.ClientListItem img {
			width: 100% ;
			transition: all 0.5s ;
		}

		div.ClientListItem:hover img {
			width: 95% ;
			max-height: 120px ;
		}

div.FrontpageContainer {
	display: flex ;
	flex-direction: row ;
	flex-wrap: wrap ;
}

	div.FrontpageHighlightContainer {
		margin: 0 auto ;
		width: 100% ;
	}


	div.FrontPageColumnLeft {
		flex: 1 ;
		width: 50% ;
		min-width: 180px ;
		padding-right: 1em ;
	}

	div.FrontPageColumnRight {
		flex: 1 ;
		width: 50% ;
		margin: 0 auto ;
		max-width: 900px ;
	}

		div.SlideBox {
			position: relative ;
			padding: 1em ;
			border-radius: 0.5em ;
			background-color: white ;
		}

			h2.SlideTitle {
				position: absolute ;
				top: 1em ;
				left: 0em ;
				padding: 0.25em ;
				padding-left: 1em ;
				padding-right: 0.5em ;
				background-color: white ;
				font-size: 1.5em ;
				transition: all 0.5s ;
				border-right: 1px solid #EEE ;
				border-bottom: 1px solid #EEE ;
				border-top: 1px solid #EEE ;
			}

				h2.SlideTitle:hover {
					background-color: #EEE ;
				}
@font-face {
    font-family: 'Century Gothic';
    src: local('Century Gothic'), local('CenturyGothic'),
        url('./fonts/CenturyGothic.woff2') format('woff2'),
        url('./fonts/CenturyGothic.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Century Gothic';
    src: local('Century Gothic Italic'), local('CenturyGothic-Italic'),
        url('./fonts/CenturyGothic-Italic.woff2') format('woff2'),
        url('./fonts/CenturyGothic-Italic.woff') format('woff');
    font-weight: normal;
    font-style: italic;
}

@font-face {
    font-family: 'Century Gothic';
    src: local('Century Gothic Bold'), local('CenturyGothic-Bold'),
        url('./fonts/CenturyGothic-Bold.woff2') format('woff2'),
        url('./fonts/CenturyGothic-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
}

body {
	background-color: #EEE ;
}

a, input, form, select, option, p, span, ul, ol, li, div, p, span, table, tr, td, textarea, pre {
	letter-spacing: 0.05rem ;
	line-height: 1.2rem ;
}

h1, h2, h3, h4, h5 {
	font-family: 'Century Gothic', Helvetica, sans-serif ;
	font-weight: normal ;
	margin: 1rem 0rem ;
}

.ui.table thead th {
	background: #1c5e99 !important ;
}

textarea, input, select, option, button {
	font-family: inherit !important ;
}

.l {
	text-align: left !important ;
}

.c {
	text-align: center !important ;
}

.r {
	text-align: right !important ;
}

.pointer:hover {
	cursor: pointer !important ;
}

.BPRed {
	color: #da1f26 ;
}

.BPBlue {
	color: #1c5e99 ;
}

.BPBlue2, .BPLightBlue {
	color: #4c9bd5 ;
}

.BPYellow {
	color: #dfe01c ;
}

a.white {
	color: white !important ;
}

a.black {
	color: black !important ;
}

a.GroupLink {
	font-weight: bold !important ;
}

a.IDLink {
	font-weight: bold !important ;
}

a.VectorLink {
	font-weight: bold !important ;
}

img.TopScreamLogo {
	max-height: 4.5rem !important ;
}

img.LanguageFlag {
	vertical-align: middle ;
}

ul.ui.list li.item:before{
  display: none !important ;
}

ul.ColumnList {
	margin: 0 !important ;
	padding: 1rem !important ;
	column-count: 5 ;
	column-gap: 1rem ;
	background-color: white ;
	border-radius: 0.5rem ;
}

/* MESSAGES */
div.MessageError, div.MessageInfo, div.MessageSuccess, div.MessageWarning {
	margin: 0.5rem 0 ;
	padding: 0.5rem 0px ;
	padding-left: 0.5rem ;
	color: white ;
	vertical-align: middle ;
	position: relative ;
	line-height: 1.5 ;
}

div.MessageError {
	background-color: #da1f26 ;
}

	div.MessageError a {
		color: white ;
	}

	div.MessageError:before, div.MessageSuccess:before, div.MessageWarning:before, div.MessageInfo:before {
		content: "\f06a" ;
		font-family: "Font Awesome 5 Pro" ;
		font-style: normal ;
		font-variant-caps: normal ;
		font-variant-ligatures: normal ;
		font-weight: 600 ;
		height: 1.5rem ;
		width: 1.5rem ;
		line-height: 1.5rem ;
		text-rendering: auto ;
		padding-right: 0.5rem ;
	}

div.MessageSuccess {
	background-color: #40c799 ;
}

	div.MessageSuccess:before {
		content: "\f058" ;
		color: white ;
	}

div.MessageWarning {
	background-color: #E1E100 ;
	color: #222 ;
}

	div.MessageWarning:before {
		content: "\f06a" ;
		color: black ;
	}

div.MessageInfo {
	background-color: #39a0ed ;
	font-size: 0.9em ;
}

	div.MessageInfo:before {
		content: "\f05a" ;
		color: white ;
	}

/* MEDIA QUERIES */
@media only screen and (max-width: 900px) {
    ul.ColumnList { column-count: 4 ; }
}

@media only screen and (max-width: 700px) {
    ul.ColumnList { column-count: 3 ; }
}
@media only screen and (max-width: 500px) {
    ul.ColumnList { column-count: 2 ; }
}

	ul.ColumnList li {
		position: relative ;
		transition: all 0.5s ;
		border-radius: 0.25rem ;

	}

	ul.ColumnList li span {
		transition: all 0.5s ;
		border-left: 0rem solid transparent ;
	}

	ul.ColumnList li:nth-child(even) {
		background-color: #F5F5F5 ;
	}

	ul.ColumnList li:hover {
		background-color: #EEE ;
	}

	ul.ColumnList li span:hover {
		border-left: 0.4rem solid transparent ;
	}

	ul.ColumnList li span.IDCount {
		position: absolute ;
		top: 0.1rem ;
		right: 1rem ;
	}

div.CenterBox, div.CenterBox2 {
	margin: 0 auto ;
	max-width: 35rem ;
}

div.CenterBox2 {
	max-width: 50rem ;
}

/* */
td.Count {
	width: 4rem !important ;
	text-align: center !important ;
}

tr.IDListRow td {
	background-color: #DDD !important ;
}

td.TDCat {
	text-align: center !important ;
	width: 12rem !important ;
	font-size: 0.8rem ;
}

td.TDWidth {
	width: 7rem !important ;
	text-align: center !important ;
	font-size: 0.9rem ;
}

td.TDIcon {
	width: 1rem !important ;
	text-align: center !important ;
}

	img.VectorIcon {
		margin-top: -0.25rem ;
		margin-bottom: -0.25rem ;
		height: 1.5rem ;
	}

	img.VectorIcon2 {
		height: 1.25rem ;
	}

/* TOP */
div.TopHeaderContainer {
	display: flex ;
	flex-flow: row wrap ;
}

	a.SubScreamer {
		font-size: 0.9rem !important ;
		color: black !important ;
	}

	div.THCLogo, div.THCURL, div.THCMenu {
		flex: 1 ;
	}

		div.TopURL {
			font-size: 2.9rem ;
			margin-top: 1.2rem ;
			margin-bottom: 1.5rem ;
			font-family: 'Century Gothic', Helvetica, sans-serif !important ;
		}

		@media only screen and (max-width: 800px) {
			div.THCURL {
				display: none ;
			}
		}

		span.TopScreamer {
			font-family: 'Century Gothic', Helvetica, sans-serif !important ;
			font-weight: 200 !important ;
			color: #f7a310 ;
		}

		span.TopScreamer2 {
			font-family: 'Century Gothic', Helvetica, sans-serif !important ;
			font-weight: 200 !important ;
			color: #e1e100 ;
		}

	div.THCLogo {
		padding-top: 0.5rem ;
		text-align: center ;
		max-width: 7rem ;
	}

	div.THCMenu {
		margin-top: 0.5rem ;
	}

div.MenuBackground {
	/* background-color: white ; */
	margin-top: 0.5rem ;
	margin-bottom: 0.5rem ;
	padding: 0.5rem 0 ;
}

a.MenuLink {
	font-family: 'Century Gothic', Helvetica, sans-serif !important;
	font-weight: normal !important ;
	font-size: 1rem !important ;
	text-transform: uppercase !important ;
}

/* BOTTOM */
footer.Bottom {
	background-color: #1c5d99 ;
	width: 100% ;
	color: white ;
	margin-top: 1rem ;
}

	div.BottomColumn {
		padding-top: 1rem ;
		width: 20% ;
		min-width: 150px ;
		font-size: 0.9rem ;
	}

		ul.BottomList {
			list-style-type: none ;
			margin: 0 ;
			padding: 0  ;
		}

		ul.BottomList li {
			padding: 0.25rem 0 ;
		}

			ul.BottomList li a {
				color: white ;
			}

/* --- */
/* SLIDER */
.ui-slider-horizontal .ui-state-default {
	width: 4rem ;
	text-align: center ;
	font-weight: bold ;
	background-color: #1c5e99 ;
	color: white ;
	border: 0 ;
}
/**
 *   Here's where everything gets included. You don't need
 *   to change anything here, and doing so might break
 *   stuff. Here be dragons and all that.
 */
/**
 *   Default variables
 *
 *   While these can be set with JavaScript, it's probably
 *   better and faster to just set them here, compile to
 *   CSS and include that instead to use some of that
 *   hardware-accelerated goodness.
 */
.unslider {
  overflow: auto;
  margin: 0;
  padding: 0;
}
.unslider-wrap {
  position: relative;
}
.unslider-wrap.unslider-carousel > li {
  float: left;
}
.unslider-vertical > ul {
  height: 100%;
}
.unslider-vertical li {
  float: none;
  width: 100%;
}
.unslider-fade {
  position: relative;
}
.unslider-fade .unslider-wrap li {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  z-index: 8;
}
.unslider-fade .unslider-wrap li.unslider-active {
  z-index: 10;
}
.unslider ul, .unslider ol, .unslider li {
  list-style: none;
  /* Reset any weird spacing */
  margin: 0;
  padding: 0;
  border: none;
}
.unslider-arrow {
  position: absolute;
  top: 50% ;
  left: 0.5em ;
  z-index: 2;
  cursor: pointer ;
  background-color: white ;
  padding: 0.5em ;
  border: 0 ;
  border-radius: 0.25em ;
  transition: all 0.5s ;
}

.unslider-arrow:hover {
   border: 0 ;
   background-color: #DDD ;
   box-shadow: 0 0 0.25em 0 #888 ;
}
.unslider-arrow.next {
  left: auto;
  right: 0.5em ;
}

.unslider-nav ol {
  list-style: none;
  text-align: center;
}
.unslider-nav ol li {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 4px;
  background: transparent;
  border-radius: 5px;
  overflow: hidden;
  text-indent: -999em;
  border: 2px solid #fff;
  cursor: pointer;
}
.unslider-nav ol li.unslider-active {
  background: #fff;
  cursor: default;
}
div.VectorThumbImageBox {
	min-width: 150px ;
	max-width: 100% ;
	background-color: white ;
	transition: all 0.5s ;
}

div.Vertical {
	border-bottom: 1px solid #EEE ;
}

	div.VectorThumbImageBox:hover {
		background-color: transparent ;
	}

	img.VectorThumbImage {
		padding: 0.4rem ;
		background-color: white ;
	}

.VectorDate {
	font-size: 0.9rem ;
}

div.VectorThumbBox2019 {
	transition: all 0.5s ;
	background-color: white ;
	margin: 0 ;
	margin-bottom: 2px ;
}

	div.VectorThumbBox2019:hover {
		background-color: transparent ;
	}

	div.VectorThumbBox2019:hover a img {
		box-shadow: 0 0 5px 0 #888 ;
		background-color: white ;
		padding: 3px ;
		border: 0 ;
	}

/* VECTOR TOP MENU */
ul.VectorTopColList {
	padding: 0 ;
	margin: 0 ;
}

	ul.VectorTopColList li {
		font-size: 1.2em ;
		margin: 0 ;
		list-style-type: none ;
		line-height: 1.2em ;
		padding: 0.2em ;
		padding-left: 1em ;
		transition: ease all 0.5s ;
	}

	ul.VectorTopColList li:hover {
		background-color: #FFF ;
	}

div.CartItemCount {
	font-size: 0.9rem ;
	position: absolute ;
	top: -0.8rem ;
	right: -0.7rem ;
	background-color: red ;
	border-radius: 50% ;
	width: 1.4rem ;
	height: 1.4rem ;
	text-align: center ;
}

/* VECTOR LIST TABLE CELLS */
.TDVecMY {
	min-width: 8rem ;
}

.TDVecCat {
	max-width: 12rem ;
}

.TDVecP {
	min-width: 12rem ;
}

.TDVecMY, .TDVecCat, .TDVecP, .TDVecC {
	text-align: center !important ;
	font-size: 0.9rem ;
}

.TDVecC {
	font-size: 1.2rem ;
	max-width: 5rem ;
}

table.VectorInfo {

}

	table.VectorInfo tr td {
		padding: 0.6rem 0rem ;
	}

	ul.VectorFormatsList {
		margin: 0 ;
		padding: 0 ;
		list-style-type: none ;
	}

		ul.VectorFormatsList li {
			font-size: 0.9rem ;
			vertical-align: middle ;
		}

div.VectorNotes {
	display: none ;
}

tr.CartDiscount td, tr.CartDiscount th {
	background-color: #fce255 !important ;
}

tr.CartPromoCode td, tr.CartPromoCode th {
	background-color: #55bffc !important ;
}

table.VectorFileFormats {
	border-collapse: collapse ;
	width: 100% ;
}

	table.VectorFileFormats tr td { border: 0 ; font-size: 0.9rem ; }

img.PaymentMethod {
	height: 3rem ;
	opacity: 0.55 ;
}

div.PaymentBox, div.PaymentBox * {
	transition: all 0.35s ;
}

div.PaymentBox h3 {
	padding: 0rem ;
	margin: 0rem ;
}

div.PaymentBox:hover {
	background-color: #EEE ;
	cursor: pointer ;
	box-shadow: inset 0 0 0.5rem #999 !important ;
}

div.PaymentBox:hover * {
	transform: scale(1.15) ;
	opacity: 1 ;
}

div.PaymentBoxSelected, div.PaymentBoxSelected:hover {
	/* background-color: #4bc84b !important ; */
	background-color: #DDD !important ;
	box-shadow: inset 0 0 0.2rem #333 !important ;
}

div.PaymentBoxSelected * {
	opacity: 1 ;
}

/* CREDITS */
div.VectorCreditsContainer {
	max-width: 50rem ;
	margin: 0em auto ;
	padding: 3em 0 ;
}

	div.VectorCreditsColumn {
		float: left ;
		width: 450px ;
	}

		img.CurrencyFlag {
			max-height: 1.5rem ;
			box-shadow: 0 0 0.3rem #666 ;
		}

		table.VectorCredits {
			width: 100% ;
			border-collapse: collapse ;
		}

			td.VectorCreditsProductCol, td.VectorCreditsProductCol2 {
				text-align: center ;
				font-size: 1.5em ;
				font-weight: 600 ;
				width: 25% ;
			}

			td.VectorCreditsProductCol2 {
				font-size: 1.2em ;
			}

			table.VectorCredits tr.VectorCreditsRow0 td, table.VectorCredits tr.VectorCreditsRow1 td, table.VectorCredits tr th {
				padding: 0.3em 0em ;
				margin: 0px ;
			}

			table.VectorCredits tr th {
				background-color: #E6E6E6 ;
			}

			table.VectorCredits tr.VectorCreditsRow1 td {
				background-color: #F7F7F7 ;
			}

			table.VectorCredits tr.VectorCreditsRow0:hover td, table.VectorCredits tr.VectorCreditsRow1:hover td {
				background-color: #f0c60c ;
				transition: background-color 0.5s ;
			}

			button.BuyNow {
				transition: all 0.5s !important ;
			}

			button.BuyNow:hover {
				padding-left: 2.25rem !important ;
				padding-right: 2.25rem !important ;
				background-color: #2374bd !important ;
			}

	div.PaymentMethodBox {
		margin-bottom: 0.5em ;
	}

	div.PaymentMethodTabContainer {
	}

		div.PaymentMethodTab, div.PaymentMethodTabActive {
			float: left ;
			text-align: center ;
			opacity: 0.5 ;
			background-color: white ;
			border-radius: 0.5em ;
			margin-bottom: 0.3em ;
			margin-right: 0.5em ;
			padding: 0 0.5em ;
			transition: all 0.5s ;
			border-bottom: 3px solid transparent ;
		}

		div.PaymentMethodTabActive {
			opacity: 1.0 ;
			border-bottom: 3px solid #95bb49 ;
			z-index: 1 ;
		}

		div.PaymentMethodTab:hover {
			border-bottom: 3px solid #95bb49 ;
		}

		div.PaymentMethodTab:hover, div.PaymentMethodTab:hover * {
			opacity: 1.0 ;
			cursor: pointer ;
		}

		img.PayMethod {
			padding: 0.2rem 0.1rem ;
		}

	div.PaymentSecureContainer {
		display: flex ;
		flex-direction: row ;
		flex-wrap: wrap ;
		font-size: 1.1em ;
		border-top: 1px solid white ;
		text-align: center ;
		padding: 0.5em ;
		padding-top: 1em ;
		margin-top: 1em ;
	}

		div.PaymentSecureBox {
			flex: 1 ;
			min-width: 150px ;
		}

	select.BankIssuer option {
		padding-left: 20px ;
		line-height: 200% ;
		background-position: left center ;
		background-repeat: no-repeat ;
	}

	div.CreditOverviewTableContainer {
		position: relative ;
		background-color: white ;
		padding: 0.5em ;
		border-radius: 0.5em ;
	}

/* VECTOR SETS */
div.VectorSetMenuContainer {
	display: flex ;
	flex-flow: column nowrap ;
	text-align: center ;
}

div.VectorSetListContainer {
	display: flex ;
	flex-flow: row wrap ;
	margin: 1em 0 ;
}

	div.VectorSetMenuItem {
		flex: 1 1 auto ;
		text-align: center ;
		transition: all 0.5s ;
		padding: 0.5em 0 ;
		background-color: #EEE ;
		transition: all 1.0s ;
	}

		div.VectorSetMenuItem:hover {
			background-color: white ;
		}

	div.VectorSetBox {
		flex: 1 ;
		min-width: 20em ;
		transition: all 0.5s ;
		background-color: white ;
		text-align: center ;
		padding: 0.25em ;
		margin: 0.25em ;
	}

		div.VectorSetBox:hover {
			background-color: #EEE ;
		}

			div.VectorSetBox:hover a img {
				box-shadow: 0 0 5px 0 #888 ;
				background-color: white ;
				padding: 3px ;
				border: 0 ;
			}

div.VectorSetBox a {
	font-size: 0.8em ;
	font-weight: 400 ;
	color: #1c5d99 ;
}

div.VectorSetBox a {
	font-size: 0.9em ;
}

img.VectorSetImage {
	border: 0px ;
	padding: 3px ;
	max-width: 250px ;
	width: 100% ;
	transition: all 0.5s ;
}

/* UPCOMING */
input.SearchUpcoming {
	font-size: 1.5em ;
	width: 30% ;
	min-width: 10em ;
	margin: 0 auto ;
	padding: 0.2em 0.5em ;
}

div.UpcomingContainer {
	display: flex ;
	flex-flow: row wrap ;
}

	div.UpcomingBox {
		flex: 1 ;
		min-width: 14em ;
		margin: 0.2em ;
		text-align: center ;
		background-color: white ;
		border-radius: 0.3em ;
		padding: 0.5em 0.25em ;
		transition: all 0.5s ;
		max-width: 250px ;
	}

		div.UpcomingBox:hover {
			/*
			box-shadow: 0 0 0.5em 0 #888 ;
			*/
			background-color: transparent ;
		}

			div.UpcomingBox img.UpcomingThumb {
				transition: all 0.5s ;
			}

			div.UpcomingBox:hover img.UpcomingThumb {
				box-shadow: 0 0 0.5em 0 #555 ;
			}

		div.UpcomingModal {
			display: none ;
		}


div.UpcomingPopColContainer {
	display: flex ;
	flex-flow: row wrap ;
}

	div.UpcomingPopCol {
		flex: 1 ;
		min-width: 250px ;
	}

	img.UpcomingPopThumb {
		width: 100% ;
		max-width: 225px ;
		margin-top: 0.25em ;
		padding: 0.5em ;
		background-color: white ;
		border-radius: 0.5em ;
	}

/* WHAT ARE AND HOW TO */

	ul.VectorExampleList {

	}

		ul.VectorExampleList li, ol.VectorExampleList li {
			margin-left: 1em ;
			line-height: 2em ;
		}

	a.VectorExampleLink {
		border: 0 ;
		text-decoration: none ;
		padding: 0.2em ;
	}

	a.VectorExampleLink:hover {
		border: 0 ;
		text-decoration: underline ;
	}

	a.VectorIMGExampleLink img {
		padding: 3px ;
		border: 0 ;
	}

	a.VectorIMGExampleLink:hover {
		border: 0 ;
	}

	a.VectorIMGExampleLink:hover img {
		box-shadow: 0 0 5px 0 #888 ;
		background-color: white ;
		padding: 3px ;
		transition: all 0.5s ;
		border: 0 ;
	}

	td.ai a, td.eps a, td.pdf a, td.svg a, td.dwg a, td.dxf a {
		color: black ;
		transition: all 0.5s ;
	}

	td.ai:hover, td.eps:hover, td.pdf:hover, td.svg:hover, td.dwg:hover, td.dxf:hover {
		background-color: black ;
		transition: all 0.5s ;
	}

	td.ai:hover a, td.eps:hover a, td.pdf:hover a, td.svg:hover a, td.dwg:hover a, td.dxf:hover a {
		color: white ;
		transition: all 0.5s ;
	}

	td.ai, td.pdf, td.eps, td.svg, td.dwg, td.dxf {
		text-align: center ;
		height: 2rem ;
	}

	td.ai {
		background-color: #f5aa2b ;
	}

	td.pdf {
		background-color: #f21012 ;
	}

	td.eps {
		background-color: #f5aa2b ;
	}

	td.svg {
		background-color: #f8c64b ;
	}

	td.dwg {
		background-color: #1375b4 ;
	}

	td.dxf {
		background-color: #00b5ee ;
	}

/* INVOiCE */
div.InvoiceContainer table tr td, div.InvoiceContainer table tr th {
	padding: 0.3rem ;
}