/*************************************
Google Font Imports
*************************************/
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,300;0,400;0,500;0,700;0,900;1,300;1,400;1,500;1,700;1,900&display=swap');

/*************************************
Variable Definitions
*************************************/

:root {
	--black: #0e0e0e;
	--white: #eeeeee;
	--darker-gray: #1e1e1e;
	--dark-gray: #333333;
	--gray: #a6a6a6;
	--light-gray: #888888;
	--lighter-gray: #e6e6e6;
	--red: #f40f21;
	--green: #19af15;
	--blue: #0043ff;
	--link-blue: #3369ff;
	--light-blue: #33ccff;
	--dark-red: #aa0816;
	--dark-green: #148910;

	--page-header-bottom-margin: 25px;

	--column-header-font-fam: "Oswald", sans-serif;
	--column-header-font-size: 18px;
	--column-header-font-size-mobile: 20px;
	--column-header-bottom-margin: 20px;
	--column-header-bottom-margin-mobile: 8px;
	--column-header-side-padding: 0 20px;

	--entry-padding: 20px;
	--entry-margin: 20px;
}

/*************************************
Keyframes Definitions
*************************************/

@property --bg-angle {
  inherits: false;
  initial-value: 75deg;
  syntax: "<angle>";
}

@keyframes spin {
  to {
    --bg-angle: 435deg;
  }
}

@keyframes pulsate {

		0% {
			text-shadow: 0 0 0 var(--red);
		}

		33% {
			text-shadow: 0 0 7px var(--red),
									 0 0 10px var(--red),
									 0 0 20px var(--red);
		}

		33.001% {
			text-shadow: 0 0 0 var(--green);
		}

		67% {
			text-shadow: 0 0 7px var(--green),
									 0 0 10px var(--green),
									 0 0 20px var(--green);
		}

		67.001% {
			text-shadow: 0 0 0 var(--blue);
		}

		100% {
			text-shadow: 0 0 7px var(--blue),
									 0 0 10px var(--blue),
									 0 0 20px var(--blue);
		}

}

@keyframes small-pulsate {

		0% {
			text-shadow: 0 0 0 var(--red);
		}

		33% {
			text-shadow: 0 0 7px var(--red),
									 0 0 10px var(--red),
									 0 0 12px var(--red);
		}

		33.001% {
			text-shadow: 0 0 0 var(--green);
		}

		67% {
			text-shadow: 0 0 7px var(--green),
									 0 0 10px var(--green),
									 0 0 12px var(--green);
		}

		67.001% {
			text-shadow: 0 0 0 var(--blue);
		}

		100% {
			text-shadow: 0 0 7px var(--blue),
									 0 0 10px var(--blue),
									 0 0 12px var(--blue);
		}

}

/*************************************
General
*************************************/

* {
	border-radius: 0 !important;
}

body {
	font-family: 'Roboto', sans-serif;
	font-weight: 400;
	background-color: var(--black);
	color: var(--white);
	font-size: 14px;
	line-height: 20px;
	width: 100%;
}

#top {
	display: none;
}

header {
	margin-top: 18px;
}

#search {
	display: none;
}

.breadcrumb {
	display: none;
}

aside {
	display: none;
}

#content {
	min-height: 600px;
}

#account-login #content {
	min-height: 360px;
}

#content hr {
	display: none;
}

@media (min-width: 1200px) {
	#content .col-lg-2:nth-child(6n+1),
	#content .col-lg-3:nth-child(4n+1),
	#content .col-lg-4:nth-child(3n+1),
	#content .col-lg-6:nth-child(2n+1) {
		clear:left;
	}
}

@media (min-width: 992px) and (max-width: 1199px) {
	#content .col-md-2:nth-child(6n+1),
	#content .col-md-3:nth-child(4n+1),
	#content .col-md-4:nth-child(3n+1),
	#content .col-md-6:nth-child(2n+1) {
		clear:left;
	}
}

@media (min-width: 768px) and (max-width: 991px) {
	#content .col-sm-2:nth-child(6n+1),
	#content .col-sm-3:nth-child(4n+1),
	#content .col-sm-4:nth-child(3n+1),
	#content .col-sm-6:nth-child(2n+1) {
		clear:left;
	}
}

@media (min-width: 768px) {
    #column-left  .product-layout .col-md-3 {
       width: 100%;
    }

	#column-left + #content .product-layout .col-md-3 {
       width: 50%;
    }

	#column-left + #content + #column-right .product-layout .col-md-3 {
       width: 100%;
    }

    #content + #column-right .product-layout .col-md-3 {
       width: 100%;
    }
}

#column-left .product-layout, #column-right .product-layout {
	width: 100%;
}

.col-sm-9 {
	width: 100%;
}

.pagination {
	margin: 0;
}

span.hidden-xs, span.hidden-sm, span.hidden-md, span.hidden-lg {
	display: inline;
}

/*************************************
Links
*************************************/

a:link {
	color: var(--link-blue);
	font-weight: 500;
	text-decoration: none;
}

a:visited {
	color: var(--link-blue);
	text-decoration: none;
}

a:hover {
	color: var(--light-blue);
	text-decoration: none;
}

a:active {
	color: var(--light-blue);
	text-decoration: none;
}

/*************************************
Buttons
*************************************/

.btn {
	box-shadow: none;
	outline: none;
}

.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
    outline: none;
}

.btn:hover, .btn:focus, .btn.focus {
    color: var(--white);
    text-decoration: none;
}

.btn:active, .btn.active {
    outline: 0;
    background-image: none;
    -webkit-box-shadow: none;
    box-shadow: none;
  }

.btn a:link {
	color: var(--white);
}

.btn-default {
	color: var(--white);
	background-color: transparent;
	border: none;
}

.btn-default:focus, .btn-default.focus {
  color: var(--white);
  background-color: transparent;
  border: none;
}

.btn-default:hover {
	color: var(--white);
	background-color: transparent;
	border: none;
}

.btn-default:active, .btn-default.active, .open > .btn-default.dropdown-toggle {
  color: var(--white);
  background-color: var(--blue);
  border: none;
}
.btn-default:active:hover, .btn-default.active:hover, .open > .btn-default.dropdown-toggle:hover, .btn-default:active:focus, .btn-default.active:focus, .open > .btn-default.dropdown-toggle:focus, .btn-default:active.focus, .btn-default.active.focus, .open > .btn-default.dropdown-toggle.focus {
  color: var(--white);
  background-color: transparent;
  border: none;
}
.btn-default:active, .btn-default.active, .open > .btn-default.dropdown-toggle {
  background-image: none;
}
.btn-default.disabled:hover, .btn-default[disabled]:hover, fieldset[disabled] .btn-default:hover, .btn-default.disabled:focus, .btn-default[disabled]:focus, fieldset[disabled] .btn-default:focus, .btn-default.disabled.focus, .btn-default[disabled].focus, fieldset[disabled] .btn-default.focus {
  background-color: transparent;
  border: none;
}
.btn-default .badge {
  color: var(--white);
  background-color: transparent;
}

.btn-primary {
	background-color: var(--link-blue);
	font-size: 16px;
	font-weight: 500;
	color: var(--white);
	border: none;
}

a.btn-primary {
	color: var(--white);
}

.btn-primary:focus, .btn-primary.focus {
    color: var(--white);
    background-color: var(--blue);
    border: none;
}

.btn-primary:hover {
	background-color: var(--blue);
	border: none;
	transition: all 0.2s ease-out;
}

.btn-primary:active, .btn-primary.active, .open > .btn-primary.dropdown-toggle {
  color: var(--white);
  background-color: var(--blue);
  border-: none;
}
.btn-primary:active:hover, .btn-primary.active:hover, .open > .btn-primary.dropdown-toggle:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open > .btn-primary.dropdown-toggle:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open > .btn-primary.dropdown-toggle.focus {
  color: var(--white);
  background-color: var(--blue);
  border: none;
}
.btn-primary:active, .btn-primary.active, .open > .btn-primary.dropdown-toggle {
  background-color: var(--blue);
}
.btn-primary.disabled:hover, .btn-primary[disabled]:hover, fieldset[disabled] .btn-primary:hover, .btn-primary.disabled:focus, .btn-primary[disabled]:focus, fieldset[disabled] .btn-primary:focus, .btn-primary.disabled.focus, .btn-primary[disabled].focus, fieldset[disabled] .btn-primary.focus {
  background-color: transparent;
  border-color: none;
}
.btn-primary .badge {
    color: var(--white);
    background-color: var(--link-blue);
}

.btn-danger {
	height: 30px;
	font-size: 16px;
	font-weight: 500;
	color: var(--white);
	background-color: var(--red);
	border: none;
}

.btn-danger:hover {
	background-color: var(--dark-red);
	border: none;
}

.btn-success {
	height: 30px;
	font-size: 16px;
	font-weight: 500;
	color: var(--white);
	background-color: var(--link-blue);
	border: none;
}

.btn-success:hover {
	background-color: var(--blue);
	border: none;
}

.btn-info {
	background-color: var(--light-blue);
	border: none;
}

.btn-info a:link {
	color: var(--white);
}

.btn-info:hover {
	background-color: var(--blue);
}

.btn-xs {
	font-size: 9px;
}

.btn-sm {
	font-size: 10px;
}

.btn-lg {
	font-size: 15px;
}

.btn-group > .btn, .btn-group > .dropdown-menu, .btn-group > .popover {
	font-size: 12px;
}

.btn-group > .btn-xs {
	font-size: 9px;
}

.btn-group > .btn-sm {
	font-size: 10px;
}

.btn-group > .btn-lg {
	font-size: 15px;
}

.pull-left a:hover {
	color: var(--light-blue);
	background-color: transparent;
}

#button-askquestion:disabled,
#button-quote:disabled,
#button-shipping:disabled {
	background-color: var(--blue);
}

/*-------------------------------------------------
* BEGIN: Shopping Cart Button  
* -----------------------------------------------*/

#cart {
	margin-bottom: 10px;
}

#cart > .btn {
	display: flex;
	align-items: center;
	justify-content: center;
	background-image: linear-gradient(to bottom, var(--black) 0%, var(--dark-gray) 75%);
	background-repeat: repeat-x;
	background-color: transparent;
	font-size: 15px;
	font-weight: 500;
	color: var(--white);
	border: none;
	outline: none;
	box-shadow: none;
	text-shadow: none;
}

#cart > .btn:hover {
	color: var(--black);
	background-color: var(--white);
	background-image: none;
	transition: all 0.4s ease-out;
}

