div.AccountBoxContainer {
	display: flex ;
	flex-direction: row ;
  	justify-content: space-between;
  	flex-wrap: wrap;
	margin-top: 1rem ;
}

	div.AccountBox {
		flex: 1 ;
		min-width: 300px ;
		width: 49.5% ;
		padding: 1rem ;
		border-radius: 0.5rem ;
		border: 1px solid #DDD ;
		margin-left: 0.5% ;
	}

div.AccountMenuContainer {
	display: flex ;
	flex-direction: row ;
	justify-content: space-between ;
	flex-wrap: wrap ;
	width: 100% ;
	margin-top: 1rem ;
	margin-bottom: 1rem ;
}

	div.AccountMenuItem {
	  box-sizing: border-box ;
	  width: calc(1/5*100% - (1 - 1/5)*1rem) ;
	  padding: 0.5rem ;
	  border: 1px solid #DDD ;
	  border-radius: 0.25rem ;
	  text-align: center ;
	  min-width: 13rem ;
	  transition: all 0.5s ;
	}

	div.AccountMenuItemSelected {
		background-color: #2b65b0 ;
		color: white ;
	}

	div.AccountMenuItemSelected a {
		color: white ;
	}

	div.AccountMenuItem:hover {
		background-color: #EEE ;
		box-shadow: 0 0 0.5rem #CCC ;
		cursor: pointer ;
	}
div.AdminTopMenu {
	display: flex ;
	flex-flow: row wrap ;
}

	div.AdminTopMenuItem {
		flex: 1 ;
		text-align: center ;
		border-radius: 0.2rem ;
		transition: all 0.5s ;
		padding: 0.3rem ;
	}

		div.AdminTopMenuItem:hover {
			background-color: #07BCDB ;
		}

table.AdminTable {
	width: 100% ;
	border-collapse: collapse ;
	margin-bottom: 10px ;
}

	table.AdminTable tr td {
		text-align: center ;
		padding: 3px ;
	}

	table.AdminTable tr.Weekend td {
		background-color: #EEE ;
	}

	table.AdminTable tr:hover td {
		background-color: #07BCDB ;
	}

	table.AdminTable tr.Highlight td {
		background-color: #FFFFFF ;
	}

table.AllStatistics {
	width: 66% ;
	border-collapse: collapse ;
	margin-bottom: 10px ;
}

	table.AllStatistics tr:nth-child(even) {
		background-color: white ;
	}

	table.AllStatistics tr td {
		text-align: center ;
		transition: all 0.5s ;
	}

	table.AllStatistics tr:hover td {
		background-color: #07BCDB ;
	}
.c {
	text-align: center ;
}

.l {
	text-align: left ;
}

.r {
	text-align: right ;
}
div.BreadcrumbContainer {
	
}

