/*---

NEUTRAL COLOR RANGE ---------------------

    black neutral = #222

    dark neutral = #3c3c3c

    medium neutral = #aaa

    white neutral = #fff


THEME COLORS ---------------------------

    primary theme/action = #ffc425
        hover/focus variant = #f1b000

---*/




/*--- MISC BOOTSTRAP RESETS --------------------------------------*/
body, .tooltip, .popover {
	font-family: 'Open Sans', sans-serif
}

body {
	color: #222
}

@media (min-width:1200px) {
	body {
		overflow-x: hidden
	}
}

/*--- form fields ---*/
main {
	min-height: 75vh
}

/*--- general links ---*/
a {
	color: #ffc425
}

	a:hover, a:focus {
		color: #f1b000
	}

p a {
	font-weight: bold
}


/*--- form fields ---*/
.form-control {
	color: #222;
	border-color: #aaa;
	border-radius: .2rem;
	box-shadow: none
}

	.form-control:focus {
		border-color: #f1b000;
		box-shadow: 0 0 8px rgba(255,196,37,.4)
	}

/*--- add to cart version ---*/
.add-to-cart-group .form-control {
	height: auto
}


/*--- buttons ---*/
.btn {
	padding: .375em .8em
}

.btn-primary, input[type="submit"], input[type="button"] {
	padding-top: .45em;
	padding-bottom: .45em;
	background-color: #fec83f;
	border: 0;
	border-radius: .2rem;
	color: #222;
	text-transform: uppercase;
	transition: background-color .2s
}

	.btn-primary:hover, .btn-primary:focus, input[type="submit"]:hover, input[type="submit"]:focus, input[type="button"]:hover, input[type="button"]:focus, .btn-primary.focus, .btn-primary:active, .btn-primary.active, .btn-primary:active:focus, .btn-primary.active:focus {
		background-color: #f1b000;
		color: #222
	}

.add-to-wishlist, .add-to-cart {
	box-shadow: none
}

.btn-default {
	border-color: #aaa;
	border-radius: .2rem;
	color: #222;
	text-transform: uppercase
}

	.btn-default:hover {
		color: #222;
		border-color: #aaa
	}




/*--- misc checkout ------------------------------*/

/*--- credit card type ---*/
.form-group-medium select.form-control {
	max-width: 100%
}

/*--- place order button ---*/
.place-order-button {
	background-color: #ffc425;
	border: 0;
	color: #222;
	text-transform: uppercase
}

	.place-order-button:hover, .place-order-button:focus, .place-order-button:active {
		background-color: #f1b000 !important;
		color: #222 !important
	}


/*--- home featured products header ---*/
.home-featured-products-header {
	padding: .5em .2em .5em .7em;
	background-color: #222;
	border-radius: .2rem .2rem 0 0;
	font-size: 1em;
	font-weight: normal;
	color: #fff;
	text-transform: uppercase
}



/*--- HEADER --------------------------------------*/

/*--- logo ---*/
.header-logo {
	display: block;
	width: 7.7em;
	/*height: 1em;compunix 07082025*/
	background: url(/App_Themes/Skin_100/images/hd-supply-logo.svg) no-repeat left center;
	background-size: contain;
	font-size: 1.875em;
	margin: 0 auto .5rem;
	overflow: hidden;
	transition: opacity .2s
}

	.header-logo:before {
		display: block;
		height: 200%;
		content: ""
	}

	.header-logo:hover, .header-logo:focus {
		opacity: .8
	}

@media (min-width:768px) {
	.header-logo {
		margin-left: 0;
		margin-right: 0
	}
}


/*--- utility menu -------------*/
.header-row .user-links {
	margin-bottom: 0
}

	.header-row .user-links li {
		margin-bottom: 10px
	}

@media (min-width:768px) {
	.header-row .user-links {
		padding-top: 10px
	}
}

@media (min-width:992px) {
	.header-row .user-links li:last-child {
		margin-right: 0
	}
}

.header-row a.user-link {
	display: block;
	padding: .6em 1em;
	border: 1px solid #aaa;
	border-radius: .2rem;
	font-size: .75em;
	color: #222;
	text-transform: uppercase;
	transition: background-color .2s
}

	.header-row a.user-link:hover, .header-row a.user-link:focus {
		background-color: #eee
	}


/*--- mobile menu bar -------------*/
.navbar-default .navbar-brand {
	display: none !important
}

