.elementor-1935 .elementor-element.elementor-element-140f655c{--display:flex;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:30px;--padding-bottom:25px;--padding-left:20px;--padding-right:20px;}.elementor-1935 .elementor-element.elementor-element-140f655c:not(.elementor-motion-effects-element-type-background), .elementor-1935 .elementor-element.elementor-element-140f655c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-primary );}.elementor-1935 .elementor-element.elementor-element-1aea2f0 > .elementor-widget-container{margin:0% 0% 0% 0%;}.elementor-1935 .elementor-element.elementor-element-56cc6ba{--display:flex;--min-height:60vh;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:2%;--padding-bottom:2%;--padding-left:8%;--padding-right:8%;}.elementor-widget .tippy-tooltip .tippy-content{text-align:center;}@media(max-width:767px){.elementor-1935 .elementor-element.elementor-element-140f655c{--padding-top:20px;--padding-bottom:15px;--padding-left:10px;--padding-right:10px;}.elementor-1935 .elementor-element.elementor-element-56cc6ba{--padding-top:3%;--padding-bottom:3%;--padding-left:2%;--padding-right:2%;}}/* Start custom CSS for html, class: .elementor-element-1aea2f0 *//* ===========================================
   Alphabet Filter
=========================================== */

.custom-alphabet-wrapper{
    display:flex;
    align-items:flex-start;
    width:100%;
    gap:18px;
}

/* ===========================================
   All Button
=========================================== */

.all-btn{
    width:48px;
    height:40px;

    display:flex;
    align-items:center;
    justify-content:center;

    flex-shrink:0;

    cursor:pointer;

    font-size:16px;
    font-weight:600;

    color:#34125E;

    background:#fff;

    border:1px solid #34125E;
    border-radius:50px;

    transition:all .25s ease;
}

.all-btn:hover,
.all-btn.active{
    background:#8B6BB5;
    color:#fff;
    border-color:#8B6BB5;
}

/* ===========================================
   Scroll Area
=========================================== */

.alphabet-scroll{
    flex:1;

    overflow-x:auto;
    overflow-y:hidden;

    scroll-behavior:smooth;
    -webkit-overflow-scrolling:touch;

    padding-bottom:8px;

    scrollbar-width:thin;
    scrollbar-color:#34125E #f2f2f2;
}

/* Chrome */

.alphabet-scroll::-webkit-scrollbar{
    height:6px;
}

.alphabet-scroll::-webkit-scrollbar-track{
    background:#f2f2f2;
    border-radius:20px;
}

.alphabet-scroll::-webkit-scrollbar-thumb{
    background:#34125E;
    border-radius:20px;
}

.alphabet-scroll::-webkit-scrollbar-thumb:hover{
    background:#8B6BB5;
}

/* ===========================================
   Alphabet Container
=========================================== */

.custom-alphabet-filter{

    display:flex;

    align-items:center;

    justify-content:space-between;

    min-width:100%;
}

/* ===========================================
   Letters
=========================================== */

.custom-alphabet-filter span{

    width:40px;
    height:40px;

    flex:0 0 40px;

    display:flex;
    align-items:center;
    justify-content:center;

    cursor:pointer;

    font-size:18px;
    font-weight:600;

    color:#34125E;

    background:#fff;

    border:1px solid #34125E;
    border-radius:50%;

    transition:all .25s ease;
}

.custom-alphabet-filter span:hover,
.custom-alphabet-filter span.active{

    background:#8B6BB5;

    border-color:#8B6BB5;

    color:#fff;

}

/* ===========================================
   Tablet
=========================================== */

@media (max-width:991px){

    .custom-alphabet-filter{

        width:max-content;

        min-width:max-content;

        justify-content:flex-start;

        gap:14px;

    }

}

/* ===========================================
   Mobile
=========================================== */

@media (max-width:767px){

    .custom-alphabet-wrapper{
        gap:10px;
    }

    .all-btn{

        width:44px;
        height:36px;

        font-size:14px;

    }

    .custom-alphabet-filter{

        gap:12px;

    }

    .custom-alphabet-filter span{

        width:36px;
        height:36px;

        flex:0 0 36px;

        font-size:16px;

    }

}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-140f655c *//* ===============================
   SUNROH CATEGORY CATALOG
================================== */

html{
    scroll-behavior:smooth;
}

.sunroh-catalog{
    max-width:1400px;
    margin:auto;
}

.sunroh-alphabet{

    position:sticky;

    top:0;

    z-index:99;

    display:flex;

    flex-wrap:wrap;

    justify-content:center;

    gap:10px;

    padding:18px;

    background:#fff;

    border-bottom:1px solid #ddd;

    margin-bottom:40px;

}

.sunroh-alphabet a{

    text-decoration:none;

    color:#111;

    font-weight:600;

    padding:4px 8px;

}

.sunroh-alphabet a:hover{

    color:#0A6CB5;

}

.sunroh-alphabet .disabled{

    color:#ccc;

    cursor:default;

    padding:4px 8px;

}

.sunroh-letter-section{

    margin-bottom:60px;

}

.sunroh-letter-section h2{

    font-size:40px;

    margin-bottom:20px;

    border-bottom:1px solid #ddd;

    padding-bottom:10px;

}

.sunroh-category-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    column-gap:60px;

    row-gap:18px;

}

.sunroh-category-item{

    text-decoration:none;

    color:#222;

    font-size:17px;

    transition:.25s;

}

.sunroh-category-item:hover{

    color:#0073aa;

    padding-left:8px;

}

/* Tablet */

@media(max-width:991px){

.sunroh-category-grid{

grid-template-columns:repeat(2,1fr);

}

}

/* Mobile */

@media(max-width:576px){

.sunroh-category-grid{

grid-template-columns:1fr;

}

.sunroh-letter-section h2{

font-size:32px;

}

.sunroh-alphabet{

justify-content:flex-start;

overflow-x:auto;

white-space:nowrap;

}

}/* End custom CSS */
/* Start custom CSS for shortcode, class: .elementor-element-be39f21 */.sunroh-category-grid{

    display:grid;

    grid-template-columns:repeat(5,1fr);

    gap: 15px 15px;

}
/* Remove top gap from first letter group */
.sunroh-letter-group:first-child .sunroh-letter-heading{
    margin-top:0;
} 

.sunroh-category-item{

    display:flex;

    justify-content:center;

    align-items:center;

    min-height:52px;

    background:#E7E4F0;

    border-radius:4px;

    text-decoration:none;

    color:#222;

    transition:.25s;

    padding:10px;

    text-align:center;

}

.sunroh-category-item:hover{

    background:#8B6BB5;
    color: #fff;

}

.sunroh-letter-heading{

    font-size:32px;

    margin:20px 0 20px;

    border-bottom:1px solid #ddd;

    padding-bottom:12px;

}

@media(max-width:1024px){

.sunroh-category-grid{

grid-template-columns:repeat(3,1fr);

}

}

@media(max-width:767px){

.sunroh-category-grid{

grid-template-columns:1fr;

}

}/* End custom CSS */