.BreadcrumbContainer, .BreadcrumbContainer ol {
	margin: 0 ; padding: 0 ;

}

	.BreadcrumbContainer ol {
		margin-top: 0.5rem ;
		margin-bottom: 0.5rem ;
	}

	.breadcrumb-arrow {
	    height: 30px ;
	    padding: 0 ;
	    line-height: 30px ;
	    list-style: none ;
	    /*background-color: #e6e9ed ;*/
		 transition: all 0.5s ;
	}
	.breadcrumb-arrow li:first-child a {
	    border-radius: 4px 0 0 4px ;
	}
	.breadcrumb-arrow li, .breadcrumb-arrow li a, .breadcrumb-arrow li span {
	    display: inline-block;
	    vertical-align: top
	}
	.breadcrumb-arrow li:not(:first-child) {
	    margin-left: -4px
	}
	.breadcrumb-arrow li+li:before {
	    padding: 0;
	    content: ""
	}
	.breadcrumb-arrow li span {
	    padding: 0 10px ;
	}
	.breadcrumb-arrow li a, .breadcrumb-arrow li:not(:first-child) span {
	    height: 30px;
	    padding: 0 5px 0 20px;
	    line-height: 30px ;
	}
	.breadcrumb-arrow li:first-child a {
	    padding: 0 5px ;
	}
	.breadcrumb-arrow li a {
	    position: relative;
	    color: #fff;
	    text-decoration: none;
	    background-color: #2b65b0 ;
	    border: 0px solid #2b65b0 ;
		 transition: all 0.5s ;
	}
	.breadcrumb-arrow li:first-child a {
	    padding-left: 10px ; ;
	}
	.breadcrumb-arrow li a:after, .breadcrumb-arrow li a:before {
	    position: absolute ;
		 top: 0px ;
	    width: 0px ;
	    height: 0 ;
	    content: '' ;
	    border-top: 15px solid transparent ;
	    border-bottom: 15px solid transparent ;
		 transition: all 0.5s ;
	}
	.breadcrumb-arrow li a:before {
	    right: -10px;
	    z-index: 3;
	    border-left-color: #2b65b0;
	    border-left-style: solid;
	    border-left-width: 11px ; ;
	}
	.breadcrumb-arrow li a:after {
	    right: -11px;
	    z-index: 2;
	    border-left: 11px solid #2494be ;
	}
	.breadcrumb-arrow li a:focus, .breadcrumb-arrow li a:hover {
	    background-color: #4fc1e9 ;
	    border: 0px solid #4fc1e9 ;
	}
	.breadcrumb-arrow li a:focus:before, .breadcrumb-arrow li a:hover:before {
	    border-left-color: #4fc1e9 ;
	}
	.breadcrumb-arrow li a:active {
	    background-color: #2494be ;
	    border: 0px solid #2494be ;
	}
	.breadcrumb-arrow li a:active:after, .breadcrumb-arrow li a:active:before {
	    border-left-color: #2494be ;
	}
	.breadcrumb-arrow li span {
	    color: #434a54 ;
	}
div.CartContainer {
	margin: 0 auto ;
	max-width: 900px ;
}

	table.VectorCart {
		width: 100% ;
	}

		table.VectorCart tr.VectorCartRow {
			border-bottom: 1px solid #2b65b0 ;
		}

		table.VectorCart tr th {
			font-size: 1.1rem ;
			padding: 0.2rem ;
			text-align: center ;
		}

		table.VectorCart tr.Discount th {
			font-size: 16px ;
			background-color: #f5d547 !important ;
			color: black ;
		}

		table.VectorCart tr td {
			padding: 5px ;
			transition: all 0.5s ;
		}

		table.VectorCart tr:hover td {
				background-color: #07BCDB ;
		}

	div.CartPaymentChoices {
		margin-top: 1rem ;
		display: flex ;
		flex-flow: row wrap ;
	}

		div.CartPaymentOptionBox {
			flex: 1 ;
			min-width: 10rem ;
			max-width: 25% ;
			text-align: center !important ;
			padding: 0.5rem ;
			border: 1px solid #DDD ;
			border-radius: 0.3rem ;
			transition: all 0.5s ;
			margin-right: 0.5rem ;
			margin-bottom: 0.5rem ;
		}

		div.CartPaymentOptionBox:hover {
			box-shadow: 0 0 1rem #DDD ;
			background-color: #EEE ;
			cursor: pointer ;
		}

			div.CartPaymentOptionImageContainer {
				min-height: 2.5rem ;
			}

				img.PaymentOptionIcon {
					min-height: 1.8rem ;
					max-height: 2.2rem ;
					max-width: 7rem ;
				}

		div.CPOB_Selected {
			border: 1px solid #2b65b0 ;
			background-color: #DDD ;
		}


	div.CartPaymentSwitchContainer {
		padding: 0.5rem 0 ;
		display: flex ;
		flex-flow: row wrap ;
	}

		div.CartPaymentSwitchItem {
			flex: 1 ;
			text-align: right ;
			font-weight: 400 ;
			height: 40px ;
			border-radius: 0.5rem ;
			padding: 0.3rem ;
		}

			div.CPSI_PayPal, div.CPSI_CC {
				flex: 0 0 180px ;
				text-align: center ;
				border: 2px solid transparent ;
				transition: all 0.5s ;
			}

			div.CPSI_PayPal:hover, div.CPSI_CC:hover {
				border: 2px solid #2b65b0 ;
				background-color: #CCC ;
				cursor: pointer ;
			}

			div.CPSI_PayPal {
				border-top-right-radius: 0 ;
				border-bottom-right-radius: 0 ;
			}

			div.CPSI_CC {
				border-top-left-radius: 0 ;
				border-bottom-left-radius: 0 ;
			}

			div.CPSI_Selected {
				border: 2px solid #2b65b0 ;
				background-color: #DDD ;
			}