#cart.open > .btn {
	color: var(--black);
	background-color: var(--white);
	background-image: none;
}

.fa-shopping-cart {
	font-size: 18px;
	padding: 0 8px 0 0;
	margin: 0;
}

#cart span#cart-total {
	padding-top: 4px;
} 

@media (min-width: 768px) and (max-width: 991px) {
	#cart > .btn {
		font-size: 12px;
	}

	.fa-shopping-cart {
		font-size: 14px;
	}

	#cart span#cart-total {
		padding-top: 2px;
	} 
}

/*-------------------------------------------------
* END: Shopping Cart Button  
* -----------------------------------------------*/

/*-------------------------------------------------
* BEGIN: Cart and Wish List Buttons Below Products  
* -----------------------------------------------*/

.product-thumb .button-group {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: transparent;
	border: none;
	overflow: visible;
}

.product-list .product-thumb .button-group {
	border: none;
}

.product-thumb .button-group button {
	float: left;
	display: inline-block;
	font-family: "Oswald", sans-serif;
	color: var(--white);
	font-size: 20px;
	line-height: 38px;
	text-align: center;
	text-transform: uppercase;
	background-color: transparent;
	border: none;
}

.product-thumb .button-group button:hover {
	background-color: transparent;
	text-decoration: none;
	cursor: pointer;
}

@media (max-width: 1199px) {
	.product-thumb .button-group button, .product-thumb .button-group button + button {
		width: 50%;
	}
}

@media (max-width: 991px) {
	.product-thumb .button-group button, .product-thumb .button-group button + button {
		width: 30%;
	}
}

@media (max-width: 767px) {
	.product-thumb .button-group button, .product-thumb .button-group button + button {
		width: 20%;
	}
}

@media (max-width: 477px) {
	.product-thumb .button-group button, .product-thumb .button-group button + button {
		width: 25%;
	}
}

@media (max-width: 1199px) {
	.product-grid .product-thumb .button-group button, .product-grid .product-thumb .button-group button + button {
		width: 40%;
	}
}

@media (max-width: 991px) {
	.product-grid .product-thumb .button-group button, .product-grid .product-thumb .button-group button + button {
		width: 30%;
	}
}

@media (max-width: 767px) {
	.product-grid .product-thumb .button-group button, .product-grid .product-thumb .button-group button + button {
		width: 15%;
	}
}

@media (max-width: 477px) {
	.product-grid .product-thumb .button-group button, .product-grid .product-thumb .button-group button + button {
		width: 20%;
	}
}

.product-thumb .button-group .fa-shopping-cart {
	font-size: 24px;
	padding-right: 4px;
}

.product-thumb .button-group .fa-search {
	font-size: 22px;
	padding-right: 2px;
}

.product-thumb .button-group .fa-ban {
	font-size: 22px;
	padding-right: 2px;
}

.product-thumb .button-group button:first-child:hover {
	color: var(--light-blue);
}

.product-thumb .button-group .fa-heart {
	font-size: 22px;
}

@media (min-width: 1200px) {
	.product-thumb .button-group .fa-heart {
		padding-left: 10px;
	}
}

.product-thumb button[data-original-title="Compare this Product"] {
	display: none;
}

#product-product .btn-group .fa-heart {
	font-size: 30px;
}

#product-product button[data-original-title="Add to Wish List"]:hover {
 	animation: pulsate 3s ease-out infinite;
}

.product-thumb .button-group button[data-original-title="Add to Wish List"]:hover {
	animation: small-pulsate 3s ease-out infinite;
}

.product-thumb #thumb-outofstock {
	pointer-events: none;
	color: var(--light-gray);
}

/*-------------------------------------------------
* END: Cart and Wish List Buttons Below Products  
* -----------------------------------------------*/

/*---------------------------------------------
* BEGIN: Add to Cart Button on Product Pages  
* -------------------------------------------*/

#product #button-cart,
#product #button-cart-outofstock {
	font-family: "Oswald", sans-serif;
	text-transform: uppercase;
	color: var(--white);
	font-size: 22px;
  padding-bottom: 12px;
  margin-top: 16px;
  font-weight: 400;
}

/*Animation- Adapted from: https://codepen.io/jlengstorf/pen/WNPGMJo*/

#product #button-cart,
#product #button-cart-outofstock {

	animation: spin 2s infinite linear running;
  
  background:

    linear-gradient(
      to bottom,
        oklch(16.38% 0 240),
        oklch(16.38% 0 240)
    )
    padding-box,

    conic-gradient(
     	from var(--bg-angle) at 50% 50%,
        red, orange, gold, green, cyan, blue, purple, red
		)
    border-box;
  
  	border: 6px solid transparent;

  	&:hover {
  		text-shadow:
    		0 0 7px var(--link-blue),
    		0 0 10px var(--light-blue),
    		0 0 20px var(--light-blue),
    		0 0 40px var(--link-blue);
    		transition: all 0.4s ease-out;
  	}
}

@-moz-document url-prefix() {

	@keyframes pulse-animation {

		0% {
			box-shadow: 0 0 0 0 var(--red);
		}

		33% {
			box-shadow: 0 0 0 14px rgba(244,15,33,0);
		}

		33.001% {
			box-shadow: 0 0 0 0 var(--green);
		}

		67% {
			box-shadow: 0 0 0 14px rgba(25,175,21,0);
		}

		67.001% {
			box-shadow: 0 0 0 0 var(--blue);
		}

		100% {
			box-shadow: 0 0 0 14px rgba(0,67,255,0);
		}

	}

  #product #button-cart,
  #product #button-cart-outofstock {
  	animation: pulse-animation 6s infinite;
  }

  #product #button-cart:hover {
  	text-shadow:
    		0 0 7px var(--link-blue),
    		0 0 10px var(--light-blue),
    		0 0 20px var(--light-blue),
    		0 0 40px var(--light-blue);
    		transition: all 0.4s ease-out;
  	}
}

#product #button-cart-outofstock {
	filter: grayscale(85%);
	pointer-events: none;
}

#product #button-cart-outofstock:hover {
	text-shadow: none;
}

/*---------------------------------------------
* END: Add to Cart Button on Product Pages  
* -------------------------------------------*/

/*************************************
Text
*************************************/

h1 {
	font-size: 33px;
}

h2 {
	font-size: 27px;
}

h3 {
	font-size: 24px;
}

h4, h5, h6 {
	font-size: 16px;
}

.fa {
	font-size: 14px;
}

p span {
	font-size: 16px !important;
	font-weight: 400;
}

label {
	font-size: 14px !important;
}

h1, h2, h3, h4, h5, h6 {
	font-family: 'Oswald', sans-serif;
	color: var(--white);
	letter-spacing: 0.05rem;
}

h1, h2, h3 {
	font-weight: 500;
}

h4, h5, h6 {
	font-weight: 400;
}

#content h1 {
	margin-bottom: 30px;
}

#content h2 {
	margin-top: 40px;
	margin-bottom: 30px;
}

#content h3 {
	margin-top: 40px;
	margin-bottom: 30px;
}

#common-home h3,
#product-category h2 {
	font-size: 36px;
}

@media (max-width: 767px) {
	#common-home h3 {
		font-size: 50px;
	}

	#common-home #content {
		text-align: center;
	}
}

#tab-description h3 {
	font-weight: 500;
	margin-top: 26px;
	margin-bottom: 16px;
}

#tab-description p {
	font-size: 15px;
}

legend {
	font-size: 18px;
	color: var(--white);
	padding: 7px 0px
}

label {
	font-size: 12px;
	font-weight: normal;
}

div.required .control-label:before {
	content: '* ';
}

div.required .control-label::before {
	color: var(--green);
}

.has-error .checkbox, 
.has-error .checkbox-inline,
.has-error .control-label,
.has-error .help-block,
.has-error .radio,
.has-error .radio-inline,
.has-error.checkbox label,
.has-error.checkbox-inline label,
.has-error.radio label,
.has-error.radio-inline label,
.text-danger {
	color: var(--red);
}

.input-group .form-control[name^=quantity] {
	min-width: 50px;
}

/*************************************
Logo
*************************************/

#logo {
	margin: 38px 0 10px 0;
	width: 1138px;
}

@media (max-width: 1199px) {
	#logo {
		width: 938px;
		margin-top: 42px;
	}
}

@media (max-width: 991px) {
	#logo {
		width: 718px;
		margin-top: 46px;
	}
}

@media (max-width: 767px) {
	#logo {
		width: 100%;
		margin-top: 10px;
	}
}

/*************************************
Navigation Bar
*************************************/

#menu {
	background-color: var(--white);
	min-height: 40px;
}

#menu .navbar-collapse {
	padding-left: 0;
	padding-right: 0;
	border: none;
}

#menu .nav > li > a {
	color: var(--black);
	padding: 10px 15px 10px 15px;
	min-height: 15px;
	background-color: transparent;
}

#menu .nav > li > a > font {
	color: var(--black);
}

#menu .nav > li > a:hover,
#menu .nav > li.open > a,
#menu .nav > li > a:hover > font {
	background-color: var(--black);
	color: var(--white);
}

#menu .nav [class^="fa"]::before {
	content: "";
}

#menu .dropdown-menu {
	background-color: var(--white);
	min-width: 160px;
	padding-top: 0;
	padding-bottom: 0;
	border: none;
}

#menu .dropdown-inner {
	display: table;
}

#menu .dropdown-inner ul {
	display: table-cell;
}

#menu .dropdown-inner a {
	min-width: 160px;
	display: block;
	padding: 6px 20px 6px 10px;
	clear: both;
	line-height: 20px;
	color: var(--black);
	font-size: 12px;
}

#menu .dropdown-inner li a:hover {
	background-color: var(--black);
	color: var(--white);
}

#menu .see-all {
	display: none;
}

#menu .btn-navbar {
	color: var(--white);
	height: 40px;
	padding: 2px 18px;
	float: left;
	background-color: var(--black);
}

#menu .btn-navbar .fa-bars {
	font-size: 26px;
}

#menu .btn-navbar:hover, #menu .btn-navbar:focus, #menu .btn-navbar:active, #menu .btn-navbar.disabled, #menu .btn-navbar[disabled] {
	color: var(--black);
	background-color: var(--white);
}

@media (min-width: 992px) {
	#menu .dropdown:hover .dropdown-menu {
		display: block;
	}
}

