.product_catalog_mlx .container {
display: flex;
}
    
.product_catalog_mlx .toggle-sidebar {
    display:None;   
    background:white!important;
    border-style: solid!important;
    border-width: 1px!important;
    border-color: #C1C1C1!important;
    color:#333333;
    font-weight:600;
}

.product_catalog_mlx .toggle-sidebar:hover {
    color:white;
    background: #035F89!important;
}

.product_catalog_mlx .aff_catalog {
    width:100%;
}
    
/* CSS for card layout */
.product_catalog_mlx .card {
    position: flex;
    width: 23%;
    border-radius: 10px;
    margin: 10px;
    padding: 10px;
    align-items: center;
    box-shadow: 5px 7px 7px #888888;
    display: grid;
    grid-template-rows: auto 2em 1fr 2em; /* Fixed grid rows. Adjust as needed. */
    gap: 10px;

}
.product_catalog_mlx .card img {
    grid-row: 1;
    width: 100%;
    height: 300px;
    object-fit: cover;
}
.product_catalog_mlx .card h3, h4 {
    grid-row: 2;
    font-size: 15px!important;
    padding-top: 10px;
    padding-right: 10px;
    padding-left: 10px;
    color:#012F44;
}

.product_catalog_mlx .card a {
    color:white;
    text-decoration:none!important;
}
.product_catalog_mlx .card a:hover {
    color:#6EC1E4;
}

.product_catalog_mlx .card p.card_price {
    grid-row:3;
    font-size: 20px;
    padding-left:10px;
    padding-top:20px;
    color:green;
    font-weight:600;
}

.product_catalog_mlx .card button {
    padding:10px;
}

.product_catalog_mlx .amazon_button {
    margin-bottom:-30px;
    background-image: linear-gradient(to right , green, #45B54D)!important;
}
.product_catalog_mlx .amazon_button:hover {
    color:red!important;
}

.product_catalog_mlx .products {
    display: flex;
    flex-wrap: wrap;
    flex: 1; /* take up the remaining space */
    /* Additional styles for products */
}

.product_catalog_mlx .sidebar {
    flex: 0 0 300px; /* flex-grow, flex-shrink, flex-basis */
    /* background-color and other styles */
    padding-left:30px;
    padding-right:30px;
}

.product_catalog_mlx .slider.noUi-target {
    margin:10px;
}

.product_catalog_mlx .noUi-connect {
    background-image: linear-gradient(to right , #0473A5, #012B3E);
}

.product_catalog_mlx .catalog {
flex-grow: 1; /* Takes the remaining space */
background-color: #fff;
padding: 20px;
box-sizing: border-box;
}

.product_catalog_mlx .pagination {
    display: inline-block;
    margin-top:20px;
    display:flex;
    justify-content: center;
}

.product_catalog_mlx .pagination a {
    color: black;
    float: left;
    padding: 8px 16px;
    text-decoration: none!important;
}

.product_catalog_mlx .pagination a.active {
    background-image: linear-gradient(to right , #0473A5, #012B3E);
    color: white;
    border-radius: 5px;
}

.product_catalog_mlx .pagination a:hover:not(.active) {
    background-color: turquoise;
    border-radius: 5px;
}

.product_catalog_mlx .see-all-link {
display: block;    /* Block display to put it on a new line */
margin-top: 10px;  /* Space above the link */
text-align: right; /* Centre the link horizontally */
}

.product_catalog_mlx #sortSelect {
    margin-bottom:10px;
}

.product_catalog_mlx #ourRatingFilter {
    margin-bottom:20px;
}

.product_catalog_mlx #category-filters {
    margin-bottom:20px;
}

.product_catalog_mlx .sidebar label.filtering_options {
    font-weight:600;
    margin-bottom: 10px;
}

.product_catalog_mlx .sidebar h4 {
    font-weight:700;
    font-size: 30px;
    margin-left:-15px;
}

.product_catalog_mlx label {
    margin-bottom:7px;
}

/* Responsive layout for tablet */
@media screen and (max-width: 768px) {
.product_catalog_mlx .container {
    flex-direction: column;
}

.product_catalog_mlx .toggle-sidebar {
    display:block;
    margin-bottom: 10px;
}

.product_catalog_mlx .card {
    width: 30%;
    padding: 5px;
    padding-bottom:10px;
    grid-template-rows: auto 4em 1fr 1em; /* Fixed grid rows. Adjust as needed. */
    gap: 10px;
    
}


.product_catalog_mlx .card img {
    height:220px;
}

.product_catalog_mlx .card h3 {
    font-size: 18px;
}

.product_catalog_mlx .card li {
    font-size: 12px;
    margin-top:-5px;
    margin-left:-20px;
}

.product_catalog_mlx .card ul {
    margin-top: 10px;
}

.product_catalog_mlx .card a {
    font-size: 12px;
}

.product_catalog_mlx .card p.card_price {
    grid-row:3;
    font-size: 16px;
}

.product_catalog_mlx .sidebar {
    display:None;
    width: 100%; /* take full width */
    flex: 0 0 auto; /* don't grow, don't shrink, height is automatic */
    padding-bottom: 40px;
    padding-left:20px;
    padding-right:20px;
    margin-top:-20px;
}

.product_catalog_mlx .sidebar.visible {
    display: block; 
}

.product_catalog_mlx .catalog {
    width: 100%;
    /* Since the sidebar is now on top, you might not need to change much here */
}

}

/* Responsive layout for mobile */
@media screen and (max-width: 600px) {
.product_catalog_mlx.container {
    flex-direction: column;
}

.product_catalog_mlx .toggle-sidebar {
    display:block;
    margin-bottom: 10px;
}

.product_catalog_mlx .card {
    width: 43%;
    padding: 5px;
    padding-bottom:10px;
    grid-template-rows: auto 4em 1fr 1em; /* Fixed grid rows. Adjust as needed. */
    gap: 10px;
    
}


.product_catalog_mlx .card img {
    height:120px;
}

.product_catalog_mlx .card h3, h4 {
    font-size: 14px;
}

.product_catalog_mlx .card li {
    font-size: 12px;
    margin-top:-3px;
    margin-left:-20px;
}



.product_catalog_mlx .card a {
    font-size: 12px;
}

.product_catalog_mlx .card p.card_price {
    grid-row:3;
    font-size: 16px;
}

.product_catalog_mlx .sidebar {
    display:None;
    width: 100%; /* take full width */
    flex: 0 0 auto; /* don't grow, don't shrink, height is automatic */
    padding-bottom: 40px;
    padding-left:20px;
    padding-right:20px;
    margin-top:-20px;
}

.product_catalog_mlx .sidebar.visible {
    display: block; 
}

.product_catalog_mlx .catalog {
    width: 100%;
    /* Since the sidebar is now on top, you might not need to change much here */
}

}