/* Common */
html {
	font-size: 16px;
}

body {
	/* font-family: Arial, Helvetica Neue, Helvetica, sans-serif; */
	font-family: 'Roboto', sans-serif; 
}

img {
	width: 100%;
}

img.nogutter-img {
	margin: 0 -20px;
}

a,
a:hover {
	color: #000;
	text-decoration: none;
}

.form-control {
	border-radius: 0;
	height: calc(2.25rem + 2px);
	padding: 0.375rem 0.75rem;
	font-size: 1rem;
}

.form-control.inline {
	display: inline-block;
	width: auto;
}

.form-control:focus {
	border-color: #ced4da;
	box-shadow: none;
}

.btn {
	font-size: inherit !important;
	padding: 9px 12px;
	border-radius: 0;
	text-transform: capitalize;
	vertical-align: top;
}

.btn i {
	vertical-align: text-top;
}

.btn-primary,
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active {
	background: #fa6600;
	border: 2px solid #fa6600;
	color: #fff;
	box-shadow: none;
	outline: none;
}

.btn-transparent {
	background: transparent;
}

/* breadcrumb  */
#breadcrumb {
	border-bottom: 1px solid #ccc;
	padding-bottom: 20px;
}

.breadcrumb-section
{
	background:transparent;
	padding-left: 30px;
}

.breadcrumb {
	background: transparent;
	font-size: 1rem !important;
	color: #444;
    padding: 0;
    margin-bottom: 0;
}

.breadcrumb a {
	display: inline-block;
	padding: 0 0.5rem;
}

.breadcrumb a:first-of-type {
	padding-left: 0;
}

.page-title {
	font-size: 1.75rem;
	color: #444;
}

.figure-caption {
	color: #000;
	font-size: 1.125rem;
}

.container {
	max-width: 100%;
	padding: 0 3rem;
}

main {
	margin-bottom: 0;
}

.page-title {
	margin-top: 1.5rem;
}

.text-danger {
    color: #f00;
}

/* header */
nav {
	border-bottom: 7px solid #fa6600;
	padding-bottom: 0.3rem;
}
nav i {
	font-size: 12px;
	vertical-align: middle;
	margin-left: 5px;
}


#nav-main {
	margin-top: 1rem;
}

.right-menu {
	font-size: 0.85rem;
}

.right-menu li {
	color: #4c4c4c;
	margin-left: 1.2rem;
}

.right-menu,
.right-menu li a {
	color: #4c4c4c;
}

nav ul,
nav li {
	list-style-type: none;
	padding: 0;
}

nav li {
	display: inline-block;
	font-weight: 600;
}

.logo {
	width: 180px;
	z-index: 100;
	position: relative;
    top: -12px;
}
.header-promo {
    background: #000;
    color: #fff;
    font-family: Verdana, Arial, sans-serif;
    padding: 20px 0px 20px;
}
.header-promo h4 {
    font-size: 1.625rem;
    margin-bottom: 0px;
    margin-top: 0;
}
.header-promo h4 small {
    font-size: 19px;
    color: inherit;
}

.menu-section {
	background: #000;
	margin: 1rem 0 0;
}
.nav-items {
	font-size: 0.875rem;
	transition: 0.5s all ease-in;
	margin-bottom: 0;
}

.nav-item {
	position: relative;
    font-size: 12px;
    margin: 8px 0 0 1.2rem;
    padding: 0.7rem 0.5rem;
    cursor: pointer;
    transition: 0.3s all ease-in;
}

.monster-nav-badge {
    display: inline-block;
    background: #ff0;
    color: #000;
    padding: 0;
    border-radius: 3px;
    margin: 0 0 0 5px;
    font-weight: 700;
    font-size: 8px;
    text-transform: uppercase;
    line-height: 13px;
    height: 11px;
    width: 24px;
    text-align: center;
}

.nav-item:first-of-type {
	margin-left: 0;
	display: none;
}

.nav-item a {
	color: #000;
}

.nav-item.active a {
	color: #fa6600;
}

.nav-item.close-nav {
	display: none;
	font-size: 1.5rem;
}