@media (max-width: 991px) {

	#menu {
		background-color: transparent;
	}

	.navbar-header {
    	float: none;
    	background-color: transparent;
	}

	.navbar-left,.navbar-right {
    	float: none !important;
	}

	.navbar-toggle {
    	display: block;
	}

	.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px;
	}

	.navbar-collapse.collapse {
    display: none!important;
	}

	.navbar-nav {
    float: none!important;
    margin-top: 7.5px;
	}
	
	.navbar-nav>li {
    float: none;
	}

	.collapse.in{
    display:block !important;
	}

	#menu .navbar-collapse {
		background-color: var(--white);
		border: none;
	}

	#menu div.dropdown-inner > ul.list-unstyled {
		display: block;
	}

	#menu .navbar-nav {
		margin: 0;
	}

	#menu .navbar-nav .open .dropdown-menu {
		position: static;
		float: none;
		width: auto;
		margin-top: 0;
		box-shadow: none;
	}

	#menu div.dropdown-menu {
		margin-left: 0 !important;
		background-color: var(--white);
	}

	#menu .dropdown-inner {
		display: block;
		border-bottom: 1px solid var(--black);
	}

	#menu .dropdown-inner a {
		width: 100%;
		padding-left: 20px;
		color: var(--black);
	}

	#menu .navbar-header #category {
		display: none !important;
	}
}

/*************************************
News Banner
*************************************/

#common-home #news-banner {

	margin-top: 10px;
	padding: 40px 20px;
	text-align: center;
	animation: spin 2s infinite linear running;
  background:

    linear-gradient(
      to bottom,
        oklch(16.38% 0 240),
        oklch(16.38% 0 240)
    )
    padding-box,

    conic-gradient(
     	from var(--bg-angle) at 50% 50%,
        red, orange, gold, green, cyan, blue, purple, red
		)
    border-box;
  
  	border: 10px solid transparent;

}

@-moz-document url-prefix() {

  	#common-home #news-banner {
  		animation: pulse-animation 6s infinite;
  		background-color: var(--black);
  		color: var(--white);
  	}

	}

#common-home #news-banner h2 {
	font-size: 50px;
	margin: 0 0 20px 0;
}

#common-home #news-banner h3 {
	font-size: 28px;
	margin: 0;
}

/*************************************
Menus
*************************************/

#cart .dropdown-menu {
	background: var(--white);
	color: var(--black);
	font-size: 14px;
	min-width: 100%;
	max-height: 800px;
	border: none;
	box-shadow: none;
	padding: 8px 8px 0 8px;
	scrollbar-width: thin;
	overflow-x: hidden;
	overflow-y: auto;
	z-index: 1001;
}

#cart .dropdown-menu a:hover {
	color: var(--red);
}

@media (max-width: 478px) {
	#cart .dropdown-menu {
		width: 100%;
	}
}

#cart .dropdown-menu .table tr {
	background-color: transparent;
}

#cart .dropdown-menu .table tr td {
	border: none;
}

#cart .dropdown-menu .table-bordered {
	border: none;
}

#cart .dropdown-menu .table-bordered tr td {
	padding: 2px 0 0 0;
}

#cart .dropdown-menu .dropdown-prod {
	width: 60%;
}

#cart .dropdown-menu .dropdown-qty {
	width: 15%;
}

#cart .dropdown-menu .dropdown-price {
	width: 30%;
}

#cart .dropdown-menu .dropdown-x {
	width: 5%;
}

#cart .dropdown-menu .dropdown-x button {
	background: var(--red);
	height: 22px;
	border: none;
	outline: none;
	padding: 4px 5px 5px 5px;
	margin: 0;
	box-shadow: none;
}

#cart .dropdown-menu .dropdown-x button:hover {
	background: var(--dark-red);
}

#cart .dropdown-menu .table-totals .dropdown-total {
	width: 30%;
}

#cart .dropdown-menu .menu-cart {
	font-size: 18px;
}

#cart .dropdown-menu li > div {
	min-width: 427px;
	padding: 0 10px;
}

#cart .dropdown-menu li p {
	margin: 20px 0;
}

@media (max-width: 767px) {

	#cart .dropdown-menu {
		border-bottom: 4px solid var(--link-blue);
	}

	#cart .dropdown-menu .table-bordered tr td {
		padding: 2px 0 0 0;
	}

	#cart .dropdown-menu .table .dropdown-total {
		width: 20%;
	}

	#cart .dropdown-menu .dropdown-prod {
		width: 50%;
	}

	#cart .dropdown-menu .dropdown-qty {
		width: 25%;
	}

	#cart .dropdown-menu .dropdown-price {
		width: 20%;
	}

}

@media (max-width: 490px) {

	#cart .dropdown-menu li > div {
		min-width: 100%;
	}

	#cart .dropdown-menu .table .dropdown-total {
		width: 30%;
	}

	#cart .dropdown-menu .dropdown-prod {
		width: 55%;
	}

	#cart .dropdown-menu .dropdown-qty {
		width: 20%;
	}

	#cart .dropdown-menu .dropdown-price {
		width: 20%;
	}

}

/*************************************
Flash Sale
*************************************/

#common-home h3#FlashSale {
	font-size: 54px;
	text-align: center;
	margin: 50px 0 30px 0;
}

#common-home .row-FlashSale {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 0 15px;
	margin: 40px 0 30px 0;	
	animation: spin 2s infinite linear running;
  background:

    linear-gradient(
      to bottom,
        oklch(16.38% 0 240),
        oklch(16.38% 0 240)
    )
    padding-box,

    conic-gradient(
     	from var(--bg-angle), transparent 20%, var(--white), var(--light-gray)
		)
    border-box;
  
  	border: 4px solid transparent;

	}

	@-moz-document url-prefix() {

		#common-home .row-FlashSale {
			border: 4px solid var(--white);
			box-shadow: inset 0 0 10px var(--white),
									0 0 10px var(--white);
		}

	}

#common-home .products-FlashSale {
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	width: 100%;
	margin-bottom: 30px;
}

/*************************************
Product Layout (General, Home)
*************************************/

#content .row {
	display: flex;
	flex-wrap: wrap;
}

.product-layout {
	margin-top: 16px;
	margin-bottom: 20px;
}

.product-thumb {
	height: 100%;
	display: flex;	
	flex-direction: column;
}

.product-thumb .caption {
	height: 100%;
	display: flex;
	flex-direction: column;
	margin-bottom: auto;
}

/*In product list mode for medium/large screens, 
float thumbnail divs to left*/
/*@media (min-width: 767px) {
	.product-list .product-thumb .image {
		float: left;
		padding: 0 15px;
	}
}
*/

.product-thumb .image img {
	margin-left: auto;
	margin-right: auto;
}

.product-thumb .image a {
	display: block;
}

.product-thumb .price {
	font-family: "Oswald", sans-serif;
	color: var(--white);
	font-size: 22px;
	left: 0;
	right: 0;
	margin-left: auto;
	margin-right: auto;
}

.product-thumb .price-new {
	font-weight: 600;
}

.product-thumb .price-old {
	color: var(--dark-gray);
	text-decoration: line-through;
	margin-left: 10px;
}

.product-thumb .price-tax {
	color: var(--light-gray);
	font-size: 12px;
	display: block;
}

.product-thumb .caption {
	padding: 0 15px;
	height: fit-content !important;
	text-align: center;0
}

.product-thumb .caption h4 {
	font-size: 30px;
	margin-top: 18px;
}

.product-thumb .caption p:nth-child(2) {
	display: none;
}

.product-list .product-thumb .caption {
	margin-left: 230px;
}

.product-thumb .caption h4 a:hover {
  animation: spin 2s infinite linear running;
  
  background:

    conic-gradient(
     	from var(--bg-angle) at 50% 50%,
        red, orange, gold, green, cyan, blue, purple, red
		)
    border-box;
    padding-bottom: 100px;

  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
  box-decoration-break: clone
  -webkit-box-decoration-break: clone;
}

@-moz-document url-prefix() {

	.product-thumb .caption h4 a:hover {
		background: transparent;
		-webkit-background-clip: initial;
		-webkit-text-fill-color: initial;
		animation: none;
		color: var(--light-blue);
	}

}

/*************************************
Product Layout (Category)
*************************************/

.product-grid .product-thumb .image {
	float: none;
}

.product-grid .product-thumb .caption h4 {
	font-size: 30px;
	margin-top: 18px;
}

.product-grid .product-thumb div:nth-child(2) {
	display: flex;
	flex-flow: column;
	flex: 1;
}

.product-grid .product-thumb div:nth-child(2) .button-group {
	display: flex;
	flex-flow: row;
	flex: 0;
}

/*************************************
Product Pages
*************************************/

@media (max-width: 767px) {
	#product-product .col-sm-4 {
		width: 100%;
		border-top: 1px solid var(--white);
		margin-top: 8px;
		padding-top: 16px;
	}
}

.thumbnail {
	background-color: transparent;
	border: none;
}

.thumbnail img {
	background-color: transparent;
}

.thumbnails {
	overflow: auto;
	clear: both;
	list-style: none;
	padding: 0;
	margin: 0;
}

.thumbnails {
	margin-left: -20px;
}

.thumbnails > li {
	margin-left: 20px;
}

.thumbnails > img {
	width: 100%;
}

.image-additional {
	max-width: 78px;
	overflow: visible;
}

.thumbnails .image-additional {
	float: left;
	margin-left: 20px;
}

.image-additional a.thumbnail {
	margin-bottom: 20px;
	padding: 5px;
	display: block;
	border: 1px solid var(--red);
	box-shadow: 0 0 8px var(--red);
}

.image-additional a.thumbnail:visited {
	border: 1px solid var(--red);
}

.image-additional a.thumbnail:hover {
	border: 1px solid var(--red);
	box-shadow: 0 0 8px var(--red),
							0 0 14px var(--red);
	transition: all 0.2s ease-out;
}

.image-additional a.thumbnail:active {
	border: 1px solid var(--red);
	box-shadow: 0 0 8px var(--red),
							0 0 14px var(--red);
}

.image-additional a.thumbnail.active,
.image-additional a.thumbnail:focus {
	border: 1px solid var(--red);
}

#product-product .nav-tabs {
	border-bottom: 1px solid var(--darker-gray);
}

#product-product .nav-tabs li a {
	font-family: "Oswald", sans-serif;
	font-size: 16px;
	font-weight: 400;
	text-transform: uppercase;
}

#product-product .nav-tabs li.active a {
	background-color: transparent;
	color: var(--black);
}