.ContactContainer {
	margin: 0 auto ;
	max-width: 600px ;
}
.centeredBox {
	margin: 0 auto !important ;
	max-width: 40rem !important ;
}

/* https://coolors.co/2b65b0-db3069-f5d547-ebebd3-3c3c3b */
/* Warnings and Error boxes */
.MessageWarning, .MessageError, .MessageSuccess {
	margin: 0.6rem 0px ;
	padding: 10px ;
	background-color: #f5d547 ;
	position: relative ;
}

	div.MessageWarning:before {
    	font-family: FontAwesome ;
    	content: "\f071" ;
	}

	.MessageWarning * {
		font-size: 1rem ;
	}

	.MessageSuccess {
		color: white ;
		background-color: #99c24d ;
	}

.MessageError {
	color: white ;
	background-color: #f93943 ;
}

/* Buttons */

/*
button {
	border: 0px solid white ;
	background-color: #2b65b0 ;
	color: white ;
	transition: all 0.4s ;
	font-size: 1.2rem ;
	border-radius: 0.3rem ;
	padding: 0.3rem 0.6rem ;
}
*/

	button div {
		font-size: 1.2rem ;
	}

.green {
	background-color: #76b041 !important ;
	color: white !important ;
}

.buybutton {
	margin: 1rem 0rem ;
	padding: 0.5rem 0.7rem ;
	font-size: 1.3rem ;
}

	button:hover {
		background-color: #3780df ;
		cursor: pointer ;
		box-shadow: 0 0 0.5rem 0 #555 ;
	}

	button:active {
		/*
		padding-top: 0.4rem ;
		padding-bottom: 0.2rem ;
		*/
	}

/* Forms, input */
textarea {
	width: 100% ;
}

fieldset {
	padding: 0px ;
	margin: 0px ;
	border: 0px ;
	display: flex ;
	flex-flow: row wrap ;
	max-width: 500px ;
}

	fieldset label {
		flex: 1 ;
		flex-basis: 200px ;
		width: 200px ;
		margin-bottom: 0.5rem ;
		border: 0px solid blue ;
		font-size: 1rem ;
	}

	input[type=text], input[type=date], input[type=email], input[type=password] {
		flex: 1 ;
		flex-basis: 250px ;
		width: 250px ;
		box-shadow: inset 0 1px 2px 1px #BBB ;
		border-radius: 4px ;
		border: 0px ;
		padding: 0.5rem ;
		transition: all 0.5s ;
		margin-bottom: 0.5rem ;
	}

input.TextInput:focus {
	background-color: #EEE ;
}

input[type=checkbox], input[type=radio] {
	vertical-align: middle ;
	position: relative ;
	bottom: 0.5rem ;
}
div.FrontpageTop {
	display: flex ;
	flex-flow: row wrap ;
	margin-top: 1.5rem ;
	margin-bottom: 1.5rem ;
}

	div.FrontpageTopItem {
		flex: 1 ;
		padding: 0.5rem ;
		border-radius: 0.5rem ;
		line-height: 1.3rem ;
		color: white ;
		font-size: 0.9rem ;
	}

	div.FrontpageTop .blue  {
		color: white ;
		background-color: #2b65b0 ;
	}

		div.FrontpageTopItem h2 {
			margin-bottom: 0.5rem ;
			color: white ;
		}

