/************************************
     Homepage 
 ***********************************/

.HomeTopArea {
    width: 100%;
    display: block;
}

/* LeftMenuSpot */
.HomeLeftBlankSpot {
    width:20%;
    padding-top:29.3%;
    margin: 0px 0px 0px 0px;
    display:inline-block;
	margin: 0px 0px 0px 0px;
    position: relative;

}

/* Hero */
.home-hero-wrap {

	margin: 0px 0px 0px 0px;
    width: 79.2%;     
    position:relative;
    height:100%;
    background-color: darkgray;
    display:inline-block;
}




/************************************
/*Hero Nav Area  */

.home-hero-wrap #nav {
	position:absolute;
    bottom:15px;
    left: 30px;
    z-index:10; 

}#nav a {
    background: none;
    margin: 0 25px;
    padding: 0px 5px;
    color: white !important;
    font-weight: bold !important;
}

   #nav a.activeSlide, a.activeSlide {
        color: cornflowerblue !important;
        text-decoration:none;
    }

    #nav a:hover {
        outline: none;
        color: #ff6a00 !important;
        /*text-decoration: none;*/
    }

.EquipmentNavLIHomePage {
    width: 186px !important;
   left: -25% !important;
   height: 306px;
}


    /************************************
    /*Hero Admin*/
#CarouselTitleSelectionRow li {
display:inline;
margin: 0 0px 0 0;
padding: 0 12px 0 0;
float:left;
width:24%;
text-align:center;
}

#CarouselTitleSelectionRow li:nth-child(4n+1) {
    clear: left;
}


/************************************
/* Most Viewed */

#home-most-viewed-wrapper, #CartAccordion {
    display: inline-block;
    height: inherit;    
    width: 100%;
    position: relative;
    padding: 25px 22px;
}


.text-overlay-wrapper {
    bottom: 8px;
    left: 9px;
    width: 92.7%;
    position: absolute;
    z-index: 20;
    background-color:#ccc;
    opacity: 0.8;
    padding: 6px 6px 4px 6px; /* top right bottom left - reduced bottom padding */
    overflow: hidden;
    /* Default collapsed height - JS controls expansion on hover */
    /* Note: No !important here - JS sets inline height dynamically */
    height: 28px;
    -webkit-border-bottom-left-radius: .1em;
	-moz-border-bottom-left-radius: .1em;
	-o-border-bottom-left-radius: .1em;
	-ms-border-bottom-left-radius: .1em;
	border-bottom-left-radius: .1em;

    -webkit-border-bottom-right-radius: .1em;
	-moz-border-bottom-right-radius: .1em;
	-o-border-bottom-right-radius: .1em;
	-ms-border-bottom-right-radius: .1em;
	border-bottom-right-radius: .1em;

    /* CSS transition for hover effect (replaces hoverIntent) */
    transition: opacity 0.2s ease, height 0.6s ease-in-out, background-color 0.8s ease;
}

/* Hover effect for grid items (replaces hoverIntent) */
/* Height is now controlled by JavaScript for dynamic content sizing */
/* See _GeneralHelpers.js - initDynamicOverlayHeight() */
.CatagoryGridItem:hover .text-overlay-wrapper,
.home-item-li:hover .text-overlay-wrapper {
    opacity: 1;
    /* Darker background for better contrast with orange text */
    background-color: #6a635c;
    /* Height set dynamically by JS based on content */
}


.CatagoryGridItem a .title {   
    width:100%;
    text-align:center;
    font-weight:bold;
    display:inline-block;   
}

.CatagoryGridItem a .desc,
.home-item-li a .desc {
    padding: 4px 2px;
    /* Default: hidden, expands on hover via CSS */
    /* No !important - JS needs to override temporarily for measurement */
    display: block;
    max-height: 0;
    overflow: hidden;
    /* Transition for smooth reveal */
    transition: max-height 0.6s ease-in-out;
}

/* Show description on hover */
.CatagoryGridItem:hover a .desc,
.home-item-li:hover a .desc {
    /* Large value to allow full content - actual height controlled by wrapper */
    max-height: 200px;
}