#product-product .nav-tabs li {
	background-color: #8c8c8c;
	border-top-left-radius: 16px !important;
	border-top-right-radius: 16px !important;
}

#product-product .nav-tabs li:hover {
	background-color: var(--gray);
}

#product-product .nav-tabs li a:hover {
	background-color: transparent;
	border: none;
}

#product-product .nav-tabs li.active {
	background-color: var(--white);
	border-top-left-radius: 16px !important;
	border-top-right-radius: 16px !important;
}

.nav-tabs > li > a {
	border: none;
	color: var(--black);
}

.nav-tabs>li.active>a, 
.nav-tabs>li.active>a:focus,
.nav-tabs>li.active>a:hover {
	border: none;
}

#tab-documentation .fa-download {
	color: var(--green);
}

h2.price {
	margin: 0;
}

.nav-tabs {
	margin-bottom: 15px;
}

@media (max-width: 767px) {
	#product-product #content .col-xs-6 {
		width: 100%;
	}
}

#product-product div.col-xs-6.col-sm-3 {
	margin-top: 16px;
	margin-bottom: 20px;
}

#product-category div.col-md-2.col-sm-6.hidden-xs,
#product-category div.col-md-3.col-sm-6,
#product-category div.col-md-3.col-xs-6,
#product-category div.col-md-4.col-xs-6 {
	display: none;
}

/*************************************
Shopping Cart Page
*************************************/

#checkout-cart #content h1 {
	margin-bottom: var(--page-header-bottom-margin);
}

#checkout-cart .checkout-grid {
	display: flex;
	flex-direction: column;
}

#checkout-cart .checkout-grid-items {
	display: flex;
	flex-direction: row;
	background-color: var(--darker-gray);
	padding: var(--entry-padding);
	margin-bottom: var(--entry-margin);
}

#checkout-cart .shopping-cart-img {
	width: 20%;
	padding-right: 20px;
}

#checkout-cart .shopping-cart-img img {
	max-height: 200px;
	border: none;
	background-color: transparent;
}

#checkout-cart .shopping-cart-details {
	display: flex;
	flex-direction: row;
	width: 80%;
}

#checkout-cart .shopping-cart-prod {
	display: flex;
	flex-direction: column;
	width: 60%;
	padding-right: 20px;
	margin-right: 20px;
}

#checkout-cart .shopping-cart-prod .product-option-list {
	padding-top: 16px;
	padding-left: 10px;
}

#checkout-cart .shopping-cart-prod ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#checkout-cart .shopping-cart-prod ul li::before {
	font-family: "FontAwesome";
	content: "\f0da";
	margin-right: 4px;
}

#checkout-cart .shopping-cart-prod ul li:not(:last-child) {
	margin-bottom: 4px;
}

#checkout-cart .shopping-cart-prices {
	display: flex;
	flex-direction: column;
	width: 40%;
	margin-left: auto;
}

#checkout-cart .shopping-cart-prod a {
	font-family: "Oswald", sans-serif;
	font-size: 24px;
}

#checkout-cart .shopping-cart-qty {
	display: flex;
	flex-direction: row;
	width: 100px;
	margin-bottom: 50px;
}

#checkout-cart .shopping-cart-qty input {
	height: 34px;
}

#checkout-cart .shopping-cart-qty .input-group {
	display: flex;
	position: static;
}

#checkout-cart .shopping-cart-qty .input-group-btn .btn {
	padding: 0;
	margin: 0;
	outline: none;
	box-shadow: none;
}

#checkout-cart .shopping-cart-qty .input-group-btn #update-button {
	width: 34px;
	height: 34px;
	background-image: none;
	background-color: transparent;
	color: var(--link-blue);
	border: none;
	text-shadow: none;
	margin-left: 10px;
}

#checkout-cart .shopping-cart-qty .input-group-btn #update-button:hover {
	color: var(--green);
	transition: all 0.2s ease-out;
}

#checkout-cart .shopping-cart-qty .input-group-btn #remove-button {
	width: 34px;
	height: 34px;
	background-image: none;
	background-color: transparent;
	color: var(--red);
	border: none;
	text-shadow: none;
}

#checkout-cart .shopping-cart-qty .input-group-btn #remove-button:hover {
	color: var(--green);
	transition: all 0.2s ease-out;
}

#checkout-cart .shopping-cart-qty .input-group-btn #update-button i {
	font-size: 22px;
}

#checkout-cart .shopping-cart-qty .input-group-btn #remove-button i {
	font-size: 24px;
}

#checkout-cart .shopping-cart-qty .input-group-btn #update-button:hover,
#checkout-cart .shopping-cart-qty .input-group-btn #remove-button:hover {
	background-color: transparent;
	background-image: none;
}

#checkout-cart .shopping-cart-unit::before {
	content: "Unit Price ";
	padding-right: 6px;
}

#checkout-cart .shopping-cart-unit {
	font-family: "Oswald", sans-serif;
	font-size: 20px;
	padding-bottom: 12px;
}

#checkout-cart .shopping-cart-total::before {
	content: "Total ";
	padding-right: 6px;
}

#checkout-cart .shopping-cart-total {
	font-family: "Oswald", sans-serif;
	font-size: 20px;
}

#checkout-cart #content h2 {
	margin-top: 15px;
}

#checkout-cart .table-bordered {
	border: none;
}

#checkout-cart .table-bordered tr td {
	border: none;
}

#checkout-cart .shopping-cart-footer {
	display: flex;
	flex-direction: row;
}

#checkout-cart .panel-group {
	width: 70%;
}

#checkout-cart .shopping-cart-grandtotal {
	display: flex;
	flex-direction: column;
	font-family: "Oswald", sans-serif;
	font-size: 20px;
	font-weight: 500;
	width: 30%;
	margin-left: 20px;
}

#checkout-cart .panel {
	background-color: transparent;
	box-shadow: none;
}

#checkout-cart .panel-group .panel-default {
	border: none;
}

.panel-default > .panel-heading + .panel-collapse > .panel-body {
	border: none;
}

#checkout-cart .panel-group .panel-default .panel-heading {
	background-color: var(--darker-gray);
	border: none;
}

#checkout-cart .panel-group .panel-default .panel-heading .panel-title {
	font-size: 20px;
}

#checkout-cart #collapse-coupon .panel-body .control-label {
	display: none;
}

#checkout-cart .input-group #input-coupon {
	height: 34px;
	border: none;
	outline: none;
}

#checkout-cart .input-group .input-group-btn #button-coupon {
	height: 34px;
	margin-right: auto;
}

#checkout-cart .shopping-cart-grandtotal .cart-checkout-button {
	font-family: "Roboto", sans-serif;
	width: 100px;
	align-self: flex-start;
	margin-left: 8px;
}

#checkout-cart .pull-left a:hover {
	color: var(--light-blue);
} 

@media (max-width: 767px) {

	#checkout-cart .checkout-grid-items {
		flex-direction: column;
		padding: 30px 20px 50px 20px;;
	}

	#checkout-cart .shopping-cart-details {
		flex-direction: column;
	}

	#checkout-cart .shopping-cart-img {
		width: 100%;
		padding-right: 0;
		padding-bottom: 30px;
	}

	#checkout-cart .shopping-cart-details {
		width: 100%;
	}

	#checkout-cart .shopping-cart-prod {
		width: 100%;
		padding-right: 0;
		padding-bottom: 40px;
		margin-right: 0;
	}

	#checkout-cart .shopping-cart-prices {
		width: 100%;
	}

	#checkout-cart .shopping-cart-qty {
		margin-bottom: 20px;
	}

	#checkout-cart .shopping-cart-footer {
		flex-direction: column;
	}

	#checkout-cart .panel-group {
		width: 100%;
	}

	#checkout-cart .shopping-cart-grandtotal {
		width: 250px;
		align-self: flex-start;
		margin-bottom: 30px;
	}

}

/*************************************
Checkout Page
*************************************/

#checkout-checkout #content h1 {
	margin-bottom: var(--page-header-bottom-margin);
}

#checkout-checkout .panel-group .panel-default .panel-heading {
	background-color: var(--darker-gray);
}

#checkout-checkout .panel-group .panel-default .panel-heading h4 {
	color: var(--light-gray);
}

#checkout-checkout .panel-group .panel-default .panel-heading .panel-title {
	font-size: 20px;
}

#checkout-checkout .panel-group .panel {
	background-color: transparent;
	border: none;
	box-shadow: none;
}

#checkout-checkout .panel-group .panel .panel-body {
	padding: var(--entry-padding);
}

#checkout-checkout .panel-body #button-register {
	margin-left: 20px;
}

#checkout-checkout .panel-body .form-horizontal #payment-existing,
#checkout-checkout .panel-body .form-horizontal #shipping-existing {
	margin-top: 10px;
	margin-bottom: 10px;
}

#checkout-checkout .panel-body #payment {
	background-color: transparent;
} 