/*--- menu toggle ---*/
.navbar-default .navbar-toggle {
	padding-left: 7px;
	padding-right: 7px;
	background-color: #ffc425;
	border-color: #222;
	border-radius: .2rem;
	transition: background-color .2s
}

	.navbar-default .navbar-toggle:hover, .navbar-default .navbar-toggle:focus {
		background-color: #f1b000;
		border-color: #fff
	}

	.navbar-default .navbar-toggle .icon-bar {
		background-color: #222
	}


/*--- menu -----------*/
.navbar.navbar-default.topnav {
	min-height: 0;
	background-color: #222;
	border: 0;
	border-top: .1em solid #ffc425;
	border-radius: 0;
	box-shadow: none
}

@media (min-width:1200px) {
	.navbar.navbar-default.topnav {
		padding-left: calc((100vw - 1200px) / 2);
		padding-right: calc(((100vw - 1200px) / 2) + 1.5rem);
		margin-left: calc(50% - 50vw);
		margin-right: calc(50% - 50vw)
	}
}

/*--- top-level items ---*/
.navbar-default .navbar-nav > li > a {
	padding: .6em 1em;
	font-size: 1em;
	color: #fff;
	text-shadow: none;
	font-weight: normal;
	text-transform: uppercase;
	transition: background-color .2s, color .2s
}

	.navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus {
		background-color: #f1b000;
		color: #222
	}

/*--- open state ---*/
.navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus {
	background-color: #f1b000;
	border-color: #fff
}

/*--- submenus ---*/
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
	padding-top: .4em;
	padding-bottom: .4em;
	background-color: #3c3c3c;
	border-bottom: 1px solid #999;
	color: #fff;
	text-transform: uppercase;
}

	.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
		background-color: #2f2f2f;
		color: #fff
	}

.navbar-default .navbar-nav .open .dropdown-menu > li > div {
	padding: .4em;
	background-color: #3c3c3c;
	border-bottom: 1px solid #999;
	color: #fff;
	font-size: .6em;
}



@media (max-width:767px) {
	.navbar-nav {
		margin-top: 0;
		margin-bottom: 0
	}

	/*--- top-level items ---*/
	.navbar-default .navbar-nav > li > a {
		border-bottom: 1px solid #fff
	}
}

@media (min-width:768px) {
	/*--- submenus ---*/
	.navbar-default .navbar-nav .open .dropdown-menu > li:last-child > a {
		border: 0
	}
}

/*--- dropdown ---*/
.dropdown-menu {
	border: 0
}

	/*--- divider ---*/
	.dropdown-menu .divider {
		display: none
	}

/*--- user links ---*/
.navbar-default a.user-link {
	font-size: inherit
}


/*--- search -----------*/
.navbar-form {
	margin-top: 0;
	margin-bottom: 0
}

	.navbar-form .search-form-group {
	}

	/*--- label ---*/
	.navbar-form .search-box-label {
		position: absolute;
		clip: rect(1px, 1px, 1px, 1px);
		clip-path: inset(50%)
	}

	/*--- button ---*/
	.navbar-form .search-go {
		width: 36px;
		height: 36px;
		padding-left: 0;
		padding-right: 0;
		background-color: #ffc425;
		border: 0;
		margin-top: 2px
	}

		.navbar-form .search-go:hover, .navbar-form .search-go:focus {
			background-color: #f1b000
		}

@media (max-width:767px) {
	.navbar-form {
		border: 0
	}
}

@media (min-width:768px) {
	/*--- button ---*/
	.navbar-form .search-go {
		margin: 0
	}
}




/*--- FOOTER -----------------------------*/
.footer-wrapper {
	padding: 1em;
	background: #222;
	color: #fff
}

	/*--- links---*/
	.footer-wrapper ul {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		list-style: none;
		padding: 0
	}

	.footer-wrapper li {
	}

	.footer-wrapper ul a {
		display: block;
		padding: .5em .5em;
		text-decoration: none;
		font-size: .75em;
		text-align: center;
		color: #fff;
		text-transform: uppercase
	}

		.footer-wrapper ul a:hover, .footer-wrapper ul a:focus {
			color: #f1b000
		}

	/*--- contact info group ---*/
	.footer-wrapper address {
		margin: 0
	}

	/*--- copyright---*/
	.footer-wrapper .copyright-row {
	}

	.footer-wrapper .copyright {
		padding: 0;
		font-size: .75em;
		text-align: center;
		color: #fff;
		font-style: normal
	}

		.footer-wrapper .copyright a {
			text-decoration: none;
			color: #aaa
		}

			.footer-wrapper .copyright a:hover, .copyright a:focus {
				color: #f1b000
			}