.menu-icon {
	display: none;
	position: absolute;
	top: 2.2rem;
	right: 1rem;
}
.sm-header-bar, .sm-header-bar a, .md-header-bar, .md-header-bar a {
    color: #fff;
}
.sm-header-bar, .md-header-bar {
    display: none;
    padding: 1rem;
    background: #000;
}
.sm-header-bar a {
	color: #fff;
}
.nav-visible {
	right: 0 !important;
}
#nav-main
{
	position:relative;
	margin-top: 1rem;
}
.sm-header-bar
{
	display:none;
}
.searchbox_wrapper {
    position: relative;
    font-size: 16px;
    margin:0.6rem 0 0 1.2rem;
    padding: 0 0 0.2rem 0.2rem;
    cursor: pointer;
    transition: 0.3s all ease-in;
   
}
nav .search-input, nav .search-input:focus {
     width: 71.7%;
    color: #929292;
    font-family: Font Awesome\ 5 Free;
    font-weight: 900;
    border-width: 0 0 1px 0;
    border-color: #929292;
    outline: none;
}
#nav-main li.nav-item a.active-nav
{
	color:#fa6600;
	text-decoration:none;
}
.search-btn {
    background:#fa6600;
    color: #fff;
    margin-left: -4px;
    padding: 0.6rem 1rem;
    border-radius: 0;
    border-bottom: 1px solid #ff6431;
}

/* homepage */
#mega-title h1 {
	color: #fa6600;
	font-weight: bold;
}

#mega-title h4 {
	color: #4c4c4c;
	font-weight: bold;
}
.banner {
	position: absolute;
	top: 0;
	width: 100%;
	height: 500px;
	color: #fff;
	font-family: Verdana, Arial, sans-serif;
}
#homepage-banner
{
	margin-bottom:3rem;
}
#homepage-bottom-banner.mt-5
{
	margin-top:0 !important;
}
.banner-item, #homepage-bottom-banner {
	position: relative;
}
#homepage-banner li.banner-item
{
	list-style:none;
}
.banner-image {
	position: relative;
	min-height: 500px;
	object-fit: cover;
}

.banner-header {
	font-size: 4.5rem;
	font-weight: bold;
}

.banner-body {
	font-size: 1.5rem;
}

.banner-footer {
	font-size: 24px;
}

.banner-cta {
	color: #fff;
	font-size: 24px;
	border: 1px solid #fff;
	border-radius: 3px;
}

.banner-cta:hover {
	color: #fff;
}

.section-header {
	color: #424242;
}

.bottom-banner-content {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	color: #fff;
	font-family: Verdana, Arial, sans-serif;
	width: 54%;
}

.bottom-banner-header {
	font-size: 3.75rm;
	font-weight: bold;
}

.bottom-banner-body {
	font-size: 1.8rem;
}

#homepage-products img {
	max-width: 500px;
}

.homepage-products-tagline {
	color: #fa6600;
	font-size: 1.1rem;
}

/* Department */
#departments {
	border-top: 1px solid #929292;
	margin-top: 1rem;
}

.filter-area {
	border-right: 1px solid #929292;
}

.filter-header,
.product-grid {
	padding-top: 2rem;
}

.filter-title,
.filter-item i {
	display: none;
}

.dept-list {
	list-style-type: none;
	padding-left: 0;
	line-height: 3rem;
}

.dept-list a {
	color: #4c4c4c;
}

.product-grid {
	border-bottom: 1px solid #929292;
}

.product-grid .figure-caption {
	font-size: 1.125rem;
	border-top: 1px solid #929292;
	padding-top: 0.5rem;
}

/* PLP */
.sort-refine-bar .form-group {
	display: inline-block;
}

#perPageCount1, #perPageCount2 {
	width: 100%;
}

.sort-refine-bar .btn-default.js-show-facets {
    background: #fa6600;
    border-color: #fa6600;
}

.pagination-bar-results {
    display: inline-block;
    margin: 0 !important;
    padding: 0 0 0 5px !important;
}