#checkout-checkout #collapse-checkout-confirm .confirm-order-details {
	display: flex;
	flex-direction: column;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-labels {
	display: flex;
	flex-direction: row;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-entry {
	display: flex;
	flex-direction: row;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-emptylbl {
	content: "\200B";
	width: 64%;
	margin-right: 20px;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-prod {
	width: 64%;
	margin-right: 20px;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-prod ul {
	margin-top: 8px;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-prod ul li:not(:last-child) {
	margin-bottom: 4px;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-qtypricetot {
	display: flex;
	flex-direction: row;
	width: 36%;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-qtylbl {
	width: 7.2%;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-pricelbl {
	width: 14.4%;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-totallbl {
	width: 14.4%;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-qty {
	width: 20%;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-price {
	width: 40%;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-total {
	width: 40%;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-summary {
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--darker-gray);
	padding-top: 10px;
}

#checkout-checkout #collapse-checkout-confirm .confirm-order-total-entry {
	margin-bottom: 6px;
}

#checkout-checkout #payment-method-tabs span {
	background-color: transparent;
	color: var(--white);
}

#checkout-checkout #payment-method-tabs .active {
	border: none !important;
}

#checkout-checkout #payment {
	border: none !important;
}

#checkout-checkout .CardField-input-wrapper {
	color: var(--black);
}

@media (max-width: 767px) {
	#checkout-checkout #collapse-checkout-confirm .confirm-order-entry {
		display: flex;
		flex-direction: column;
		border-bottom: 1px solid var(--darker-gray);
		padding-bottom: 10px;
		margin-bottom: 10px;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-prod {
		width: 100%;
		margin-right: 0;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-qtypricetot {
		display: flex;
		flex-direction: column;
		width: 100%;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-labels {
		display: none;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-qty::before {
		content: "Qty: ";
		font-weight: 500;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-qty {
		width: 100%;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-price::before {
		content: "Unit Price: ";
		font-weight: 500;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-price {
		width: 100%;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-total::before {
		content: "Total: ";
		font-weight: 500;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-total {
		width: 100%;
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-summary {
		border-top: none;
	}
}

/*************************************
My Account
*************************************/

#account-account #content {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	align-content: center;
	justify-content: center;
	min-height: 300px;
}

#account-account #content h2 {
	margin-top: 0;
}

#account-account .account-myaccount-entry {
	background-color: var(--darker-gray);
	height: 200px;
	width: 200px;
	padding: var(--entry-padding);
}

#account-account .account-myaccount-entry:not(:last-child) {
	margin-right: 40px;
}

@media (max-width: 767px) {

	#account-account #content {
		display: flex;
		flex-direction: column;
		align-items: center;
	}

	#account-account #content h2 {
		font-size: 36px;
	}

	#account-account .account-myaccount-entry:not(:last-child) {
		margin-right: 0;
	}

	#account-account .account-myaccount-entry {
		font-size: 18px;
		line-height: 1.5;
		height: 244px;
		width: 100%;
		margin: 20px 0;
	}

}

/*************************************
Order History
*************************************/

#account-order #content h1 {
	margin-bottom: var(--page-header-bottom-margin);
}

#account-order .order-list {
	display: flex;
	flex-direction: column;
}

#account-order .order-list .order-list-labels {
	font-family: var(--column-header-font-fam);
	font-size: var(--column-header-font-size);
	display: flex;
	flex-direction: row;
	padding: var(--column-header-side-padding);
	margin-bottom: var(--column-header-bottom-margin);
}

#account-order .order-list .order-list-idlbl {
	width: 10%;
}

#account-order .order-list .order-list-customerlbl {
	width: 20%;
}

#account-order .order-list .order-list-prodlbl {
	width: 15%;
}

#account-order .order-list .order-list-statuslbl {
	width: 20%;
	margin-right: 10px;
}

#account-order .order-list .order-list-totallbl {
	width: 10%;
}

#account-order .order-list .order-list-datelbl {
	width: 15%;
}

#account-order .order-list .order-list-viewlbl {
	display: flex;
	justify-content: center;
	width: 10%;
}

#account-order .order-list .order-list-entry {
	display: flex;
	flex-direction: row;
	background-color: var(--darker-gray);
	padding: var(--entry-padding);
	margin-bottom: var(--entry-margin);
}

#account-order .order-list .order-list-id {
	width: 10%;
}

#account-order .order-list .order-list-customer {
	width: 20%;
}

#account-order .order-list .order-list-prod {
	width: 15%;
}

#account-order .order-list .order-list-status {
	width: 20%;
	margin-right: 10px;
}

#account-order .order-list .order-list-total {
	width: 10%;
}

#account-order .order-list .order-list-date {
	width: 15%;
}

#account-order .order-list .order-list-view {
	display: flex;
	width: 10%;
	justify-content: center;
}

#account-order .order-list .order-list-view i {
	font-size: 16px;
}

#account-order .order-list-continue {
	margin-top: 20px;
}

@media (max-width: 767px) {

	#account-order .order-list .order-list-labels {
		display: none;
	}

	#account-order .order-list .order-list-entry {
		flex-direction: column;
	}

	#account-order .order-list .order-list-id::before {
		display: block;
		content: "Order ID";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-order .order-list .order-list-customer::before {
		display: block;
		content: "Customer";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-order .order-list .order-list-prod::before {
		display: block;
		content: "Order Size";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-order .order-list .order-list-status::before {
		display: block;
		content: "Status";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-order .order-list .order-list-total::before {
		display: block;
		content: "Total";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-order .order-list .order-list-date::before {
		display: block;
		content: "Date Added";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-order .order-list .order-list-view {
		display: flex;
		width: 10%;
		justify-content: flex-start;
	}

	#account-order .order-list .order-list-view i {
		font-size: 28px;
	}

	#account-order .order-list .order-list-id,
	#account-order .order-list .order-list-customer,
	#account-order .order-list .order-list-prod,
	#account-order .order-list .order-list-status,
	#account-order .order-list .order-list-total,
	#account-order .order-list .order-list-date {
		width: 100%;
		font-size: 16px;
		margin-bottom: var(--entry-margin);
	}

}

/*************************************
Detailed Order History
*************************************/

#account-order .order-history-details {
	display: flex;
	flex-direction: row;
	background-color: var(--darker-gray);
	padding: var(--entry-padding);
	margin-bottom: var(--entry-margin);
}

#account-order .order-history-label {
	font-family: var(--column-header-font-fam);
	font-size: var(--column-header-font-size);
	margin-bottom: 10px;
}

#account-order .order-history-details #text-invoice-no,
#account-order .order-history-details #text-order-id,
#account-order .order-history-details #text-date-added, 
#account-order .order-history-details #text-payment-method,
#account-order .order-history-details #text-shipping-method,
#account-order .order-history-prods .order-history-totallbl,
#account-order .order-history-comments #text-comment {
	display: block;
}

#account-order .order-history-details .order-history-iddate {
	display: flex;
	flex-direction: column;
	width: 50%;
}

#account-order .order-history-details .order-history-invoice {
	margin-bottom: 14px;
}

#account-order .order-history-details .order-history-id {
	margin-bottom: 14px;
}

#account-order .order-history-details .order-history-payship {
	display: flex;
	flex-direction: column;
	width: 50%;
}

#account-order .order-history-details .order-history-paymethod {
	margin-bottom: 14px;
}

#account-order .order-history-addresses {
	display: flex;
	flex-direction: row;
	background-color: var(--darker-gray);
	padding: var(--entry-padding);
	margin-bottom: var(--entry-margin);
}

#account-order .order-history-addresses .order-history-payaddress {
	display: flex;
	flex-direction: column;
	width: 50%;
	margin-right: 10px;
}

#account-order .order-history-addresses .order-history-shipaddress {
	display: flex;
	flex-direction: column;
	width: 50%;
}

#account-order .order-history-products {
	display: flex;
	flex-direction: column;
	background-color: var(--darker-gray);
	padding: 20px;
	margin-bottom: var(--entry-margin);
}

#account-order .order-history-products .order-history-productslbl {
	display: flex;
	flex-direction: row;
	margin-bottom: 10px;
}

#account-order .order-history-products .order-history-namelbl {
	width: 50%;
	margin-right: 20px;
}

#account-order .order-history-products .order-history-qtylbl {
	width: 10%;
}

#account-order .order-history-products .order-history-pricelbl {
	width: 20%;
}

#account-order .order-history-products .order-history-totallbl {
	width: 20%;
}

#account-order .order-history-products .order-history-prods {
	display: flex;
	flex-direction: row;
	margin-bottom: var(--entry-margin);
}

#account-order .order-history-products .order-history-prod {
	width: 50%;
	margin-right: 20px;
}

#account-order .order-history-products .order-history-prod ul {
	padding-left: 16px;
	margin-top: 8px;
}

#account-order .order-history-products .order-history-prod ul li:not(:last-child) {
	margin-bottom: 4px;
}

#account-order .order-history-products .order-history-qty {
	width: 10%;
}

#account-order .order-history-products .order-history-price {
	width: 20%;
}

#account-order .order-history-products .order-history-total {
	width: 20%;
}

#account-order .order-history-totals {
	display: flex;
	flex-direction: column;
}

#account-order .order-history-totals .order-history-totallbl {
	width: 100%;
}

#account-order .order-history-totals .order-history-amount {
	width: 100%;
	margin-bottom: 10px;
}

#account-order .order-history-comments {
	display: flex;
	flex-direction: column;
	background-color: var(--darker-gray);
	padding: var(--entry-padding);
	margin-bottom: var(--entry-margin);
}

@media (max-width: 767px) {

	#account-order .order-history-products .order-history-prods {
		flex-direction: column;
	}

	#account-order .order-history-products .order-history-productslbl {
		display: none;
	}	

	#account-order .order-history-products .order-history-prod,
	#account-order .order-history-products .order-history-qty,
	#account-order .order-history-products .order-history-price,
	#account-order .order-history-products .order-history-total {
		width: 100%;
	}

	#account-order .order-history-products .order-history-prod {
		margin-right: 0;
	}

	#account-order .order-history-products .order-history-qty::before {
		content: "Qty: ";
		font-weight: 500;
	}

	#account-order .order-history-products .order-history-price::before {
		content: "Unit Price: ";
		font-weight: 500;
	}

	#account-order .order-history-products .order-history-total::before {
		content: "Total: ";
		font-weight: 500;
	}

	#account-order .order-history-prods {
		border-bottom: 1px solid var(--dark-gray);
		padding-bottom: 20px;
	}

}

/*************************************
Login Page
*************************************/

#account-login #content h2 {
	margin-top: var(--page-header-bottom-margin);
}

@media (min-width: 768px) {
	#account-login .row #content .row .col-sm-6:first-child {
		border-right: 1px solid var(--white);
	}
}

@media (max-width: 767px) {
	#account-login .row #content .row .col-sm-6:first-child {
		border-bottom: 1px solid var(--white);
		padding-bottom: 10px;
	}
}

.well {
	background-color: transparent;
	border: none;
	box-shadow: none;
	color: var(--white);
	padding-top: 0;
	padding-bottom: 0;
}

/*************************************
Address
*************************************/

#account-address .address-list-table {
	display: flex;
	flex-direction: column;
}

#account-address .address-list-entry {
	display: flex;
	flex-direction: row;
	background-color: var(--darker-gray);
	padding: var(--entry-padding);
	margin-bottom: var(--entry-margin);
}

#account-address .address-list-left {
	width: 50%;
}

#account-address .address-list-right {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	width: 50%;
}

#account-address .address-edit {
	background-color: var(--link-blue);
	color: var(--white) !important;
	width: 80px;
	border: none;
}

#account-address .address-edit:hover {
	background-color: var(--blue);
}

#account-address .address-delete {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--red);
	color: var(--white) !important;
	width: 80px;
	border: none;
}

#account-address .address-delete:hover {
	background-color: var(--dark-red);
}

#account-address .address-new {
	background-color: var(--link-blue);
	color: var(--white) !important;
}

#account-address .address-new:hover {
	background-color: var(--blue);
}

/*************************************
Wishlist
*************************************/