/*--- BREADCRUMB ---------------------------------*/
.breadcrumb {
	padding: 0;
	font-size: .75em;
	text-transform: uppercase;
	font-style: normal;
	font-weight: bold;
	margin: 0 0 1em
}

	.breadcrumb a {
		text-decoration: none
	}




/*--- PAGE HEADING ---------------------------------*/
h1.entity-page-header {
	font-size: 1.5em
}




/*--- PRODUCT LISTING ---------------------------------*/
.products-grid {
}

	.products-grid .row {
		display: flex;
		flex-wrap: wrap;
		margin-left: -.5em;
		margin-right: -.5em
	}

	.products-grid .product-grid-item {
		padding: 0 .5em;
		margin: 0 0 1em
	}

	.products-grid .grid-item-inner {
		min-height: 100%;
		padding: .5em;
		border: 1px solid #aaa;
		border-radius: .2rem;
		text-align: left
	}

	/*--- links ---*/
	.products-grid a {
		display: block;
		text-decoration: none
	}

	/*--- image ---*/
	.products-grid .grid-item-image-wrap {
		padding: 100% 0 0;
		position: relative;
		margin: 0 0 1em
	}

		.products-grid .grid-item-image-wrap img {
			display: block;
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			margin: auto
		}

	/*--- title ---*/
	.products-grid .grid-item-name-wrap {
		font-size: 1.125em;
		line-height: 1.1;
		color: #222;
		transition: color .2s
	}

	.products-grid a:hover .grid-item-name-wrap, .products-grid a:focus .grid-item-name-wrap {
		color: #f1b000
	}

	/*--- price ---*/
	.products-grid .price-wrap {
		font-weight: normal
	}

	.products-grid span {
		display: none
	}

	/*--- details link and add to cart stuff ---*/
	.products-grid .featuredCartWrap {
		display: none
	}



/*--- PAGINATION ---------------------------------*/
.pagination {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	font-size: .8em;
	text-align: center;
	overflow: hidden;
	margin: 0 auto 1.5em
}

	.pagination > li {
		margin: 0 .1em
	}

		/*--- page items ---*/
		.pagination > li > a, .pagination > li > span {
			background-color: #aaa;
			border-color: #aaa;
			border-radius: .2rem !important;
			color: #fff;
			transition: background-color .2s, border-color .2s, color .2s
		}

			.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus {
				background-color: #ffc425;
				border-color: #ffc425;
				color: #222
			}

	/*--- active ---*/
	.pagination > .active > a, .pagination > .active > span {
		background-color: #ffc425;
		border-color: #ffc425;
		color: #222
	}

		.pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {
			background-color: #f1b000;
			border-color: #f1b000;
			color: #222
		}

	/*--- disabled ---*/
	.pagination .disabled {
		background-color: #e5e5e5;
		border-color: #e5e5e5;
		color: #fff;
		pointer-events: none
	}



/*--- HOMEPAGE HIGHLIGHTS -----------------------------*/
.highlights {
	list-style: none;
	padding: 0;
	margin: 0 0 2em
}

	.highlights li {
		padding: .5rem;
		border: 1px solid #aaa;
		border-radius: .2rem;
		position: relative;
		margin: 0 0 1em
	}

		.highlights li::after {
			display: block;
			clear: both;
			content: ""
		}

@media (min-width:768px) {
	.highlights {
		display: flex;
		margin-left: -1em
	}

		.highlights li {
			flex-basis: 50%;
			margin-left: 1em
		}
}

/*--- heading---*/
.highlights h2 {
	padding: .5em 5em .5em .7em;
	background-color: #222;
	border-radius: .2rem .2rem 0 0;
	font-size: 1em;
	font-weight: normal;
	color: #fff;
	text-transform: uppercase;
	margin: calc(-.5rem - 1px) calc(-.5rem - 1px) 1em
}

/*--- image---*/
.highlights li > span {
	display: block;
	float: left;
	width: 30%;
	max-width: 8em;
	position: relative;
	margin: 0 1em .5em 0
}

	.highlights li > span::before {
		display: block;
		padding: 100% 0 0;
		content: ""
	}

	.highlights li > span img {
		display: block;
		max-width: 100%;
		height: auto;
		max-height: 100%;
		position: absolute;
		top: 0;
		bottom: 0;
		right: 0;
		left: 0;
		margin: auto
	}