div.FrontpageGroupBox {
	padding: 0.66rem 0 ;
}

	div.FrontpageGroupBox ul {
		margin: 0 ; padding: 0 ;
		display: flex ;
		flex-flow: row wrap ;
	}


	div.FrontpageGroupBox ul li {
		flex: 1 ;
		list-style-type: none ;
		margin: 0 ; padding: 0 ;
		min-width: 200px ;
		max-width: 200px ;
	}
div.HowItWorkStepContainer {

}

	div.HowItWorkStepContainer ol {
		margin-left: 1rem ;
		padding: 0 ;
	}

		div.HowItWorkStepContainer ol li {
			font-size: 1rem ;
			padding: 0.5rem ;
		}

table.DiscountTable {
	width: 300px ;
}

	table.DiscountTable tr:nth-child(odd) td {
		background-color: #E5E5E5 ;
	}

		table.DiscountTable tr td, table.DiscountTable tr th {
			background-color: white ;
			padding: 3px ;
			font-size: 18px ;
			text-align: center ;
		}

		table.DiscountTable tr th {
			color: white ;
			background-color: #2b65b0 ;
		}

div.ExampleContainer {
	display: flex ;
	flex-flow: row wrap ;
	margin-top: 1em ;
}

	div.ExampleCol {
		flex: 1 ;
		min-width: 300px ;
		text-align: center ;
	}

		div.ExampleCol p a {
			padding: 0.2rem ;
			background-color: #2b65b0 ;
			border-radius: 0.2rem ;
			color: white ;
			transition: background-color 0.5s ;
		}

			div.ExampleCol p a:hover {
				background-color: white ;
				color: #2b65b0 ;
			}

	.examplefileicon {
		width: 1rem ;
	}

	.ExampleImage {
		width: 100% ;
		margin: 0.5em ;
		max-width: 350px ;
	}
form.LoginForm, form.RegisterForm {
	width: 500px ;
	margin: 0 auto ;
	margin-top: 1rem ;
}

	form.LoginForm fieldset, form.RegisterForm fieldset {
		padding-top: 1rem ;
	}
body {
	margin: 0 ; padding: 0 ;
}

a, input, button, form, select, option, p, span, ul, li, ol, div, p, span, table, tr, td, th, tbody, pre, textarea {
	font-size: 14px ;
	font-family: 'Montserrat', sans-serif !important ;
	font-weight: 300 !important ;
}

h1, h2, h3, h4, h5 {
	font-family: 'Montserrat', sans-serif ;
	font-weight: 500 !important ;
	margin: 0 ;
}

a {
	text-decoration: none ;
	color: black ;
	font-weight: 500 !important ;
	border: 0 ;
}

	a:hover {
		text-decoration: underline ;
	}

	a:active {
    	outline: none ;
	}

table {
	border-collapse: collapse ;
	width: 100% ;
}

img.icon {
	vertical-align: middle ;
}

img.filetypeicon {
	vertical-align: middle ;
	width: 1.5rem ;
}

img.ccicon {
	height: 1.75rem ;
}

hr {
	border: 0px ;
	background-color: #2b65b0 ;
	height: 1px ;
}

table tr th {
	color: white ;
	background-color: #2b65b0 ;
}

.clearBoth, .ClearBoth { clear: both ; }

.hand:hover { cursor: pointer ;}

div.InlineModal {
	max-width: 30rem ;
	margin: 1rem auto ;
}

/* HEADER */

.HeaderContainer {
	background-color: #140f2d ;
	box-shadow: 0px 0px 8px 0px #444 ;
	position: sticky ;
	top: 0 ;
	z-index: 999 ;
}