.pagination-bar .pagination,
.pagination > li.pagination-prev > a, .pagination > li.pagination-prev > span,
.pagination > li.pagination-next > a, .pagination > li.pagination-next > span {
	border: none;
}

.pagination > li > a,
.pagination > li > span {
	font-size: 24px;
	color: #fa6600;
}

.pagination-bar .pagination, .pagination-bar button {
    margin-top: 34px;
}

.product__listing .product__list--price-panel {
  text-align: left;
  float: none !important;
  width: 100% !important;
}

.product__listing .product__list--name {
	margin: 0 0 0px !important;
}
.product__listing .product__listing--code
{
	margin-bottom:7px;
}

.product__listing .product__listing--description {
	margin: 1rem 0;
}

.product__list--price-panel > div {
	line-height: 2;
}

.product__listing--sale-price, .product__listing--price, .product__free--shipping {
	font-size: 0.875rem;
	color: #4c4c4c;
}

.product__listing--special-price {
	color: #fa6600;
	font-size: 1.125rem;
}

.product__free--shipping {
	color: #0066cd;
}

.product__listing--rating {
	font-size: 1.2rem;
}

.product__listing--rating .rating-count {
    color: #0066cd;
    font-size: 0.8rem;
}

.rating .rating-stars span.active {
    color:#fa6600;
}

.product__listing--description {
	max-height: 100px;
	overflow: hidden;
	transition: 0.5s max-height ease-in;
}

.product__listing--description-trigger {
	display: none;
}

.product__listing--description.visible {
	display: block !important;
	max-height: 1000px !important;
	height: auto;
}

a.toggle-description {
	color: #0066cd;
	text-decoration: none;
}

.product__listing--compare input[type="checkbox"] {
	display: none;
}

.product__listing--compare label {
	padding-left: 0;
}

.compare-checkbox {
	display: inline-block;
    width: 20px;
    height: 20px;
    padding: 0;
    margin-right: 10px;
    border: 1px solid #cccccc;
    text-align: center;
    vertical-align: middle;
    background: #ffffff;
    margin-top: -3px;
}

.product__listing--compare .checkbox input[type="checkbox"]:checked + .compare-checkbox {
	background: #fa6600;
	border: #fa6600;
}
.product__listing.product__list .product__list--item:nth-of-type(2n)
{
	background-color: transparent;
}
a.remove-facet {
	color: #fa6600;
}

/* footer */
footer {
	font-size: 0.75rem;
	color: #fff;
	background: #231f20;
	border-top: 5px solid #fa6600;
	margin-top: 5px;
}

#footer-main {
	padding: 1rem 0;
}

#footer-main a {
	color: #fff;
}

footer ul {
	padding: 0;
	list-style-type: none;
}

.footer-section-title {
	text-transform: uppercase;
	font-weight: bold;
	border-bottom: 1px solid #929292;
	margin-bottom: 1rem;
}

.footer-link {
	text-transform: capitalize;
}

li.footer-contact-item,
li.footer-logo {
	display: inline-block;
	margin-left: 0.8rem;
}

li.footer-contact-item:first-of-type {
	margin-left: 0;
}

#footer-copyright {
	padding: 1rem 0;
}

#footer-copyright a {
	color: #fa6600;
	text-decoration: underline;
}
#footer-main .col-md-6 .col-sm-4:nth-child(4)
{
	clear: left;
    margin-top: -10.5em;
    margin-left: 0;
}
#footer-main .col-md-6 .col-sm-4:nth-child(5)
{
	clear: left;
	margin-left: 0;
    margin-top: 8px;
}
#footer-main .col-md-4 .expand-footer-section
{
	display:none;
}
#footer-main .col-md-4 i.fa-angle-right
{
	padding-left: 5px;
}
#footer-main .expand-footer-section
{
	display:none;
}