/*--- link---*/
.highlights a {
	display: block;
	padding: .5em .6em;
	background-color: #ffc425;
	border-radius: .2rem;
	font-size: 1em;
	font-weight: bold;
	text-transform: uppercase;
	color: #222;
	text-decoration: none;
	transition: background-color .2s;
	position: absolute;
	top: -1px;
	right: -1px;
	border-radius: 0 .2rem 0 0;
	margin: 0
}

	.highlights a:hover, .highlights a:focus {
		background-color: #f1b000
	}

	/*--- arrow icon---*/
	.highlights a::after {
		display: inline-block;
		vertical-align: middle;
		font-family: 'Fontawesome';
		font-weight: normal;
		font-size: .8em;
		margin: -.1em 0 0 .4em;
		content: "\f054"
	}




/*--- PRODUCT PAGE ------------------------------------------------------------------------*/
#ProductXml {
	margin: 0 0 2em
}

@media (min-width:800px) {
	#ProductXml {
		margin-top: 2em
	}
}


/*--- product images ---------------------*/
#ProductXml .product-images {
}

@media (min-width:800px) {
	#ProductXml .product-images {
		float: left;
		/*width: 50%; 07082025 */
		max-width: 500px;
		margin: 0 1em 1em 0
	}
}

/*--- image ---*/
#ProductXml .product-images > img {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto 1em
}

/*--- zoom ---*/
#ProductXml .product-images > a {
	display: table;
	margin: 0 auto
}

/*--- email link ---*/
#ProductXml .product-images .email-a-friend-link {
	display: table;
	margin: 0 auto
}


/*--- product details ----------------------------*/
#ProductXml .product-details {
	overflow: hidden
}

	/*--- title ---*/
	#ProductXml .product-details h1 {
		font-size: 1.875em
	}

	/*--- price ---*/
	#ProductXml .product-details .product-price {
		font-size: 1.2em;
		font-weight: bold;
		margin: 0 0 1em
	}

	/*--- price ---*/
	#ProductXml .product-details ul {
		list-style-position: inside;
		padding: 0
	}

	#ProductXml .product-details li {
		margin-bottom: .2em
	}


/*--- details table ---------------------------*/
.product-options {
	width: 100%;
	max-width: 100%;
	padding: 0 0 1rem;
	border-collapse: separate;
	border-spacing: 3px;
	font-size: .8em;
	margin: 0 0 2em
}

	.product-options td {
		padding: .4em .5em;
		background-color: #f2f2f2;
		font-weight: bold;
		text-align: center
	}

		.product-options td:nth-child(even) {
			background-color: #e6e6e6
		}

	.product-options .DarkCell td {
		background-color: #aaa;
		text-transform: uppercase;
		font-weight: bold;
		color: #fff
	}

	/*--- last 2 rows' cells ---*/
	.product-options tr:nth-last-child(-n+2) td {
		background-color: #fff;
	}

@media (min-width:600px) {
	.product-options tr:nth-last-child(-n+2) td {
		text-align: right;
	}
}

/*--- quantity field ---*/
.product-options #Qty {
	display: table;
	width: 3em;
	font-size: 1.2em;
	text-align: center;
	margin: 0 auto
}

	.product-options #Qty:focus {
		border-color: #f1b000
	}

/*--- add to cart buttons ---*/
.product-options input[type="button"] {
	padding: .6em .8em;
	font-size: 1.25em;
	line-height: 1
}


/*--- single column layout ---*/
@media (max-width:599px) {
	.product-options {
		padding-bottom: 0;
		text-align: left;
	}

		.product-options, .product-options thead, .product-options tbody, .product-options tr, .product-options th, .product-options td {
			display: block;
		}

			.product-options tr.DarkCell.product-options-headings {
				display: none;
			}

			.product-options tr {
				padding: 0 0 .5em;
			}

			.product-options td {
				text-align: left;
			}

			.product-options tr.DarkCell:first-of-type {
				display:none;
			}

			.product-options tr:nth-last-child(n+2) td:before {
				display: inline-block;
				min-width: 7em;
				padding: 0 .5em 0 0;
				content: attr(data-th) ":";
			}

			.product-options td:empty {
				display: none;
			}

			/*--- inner content wrapper ---*/
			.product-options td div {
				display: inline-block;
			}

			.product-options tr.hide-it {
				display: none;
			}

			.product-options tr.active-select {
				display: table-row;
			}
}

.forgot-password-header {
	padding: .6em .8em;
	border-radius: .1rem;
	font-weight: bold;
	text-transform: uppercase;
	margin: 0 0 1em;
	cursor: pointer;
	transition: color .2s, background-color .2s, border-color .2s;
	display: table;
	padding: .3em .5em;
	font-size: 14px;
	margin: .5em 0 0;
}


	.forgot-password-header a {
		background-color: #ffc425;
		display: table;
		color: #222;
	}

