.elementor-17175 .elementor-element.elementor-element-9fc99d3{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:10px 10px;--row-gap:10px;--column-gap:10px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-17175 .elementor-element.elementor-element-9e75647 > .elementor-widget-container{margin:40px 0px 0px 0px;}.elementor-17175 .elementor-element.elementor-element-9e75647{text-align:center;}.elementor-17175 .elementor-element.elementor-element-9e75647 .elementor-heading-title{font-family:"Arial", Sans-serif;font-size:26px;font-weight:600;color:#000;}.elementor-17175 .elementor-element.elementor-element-529e5ea > .elementor-widget-container{margin:40px 0px 0px 0px;}.elementor-17175 .elementor-element.elementor-element-494d2b0{--spacer-size:200px;}:root{--page-title-display:none;}@media(min-width:768px){.elementor-17175 .elementor-element.elementor-element-9fc99d3{--content-width:1400px;}}/* Start custom CSS for shortcode, class: .elementor-element-529e5ea *//* Csempe konténer */
.toc-subcategories-container {
    margin-top: 0px;
}

/* Csempek */
.toc-subcategory-tiles {
    display: flex;
    flex-wrap: wrap;
   /* justify-content: flex-start;*/
        justify-content: center;

    gap: 10px; /* térköz a csempék között */
}

/* Egyetlen csempe */
.toc-subcategory-tile {
    width: 342px; /* Fix szélességű csempe */
    max-width: 100%; /* Maximális szélesség, hogy a mobilnézetben is responsív legyen */
    overflow: hidden;
    position: relative;
    text-align: center;
    margin-bottom: 7px; /* Térköz a csempék között */
    border: 1px solid #ddd; /* Csempe szegélye */
    background-color: #fff; /* Fehér háttér a csempéknek */
}

/* Kép konténer */
.toc-subcategory-thumbnail {
    position: relative;
    height: 340px;
    background-size: cover;
    background-position: center;
    overflow: hidden; /* Kép vágása, ha túllép a tartományon */
     /*   background-color: #f5d42c;*/

}

/* Kép stílus */
.toc-subcategory-thumbnail img {
    opacity: 1;
    filter: saturate(100%); /* Alapállapotban normál színek */
    transition: opacity 0.2s ease-in-out; /* Animálás hozzáadása */
  object-fit: cover !important;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 1;
}

/* Alternatív háttérkép */
.toc-subcategory-thumbnail .cat_background {
 
 filter: opacity(100%);
 transition: opacity 0.2s ease-in-out; /* Animálás hozzáadása */  
    
}

.toc-subcategory-thumbnail .alt_background {
    filter: opacity(100%);
}

/* Hover állapot: képek közötti váltás */
.toc-subcategory-tile:hover .cat_background {

filter: opacity(20%) contrast(300%)  grayscale(100%);
transition: opacity 0.2s ease-in-out; /* Animálás hozzáadása */
mix-blend-mode: multiply; 

}

.toc-subcategory-tile:hover .alt_background {
   filter: opacity(100%);
   transition: opacity 0.2s ease-in-out; /* Animálás hozzáadása */


}

/* Csempe cím */
.toc-subcategory-title {
    padding: 5px;
    font-size: 16px;
    color: #000; /* Csempe címének színe */
    font-weight: 500;
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    background-color: white;
    position: relative;
    z-index: 10; /* A cím a képek felett jelenjen meg */
    box-sizing: border-box; /* Kiegyensúlyozott padding és szöveg */
}

/* Hover hatás a csempe címén */
.toc-subcategory-tile:hover .toc-subcategory-title {
    background-color: rgba(255, 255, 255, 0.8); /* Enyhe háttérszín a címnek hover esetén */
}

/* Az alapértelmezett képek (a háttérkép és alternatív képek) helyes kezeléséhez */
.toc-subcategory-thumbnail img.cat_background,
.toc-subcategory-thumbnail img.alt_background {
    width: 100%;
    height: 100%;
    object-fit: cover;
}





.toc-subcategory-title:hover {

    color: #000000; 
    text-decoration: none;
    

}
/* Mobil nézet */
@media (max-width: 768px) {
    .toc-subcategory-tile {
        width: calc(50% - 5px); /* Két csempe egy sorban mobil nézetben */
    }
    
    .toc-subcategory-thumbnail {
    position: relative;
    height: 200px;
    background-size: cover;
    background-position: center;
    overflow: hidden; /* Kép vágása, ha túllép a tartományon */
}
}/* End custom CSS */
/* Start custom CSS */#ddd,#sgomb{display: none;}
.kata a{
    font-weight: 600;
}/* End custom CSS */