<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">.template-collection{


    @media(max-width:1024px){
        .site-main{z-index: 800;}
    }


    &amp;.scroll-lock .site-main.site-main{z-index: 600;}


    .productgrid--outer{display: flex; flex-wrap: wrap;

        .mobile-overlay{display: none;position: fixed;top: 0;right: 0;z-index: 99998;background: rgba(0, 0, 0, 0.5);width: 100vw;height: 100vh;
        
            @media(max-width:1200px){
                &amp;.active{display: block;}
            }

        }

        .breadcrumbs-container{flex: 0 0 100%; width: 100%;}

        .productgrid--wrapper{flex: 0 0 80%; max-width: 80%;
        
            @media(max-width:1200px){flex: 0 0 100%; max-width: 100%; width: 100%;}
            
        }

        .productgrid-filters{flex: 0 0 20%; max-width: 20%; padding-right: 25px; margin-top: 1.75rem;

            @media(max-width:1200px){
                width: 280px; max-width: 100vw; flex: initial;position: fixed; left: 0; top: 0; 
                transform: translateX(-100%); transition: transform 0.5s ease-in;
                z-index: 99999; margin-top: 0; padding: 15px; overflow: auto;height: 100vh; background: white; box-shadow: 0 0 5px rgba(255,255,255,0.5);

                &amp;.active{transform: translateX(0);transition: transform 0.5s ease-out;}

            }

            .close-btn{display: none; text-align: right;

                .x-sign{display: inline-block; cursor: pointer;}

                @media(max-width:1200px){
                    display: block;
                }

            }

            .sidebar-title{margin-bottom: 1.5rem;
                &amp;::after{content: ''; display: block; width: 100%; height: 2px; background: #f2f2f2; margin-top: 1.5rem;}
            }
            
            .filter-wrap{

                &amp;::after{content: ''; display: block; width: 100%; height: 2px; background: #f2f2f2; margin-top: 10px;}

                .filter-title{cursor: pointer; padding-right: 10px; position: relative; margin-bottom: 1.5rem;
                
                    &amp;::after{content: '';width: 10px;height: 10px;border-left: 2px solid #2E140A;border-top: 2px solid #2E140A;
                        display: block;position: absolute;right: 0;top: 50%;transform: rotate(-135deg) translateY(-50%);
                        transform-origin: top center;
                    }

                    @media(max-width:991px){font-size: 1rem;

                        &amp;::after{border-width: 1px; width: 8px;height: 8px;}

                    }

                }

                .filter-items{display: none; padding-left: 10px; max-height: 50vh; overflow: auto;

                    .single-filter{margin-bottom: 15px; 

                        .filter-row{text-decoration: none!important; cursor: pointer; display: flex; flex-wrap: wrap; align-items: center;

                            &amp;.disabled{cursor: not-allowed;}

                            .txt{margin-left: 5px;}
                            .filter-checkbox{width: 15px;height: 15px;}

                        }

                    }

                    
                }

                &amp;.opened{
                    .filter-items{display: block;}
                    .filter-title::after{transform: rotate(45deg) translateY(-50%);}
                }

            }
            
            
        }

    }


    .open-filters-wrap{
        display: none;

        @media(max-width:1200px){display: block; width: 100%; border-top: 2px solid #f2f2f2; border-bottom: 2px solid #f2f2f2; padding: 10px 0; margin: 10px 0;

            .open-filters{display: flex;align-items: center;justify-content: center; background: transparent; border: none!important; outline: none!important; cursor: pointer;

                svg{width: 15px;margin-right: 10px; fill: #000;}

            }

        }

    }

    // .open-filters{
    
    //     @media(max-width:1200px){
    //         display: flex;align-items: center;justify-content: center; background: transparent; border: none!important; outline: none!important; cursor: pointer;
    //         svg{width: 15px;margin-right: 10px; fill: #000;}
    //     }
    
    // }

}
</pre></body></html>