header {
	position: sticky !important ;
	top: 0 ;
	max-width: 1200px ;
	margin: 0 auto ;
	display: flex ;
	flex-flow: row wrap ;
	/* flex-flow: column nowrap ; */
	align-items: center ;
	align-content: center ;
}

	img.HeaderLogo {
		height: 4rem ;
		margin-top: 0.3rem ;
		transition: all 0.5s ;
	}

		img.HeaderLogoSmaller {
			height: 2rem ;
		}

	.HeaderItem {
		flex: 1 ;
		flex-basis: auto ;
		font-size: 0 ;
		padding: 0.5rem 0.7rem ;
		transition: all 0.5s ;
	}

	.HeaderItemLogo {
		padding: 0 ;
	}

	.HeaderItem:hover {
		background-color: #333 ;
	}

		.HeaderItem a {
			font-size: 1.3rem ;
			color: white ;
			transition: all 0.5s ;
		}

		a.Selected {
			color: #E1E100 ;
		}

	.HeaderItemRight {
		color: white ;
		margin-left: auto ;
		text-align: center ;
	}

	.HeaderInput {
		margin-top: 0.5rem ;
		padding: 3rem ;
	}

	.HeaderInputButton {
		font-size: 0.9rem ;
		margin-left: -0.5rem ;
		padding: 0.5rem 0.5rem ;
		border-top-left-radius: 0 ;
		border-bottom-left-radius: 0 ;
	}

	div.HeaderCart {
		position: relative ;
	}
		/* div.CartCount {
			position: absolute ;
			top: 25% ; right: 0.25rem ;
			text-align: center ;
			background-color: #f93943 ;
			color: white ;
			font-weight: bold ;
			min-width: 1.25rem ;
			font-size: 1rem ;
			border-radius: 1rem ;
		} */

	.HeaderItemDropDown {
		display: none ;
		min-width: 10rem ;
		position: absolute ;
		top: 4.8rem ;
		right: 0 ;
		background-color: white ;
		box-shadow: 0px 0px 8px 0px #444 ;
	}

	.HeaderItemDropDownContainer {
		position: relative ;
	}

	.HeaderItemDropDownContainer:hover {
		cursor: pointer ;
	}

	/*
	.HeaderItemDropDownContainer:hover .HeaderItemDropDown {
		display: block ;

		opacity: 1 ;
	}
	*/

/* MAIN */
main {
	width: 100% ;
	max-width: 1200px ;
	min-height: 400px ;
	margin: 0 auto ;
	z-index: 10 ;
}

/* FOOTER */

.footerContainer {
	background-color: #EEE ;
}

footer {
	display: flex ;
	margin: 0 auto ;
	margin-top: 2em ;
	padding: 1em 0 ;
	/* border-top: 1px solid #DDD ; */
	max-width: 1200px ;
}

	.FooterCol {
		flex: 1 ;
	}

	ul.FooterList {
		margin: 0 ;
		padding: 0 ;
	}

		ul.FooterList li {
			list-style-type: none ;
			margin-bottom: 0.4rem ;
		}
div.SearchContainer {
	width: 35rem ;
	margin: 0 auto ;
	margin-top: 1rem ;
}

	div.SearchIDBreak {
		background-color: #2b65b0 ;
		padding: 0.2rem 0.3rem ;
		margin-top: 0.5rem ;
		color: white ;
		text-shadow: 1px 1px 2px #000 ;
	}

		div.SearchIDBreak a {
			color: white ;
			font-size: 1.1rem ;
		}
/* Menu */
.TemplateIndexMenu {

}

	ul.TemplateIndex {
		display: flex ;
		flex-flow: row wrap ;
		align-items: center ;
		margin: 0 ; margin-bottom: 0.5rem ; padding: 0 ;
		background-color: rgb(212, 212, 212) ;
		border-radius: 0.3rem ;
	}

		ul.TemplateIndex li {
			flex: 1 ;
			/* padding: 0.1rem 0.2rem ; */
			list-style-type: none ;
			text-align: center ;
			transition: all 0.5s ;
			min-height: 6.5rem ;
		}

		li.TemplateIndexMenuSelected {
			background-color: #FFFFFF !important ;
			box-sizing: border-box ;
    		-moz-box-sizing: border-box ;
    		-webkit-box-sizing: border-box ;
			border: 1px solid #EEE ;
		}

		ul.TemplateIndex li:hover {
			background-color: #FFFFFF ;
		}

		img.TemplateIndexMenuImage {
			max-height: 4rem !important ;
		}