/* media queries */
@media (max-width: 1023px) {
	.header-promo
	 {
   		 display: none;
	}
	img.nogutter-img {
		margin: auto;
	}
	.banner-image
	{
		min-height:auto;
	}
	/* header */
	nav {
		border: none;
	}
	#nav-main {
		margin-top: 0;
	}
	.logo
	 {
	   margin: 17px 0 17px 0;
   	   width: 125px;
       top: 0;
	}
	.nav-links .breadcrumb-section
	{
		display:none;
	}
	.menu-icon .toggleMenu:first-child
	{
		display:inline-block;;
	}
	#nav-main .flex-grow-1.nav-items {
		flex-direction: column;
		position: fixed;
		top: 0;
		right: -100%;
		width: 300px;
		height: auto;
		background: #2e2e2e;
		overflow-y: scroll;
		z-index: 101;
		margin:0;
	}
	#nav-main .nav-links
	{
		margin:0;
		order:2;
	}
	.nav-item {
		display: block;
		margin-left: 0;
		padding: 0.7rem 0;
		font-size: inherit;
		margin-top:0;
	}
	.nav-search .nav-item
	{
   	 	padding: 1rem;
	}
	.nav-search .nav-item a
	{
    	padding: 0;
	}
	.nav-item a {
		display: block;
		width: 100%;
		padding: 1rem;
		color: #fff;
	}
	nav .search-input, nav .search-input:focus
	{
	    width: 80%;
	    padding: 0.8rem 0.2rem;
	    border: 1px solid #929292;
	    font-size: 16px;
	}
	.searchbox_wrapper .search-btn
	{
	    margin-left: -2px;
	    padding: 0.8rem 1rem;
	}
	.nav-links > .nav-item {
		border-bottom: 1px solid #f2f2f2;
	}
	.nav-links > .nav-item:last-child
	{
		border-bottom: none;
	}
	.nav-item a i {
		float: right;
	}
	.searchbox_wrapper
	{
    	margin-left: 0.2rem;
    	padding: 0.4rem 0.5rem 0.2rem 0.2rem;
    	margin-top:0;
	}
	.col-xs-6.menu-icon
	{
		width:auto;
	}
	.menu-icon {
		display: block;
		position: absolute;
	    top: 24px;
	    right: 0;
	    z-index: 100;
	}
	.menu-icon a .ss-rows
	{
		margin-top: 1px;
        display: inline-block;
        margin-right: 3px;
	}
	.nav-item.close-nav {
		display: block;
		margin:0;
	}
	.nav-item:hover 
	{
   		background: transparent;
	}
	.nav-item.close-nav i {
		float: none;
		font-size: inherit;
	}
	.right-menu {
		display: none;
	}
	/* homepage */
	#homepage-products {
		text-align: center;
	}
	#homepage-products .d-flex {
		flex-direction: column;
	}
	.bottom-banner-content {
		text-align: center;
	}

	/* Departments */
	.filter-area {
		border-right: none;
	}
	.filter-title,
	.filter-item i {
		display: inherit;
	}
	.filter-title {
		background: #414141;
		color: #fff;
		font-size: 1rem;
		font-weight: bold;
		padding: 0.8rem;
		margin-bottom: 0;
	}

	.dept-list.filters {
		border: 1px solid #4c4c4c;
		border-bottom-width: 0px;
	}

	.filters .filter-item {
		padding: 0.5rem;
		border-bottom: 1px solid #4c4c4c;
	}

	.filters .filter-item i {
		float: right;
		margin-top: 1rem;
		color: #fa6600;
	}
	figure {
		margin: 0 0 1.5rem;
	}
	figcaption {
		text-align: center;
	}
	.product-grid .product-item img {
		border: 1px solid #4c4c4c;
	}
	.product-grid .figure-caption {
		border: none;
	}
	#footer-main .col-md-4 .expand-footer-section
	{
		display:inline-block;
	}
	#footer-main .col-md-6 .col-sm-4:nth-child(3) .footer-section-title
	{
		margin-top: 0;
	}
	#footer-main .col-md-6 .col-sm-4:nth-child(4)
	{
		clear: left;
	    margin-top: 0;
	}
	#footer-main .expand-footer-section
	{
		display:block;
	}
}