#account-wishlist .wishlist-grid-items {
	display: flex;
	flex-direction: column;
}

#account-wishlist .wishlist-entry {
	display: flex;
	flex-direction: row;
	background-color: var(--darker-gray);
	padding: var(--entry-padding);
	margin-bottom: var(--entry-margin);
}

#account-wishlist .wishlist-entry .wishlist-action {
	display: flex;
	flex-direction: row;
}

#account-wishlist .wishlist-entry .wishlist-action .wishlist-cart-add {
	width: 40px;
	height: 40px;
	padding-top: 7px;
	padding-left: 8px;
	margin-right: 20px;
}

#account-wishlist .wishlist-entry .wishlist-action .wishlist-cart-add i {
	font-size: 25px;
}

#account-wishlist .wishlist-entry .wishlist-action .wishlist-remove {
	width: 40px;
	height: 40px;
	padding: 6px 10px;
	color: var(--white);
}

#account-wishlist .wishlist-entry .wishlist-action .wishlist-remove i {
	font-size: 25px;
}

#account-wishlist .wishlist-entry .wishlist-image {
	width: 10%;
	margin-right: 30px;
}

#account-wishlist .wishlist-entry .wishlist-image img {
	width: 100%;
}

#account-wishlist .wishlist-entry .wishlist-details {
	display: flex;
	flex-direction: row;
	width: 90%;
}

#account-wishlist .wishlist-entry .wishlist-prodstatus {
	display: flex;
	flex-direction: column;
	width: 60%;
	margin-right: 30px;
}

#account-wishlist .wishlist-entry .wishlist-priceaction {
	display: flex;
	flex-direction: column;
	width: 40%;
}

#account-wishlist .wishlist-entry .wishlist-prod {
	font-family: "Oswald", sans-serif;
	font-size: 22px;
	line-height: 1.10;
	width: 100%;
	margin-bottom: 10px;
}

#account-wishlist .wishlist-entry .wishlist-stock {
	font-size: 18px;
	width: 100%;
}

#account-wishlist .wishlist-entry .wishlist-price {
	font-family: "Oswald", sans-serif;
	font-size: 20px;
	width: 15%;
	margin-bottom: 30px;
}

#account-wishlist .wishlist-entry .wishlist-action {
	width: 15%;
	margin-top: auto;
}

@media (max-width: 767px) {

	#account-wishlist .wishlist-entry .wishlist-image {
		width: 200px;
	}

	#account-wishlist .wishlist-entry .wishlist-details {
		flex-direction: column;
	}

	#account-wishlist .wishlist-entry .wishlist-prodstatus,
	#account-wishlist .wishlist-entry .wishlist-priceaction {
		width: 100%;
	}


	#account-wishlist .wishlist-entry .wishlist-prodstatus {
		margin-right: 0;
	}

	#account-wishlist .wishlist-entry .wishlist-stock {
		margin-bottom: 20px;
	}

}

/*************************************
Transactions
*************************************/

#account-transaction #content h1 {
	margin-bottom: var(--page-header-bottom-margin);
}

#account-transaction .transaction-grid-items {
	display: flex;
	flex-direction: column;
	margin-bottom: 30px;
}

#account-transaction .transaction-grid-items .transaction-labels {
	display: flex;
	flex-direction: row;
	font-family: var(--column-header-font-fam);
	font-size: var(--column-header-font-size);
	padding: var(--column-header-side-padding);
	margin-top: 10px;
	margin-bottom: var(--column-header-bottom-margin);
}

#account-transaction .transaction-grid-items .transaction-labels .transaction-datelbl {
	width: 15%;
}

#account-transaction .transaction-grid-items .transaction-labels .transaction-descriptionlbl {
	width: 65%;
	margin-right: 10px;
}

#account-transaction .transaction-grid-items .transaction-labels .transaction-amountlbl {
	width: 20%;
}

#account-transaction .transaction-grid-items .transaction-entry {
	display: flex;
	flex-direction: row;
	background-color: var(--darker-gray);
	padding: var(--entry-padding);
	margin-bottom: var(--entry-margin);
}

#account-transaction .transaction-entry .transaction-date {
	width: 15%;
}

#account-transaction .transaction-entry .transaction-description {
	width: 65%;
	margin-right: 10px;
}

#account-transaction .transaction-entry .transaction-amount {
	width: 20%;
}

#account-transaction .transaction-grid-items .transaction-empty {
	display: flex;
	font-family: "Oswald", sans-serif;
	font-size: 22px;
	width: 100%;
	justify-content: center;
	margin-top: 20px;
}

#account-transaction .transaction-continue {
	margin-top: 20px;
}

@media (max-width: 767px) {

	#account-transaction .transaction-grid-items .transaction-labels {
		display: none;
	}

	#account-transaction .transaction-grid-items .transaction-entry {
		flex-direction: column;
	}

	#account-transaction .transaction-entry .transaction-date::before {
		display: block;
		content: "Date Added";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-transaction .transaction-entry .transaction-description::before {
		display: block;
		content: "Description";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-transaction .transaction-entry .transaction-amount::before {
		display: block;
		content: "Amount";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#account-transaction .transaction-entry .transaction-date {
		width: 100%;
		margin-bottom: 10px;
	}

	#account-transaction .transaction-entry .transaction-description {
		width: 100%;
		margin-bottom: 10px;
	}

	#account-transaction .transaction-entry .transaction-amount {
		width: 100%;
	}

}

/*************************************
Ticketing
*************************************/

.zen-content a.ticket-call > span {
	display: flex;
	align-items: center;
	justify-content: center;
}

.zen-content a.ticket-call {
	width: 34px;
	height: 34px;
}

.zen-content .ticket-call i {
	display: block;
	font-size: 15px;
	padding-top: 4px;
	padding-right: 2px;
}

#content .zen-container {
	background: none;
	box-shadow: none;
	color: var(--white);
}

#main-tickets .ticketing-grid {
	display: flex;
	flex-direction: column;
}

#main-tickets .ticketing-grid .ticketing-labels {
	display: flex;
	flex-direction: row;
	font-family: var(--column-header-font-fam);
	font-size: var(--column-header-font-size);
	padding: var(--column-header-side-padding);
}

#main-tickets .ticketing-grid .ticketing-empty {
	display: flex;
	font-family: "Oswald", sans-serif;
	font-size: 22px;
	width: 100%;
	justify-content: center;
	margin-top: 20px;
	margin-bottom: 20px;
}

#main-tickets .ticketing-grid .ticketing-entry {
	display: flex;
	flex-direction: row;
	background-color: var(--darker-gray);
	margin-bottom: var(--entry-margin);
	padding: var(--entry-padding);
}

#main-tickets .ticketing-grid .ticketing-labels {
	margin-bottom: 10px;
}

#main-tickets .ticketing-grid .ticketing-labels .ticketing-subjectlbl {
	width: 20%;
	margin-right: 10px;
}

#main-tickets .ticketing-grid .ticketing-labels .ticketing-statuslbl {
	width: 14%;
}

#main-tickets .ticketing-grid .ticketing-labels .ticketing-prioritylbl {
	width: 14%;
}

#main-tickets .ticketing-grid .ticketing-labels .ticketing-deptlbl {
	width: 10%;
}

#main-tickets .ticketing-grid .ticketing-labels .ticketing-datecreatedlbl {
	width: 17%;
}

#main-tickets .ticketing-grid .ticketing-labels .ticketing-datemodlbl {
	width: 17%;
}

