/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 22 2025 | 10:38:21 */
/* Add your CSS code here.

For example:
.example {
    color: red;
}
For brushing up on your CSS knowledge, check out http://www.w3schools.com/css/css_syntax.asp
End of comment */ 
.menu-responsive{
	opacity:0;
	position:fixed;
	top:-100vh;
	width:100%;
	transition:all .5s ease;
}

.menu-responsive.menu-sg-toggle{
	top:0;
	left:0;
	opacity:1;
	z-index:9999;
	min-height:100%;
           flex-direction: column;
        flex-wrap: nowrap;
        background: black;
        padding: 10px 10px 0px 10px;
        position: fixed;        
        height: 100dvh;
        max-height: 100dvh;
        top: 0;
        box-sizing: border-box;        
        overflow-y: auto;
        overflow-x: hidden;
        z-index: 9999999999;
        overscroll-behavior: contain;
        display: flex;
	
}
.menu-responsive.menu-sg-toggle .e-con-inner{
	flex-direction:row;
	    flex-grow: unset;
    flex-basis: content;
}
.mob-menu-scroll{
	
	
}
.mob-menu-scroll .elementor-widget-container nav ul.hfe-nav-menu{
/* 	height:100%;
	overflow-y: auto;
	overflow-x: hidden; */
}
/* .menu-responsive.menu-sg-toggle .sub-menu-open{
	max-height: 300px;
	overflow-y:auto;
} */
.menu-responsive.menu-sg-toggle ul.hfe-nav-menu ul ul li{
	padding-left:20px; 
	padding-right:20px;
}

.desk-menu #mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-tabbed > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link{
	float:none;
	width: 20%;
    display: inline-block;
}
.desk-menu #mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link:hover{
	background:transparent;
}
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item > a.mega-menu-link:focus{
	background:transparent !important;
}
.sg-featured-image img{
	object-fit:contain !important;
	margin-bottom:20px;
}
.min-cart a#hfe-menu-cart__toggle_button {
    background: transparent;
    border: none;
	padding:0px;
}
div#hfe-site-header-cart {
    background: #db1937;
    border-radius: 2px;
    height: 38px;
    width: 38px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.elementor-widget-hfe-cart.toggle-icon--bag-light .hfe-menu-cart__toggle .elementor-button-icon i:before {
    content: '\e8e5';
	font-weight:900;
}
#mega-menu-wrap-menu-1 #mega-menu-menu-1 li.mega-menu-item{
	letter-spacing:1px;
}
.mega-menu-item a:first-child{
	font-weight:600 !important;
}
#mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column-standard li.mega-menu-item > a.mega-menu-link, #mega-menu-wrap-menu-1 #mega-menu-menu-1 > li.mega-menu-megamenu > ul.mega-sub-menu li.mega-menu-column > ul.mega-sub-menu > li.mega-menu-item li.mega-menu-item > a.mega-menu-link{
	font-weight:normal !important;
}
/**on scroll animation**/

.anim-sec p, 
.anim-sec h2, 
.anim-sec h4, 
.anim-sec .cat-col,
.anim-sec .tilt-less,
.anim-sec .custom-button{
	animation: text-appear ease-in both;
  animation-timeline: view(); 
  animation-range: 0vh 30vh;
}
/* .anim-sec img {
  animation: image-appear ease-in both;
  animation-timeline: view();
  animation-range: entry 50% 100vh; */
}
@prefers-reduced-motion {
  .anim-sec p, 
  .anim-sec h2, 
  .anim-sec h4, 
  .anim-sec .cat-col,
  .anim-sec .tilt-less,
  .anim-sec .custom-button,
  .anim-sec img{
    animation: none;
  }
}
@keyframes text-appear {
  from {
    opacity: 0;
    translate: 0 8rem;
  }
}
@keyframes image-appear {
  from {
    filter: saturate(0) contrast(4) brightness(.1) blur(3px);
    opacity: 0;
    scale: .95;
    translate: 0 4rem;
  }
}
body.logged-in .apply-trade {
    display: none !important;
}

/* #mega-menu-wrap-menu-1 #mega-menu-menu-1 li.mega-menu-item > ul.mega-sub-menu {
		max-height:74vh;
		overflow-y: auto;
		min-height:100%;
	} */
@media screen and (min-width:1025px) and (max-width:1400px){
	#mega-menu-wrap-menu-1 #mega-menu-menu-1 li.mega-menu-item > ul.mega-sub-menu {
		max-height:74vh;
		overflow-y: auto;
		min-height:100%;
	}
}

@media screen and (min-width:768px) and (max-width:1025px){
	.menu-responsive.menu-sg-toggle .e-con-inner{
		flex-direction:column;
	}
}