@media (max-width: 767px) {
	/* header */
	.sm-header-bar {
		display: block;
	}
	.nav-search {
		text-align: left !important;
		order: 1;
	}

	/* homepage */
	.banner-header,
	.bottom-banner-header {
		font-size: 2.5rem;
	}
	.category-product-title {
		font-size: 1rem;
	}

	/* PLP */
	.sort-refine-bar .form-group {
		display: block;
	}
	.product__listing.product__list .product__list--price-panel {
	    margin-left: 0 !important;
	}
	.product__listing .product__listing--description {
		display: block !important;
		max-height: 0;
		margin: 0;
		height: auto;
		transition: 0.5s max-height ease-in;
	}
	.product__listing--description-container {
		border: 1px solid #000;
	    padding: .5rem;
	    margin-top: 1rem;
	}
	.product__listing--description-trigger {
		display: block;
	}
	.toggle-description {
		display: none;
	}
	.product__listing.product__list .SearchResultsList-ListAddToCartAction {
		float: none;
		width: 100%;
	}
	.product__list--item .addtocart {
		position: inherit;
	}


	/* footer */
	.collapsible {
		display: none;
	}
	.footer-contact-item.bar {
		display: none;
	}
	li.footer-contact-item {
		display: block;
		margin-left: 0;
	}
}

@media (min-width: 1024px) {
	/* common */
	.container {
		width: 100% !important;
		padding: 0 3rem !important;
	}

	/* header */
	.submenu-1-item:first-of-type {
		margin-top: 2rem;
	}
	.nav-item:hover .nav-submenu-1 {
		opacity: 1;
		height: 920px;
		z-index: 10;
	}
	.nav-search {
		flex-grow: 1;
	}
	.nav-search .search-btn {
		display: none;
	}
	.banner-image
	{
		min-height:auto;
	}

	/* PLP */
	.product__listing .addtocart .SearchResultsList-ListAddToCartAction,
	.ProductListComponent-ListAddToCartAction {
    	width: 100% !important;
    	left:0;
	}
	.product__listing .addtocart
	{
		padding: 24px 0 0 0;
	}
	.search-list-page-right-result-list-slot
	{
		margin-top:0;
	}
	
}

@media (min-width: 768px) and (max-width: 1023px) {
	.md-header-bar {
		display: block;
	}
	.email-form button {
		margin-top: 1rem;
		float: right;
	}
	#footer-main .col-md-6 .col-sm-4:nth-child(4)
	{
		margin-top:-10.5em;
	}
	
}

@media (min-width: 1400px) {
	.container {
		max-width: 100% !important;
		padding: 0 3rem !important;
	}
}

@media (min-width: 668px) and (max-width: 1023px)
{
	.bottom-banner-content
	{
		text-align: left;
	    font-size: 18px;
	    width: 56%;
	    left: 13px;
	}
	.bottom-banner-content .bottom-banner-header
	{
		font-size: 24px;
        margin-bottom: 5px;
	}
	.bottom-banner-content .bottom-banner-body
	 {
	    font-size: 24px;
	    margin-bottom: 7px !important;
	}
}
@media (max-width: 667px) 
{
	.text-capitalize.text-center.sm-header-bar .justify-content-around a
	{
		color:#fff;
		font-weight:bold;
	}
	#nav
	{
		margin-top:0;
	}
	.bottom-banner-content
	{
		text-align: left;
	    font-size: 15px;
	    width: 56%;
	    left: 13px;
	}
	.bottom-banner-content .bottom-banner-header
	{
		font-size: 19px;
        margin-bottom: 5px;
	}
	.bottom-banner-content .bottom-banner-body
	 {
	    font-size: 19px;
	    margin-bottom: 7px !important;
	}
}
@media (max-width: 414px) 
{
	.bottom-banner-content
	{
		text-align: left;
	    font-size: 12px;
	    width: 55%;
	    left: 13px;
	}
	.bottom-banner-content .bottom-banner-header
	{
		font-size: 11px;
        margin-bottom: 5px;
	}
	.bottom-banner-content .bottom-banner-body
	 {
	    font-size: 13px;
	    margin: 0 !important;
	}
}
@media (min-width: 1024px) and (max-width: 1024px) 
{
	nav .search-input, nav .search-input:focus
	{
		width:100%;
	}
}