.signin-text a {
	background-color: #ffc425;
	padding: .6em .8em;
	border-radius: .1rem;
	font-weight: bold;
	font-size: .8em;
	text-transform: uppercase;
	color: #222;
	margin: 0 0 1em;
	cursor: pointer;
	transition: color .2s, background-color .2s, border-color .2s;
	display: table;
	padding: .3em .5em;
	margin: .5em 0 0;
}

.grid-item-sku-wrap {
	/*padding: 0 0 .5em;
	font-size: .6em;*/
	color: #555;
}

.products-grid a:hover .grid-item-sku-wrap, .products-grid a:focus .grid-item-sku-wrap {
	color: #f1b000;
}

.navbar.navbar-default.topnav.belowmenubar {
	margin-top: -12px;
	color: white;
	text-align: center;
	border-bottom: .1em solid #ffc425;
}

.bestseller-image-wrap, .bestseller-name-wrap {
	display: inline-block;
}

a.bestseller-product-link img {
	width: 100px;
}

a.bestseller-product-link {
	display: block;
}

.best-sellers-entities {
	color: #ffc425;
}



.white-box-heading {
	text-align: center;
	font-size: large;
	font-weight: bold;
}



#my_startdate_picker, #my_enddate_picker {
	opacity: 1;
	background: white;
	width: 17em;
	height: 0;
	position: relative;
	left: 200px;
	top: -100px;
	z-index: 10000;
}

.ct-app {
	display: none;
}








/*--- ACCOUNT ----------------------------------------*/
.account-page {
}

/*--- heading ---*/
h1.account-page-header a {
	background-color: white;
	color: red;
	font-size: 18px;
	padding: 4px
}


/*--- header/links ---------*/
#account-header-links {
	display: flex;
	flex-wrap: wrap;
	gap: .5em
}

	#account-header-links a {
	}








/*--- DASHBOARD ----------------------------------------*/
.customerreport {
	display: grid;
	gap: clamp(.5em, 1.5vw, 1.5em);
	margin: 0 0 2em
}

	/*--- report items -------------*/
	.customerreport > div:not(:first-of-type) {
		display: flex;
		flex-wrap: wrap;
		gap: .5em 1em;
		padding: clamp(.5em, 10vw, 1em);
		border-radius: .4rem;
		border: 1px solid #eaeaea;
		box-shadow: 0 0 .25em #e6e6e6, 0 0 clamp(.5em, 1.5vw, 1.5em) #dedede
	}

	/*--- title ---*/
	.customerreport h2 {
		flex-basis: 100%;
		font-size: 1.125em;
		font-weight: bold;
		margin: 0
	}

	/*--- chart SVG ---*/
	.customerreport svg {
		display: block;
		width: auto;
		max-width: 100%;
		overflow: visible
	}


@media (min-width:500px) {
	.customerreport {
		grid-template-columns: repeat(4, 1fr)
	}

		/*--- first 4 (excluding .reporttype) ---*/
		.customerreport > div:nth-of-type(n + 2):nth-of-type(-n + 5) {
			grid-column: span 2
		}

		/*--- all others ---*/
		.customerreport > div:nth-of-type(n+6) {
			grid-column: span 4
		}

		/*--- table ---*/
		.customerreport .dashboardgrid {
			grid-column: span 4 !important
		}
}

@media (min-width:768px) {
	/*--- all others ---*/
	.customerreport > div:nth-of-type(n+6) {
		grid-column: span 2
	}
}

@media (min-width:992px) {
	/*--- first 4 items ---*/
	.customerreport > div:nth-of-type(n + 2):nth-of-type(-n + 5) {
		grid-column: span 1
	}
}


/*--- filters --------------------*/
.customerreport .reporttype {
	grid-column: 1/-1;
	display: flex;
	flex-wrap: wrap;
	justify-content: end;
	gap: .5em
}

/*--- selector & link ---*/
.customerreport label[for="TimeFrames"] {
	position: absolute;
	clip: rect(0,0,0,0);
	clip-path: inset(50%)
}

.customerreport #TimeFrames, .customerreport #btnReport {
	padding: .1em .4em;
	border: 1px solid #bbb;
	border-radius: .4rem
}

.customerreport #btnReport {
	text-decoration: none
}

	.customerreport #btnReport:not(:hover, :focus) {
		color: #222
	}


/*--- simple values --------------------*/
.customerreport .report-value {
	display: grid !important;
	grid-template-columns: 2em 1fr;
	gap: 0 1em !important;
	background-color: #ffa556;
	border: 0 !important;
	line-height: 1;
	color: #fff;
	text-shadow: 0 0 .1em rgba(0,0,0,.2), 0 0 .5em rgba(0,0,0,.1)
}

	.customerreport .report-value i {
		grid-row: 1/3;
		justify-self: center;
		align-self: center;
		font-size: 1.2em
	}

	.customerreport .report-value h2 {
		order: 01;
		font-size: .8em;
		font-weight: normal;
		margin: 0
	}

	.customerreport .report-value div {
		font-size: 1.5em
	}

