/*Fonts */
	@font-face	{font-family: openSans; src: url('/assets/fonts/openSans.woff'); font-weight: normal; font-style: normal;}
	@font-face	{font-family: openSans; src: url('/assets/fonts/openSansBold.woff'); font-weight: bold; font-style: normal;}
	@font-face	{font-family: openSans; src: url('/assets/fonts/openSansItalic.woff'); font-weight: normal; font-style: italic;}
	@font-face	{font-family: caviarDreams; src: url('/assets/fonts/caviarDreams.woff'); font-weight: normal; font-style: normal;}
	@font-face	{font-family: caviarDreams; src: url('/assets/fonts/caviarDreamsBold.woff'); font-weight: bold; font-style: normal;}

/*Basics */
	body
		{background-color: white; color: #222222; font-family: openSans, sans-serif; font-size: 1em; margin: 0; -ms-overflow-style: -ms-autohiding-scrollbar; scroll-behavior: smooth;}
	h1
		{color: black; font-family: caviarDreams, sans-serif; font-size: 1.5em; margin: 0;}
	h2
		{color: black; font-size: 1.25em; text-transform: uppercase; margin: 0;}
	h3
		{color: black; font-size: 1.15em; margin: 0;}
	p
		{margin: 0;}
	strong
		{font-weight: bold;}
	img
		{vertical-align: middle; border: 0;}
	a
		{color: black; text-decoration: none;}
	a:hover
		{text-decoration: underline;}

/*Layout */
	.page
		{width: 100%; min-height: 100vh; display: flex; flex-direction: column; overflow-x: hidden;}
	header
		{margin: 1em 5% 0 5%; flex: none;}
	.usrControls
		{margin-bottom: 1em; text-align: right;}
	.usrControlsBlank
		{margin-bottom: 0.5em;}
	.logo
		{width: 60%; display: inline-block; vertical-align: middle;}
	.iconBox
		{width: 40%; display: inline-block; text-align: right; vertical-align: middle;}
	.cartIcon
		{width: 2em; margin-right: 1em; display: inline-block; vertical-align: middle; position: relative;}
	.iconNum
		{background-color: red; color: white; font-size: 0.75em; padding: 0.15em 0.45em 0.15em 0.5em; position: absolute; right: 1.33em; top: -0.5em; border-radius: 50%;}
	.trigram
		{width: 1.5em; display: inline-block; vertical-align: middle;}
	.trigramX
		{width: 1.5em; position: absolute; right: 5%; top: 1.5em;}
	.menu
		{background-color: black; color: white; width: 100%; height: 100vh; text-align: left; position: fixed; left: 0%; top: 0; z-index: 110; overflow: auto; transition: 0.75s;}
	.menu0
		{left: 100%;}
	.menuOptions
		{ font-family: caviarDreams, sans-serif; letter-spacing: 0.5px; font-size: 1.15em; width: 100%; padding-top: 3.5em;}
	a.menuOption1, a.menuOption2
		{color: white; text-decoration: none; text-transform: uppercase; width: 85%; padding: 0.66em 7.5%; display: inline-block; border-bottom: 1px solid #cccccc;}
	a.menuOption2
		{background-color: white; color: #222222;}
	.menuBox
		{background-color: black; width: 100%; padding: 0.25em 0; margin-top: 0.75em;}
	.searchControl
		{width: calc(100% - 1em); margin: auto;}
	.search
		{background-color: black; color: white; width: calc(100% - 2.01em); display: inline-block; vertical-align: middle; border: 0;}
	.searchIcon
		{width: 1.5em; margin: 0.33em 0 0.25em 0; display: inline-block; text-align: right; vertical-align: middle;}

	.banner
		{width: 90%; margin: auto; flex: none;}
	.bannerHalf1, .bannerHalf2
		{width: 47.75%;}
	.bannerHalf1
		{xmargin-right: 5%;}
	.main, .mainNarrow
		{width: 90%;  margin: auto; flex: auto;}
	.mainGapTop
		{margin-top: 3.5em;}
	.catsBar
		{margin-top: 2.5em -0.25em 0 -0.25em;}
	.catBar
		{font-size: 1.5em; width: calc(50% - 2.5em - 2px); padding: 0.75em; margin: 0.25em; display: inline-block; text-align: center; vertical-align: middle; border: 1px solid #fcfcfc;}
	.catBar:hover
		{text-decoration: none; border: 1px solid #666666;}
	.catIcon
		{width: 80%; margin-bottom: 0.33em;}
	.slots3
		{margin-top: 2.5em;}
	.slot3
		{width: 33.33%; display: inline-block; vertical-align: middle; opacity: 1; transition: 0.75s;}
	.slot3:hover
		{opacity: 0.75;}

	.makes
		{white-space: nowrap; width: 100%; margin: 4em 0; position: relative; overflow: hidden;}
	.makesBox
		{position: relative; left: 0%; transition: 0.75s;}
	.make1, .makeX
		{width: 46%; margin: 0 2%; display: inline-block; vertical-align: middle; opacity: 1; box-sizing: border-box; transition: 0.75s;}
	.makeX
		{}
	.make1:hover, .makeX:hover
		{opacity: 0.75;}
	.makesArrowLast
		{height: 1.5em; position: absolute; left: 0; top: calc(50% - 0.75em);}
	.makesArrowNext
		{height: 1.5em; position: absolute; right: 0; top: calc(50% - 0.75em);}
	.makesArrow
		{height: 100%; opacity: 0.5;}
	.makesArrow:hover
		{opacity: 1;}

	.grpText
		{width: 90%; padding: 0 1em; margin: auto; text-align: center; position: relative; top: 0em; opacity: 1; box-sizing: border-box; transition: 0.75s;}
	.grpText h1
		{color: #b9b9b9; font-weight: bold; text-transform: uppercase;}
	.grpLabel0
		{top: 1.5em; opacity: 0;}
	.grpTextRuler
		{margin: 2.5em 0 1em 0; border-bottom: 1px solid #b9b9b9;}
	.grpTextTitle
		{color: #222222; font-size: 1.25em; text-transform: uppercase;}

	.appControls
		{color: #222222; font-size: 0.875em; text-transform: uppercase; padding: 0.5em 0; margin: 0.5em 0 2em 0; text-align: center; border-bottom: 1px solid #cccccc;}
	.appControls a
		{color: #222222;}
	.appControls a:hover
		{color: #222222; text-decoration: none;}
	a.sortOn
		{color: #222222;}
	a.sortOn:hover
		{color: #ef2523;}
	.sortOff
		{color: #ef2523;}
	.shopThumbs
		{margin: -1em;}
	.thumbsGapTop
		{margin-top: 1em;}
	.featuredThumbs
		{white-space: nowrap; margin-top: 1em; overflow: hidden;}
	.shopThumb
		{white-space: normal; width: calc(50% - 2em); margin: 1em; display: inline-block; text-align: center; vertical-align: top; position: relative; top: 0em; opacity: 1; transition: 0.75s;}
	.shopThumb0
		{top: 1.25em; opacity: 0;}
	.shopFlags
		{position: absolute; right: 1em; top: 1em;}
	.shopNew
		{background-color: green; width: 1em; height: 1em; margin-bottom: 0.33em; border-radius: 50%;}
	.shopDeal
		{background-color: red; width: 1em; height: 1em; margin-bottom: 0.33em; border-radius: 50%;}
	.shopThumbTitle
		{text-transform: uppercase; margin-top: 0.5em;}
	.shopInfo
		{font-size: 0.875em; margin-bottom: 0.33em;}
	.stockInfo
		{color: #aaaaaa; font-style: italic; font-size: 0.75em; margin-top: 0.25em;}
	.priceMy
		{font-size: 1.15em; font-weight: bold;}
	.priceOld
		{color: #aaaaaa; text-decoration: line-through;}
	.cartConfirmImg
		{width: 33.33%; margin-right: 1em; display: inline-block; vertical-align: middle;}
	.cartConfirmBody
		{width: calc(66.66% - 1em); display: inline-block; vertical-align: middle;}
	.prodBig
		{text-align: center;}
	.prodBigImg
		{max-width: 100%; max-height: 60vh;}
	.prodRight
		{margin-top: 2em;}
	.prodRight h2
		{text-align: left;}
	.prodInfo
		{color: #222222; font-size: 0.875em; font-style: italic;}
	.isNew
		{background-color: #488000; color: white; font-size: 0.75em; font-style: italic; padding: 0.2em 0.5em; margin: 0.25em 0; display: inline-block;}
	.isDeal
		{background-color: #ef2523; color: white; font-size: 0.75em; font-style: italic; padding: 0.2em 0.5em; margin: 0.25em 0; display: inline-block;}
	.stockPending
		{color: #0000a0; font-style: italic;}
	.buyControl
		{padding: 0.75em 0; display: flex; flex-direction: column; align-items: center; border: 1px solid #cccccc; border-left: 0; border-right: 0;}
	.buyPrice
		{text-align: center; order: 1;}
	.buyButton
		{margin-top: 0.33em; order: 2;}
	.prodPrice
		{font-size: 1.5em; font-weight: bold;}
	.appSteps
		{color: #2c2c2c; font-size: 1.15em; padding: 0.66em 0; margin-bottom: 1.5em; text-align: center; border: 1px solid #cccccc; border-left: 0px; border-right: 0px;}
	.appSteps a
		{color: #2c2c2c;}
	.appStep
		{color: #ef2523; line-height: 150%;}
	.appStep0
		{color: #aaaaaa;}
	.tease
		{background-color: #ffff9c; padding: 0.5em; margin-top: 1.25em; border: 1px solid #cccccc; border-left: 0; border-right: 0;}
	.cartPriceCol
		{width: 12.5%; text-align: right;}
	.cartQtyCol
		{width: 15%; text-align: center;}
	.cartHeader
		{}
	.cartQty
		{width: 100%; text-align: center;}
	.cartPrice
		{font-size: 1.5em; font-weight: bold; position: relative;}
	.cartDel
		{font-size: 0.75rem; font-weight: normal; position: absolute; right: 0; top: 87.5%;}
	.cartTotal
		{font-size: 1.5em; font-weight: bold;}
	.cartSummary
		{padding: 1em 0.5em 0.5em 0.5em; border-bottom: 2px solid black;}
	.cartSummary a
		{color: #222222;}
	.orderSummaryBox
		{width: 100%; margin-top: 1.5em; overflow: scroll;}
	.orderSummary
		{width: 800px;}

	.cms img
		{max-width: 100%;}
	.cmsArticleInfo
		{color: #aaaaaa; font-size: 0.875em; font-style: italic; text-align: center;}
	.cmsControls
		{font-size: 0.875em; font-style: italic; text-align: center;}
	.cmsControls a
		{color: #222222;}
	.cmsControls a:hover
		{text-decoration: none;}
	.cmsIcon
		{width: 2em;}
	.cmsVideoBox
		{width: 100%; padding-top: 40vh; position: relative;}
	.cmsVideo
		{width: 100%; height: 100%; position: absolute; left: 0; top: 0;}
	.sharingCenter
		{text-align: center; transition: 0.75s;}
	.sharing0
		{opacity: 0;}
	.sharingIcon
		{margin: -0.25em 0em 0em 0.75em;}

	.col21, .col31
		{}
	.col22, .col3X
		{margin-top: 1.5em;}
	.infoImg
		{width: 85%;}
	.infoBody
		{font-weight: normal; margin-top: 1em;}

	.pager1, .pager2
		{text-transform: uppercase; padding: 0.33em; display: inline-block; border: 1px solid transparent; outline: 0; -webkit-appearance: none;}
	.pager2
		{font-weight: bold; border: 1px solid #ef2523;}
	.pager1:hover
		{text-decoration: none; border: 1px solid #ef2523;}
	.pager2:hover
		{text-decoration: none;}

/*Footer */
	footer
		{font-size: 0.875em; width: 90%; padding: 2em 0; margin: 3.5em auto 0 auto; flex: none; border-top: 1px solid #d7d7d7;}
	.footer1
		{width: 60%; display: inline-block; vertical-align: top;}
	.footer2, .footer4
		{margin-top: 1.75em;}
	.footer3
		{width: 40%; display: inline-block; vertical-align: top;}
	.footerLabel
		{font-weight: bold; text-transform: uppercase; margin-bottom: 0.5em;}
	.footerIcon
		{width: 1.66; margin-right: 0.5em;}
	.mailerForm
		{width: 100%;}
	.mailerEmail
		{width: 100%;}
	.mailerButton
		{margin-top: 0.33em;}

	.cookieJar
		{background-color: rgba(0,0,0,0.66); color: white; width: 100%; padding: 1em 5%; position: fixed; left: 0; bottom: 0em; z-index: 99; border-top: 1px solid white; box-sizing: border-box; transition: 0.75s;}
	.cookieJar0
		{bottom: -10em;}
	.cookieJar1
		{}
	.cookieJar1 a
		{color: white; text-decoration: underline;}
	.cookieJar2
		{margin-top: 1em;}
	.cookieJar2 a
		{background-color: initial; color: white; border: 2px solid white;}
	.cookieJar2 a:hover
		{background-color: white; color: black;}

/*Table */
	.table0
		{}
	.table5
		{border-bottom: 4px solid #585858;}
	.tabHead, .tabSum
		{font-weight: bold; text-transform: uppercase;}
	.tabRow1
		{}
	.tabRow2
		{background-color: #ebf2fd;}
	.tabOver
		{background-color: #c1d4f8; cursor: default;}
	.tabCellHead
		{padding: 0.5em; border-bottom: 5px solid #585858;}
	.tabCell0
		{padding: 0.5em;}
	.tabCell1
		{padding: 0.5em; border-bottom: 1px solid #dddddd;}
	.tabCellSum
		{padding: 0.5em; border-top: 4px solid #585858;}

/*Forms */
	form
		{margin: 0;}
	label
		{cursor: pointer;}
	.checkbox
		{border: 0; -webkit-appearance: checkbox;}
	input, textarea, select
		{font-family: openSans, sans-serif; font-size: 0.875em; padding: 0.33em; border: 1px solid #cccccc; outline: 0; box-sizing: border-box;}
	textarea
		{overflow: auto;}
	.button1, .buttonX
		{background-color: black; color: white; text-transform: uppercase; width: 100%; padding: 0.33em 1em; display: inline-block; text-align: center; border: 1px solid black; outline: 0; -webkit-appearance: none; box-sizing: border-box;}
	.buttonX
		{background-color: inherit; color: black;}
	.button1:hover
		{background-color: inherit; color: black; text-decoration: none;}
	.buttonX:hover
		{background-color: black; color: white; text-decoration: none;}
	.autoSize
		{}
	.gapSide
		{margin-left: 0.33em;}
	.gapTop, .gapLeft
		{margin-top: 0.33em;}

/*Formatting */
	.isHidden
		{display: none;}
	.isFull, isHalf, .isQuarter
		{width: 100%;}
	.isLeft
		{text-align: left;}
	.isRight
		{text-align: right;}
	.isCenter
		{text-align: center}
	.isErr
		{border: 1px solid #ef2523;}
	.isGrow
		{transition: 0.25s;}
	.isGrow:hover
		{transform: scale(1.1); -webkit-transform: scale(1.1);}
	.isNoGrow
		{display: inline-block; vertical-align: middle; overflow: hidden;}

	.isDarken
		{background-color: rgba(0,0,0,0.66); width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 100;}
	.isDialogBox
		{width: 80%; max-height: 70vh; margin-top: 15vh; position: relative; left: 10%; opacity: 1; overflow: auto; transition: 0.75s;}
	.isDialogBox0
		{opacity: 0;}
	.isDialog
		{background-color: white; color: black; width: 100%; padding: 1.25em 1.5em; box-sizing: border-box;}
	.isDialog h1, .isDialog h2, .isDialog h3
		{margin-bottom: 0.33em;}
	.isDialog img
		{max-width: 100%;}

/*Media queries */
	@media screen and (orientation: landscape)
	{
		.logo
			{width: 33.33%;}
		.iconBox
			{width: 66.66%;}
		.shopThumb
			{width: calc(33.33% - 2em);}
		.footer1, .footer2, .footer3, .footer4
			{width: 50%; display: inline-block; vertical-align: top;}
	}
