/* ===========================
	1. GLOBAL UTILITIES
=========================== */

/* ===== Colors ===== */
.text-gray{color: #383838;} 

/* ===============================
	2. COMPONENT-SPECIFIC CSS
=============================== */

/* ---------- Navbar ----------*/
.navbar-parent-container{background: linear-gradient(to bottom, rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0)) !important;}
.navbar-content-container{justify-content: space-evenly;}
a.d-lg-none i.fa-bars {color: #383838; }
.breadcrumb{display: none !important;}

/* ---------- Home Page ----------*/

/* ===== Banner ===== */
.banner-parent-container{
	background-image: url(https://store-media.mpowerpromo.com/694054ba33c5f55224061aa7/assets/Banner-1765823888489.jpg);
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	background-attachment: fixed;
	min-height: 350px;
}
/* ===== Arrows ===== */
.shape-1 {right: -76px;}
.shape-2 {right: -100px;}
.shape-3 {right: 500px;}

/* ===== Home Page Product Section ===== */
.home-page-body{
	padding-top: 5%;
  padding-bottom: 5%;
}
.row-container{
	padding-left: 5%;
	padding-right: 5%;
}
.row-item{max-width: 25% !important;}

/* ---------- Product Page ----------*/

.product-configure-part-label{ display: none }
.product-configure-part-count:after{ content: ' Color(s)'; }
button[data-cy="add-artwork"] span {display: none;}
button[data-cy="add-artwork"]::after {
  content: "Add Logo";
  white-space: nowrap;
}
button[data-cy="add-artwork"] {
  min-width: 140px;
  flex: 0 0 auto;
	justify-content: center !important;
}
.sticky-top{z-index: 49 !important;}
.col-md-8.col-lg-6 > div:nth-child(1) {order: 2;}
.col-md-8.col-lg-6{
	display: flex;
	flex-direction:column;
}
[data-id="mPower-DesignBlock1"] {text-align:center !important;}
h3.product-configure-part-heading, h1[data-cy="product-name"] { display: none !important;}
.mpower-designer-viewer,
  .mpower-designer-viewer .viewer,
  .mpower-designer-viewer .canvas-container,
  .mpower-designer-viewer canvas.lower-canvas,
  .mpower-designer-viewer canvas.upper-canvas {pointer-events: none !important;}

/* ---------- Footer ----------*/

.footer-content-container{
  justify-content: space-evenly;
	background-color: #383838 !important;
}
.nav-link {color: silver !important;}

/* ===============================
	3. Media CSS
=============================== */

/* ---------- Tablet + Mobile Shared Utilities ---------- */
@media (max-width: 991px) {
  .responsive-display-none { display: none !important; }
  .responsive-padding-1 { padding: 1rem !important; }
  .responsive-min-height { height: 80px !important; }
  .responsive-align-content-center { align-content: center !important; }
  .responsive-justify-space-between { justify-content: space-between !important; }
}
/* ---------- Mobile Only ---------- */
@media (max-width: 576px){
	.shape-3 {right: 150px;}
	.shape-2 {right: -80px;}
	.shape-1 {right: -36px;}
	.row-item{min-width: 80% !important;}
	.banner-parent-container{
		background-attachment: scroll !important;
		min-height: 300px !important;
	}
}