/*--- color ---*/
.customerreport > div:nth-child(2 of .report-value) {
	background-color: #67e462
}

.customerreport > div:nth-child(3 of .report-value) {
	background-color: #b28ed4
}

.customerreport > div:nth-child(4 of .report-value) {
	background-color: #6e9fbd
}


/*--- big donut charts -------------*/
.customerreport .report-donut {
}

	/*--- legend ---*/
	.customerreport .report-donut ul {
		align-self: center;
		flex: 1 0 6em;
		order: 2;
		list-style: none;
		padding: 0;
		margin: 0
	}

	.customerreport .report-donut li {
		display: flex;
		align-items: start;
		gap: .5em;
		font-size: .8em;
		line-height: 1;
		font-weight: bold;
		margin: 0 0 1em
	}

		.customerreport .report-donut li::before {
			display: block;
			flex: 0 0 1em;
			width: 1em;
			height: 1em;
			background-color: #5681F2;
			border-radius: 50%;
			font-size: .8em;
			font-weight: bold;
			margin: .2em 0 0;
			content: ""
		}

		/*--- color ---*/
		.customerreport .report-donut li:nth-child(2)::before {
			background-color: #6EC6EA
		}

		.customerreport .report-donut li:nth-child(3)::before {
			background-color: #50B887
		}

		.customerreport .report-donut li:nth-child(4)::before {
			background-color: #A6DF6E
		}

		.customerreport .report-donut li:nth-child(5)::before {
			background-color: #FBB458
		}

		.customerreport .report-donut li:nth-child(6)::before {
			background-color: #F2A7A4
		}

		.customerreport .report-donut li:nth-child(7)::before {
			background-color: #E2664E
		}

		.customerreport .report-donut li:nth-child(8)::before {
			background-color: #e24e9e
		}

		.customerreport .report-donut li:nth-child(9)::before {
			background-color: #dc4ee2
		}

		.customerreport .report-donut li:nth-child(10)::before {
			background-color: #b44ee2
		}

	/*--- SVG ---*/
	.customerreport .report-donut svg {
		height: 300px
	}

		.customerreport .report-donut svg > g {
			scale: .78;
			transform: translate(22%, 22%)
		}

/*--- donut slices ---*/
.customerreport .nvd3.nv-pie path {
	stroke-width: 2px !important
}

/*--- slice label ---*/
.customerreport .nv-pieLabels {
	display: none
}

.customerreport .nv-label {
}

	.customerreport .nv-label rect {
	}

	.customerreport .nv-label text {
	}

/*--- hover tooltip ---*/
.customerreport .nvtooltip {
}


/*--- graph chart --------------------*/
.customerreport .report-chart {
}

/*--- image wrapper ---*/
.customerreport #TotalOrdersByDateGraphChart {
}

	/*--- SVG ---*/
	.customerreport #TotalOrdersByDateGraphChart svg {
		height: 300px
	}

	.customerreport #TotalOrdersByDateGraphChart line {
		display: none
	}

	.customerreport #TotalOrdersByDateGraphChart .nv-group {
		fill-opacity: 1 !important
	}


/*--- map ------------------------------*/
.customerreport .report-map {
}

/*--- image wrapper ---*/
.customerreport #vmap {
}

	/*--- SVG ---*/
	.customerreport #vmap svg {
	}

	/*--- text ---*/
	.customerreport #vmap text {
		fill: #fff !important;
		stroke: #000 !important;
		font-weight: bold
	}


/*--- recent orders ----------------------*/
.customerreport .dashboardgrid {
	overflow: hidden
}

	.customerreport .dashboardgrid > div {
		width: 100%;
		overflow-x: auto
	}

	/*--- table----------*/
	.customerreport .dashboardgrid table {
		width: 100%;
		font-size: .875em;
		white-space: nowrap
	}

	.customerreport .dashboardgrid tr:nth-child(even) {
		background-color: #fafafa
	}

	.customerreport .dashboardgrid th, .dashboardgrid td {
		padding: .5em 1em .5em 0
	}

	.customerreport .dashboardgrid th {
		font-size: .85714285em;
		text-transform: uppercase;
		color: #757575
	}

	.customerreport .dashboardgrid td {
		border-top: 1px solid #bbb
	}

	.customerreport .dashboardgrid th:nth-of-type(n + 4):nth-of-type(-n + 7), .dashboardgrid td:nth-of-type(n + 4):nth-of-type(-n + 7) {
		text-align: right
	}

	.customerreport .dashboardgrid th:last-child, .dashboardgrid td:last-child {
		text-align: center
	}