#main-tickets .ticketing-grid .ticketing-labels .ticketing-actionlbl {
	width: 8%;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-subject {
	width: 20%;
	margin-right: 10px;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-status {
	width: 14%;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-priority {
	width: 14%;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-dept {
	width: 10%;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-datecreated {
	width: 17%;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-datemod {
	width: 17%;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-action {
	width: 8%;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-action a.ticket-call {
	background-color: transparent;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-action a.btn.ticket-call {
	margin: 0;
	padding: 0;
	height: auto;
}

#main-tickets .ticketing-grid .ticketing-entry .ticketing-action i {
	color: var(--link-blue);
	font-size: 18px;
	padding: 0;
}

#main-tickets .ticketing-priority .zen-label {
	font-weight: 500;
	padding-top: 4px !important;
}

#main-tickets .ticketing-action a.btn.btn-default:hover > i {
	color: var(--light-blue) !important;
}

/*Reply window*/
.mfp-content {
	max-width: 1000px;
}

.mfp-content button.mfp-close {
	color: var(--white);
}

.mfp-content .mfp-inside {
	background-color: var(--darker-gray);
	border: none;
	box-shadow: none;
}

.mfp-content .mfp-inside h3 {
	color: var(--white);
}

.mfp-content .customer-bubble,
.mfp-content .agent-bubble {
	color: var(--white);
	background: linear-gradient(var(--darker-gray), var(--dark-gray));
	border: none;
}

.mfp-content .customer-bubble:after,
.mfp-content .agent-bubble:after {
	border-color: var(--light-blue) transparent;
}

.mfp-content .note-editor .note-toolbar {
	background-color: var(--dark-gray);
}

.mfp-content .reply-content {
	color: var(--black) !important;
	border: none;
}

.mfp-content .reply-content p {
	font-size: 14px !important;
	color: var(--black) !important;
}

.mfp-content .reply-content p > span {
	font-size: 14px !important;
	color: var(--black) !important;
}

.mfp-content #reply .note-editable {
	color: var(--black);
}

.mfp-content .mfp-inside .note-editor {
	border: none;
}

.mfp-content #reply .reply-bubble {
	border: none;
}

.mfp-content .modal-content {
	background-color: var(--darker-gray);
	box-shadow: none;
	border: none;
}

.mfp-content .modal-title {
	color: var(--white);
	font-size: 18px;
}

.mfp-content .modal-header {
	border-bottom: 1px solid var(--black);
}

.mfp-content .modal-footer {
	border-top: 1px solid var(--black);
}

@media (max-width: 767px) {

	#main-tickets .ticketing-grid .ticketing-labels {
		display: none;
	}

	#main-tickets .ticketing-grid .ticketing-entry {
		flex-direction: column;
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-subject::before {
		display: block;
		content: "Subject";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-subject {
		width: 100%;
		margin-right: 0;
		margin-bottom: 10px;
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-status::before {
		display: block;
		content: "Status";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-status {
		width: 100%;
		margin-bottom: 10px;
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-priority::before {
		display: block;
		content: "Priority";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-priority {
		width: 100%;
		margin-bottom: 10px;
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-dept::before {
		display: block;
		content: "Dept";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-dept {
		width: 100%;
		margin-bottom: 10px;
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-datecreated::before {
		display: block;
		content: "Creation Date";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-datecreated {
		width: 100%;
		margin-bottom: 10px;
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-datemod::before {
		display: block;
		content: "Last Update";
		font-family: var(--column-header-font-fam);
		font-size: var(--column-header-font-size-mobile);
		margin-bottom: var(--column-header-bottom-margin-mobile);
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-datemod {
		width: 100%;
		margin-bottom: 10px;
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-action {
		width: 100%;
	}

	#main-tickets .ticketing-grid .ticketing-entry .ticketing-action i {
		font-size: 28px;
	}

	.mfp-content .modal-content {
		box-shadow: none;
	}

}

/*************************************
Forms
*************************************/

.form-control {
	color: var(--black);
	box-shadow: none;
	border: 3px solid transparent;
}

.form-control option:checked {
	background-color: var(--black);
	color: var(--white);
}

select.form-control,
textarea.form-control,
input[type="text"].form-control,
input[type="password"].form-control,
input[type="datetime"].form-control,
input[type="datetime-local"].form-control,
input[type="date"].form-control,
input[type="month"].form-control,
input[type="time"].form-control,
input[type="week"].form-control,
input[type="number"].form-control,
input[type="email"].form-control,
input[type="url"].form-control,
input[type="search"].form-control,
input[type="tel"].form-control,
input[type="color"].form-control {
	font-size: 12px;
}

.input-group input,
.input-group select,
.input-group .dropdown-menu,
.input-group .popover {
	font-size: 12px;
}

.input-group .input-group-addon {
	font-size: 12px;
	height: 30px;
}

.form-control:focus {
	border: 3px solid var(--light-blue);
	box-shadow: none;
}

.has-error .form-control {
	border: 3px solid var(--red);
	box-shadow: none;
}

.has-error .form-control:focus {
	border: 1px solid var(--red);
	box-shadow: none;
}

/*************************************
Footer
*************************************/

footer {
	background-color: transparent;
	border: 6px solid;
	border-image-source: linear-gradient(to right, var(--red), var(--red) 33%, var(--green) 33%, var(--green) 66%, var(--blue) 66%, var(--blue));
	border-image-slice: 1;
	border-width: 6px;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
	margin-top: 20px;
	margin-bottom: 10px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 10px;
}

@media (min-width: 1200px) {
	footer {
		width: 1170px;
	}
}

@media (max-width: 1199px) {
	footer {
		width: 970px;
	}
}

@media (max-width: 991px) {
	footer {
		width: 750px;
	}
}

@media (max-width: 767px) {
	footer {
		width: 100%;
		padding-right: 15px;
		padding-left: 15px;
	}
}

footer hr {
	display: none;
}

footer a {
	font-weight: 600;
}

footer #social-media {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
	padding: 15px;
}

footer #social-media div:not(:first-child) {
	margin-left: 20px;
}

footer #social-media i {
	font-size: 36px;
}

footer #social-media a {
	color: var(--white);
}

footer #social-media a:hover {
	cursor: pointer;
}

footer #social-media #youtube a:hover,
footer #social-media #twitch a:hover,
footer #social-media #twitter a:hover,
footer #social-media #amazon a:hover {
	display: block;
	animation: spin 2s infinite linear running;
  
  background:

    conic-gradient(
     	from var(--bg-angle) at 50% 50%,
        red, orange, gold, green, cyan, blue, purple, red
		)
    border-box;
    padding-bottom: 46px;

  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
  box-decoration-break: clone
  -webkit-box-decoration-break: clone;
}

footer #social-media #youtube:hover,
footer #social-media #twitch:hover,
footer #social-media #twitter:hover,
footer #social-media #amazon:hover {
	margin-bottom: -46px;
}

@-moz-document url-prefix() {

	footer #social-media #youtube a:hover,
	footer #social-media #twitch a:hover,
	footer #social-media #twitter a:hover,
	footer #social-media #amazon a:hover {
		background: transparent;
		-webkit-background-clip: initial;
		-webkit-text-fill-color: initial;
		animation: none;
		color: var(--light-blue);
	}
}

/*************************************
Popups
*************************************/

#modal-shipping .modal-header h4 {
	color: var(--black);
}

#modal-shipping .modal-content {
	background-color: var(--white);
	color: var(--black);
	border: none;
}

#modal-shipping .modal-footer .shipping-cancel-btn {
	color: var(--black);
	border: none;
}

#modal-agree {
	color: var(--black);
}

#modal-agree .modal-header h4 {
	color: var(--black);
}

#modal-agree .modal-body h3 {
	color: var(--black);
}

.alert {
    position: fixed;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    -webkit-transform: translate(-50%,-50%);
	  width: 320px;
	  height: auto;
    background-color: var(--white);
    border: none;
    margin: 0;
    padding: 0;
    z-index: 9999;
}

.alert p.alert-message {
	color: var(--black);
	font-size: 18px;
	padding: 40px;
	line-height: 1.25;
}

.alert p.alert-message-captcha {
	color: var(--black);
	font-size: 18px;
	padding: 40px;
	line-height: 1.25;
}

.alert p.alert-message a:hover {
	color: var(--red);
}

.alert .close {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--black);
	color: var(--white);
	height: 20px;
	width: 20px;
	top: 4px;
	right: 4px;
	text-shadow: none;
	opacity: unset;
}

.alert .close:hover {
	background-color: var(--red);
}

.alert-message .cart-prod-name,
.alert-message .wish-prod-name,
.alert-message .wishlog-prod-name {
	display: block;
	font-family: "Oswald", sans-serif;
	font-size: 24px;
	margin: 14px 0 0 0;
	line-height: 1.25;
}

@media (max-width: 477px) {
	.alert {
		width: 280px;
	}
}

/*************************************
YouTube Embeds
*************************************/

@media (max-width: 767px) {
	#product-product .youtube-video {
		float: none;
		clear: both;
		position: relative;
		text-align: center;
		width: 100%;
		padding-bottom: 56.25%;
		padding-top: 25px;
		height: 0;
	}

	#product-product .youtube-video embed {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
}

/*************************************
Image Thumbnail Adjustments
*************************************/

#image-95 {
	width: 230px;
	height: 230px;
	object-fit: cover;
	margin-top: -70px;
}

@media (max-width: 767px) {

	.image {
		overflow: hidden;
	}

	/*NESRGB Installation Service*/
	#image-57 {
		margin-top: -50px;
	}

	/*SNESRGB Installation Service*/
	#image-61 {
		margin-top: -80px;
	}

	/*SNES 8 Megabitz*/
	#image-76 {
		margin-top: -120px;
	}

	/*SNES Super Stacker*/
	#image-77 {
		margin-top: -128px;
	}

	/*Wii-U NAND Recovery Kit*/
	#image-82 {
		margin-top: -68px;
	}

	/*PS1 xStation Installation Service*/
	#image-85 {
		margin-top: -50px;
	}

	/*Cartridge Patching & Translation Service*/
	#image-92 {
		margin-top: -45px;
	}

	/*Pre-Modded Stealth PSOne*/
	#image-95 {
		margin-top: -70px;
	}

	/*Pre-Modded HDMI+RGB N64*/
	#image-100 {
		margin-top: -50px;
	}

}



/*************************************
--------------------------------------

LIGHT MODE SETTINGS

--------------------------------------
*************************************/

