.tribe-events-calendar-list__event-row {
    display: flex;
    align-items: flex-start;
    gap: 20px;
}

.tribe-events-calendar-list__event-wrapper {
    flex: 1; /* Makes text content fill remaining space */
}
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-list__event-details{
    width: 700px;
}

.tribe-events .tribe-events-calendar-day__event-featured-image-link, .tribe-events .tribe-events-calendar-list__event-featured-image{
    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover;
    display: block;
}
/*latest past events list */
.tribe-events .tribe-events-calendar-latest-past__event-featured-image, .tribe-events .tribe-events-calendar-latest-past__event-featured-image{
	    width: 100%;
    aspect-ratio: 16/10;
    object-fit: cover;
    display: block;
}
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-latest-past__event{
	width: 1250px;
}
.tribe-common--breakpoint-medium.tribe-events .tribe-events-calendar-latest-past__event-row>.tribe-common-g-col{
	padding-left:5px;
	padding-right:5px;
}
#content > div > div > div > div.tribe-events-calendar-list > div {
margin-bottom:20px;
}
.tribe-events-calendar-list__event-category-tag{
font-size:14px;
font-weight:600;
color:#015262;
}
/*nav tribe*/
/* Navigation container */
/* General container styles */
/* General container styling for navigation */
#content > div > div > div > header > div.custom-events-navigation{
max-width:100vw;
width:100%;
}
#content > div > div > div > header > div.custom-events-navigation > div > ul {
    display: flex;
max-width:100vw;
flex-direction:row;
border-bottom: 1px solid #015262;
	justify-content: space-between;
}

/* Upcoming Tab */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-events-navigation__item.custom-upcoming-tab {
    padding: 10px 15px;
    
    background-color: #fff; /* Default background color */
    color: #015262; /* Default text color */
font-family:helvetica,sans-serif;
font-size:14px;

    transition: all 0.3s ease; /* Smooth transition for hover/active states */
}

/* Past Tab */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-events-navigation__item.custom-past-tab {
    padding: 10px 15px;
    
    background-color: #fff; /* Default background color */
    color: #015262; /* Default text color */
font-family:helvetica,sans-serif;
font-size:14px;

    transition: all 0.3s ease; /* Smooth transition for hover/active states */
}

/* Calendar Tab */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-events-navigation__item.custom-calendar-tab {
    padding: 10px 15px;
    
    background-color: #fff; /* Default background color */
    color: #015262; /* Default text color */
font-family:helvetica,sans-serif;
font-size:14px;

    transition: all 0.3s ease; /* Smooth transition for hover/active states */
}

/* Links inside each tab (default state) */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-events-navigation__item a {
    color: #015262;
    text-decoration: none;
    font-weight: bold;
}

/* Hover state for all tabs */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-events-navigation__item:hover {
    background-color: white; /* Change background to white */
    color: #002F3C; /* Change text color to dark teal */
   
}

/* Hover state for links */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-events-navigation__item:hover a {
    color: #015262; /* Ensure the text color changes on hover */
font-family:helvetica,sans-serif;
font-size:14px;
}

/* Active state for Upcoming Tab */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-upcoming-tab.custom-active {
    background-color: #015262; /* Active background */
    color: #fff; /* Active text color */
   
}
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-events-navigation__item.custom-upcoming-tab.custom-active > a{
color:#fff;
font-family:helvetica,sans-serif;
font-size:14px;

}
/* Active state for Past Tab */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-past-tab.custom-active {
    background-color: #015262;
    color: #fff;
    
}
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-past-tab.custom-active > a {
color:#fff;
}
/* Active state for Calendar Tab */
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-calendar-tab.custom-active {
    background-color: #015262;
    color: #fff ;
    
}
#content > div > div > div > header > div.custom-events-navigation > div > ul > li.custom-calendar-tab.custom-active > a{
color : #fff;
font-family:helvetica,sans-serif;
font-size:14px;

}