/*--- CUSTOMER REPORT ----------------------------------------*/
.customerreport2 {
	margin: 0 0 2em
}

	/*--- groups ---*/
	.customerreport2 > div {
		padding: clamp(.5em, 10vw, 1em);
		border-radius: .4rem;
		border: 1px solid #eaeaea;
		box-shadow: 0 0 .25em #e6e6e6, 0 0 clamp(.5em, 1.5vw, 1.5em) #dedede;
		margin: 0 0 1em
	}

	/*--- headings ---*/
	.customerreport2 h1, .customerreport2 h2 {
		font-weight: bold
	}

	.customerreport2 h1 {
		font-size: 1.5em
	}

	.customerreport2 h2 {
		font-size: 1.25em
	}


	/*--- selection group ------------------*/
	.customerreport2 > div:first-of-type {
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		gap: 1em 2em
	}

	/*--- form elements ---*/
	.customerreport2 label {
		font-weight: normal
	}

	.customerreport2 legend {
		border: 0;
		font-size: 1em;
		margin: 0 0 .5em
	}

	/*--- report type ---*/
	.customerreport2 .reporttype {
	}

	/*--- time frame ---*/
	.customerreport2 .timeframe {
	}

		.customerreport2 .timeframe label {
		}

	/*--- date range ---*/
	.customerreport2 .dates {
		display: flex;
		flex-wrap: wrap;
		gap: .25em 1em
	}

		.customerreport2 .dates label {
		}

@media (max-width:400px) {
	.customerreport2 .dates label {
		display: block
	}
}


/*--- buttons ---*/
.customerreport2 .submit {
	flex: 100%;
	padding: .5em 0 0;
	border-top: 1px solid #aaa
}

	.customerreport2 .submit button {
	}


/*--- results group ------------------*/
.customerreport2 > div:last-of-type {
}

/*--- column reset ---*/
.customerreport2 .col-lg-12 {
	float: none;
	padding: 0
}

	.customerreport2 .col-lg-12 ~ .col-lg-12 {
		margin-top: 1em
	}


/*--- charts without height ---*/
.customerreport2 svg.dash-chart:not([height]) {
	height: 300px
}


/*--- table data ---*/
.customerreport2 .customerreportgrid {
	overflow: hidden
}

	.customerreport2 .customerreportgrid > div {
		overflow-x: auto
	}

	.customerreport2 .customerreportgrid table {
		width: 100%;
		font-size: .875em;
		white-space: nowrap
	}

	.customerreport2 .customerreportgrid tr:nth-child(even) {
		background-color: #fafafa
	}

	.customerreport2 .customerreportgrid th, .customerreport2 .customerreportgrid td {
		padding: .5em 1em .5em 0
	}

	.customerreport2 .customerreportgrid.approvedordersbydate th, .customerreport2 .customerreportgrid.approvedordersbydate td {
		padding: .2em .2em .5em 0;
		text-align: left;
	}

	.customerreport2 .customerreportgrid th {
		font-size: .85714285em;
		text-transform: uppercase;
		color: #757575
	}

	.customerreport2 .customerreportgrid td {
		border-top: 1px solid #bbb
	}

		.customerreport2 .customerreportgrid th:nth-of-type(n + 2):nth-of-type(-n + 4), .customerreport2 .customerreportgrid td:nth-of-type(n + 2):nth-of-type(-n + 4), .customerreport2 .customerreportgrid th:last-child, .customerreport2 .customerreportgrid td:last-child {
			text-align: right
		}

		.customerreport2 .customerreportgrid th:nth-child(5), .customerreport2 .customerreportgrid td:nth-child(5) {
			text-align: center
		}

#main-product ul {
	font-weight: normal;
}

#ProductXml #logo_image {
	display: none !important;
}

#ProductXml .product-details {
	font-weight: normal;
}

.custom-order-form-header, .custom-order-form-detail {
	font-size: 15px;
}

	.custom-order-form-header h1 {
		border-bottom: 1px solid black;
		margin-bottom: 15px;
	}

	.custom-order-form-detail .editor-field label, .custom-order-form-detail .editor-field input, .custom-order-form-detail.editor-field span {
		display: block;
	}