@media (prefers-color-scheme: light) {

	/*************************************
	General
	*************************************/

	body {
		background-color: var(--white);
		color: var(--black);
	}

	/*************************************
	Text
	*************************************/

	h1, h2, h3, h4, h5, h6 {
		color: var(--black);
	}

	h5 {
		font-weight: 500;
	}

	legend {
		color: var(--black);
		border: none;
	}

	div.required .control-label::before {
		color: var(--red);
	}

	.has-error .checkbox, 
	.has-error .checkbox-inline,
	.has-error .control-label,
	.has-error .help-block,
	.has-error .radio,
	.has-error .radio-inline,
	.has-error.checkbox label,
	.has-error.checkbox-inline label,
	.has-error.radio label,
	.has-error.radio-inline label,
	.text-danger {
		color: var(--red);
	}

	/*************************************
	Links
	*************************************/

	a:link {
		color: var(--blue);
		text-decoration: none;
	}

	a:visited {
		color: var(--blue);
		text-decoration: none;
	}

	a:hover {
		color: var(--red);
		text-decoration: none;
	}

	a:active {
		color: var(--red);
		text-decoration: none;
	}

	/*************************************
	Logo
	*************************************/

	#logo img {
		content: url("/image/catalog/Site Graphics/logo_light.svg");
	}

	/*************************************
	Navigation Bar
	*************************************/

	#menu {
		background-color: var(--black);
	}

	#menu .nav > li > a {
		color: var(--white);
	}

	#menu .nav > li > a > font {
		color: var(--white);
	}

	#menu .nav > li > a:hover,
	#menu .nav > li.open > a,
	#menu .nav > li > a:hover > font {
		background-color: var(--white);
		color: var(--black);
	}

	#menu .btn-navbar {
		color: var(--black);
		background-color: var(--white);
	}

	#menu .btn-navbar:hover, #menu .btn-navbar:focus, #menu .btn-navbar:active, #menu .btn-navbar.disabled, #menu .btn-navbar[disabled] {
		color: var(--white);
		background-color: var(--black);
	}

	#menu .dropdown-menu {
		background-color: var(--black);
	}

	#menu .dropdown-inner a {
		color: var(--white);
	}

	#menu .dropdown-inner li a:hover {
		background-color: var(--white);
		color: var(--black);
	}

	@media (max-width: 991px) {

		#menu {
			background-color: transparent;
		}

		#menu .navbar-collapse {
			background-color: var(--black);
		}

		#menu div.dropdown-menu {
			background-color: var(--black);
		}

		#menu .dropdown-inner {
			border-bottom: 1px solid var(--white);
		}

		#menu .dropdown-inner a {
			color: var(--white);
		}
	}

	/*************************************
	News Banner
	*************************************/
	#common-home #news-banner {

		text-align: center;

		animation: spin 2s infinite linear running;
  
 	 	background:

    	linear-gradient(
      	to bottom,
        	oklch(94.91% 0 0),
        	oklch(94.91% 0 0)
    	)
    	padding-box,

    	conic-gradient(
     		from var(--bg-angle) at 50% 50%,
        red, orange, gold, green, cyan, blue, purple, red
			)
    	border-box;
  
  		border: 10px solid transparent;
	}

	@-moz-document url-prefix() {

  		#common-home #news-banner {
  			animation: pulse-animation 6s infinite;
  			background-color: var(--white);
  			color: var(--black);
  		}

		}

	#common-home #news-banner h2,
	#common-home #news-banner h3 {
		color: var(--black);
		font-weight: 600;
	}

	/*************************************
	Buttons
	*************************************/

	a.btn-primary {
		color: var(--white);
	}

	.pull-left a:hover {
		color: var(--red);
	}

	.pull-right .btn {
		color: var(--white);
	}

	a.cart-checkout-button {
		color: var(--white);
	}

	.product-thumb .button-group .fa-heart,
	.product-thumb .button-group .fa-shopping-cart {
		color: var(--black);
	}

	.product-thumb .button-group span {
		color: var(--black);
		font-weight: 500;
	}

	.product-thumb .button-group .fa-search {
		color: var(--black);
	}

	.product-thumb #thumb-outofstock i, 
	.product-thumb #thumb-outofstock span {
		color: var(--light-gray);
	}

	.product-thumb .button-group button:first-child:hover > span,
	.product-thumb .button-group button:first-child:hover > i {
		color: var(--red);
	}

	/*-------------------------------------------------
	* BEGIN: Shopping Cart Button  
	* -----------------------------------------------*/

	#cart {
		margin-bottom: 10px;
	}

	#cart > .btn {
		background-image: linear-gradient(to bottom, var(--white) 0%, #ffffff 80%);
		color: var(--black);
	}

	#cart > .btn:hover {
		color: var(--white);
		background-color: var(--black);
		transition: all 0.4s ease-out;
	}

	#cart.open > .btn {
		color: var(--white);
		background-color: var(--black);
	}

	/*-------------------------------------------------
	* END: Shopping Cart Button  
	* -----------------------------------------------*/

	/*---------------------------------------------
	* BEGIN: Add to Cart Button on Product Pages  
	* -------------------------------------------*/

	@-moz-document url-prefix() {

  	#product #button-cart,
  	#product #button-cart-outofstock {
  		animation: pulse-animation 6s infinite;
  		background-color: var(--black);
  		color: var(--white);
  	}

	}

	/*---------------------------------------------
	* END: Add to Cart Button on Product Pages  
	* -------------------------------------------*/

	/*************************************
	Menus
	*************************************/

	#cart .dropdown-menu {
		background: var(--black);
		color: var(--white);
	}

	#cart .dropdown-menu a {
		color: var(--link-blue);
	}

	#cart .dropdown-menu a:hover {
		color: var(--light-blue);
	}

	@media (max-width: 767px) {
		#cart .dropdown-menu {
			border-bottom: 4px solid var(--link-blue);
		}
	}

	/*************************************
	Flash Sale
	*************************************/

	#common-home h3#FlashSale {
		color: var(--black);
	}

	#common-home .row-FlashSale {

	animation: spin 2s infinite linear running;
  background:

    linear-gradient(
      to bottom,
        oklch(94.91% 0 0),
        oklch(94.91% 0 0)
    )
    padding-box,

    conic-gradient(
     	from var(--bg-angle), transparent 20%, var(--light-blue), var(--link-blue)
		)
    border-box;
  
  	border: 4px solid transparent;

	}

	@-moz-document url-prefix() {

		#common-home .row-FlashSale {
			border: 6px solid #d9d9d9;
			background-image: none;
		}

	}

	/*************************************
	Product Layout (General, Home)
	*************************************/

	.product-thumb .price {
		color: var(--black);
		font-weight: 500;
	}

	.product-thumb .price-old {
		color: var(--light-gray);
	}

	.thumbnail {
		background-color: transparent;
	}

	@-moz-document url-prefix() {

		.product-thumb .caption h4 a:hover {
			background: transparent;
			-webkit-background-clip: initial;
			-webkit-text-fill-color: initial;
			animation: none;
			color: var(--red);

		}
	}

	/*************************************
	Product Pages
	*************************************/

	.image-additional a.thumbnail {
		overflow: visible;
	}

	.image-additional a.thumbnail {
		border: 1px solid var(--blue);
		box-shadow: 0 0 8px var(--blue);
	}

	.image-additional a.thumbnail:visited {
		border: 1px solid var(--blue);
	}

	.image-additional a.thumbnail:hover {
		border: 1px solid var(--blue);
		box-shadow: 0 0 8px var(--blue),
								0 0 14px var(--blue);
		transition: all 0.2s ease-out;
	}

	.image-additional a.thumbnail:active {
		border: 1px solid var(--blue);
		box-shadow: 0 0 8px var(--blue),
								0 0 14px var(--blue);
	}

	.image-additional a.thumbnail.active,
	.image-additional a.thumbnail:focus {
		border: 1px solid var(--blue);
	}

	@media (max-width: 767px) {
		#product-product .col-sm-4 {
			border-top: 1px solid var(--black);
		}
	}

	#product-product .fa-heart {
		color: var(--black);
	}

	#product-product .nav-tabs {
		border-bottom: 1px solid var(--lighter-gray);
	}

	#product-product .nav-tabs li a {
		color: var(--white);
	}

	#product-product .nav-tabs li.active a {
		background-color: transparent;
		color: var(--white);
	}

	#product-product .nav-tabs li {
		background-color: #737373;
		border-top-left-radius: 16px !important;
		border-top-right-radius: 16px !important;
	}

	#product-product .nav-tabs li:hover {
		background-color: #999999;
	}

	#product-product .nav-tabs li.active {
		background-color: var(--black);
		border-top-left-radius: 16px !important;
		border-top-right-radius: 16px !important;
	}

	/*************************************
	Shopping Cart Page
	*************************************/

	#checkout-cart .checkout-grid-items {
		background-color: var(--lighter-gray);
	}

	#checkout-cart .shopping-cart-prod {
		font-weight: 500;
	}

	#checkout-cart .shopping-cart-prices {
		font-weight: 500;
	}

	#checkout-cart .shopping-cart-qty .input-group-btn #update-button:hover {
		color: var(--dark-green);
	}

	#checkout-cart .shopping-cart-qty .input-group-btn #remove-button:hover {
		color: var(--dark-green);
	}

	#checkout-cart .panel-group .panel-default .panel-heading {
		background-color: var(--lighter-gray);
	}

	#checkout-cart .pull-left a:hover {
		color: var(--red);
	} 

	/*************************************
	Checkout Page
	*************************************/

	#checkout-checkout .panel-group .panel-default .panel-heading {
		background-color: var(--lighter-gray);
	}

	#checkout-checkout #collapse-checkout-confirm .confirm-order-summary {
		border-top: 1px solid var(--lighter-gray);
	}

	#checkout-checkout #payment-method-tabs span {
		background-color: transparent;
		color: var(--black);
	}

	@media (max-width: 767px) {

		#checkout-checkout #collapse-checkout-confirm .confirm-order-entry {
			border-bottom: 1px solid var(--lighter-gray);
		}

		#checkout-checkout #collapse-checkout-confirm .confirm-order-summary {
			border: none;
		}

	}

	/*************************************
	My Account
	*************************************/

	#account-account .account-myaccount-entry {
		background-color: var(--lighter-gray);
	}

	/*************************************
	Addresses
	*************************************/

	#account-address .address-list-entry {
		background-color: var(--lighter-gray);
	}

	/*************************************
	Wish List
	*************************************/

	#account-wishlist .wishlist-entry {
		background-color: var(--lighter-gray);
	}

	/*************************************
	Order History
	*************************************/

	#account-order .order-list .order-list-entry {
		background-color: var(--lighter-gray);
	}

	/*************************************
	Detailed Order History
	*************************************/

	#account-order .order-history-details,
	#account-order .order-history-addresses,
	#account-order .order-history-products,
	#account-order .order-history-comments {
		background-color: var(--lighter-gray);
	}

	@media (max-width: 767px) {
		#account-order .order-history-prods {
			border-bottom: 1px solid var(--light-gray);
		}
	}

	/*************************************
	Transactions
	*************************************/

	#account-transaction .transaction-grid-items .transaction-entry {
		background-color: var(--lighter-gray);
	}

	/*************************************
	Ticketing
	*************************************/

	#content .zen-container {
		color: var(--black);
	}

	#main-tickets .ticketing-grid .ticketing-entry {
		background-color: var(--lighter-gray);
	}

	#main-tickets .ticketing-action a.btn.btn-default:hover > i {
		color: var(--red) !important;
	}

	.mfp-content button.mfp-close {
		color: var(--black);
	}

	.mfp-content .mfp-inside {
		background-color: var(--lighter-gray);
		border: none;
		box-shadow: none;
	}

	.mfp-content .mfp-inside h3 {
		color: var(--black);
	}

	.mfp-content .customer-bubble,
	.mfp-content .agent-bubble {
		color: var(--white);
		background: linear-gradient(var(--darker-gray), var(--dark-gray));
		border: none;
	}

	.mfp-content .customer-bubble:after{
		border-color: var(--light-blue) transparent;
	}

	.mfp-content .agent-bubble:after {
		border-color: var(--red) transparent;
	}

	.mfp-content .modal-content {
		background-color: var(--lighter-gray);
		box-shadow: none;
	}

	.mfp-content .modal-title {
		color: var(--black);
		font-size: 18px;
		font-weight: 400;
	} 

	/*************************************
	Login Page
	*************************************/

	@media (min-width: 768px) {
		#account-login .row #content .row .col-sm-6:first-child {
			border-right: 1px solid var(--black);
		}
	}

	@media (max-width: 767px) {
		#account-login .row #content .row .col-sm-6:first-child {
			border-bottom: 1px solid var(--black);
			padding-bottom: 30px;
		}
	}

	.well {
		color: var(--black);
		border: none;
	}

	.well h2 {
		color: var(--black);
	}

	/*************************************
	Footer
	*************************************/

	footer #social-media a {
		color: var(--black);
	}

	/*************************************
	Popups
	*************************************/

	.alert {
    background-color: var(--black);
	}

	.alert p.alert-message {
		color: var(--white);
	}

	.alert p.alert-message-captcha {
		color: var(--white);
	}

	.alert p.alert-message a:hover {
		color: var(--light-blue);
	}

	.alert .close {
		background-color: var(--white);
		color: var(--black);
	}

	.alert .close:hover {
		background-color: var(--red);
	}
	
}
/*Designed by De Stella Nova LLC*/