/*---------------------------------------------------------------------------------

 Theme Name:   Troop Rewards
 Theme URI:    https://www.trooprewards.org
 Description:  Custom Theme
 Author:       Jeremiah Castillo
 Author URI:   https://www.kre8ivdesigns.com
 Template:     Divi
 Version:      1.0.0
 License:      GNU General Public License v2 or later
 License URI:  http://www.gnu.org/licenses/gpl-2.0.html

------------------------------ ADDITIONAL CSS HERE ------------------------------*/

.hotels-archive-grid {
    margin: 0 auto;
}

.hotel-item {
    transition: transform 0.3s ease-in-out;
    border-radius: 5px;
}

.hotel-item:hover {
    transform: scale(1.05);
}

.hotel-title {
    font-size: 1rem;
    font-weight: bold;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.5);
    background-color: rgba(0,0,0,0.5);
    padding: 20px;
}

.sponsor-list {
    display: flex !important;
    flex-wrap: wrap; /* Allows wrapping to next line if there's not enough space */
    justify-content: flex-start; /* Ensures spacing between columns */
	gap: 20px;
}

.sponsor-item {
    flex: 0 1 calc(33.333% - 20px); /* Makes each item 1/3rd of the container width, minus the gap */
    margin-bottom: 20px; /* Adds space between rows */
    background-color: #ffffff; /* Optional background color for each sponsor block */
    padding: 15px;
    text-align: center;
    border: 1px solid #eaeaea; /* Optional border */
    border-radius: 8px; /* Optional rounded corners */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Optional shadow */
	width: calc(33.333% -20px);
}

.sponsor-item .featured-image img {
    width: 100%; /* Ensure image takes up full column width */
    height: 200px; /* Set a fixed height for all images */
    object-fit: cover; /* Maintain aspect ratio and cover the area */
    border-radius: 8px; /* Optional: Match border radius */
}

.sponsor-logo {
	display: block;
	width: 100% !important;
	margin: auto auto;
}

.sponsor-content {
    margin-top: 15px;
}

@media (max-width: 768px) {
    .sponsor-item {
        flex: 0 1 100%; /* Single column for mobile */
    }
    
    .sponsor-item img {
        height: 150px; /* Adjust height for mobile */
    }
}