.custom-order-form-detail {
	margin-top: 30px;
	padding-left: 30px;
	padding-right: 30px;
}

	.custom-order-form-detail .row {
		margin-bottom: 10px;
	}

		.custom-order-form-detail .row input {
			width: 80%;
		}

		.custom-order-form-detail .row input {
			width: 40%;
		}

.date-picker-div, #EventDate {
	display: inline-block;
	/*height: 27px;
	font-size: 15px;*/
}

.date-picker-div {
	position: relative;
	float: left;
	margin-right: 4px;
}

.custom-order-form-detail #my_startdate_picker {
	left: 50px;
}

.custom-order-form-detail .editor-field input {
	width: 80%;
}

.custom-order-form-detail .editor-field textarea {
	width: 80%;
	height: 120px;
}

.custom-order-form-detail .editor-field-inline {
	display: inline-block;
	width: 40%;
}

.custom-order-form-detail select {
	padding-left: 5px;
	padding-right: 5px;
	width: 100%;
	height: 28px;
	margin-right: 5px;
}

.custom-order-form-detail .editor-field-inline input {
	width: 100%;
}

.custom-order-form-detail span {
	display: block;
}

.custom-order-form-detail .required::after {
	content: " (required)";
	font-weight: normal;
	color: #A94442;
}

select#EventDate.noshow {
	-moz-appearance: none;
	-webkit-appearance: none;
	appearance: none;
	background-image: none;
}

select#EventDate option hide {
	display: none;
}



.page-wrap.custom-order-form-detail .editor-field.datefieldX input {
	float: left;
	margin-right: 3px;
	width: fit-content;
	display: inline-block;
}

.page-wrap.custom-order-form-detail .editor-field.datefieldX label {
	float: left;
	margin-right: 3px;
	width: fit-content;
	display: inline-block;
}

.page-wrap.custom-order-form-detail .editor-field.datefieldX fieldset {
	float: left;
	margin-right: 3px;
	width: fit-content;
	display: inline-block;
}

.page-wrap.custom-order-form-detail .editor-field.datefieldX label#EventDateLabel {
	float: none;
	clear: both;
	display: block;
}

#fsEventDate {
	margin-left: 15px;
}

.custom-order-form-detail .editor-field.editor-field-inline.city {
	width: 30%;
}

.custom-order-form-detail .editor-field.editor-field-inline.state {
	width: 16%;
}

.custom-order-form-detail .editor-field.editor-field-inline.zipcode {
	width: 16%;
}

.custom-order-form-detail .editor-field.editor-field-inline.country {
	width: 16%;
}

.error {
	background-color: lightpink;
}

.customerreportgrid a.approve {
	background-color: green;
}

.customerreportgrid a.deny {
	background-color: red;
}

.customerreportgrid a.disabled {
	border: none;
	font-weight: normal;
	background-color: gray;
}

.customerreportgrid a {
	opacity: .85;
}

	.customerreportgrid a:hover {
		opacity: 1;
	}


.InseamDropdown option {
	color: gray;
	font-weight: normal;
}

	.InseamDropdown option.bold-text {
		color: black;
		font-weight: bold;
	}



.WaistDropdown option {
	color: gray;
	font-weight: normal;
}

	.WaistDropdown option.bold-text {
		color: black;
		font-weight: bold;
	}





.product-options-headings.hide-it {
	display: table-row;
}

.hide-it {
	display: none;
}

.product-options tr.active-select {
	display: table-row;
}

.product-options .inventory {
	display: none;
}

.product-options .available {
	display: none;
}

.product-options tr.hide-it.satc {
	display: table-row;
}

.product-filters span, .product-filters select {
	font-weight: bold;
	margin-right: 4px;
}

.approvedordersbydate table tr td, .approvedordersbydate table tr th {
	text-align: left !important;
}
#ProductXml .waist-inseam-dropdown {
	clear: both;
}
#ProductXml .product-details .product-price {
	display: none;
}
/* for everything other than pants */
#ProductXml.impactvariantsintable .product-options tr td.price {
	display: none;
}


#ProductXml.impactvariantswdropdowns .product-options tr td.price {
	display: none;
}
	#ProductXml.impactvariantswdropdowns .product-options tr td.inventory {
		display: none;
	}
	#ProductXml.impactvariantswdropdowns .product-options tr td.available {
		display: none;
	}
.account-page .wallet-wrap {
                display:none;

}
.account-page #gift-card-wrap {
                display: none;
}
/*
.account-page .order-history-table tr th:nth-child(4),
.account-page .order-history-table tr td:nth-child(4) {
                display: none;
}
*/

/* hide the {EDIT ADDRESSES] button on the account page */

.col-sm-6.address-wrap .address-edit {display:none;}