/* Thumb List */
.TemplateListContainer {
	display: flex ;
	flex-flow: row wrap ;
}

	.TemplateBrandListBox {
		flex: 1 ;
		position: relative ;
		margin: 3px ;
		max-width: 234px ;
		min-width: 234px ;
	}

	.TemplateBrandListBox:first-child {
		margin-left: 0 ;
	}

	div.TemplateBrandListBoxImageContainer {
		overflow: hidden ;
	}

		.TemplateBrandListBox a img {
			width: 100% ;
			transition: transform 0.5s ;
			z-index: 1 ;
		}
			.TemplateBrandListBox a img:hover {
				transform: scale(1.05) ;
			}

	.TemplateBrandListBoxTitle {
		background-color: rgb(192, 192, 192) ;
		padding: 0.2rem ;
		transition: all 0.5s ;
	}

	.TemplateBrandListBoxTitle:hover {
		background-color: rgb(212,212,212) ;
	}

	.TemplateBrandListBoxYear {
		font-size: 1rem ;
		background-color: rgb(212, 212, 212) ;
		padding-left: 0.2rem ;
		z-index: 50 ;
	}

	.TemplateBrandListBoxPrice {
		position: absolute ;
		right: 0 ;
		bottom: 0 ;
		background-color: #2b65b0 ;
		color: white ;
		padding: 0.1rem 0.2rem ;
		border-radius: 0.2rem ;
		z-index: 50 ;
	}

	.TemplateBrandListBoxPrice a {
		color: white ;
	}

	/* GROUP */
	div.BrandListContainer {
		display: flex ;
		flex-flow: row wrap ;
		width: 100% ;
	}

		div.BrandListContainer table.BrandList {
			flex: 1 ;
			width: 24.7% ;
			min-width: 150px ;
			margin-right: 0.3% ;
		}

			table.BrandList tr td {
				padding-left: 0.3rem !important ;
				transition: all 0.5s ;
			}

			table.BrandList tr td:hover {
				padding-left: 0.45rem !important ;
			}

			table.BrandList tr td, table.BrandList tr td a {
				font-size: 1rem ;
			}

			table.BrandList tr td.BrandCount {
				width: 2.5rem ;
				text-align: center ;
				color: #2b65b0 ;
			}

			table.BrandList tr:nth-child(even) {
				background: #E5E5E5 ;
			}

			table.BrandList tr:hover td {
				background-color: #6f9ceb ;
			}

			table.BrandList tr:hover td.BrandCount {
				color: white ;
			}

			table.BrandList tr td {
				transition: all 0.5s ;
				padding: 3px ;
			}

	/* SHOW */
	div.VectorShowTitle {
		margin-top: 2rem ;
		margin-bottom: 1rem ;
	}

	div.VectorShowContainer {
		margin-bottom: 2rem ;
		display: flex ;
		flex-flow: row wrap ;
	}

		div.VectorShowInfo {
			flex: 1 ;
			min-width: 300px;
			width: 750px ;
		}

			div.VectorShowInfo table tr td, div.VectorShowInfo table tr th {
				padding: 0.2rem ;
			}

			div.VectorShowInfo table tr td:first-child, div.VectorShowInfo table tr td span {
				font-size: 0.9rem ;
			}

				ul.VectorFormatsList {
					margin: 0 ; padding: 0 ;
				}

				ul.VectorFormatsList li {
					list-style-type: none ;
					margin: 0.3rem ;
				}

		div.VectorShowPreview {
			flex: 1 ;
			width: 400px ;
		}

			img.VectorPreview {
				width: 100% ;
				max-width: 500px ;
				min-width: 300px;
				border-radius: 3px ;'
			}

		div.VectorShowPreviewWM {
			display: none ;
		}

	div.VectorRelatedTitle {
		margin-bottom: 0.66rem ;
	}

	img.VectorIcon {
		height: 1.2rem ;
	}
