a{
    transition: all .3s;
}
.entry-title a{
    display:block;
}
.entry-title a:after {
    content: "";
    width: 0;
    display:block;
    transition: width .5s;
    border-bottom:1px solid var(--thm_general_text_color);
}
.entry-title a:hover:after {
    width: 100%;
}

/**
 * list
 * =================================================================== */

[data-block]{
    .wp-block-gallery{
        .blocks-gallery-item:before{
            display:none!important;
        }
    }
}

/**
 * front end only style
 * class that transforms a nested list into a tab view
 * ========================================================================== */

.list-style-tab:not(.list-style-initial):not([id]):not(.is-style-list-style-initial){
    @extend %block;
    margin:1.5rem auto .75rem;
    &.success-js{
        margin-top:1.5rem;
        margin-bottom:.75rem;
        position:relative;
        overflow:hidden;
        list-style:none;
        & > li{
            text-indent:0;
            &:before{
                visibility:hidden;
                outline:none;
            }
            &:hover{
                cursor:pointer;
            }
            &:focus,
                &.active{
                outline:none;
            }
            visibility:visible;
            list-style:none;
            padding:.73rem 1rem;
            box-sizing:border-box;
            border-color:var(--thm_common_border, rgba(188,188,188,.5));
            border-style:var(--thm_common_border_style);
            border-width:var(--thm_common_border_width);
            margin-right:3px;
            margin-top:0;
            margin-bottom:0;
            float:left;
            clear:none;
            &:after{
                content:'';
                display:block;
                border-top-color:var(--thm_common_border, rgba(188,188,188,.5));
                border-top-style:var(--thm_common_border_style);
                border-top-width:var(--thm_common_border_width);
                position:absolute;
                left:0;
                top:calc(3rem);
                right:0;
                box-sizing:inherit;
            }
            ol,
            ul{
                padding:16px 0 16px 40px;
                box-sizing:border-box;
                position:absolute;
                visibility:hidden;
                left:0;
                width:100%;
                li{
                    text-indent:0;
                    &:before{
                        display:none;
                    }
                }
            }
            &:focus{
                ul{
                    visibility:visible;
                    @include clearfix;
                    top:40px;
                }
            }
        }
        &.has-background{
            & > li{
                &:after{
                    top:4rem;
                }
            }
        }
    }
}
#document{
    .woocommerce-page{
        .woocommerce-ordering{
            text-align:right;
        }
        .woocommerce-result-count{
            margin-left:auto;
            margin-right:auto;
            text-align:right;
            width:100%;
        }
        .entry-content{
            .woocommerce-product-gallery{
                ul,ol{
                    li{
                        text-indent:0;
                    }
                }
            }
            .woocommerce-product-gallery__wrapper{
                max-width:none;
            }
        }
        #add_payment_method div#payment,
        &.woocommerce-cart div#payment,
        &.woocommerce-checkout div#payment {
            background: #ebe9eb;
            border-radius: 5px;
            color:  var(--thm_black_color);
            ul.wc_payment_methods{
                li{
                    text-indent:0;
                    &:before{
                        display:none;
                    }
                    a{
                        color:var(--thm_gray_color);
                    }
                }
            }
            div.form-row{
                a{
                    color:var(--thm_gray_color);
                }
            }
        }
        .content-area{
            @extend %block_wide;
            margin-left:auto;
            margin-right:auto;
            max-width:100%;
            .woocommerce-products-header{
                // @see emulsion_woocommerce_dinamic_css()
            }
        }
        .wc-tabs-wrapper [role="tablist"] #tab-title-description{
            text-indent:0;
            &:before{
                display:none;
            }
        }
    }
    .wp-block-latest-posts{
        .woocommerce{
            .products{
                padding-left:0;
                .product{
                }
            }
        }
    }
    .woocommerce{
        .products{
            margin-left:auto;
            margin-right:auto;
            .product{
                text-indent:0;
                &:before{
                    display:none;
                }
                [data-product_id]{
                    &.button{
                        color: var(--thm_header_text_color);
                        background: var(--thm_header_bg_color);
                        white-space:pre;
                    }
                }
                .price,
                .woocommerce-loop-product__title{
                    padding-left:var(--thm_content_gap, 24px);
                    padding-right:var(--thm_content_gap, 24px);
                }
                .button{
                    text-align:center;
                    display:block;
                    margin-left:auto;
                    margin-right:auto;
                }
            }
        }
    }
}
.enable-alignfull{
    [class|="wp-block-woocommerce"]{
        .alignfull{
            width:100%;
            max-width: 100%;
            position: relative;
        }
        .alignwide{
            width:calc( var(--thm_content_width, 720px) + var(--thm_align_offset) );
            position: relative;
            left:0;
            margin-left:auto;
            margin-right:auto;
            max-width:100%;
        }
    }
}
[class|="wp-block-woocommerce"]{
    .alignfull{
        width:calc( var(--thm_content_width, 720px) );
        max-width: 100%;
        position: relative;
    }
    .alignwide{
        width:calc( var(--thm_content_width, 720px) );
        position: relative;
        left:0;
        margin-left:auto;
        margin-right:auto;
        max-width:100%;
    }
    &.wp-block-woocommerce-product-search{
        .wc-block-product-search__fields{
            margin-left:auto;
            margin-right:auto;
            width:-moz-fit-content;
            width:fit-content;
            .wc-block-product-search__field{
                max-width:360px;
                margin-left:0;
                margin-right:0;
            }
            button{
                margin:.75rem 0;
                vertical-align:middle;
            }
        }
    }
    &.wp-block-woocommerce-all-reviews{
    }
    &.wp-block-woocommerce-product-categories{
    }
    &.wp-block-woocommerce-reviews-by-product{
    }
    &.wp-block-woocommerce-reviews-by-category{
    }
}
[class|="wc-block"]{
    .alignnone{
        width:640px; //todo
        display:block;
        margin-left:auto;
        margin-right:auto;
    }
    &.wc-block-grid{
        .wc-block-grid__products{
            .wc-block-grid__product{
                text-indent:0;
                &:before{
                    display:none;
                }
                .wc-block-grid__product-onsale,
                .onsale{
                    min-height: 3.236em;
                    min-width: 3.236em;
                    padding: .202em;
                    font-size: 1em;
                    font-weight: 700;
                    position: absolute;
                    text-align: center;
                    line-height: 3.236;
                    top: -.5em;
                    left: -.5em;
                    margin: 0;
                    border-radius: 100%;
                    background-color: #77a464;
                    color: var(--thm_white_color);
                    font-size: .857em;
                    z-index: 9;
                }
            }
        }
    }
    &.wc-block-product-best-sellers{
    }
    &.wp-block-handpicked-products{
    }
    &.wc-block-featured-category{
    }
    &.wc-block-featured-category{
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        flex-wrap: wrap;
        align-content: center;
        flex-direction:column;
    }
    &.wc-block-featured-category{
        position: relative;
        background-color: #24292d;
        background-size: cover;
        background-position: 50%;
        width: 100%;
        margin: 0 0 1.5em;
        .wc-block-featured-category__description,
        .wc-block-featured-category__link,
        .wc-block-featured-category__title{
            text-align:center;
        }
        @supports ( width:fit-content ) or ( width: -moz-fit-content ){
            .wc-block-featured-category__description,
            .wc-block-featured-category__link,
            .wc-block-featured-category__title{
                display:block;
                text-align:left;
                width: -moz-fit-content;
                width:fit-content;
                margin-left:auto;
                margin-right:auto;
            }
        }
    }
    &.wc-block-featured-product,
    &.wc-block-featured-product .wc-block-featured-product__wrapper {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        flex-wrap: wrap;
        align-content: center;
        flex-direction:column;
    }
    &.wc-block-featured-product{
        position: relative;
        background-color: #24292d;
        background-size: cover;
        background-position: 50%;
        width: 100%;
        margin: 0 0 1.5em;
        .wc-block-featured-product__description,
        .wc-block-featured-product__link,
        .wc-block-featured-product__price,
        .wc-block-featured-product__title,
        .wc-block-featured-product__variation{
            text-align:center;
        }
        @supports ( width:fit-content ) or ( width: -moz-fit-content ){
            .wc-block-featured-product__description p,
            .wc-block-featured-product__description,
            .wc-block-featured-product__link,
            .wc-block-featured-product__price,
            .wc-block-featured-product__title,
            .wc-block-featured-product__variation{
                display:block;
                text-align:left;
                width: -moz-fit-content;
                width:fit-content;
                margin-left:auto;
                margin-right:auto;
            }
        }
    }
}

/**
 * hanging indent
 * Place smileys and emoji at the beginning of the paragraph and display it like a list bullet.
 * =================================================================== */

.is-style-hanging-indent,
.hanging-indent{
    padding-left:calc(var(--thm_content_gap, 24px) * 2 );
    text-indent:calc( var(--thm_content_gap, 24px) * -1 );
}
.h1,
h1{
    &.hanging-indent{
        padding-left:calc(1em * 1.3);
        text-indent: -2.8rem;
    }
}
.h2,
h2{
    &.hanging-indent{
        padding-left:calc(1em * 1.3);
        text-indent: -2.7rem;
    }
}
.h3,
h3{
    &.hanging-indent{
        padding-left:calc(1em * 1.5);
        text-indent: -2.2rem;
    }
}
/**
 * Block heading element based on meta font size
 */
.wp-block-latest-posts{
    .h1,
    h1{
        &.hanging-indent{
            padding-left:1.5em;
            text-indent:calc(var(--thm_meta_data_font_size) * -2.5);
        }
    }
    .h2,
    h2{
        &.hanging-indent{
            padding-left:1.5em;
            text-indent:calc(var(--thm_meta_data_font_size) * -2);
        }
    }
    .h3,
    h3{
        &.hanging-indent{
            padding-left:1.5em;
            text-indent:calc(var(--thm_meta_data_font_size) * -2);
        }
    }
}
/**
 * Alternative display of svg icon on edit screen
 */
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-block-list__layout,
.emulsion-gb-phase-block [data-block]{
    [class^="ico-"]:before,
        [class*=" ico-"]:before{
        content:'';
        width:1em;
        height:1em;
        display:inline-block;
        border:1px dashed;
        margin-right:.5rem;
    }
}

/**
 * indent
 * =================================================================== */

.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-5rem,
.is-style-indent-5rem,
.indent-5rem{
    padding-left:calc(var(--thm_common_font_size, 16px) * 5 + var(--thm_content_gap, 24px) );
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-10rem,
.is-style-indent-10rem,
.indent-10rem{
    padding-left:calc(var(--thm_common_font_size, 16px) * 10 + var(--thm_content_gap, 24px) );
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-15rem,
.is-style-indent-15rem,
.indent-15rem{
    padding-left:calc(var(--thm_common_font_size, 16px) * 15 + var(--thm_content_gap, 24px) );
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-20rem,
.is-style-indent-20rem,
.indent-20rem{
    padding-left:calc(var(--thm_common_font_size, 16px) * 20 + var(--thm_content_gap, 24px) );
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-right-5rem,
.is-style-indent-right-5rem,
.indent-right-5rem{
    padding-right:calc(var(--thm_common_font_size, 16px) * 5 + var(--thm_content_gap, 24px) );
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-right-10rem,
.is-style-indent-right-10rem,
.indent-right-10rem{
    padding-right:calc(var(--thm_common_font_size, 16px) * 10 + var(--thm_content_gap, 24px) );
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-right-15rem,
.is-style-indent-right-15rem,
.indent-right-15rem{
    padding-right:calc(var(--thm_common_font_size, 16px) * 15 + var(--thm_content_gap, 24px) );
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-right-20rem,
.is-style-indent-right-20rem,
.indent-right-20rem{
    padding-right:calc(var(--thm_common_font_size, 16px) * 20 + var(--thm_content_gap, 24px) );
}
/**
 * Add one line negative top margin
 */
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-5rem-n,
.is-style-indent-5rem-n,
.indent-5rem-n{
    padding-left:calc(var(--thm_common_font_size, 16px) * 5 + var(--thm_content_gap, 24px) );
    margin-top:calc(  var(--thm_common_font_size, 16px) * var(--thm_content_line_height, 1.5)  * -2);
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-10rem-n,
.is-style-indent-10rem-n,
.indent-10rem-n{
    padding-left:calc(var(--thm_common_font_size, 16px) * 10 + var(--thm_content_gap, 24px) );
    margin-top:calc(  var(--thm_common_font_size, 16px) * var(--thm_content_line_height, 1.5)  * -2);
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-15rem-n,
.is-style-indent-15rem-n,
.indent-15rem-n{
    padding-left:calc(var(--thm_common_font_size, 16px) * 15 + var(--thm_content_gap, 24px) );
    margin-top:calc(  var(--thm_common_font_size, 16px) * var(--thm_content_line_height, 1.5)  * -2);
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-20rem-n,
.is-style-indent-20rem-n,
.indent-20rem-n{
    padding-left:calc(var(--thm_common_font_size, 16px) * 20 + var(--thm_content_gap, 24px) );
    margin-top:calc(  var(--thm_common_font_size, 16px) * var(--thm_content_line_height, 1.5)  * -2);
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-right-5rem-n,
.is-style-indent-right-5rem-n,
.indent-right-5rem-n{
    padding-right:calc(var(--thm_common_font_size, 16px) * 5 + var(--thm_content_gap, 24px) );
    margin-top:calc(  var(--thm_common_font_size, 16px) * var(--thm_content_line_height, 1.5)  * -2);
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-right-10rem-n,
.is-style-indent-right-10rem-n,
.indent-right-10rem-n{
    padding-right:calc(var(--thm_common_font_size, 16px) * 10 + var(--thm_content_gap, 24px) );
    margin-top:calc(  var(--thm_common_font_size, 16px) * var(--thm_content_line_height, 1.5)  * -2);
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-right-15rem-n,
.is-style-indent-right-15rem-n,
.indent-right-15rem-n{
    padding-right:calc(var(--thm_common_font_size, 16px) * 15 + var(--thm_content_gap, 24px) );
    margin-top:calc(  var(--thm_common_font_size, 16px) * var(--thm_content_line_height, 1.5)  * -2);
}
.emulsion-gb-phase-site .editor-styles-wrapper .block-editor-writing-flow .block-editor-block-list__layout .block-editor-block-list__block.is-style-indent-right-20rem-n,
.is-style-indent-right-20rem-n,
.indent-right-20rem-n{
    padding-right:calc(var(--thm_common_font_size, 16px) * 20 + var(--thm_content_gap, 24px) );
    margin-top:calc(  var(--thm_common_font_size, 16px) * var(--thm_content_line_height, 1.5)  * -2);
}
$indent-classes:('5rem','10rem','15rem','20rem','right-5rem','right-10rem','right-15rem','right-20rem');
@each $type in $indent-classes {

    .wp-block-latest-posts .indent-#{$type}{
        text-indent: 0;
        padding-left:calc(var(--thm_content_gap, 24px) );
        padding-right:calc(var(--thm_content_gap, 24px) );
    }
    .wp-block-latest-posts .indent-#{$type}-n{
        text-indent: 0;
        padding-left:calc(var(--thm_content_gap, 24px) );
        padding-right:calc(var(--thm_content_gap, 24px) );
        margin-top:1.5rem;
    }
    ol.indent-#{$type}-n,
    ul.indent-#{$type}-n,
    ol.indent-#{$type},
    ul.indent-#{$type} {
        & > li:first-child{
            padding-top:0;
        }
    }
}
.wp-block-latest-posts{
    li{
        text-indent:0;
        .wp-block-latest-posts__post-full-content{
            text-indent:0;
        }
    }
}

@media screen and ( max-width : $content_width  ) {
    @each $type in $indent-classes {
        .is-style-indent-#{$type},
        .indent-#{$type}{
            padding-left:calc(var(--thm_content_gap, 24px) );
            padding-right:calc(var(--thm_content_gap, 24px) );
        }
        .is-style-indent-#{$type}-n,
        .indent-#{$type}-n{
            padding-left:calc(var(--thm_content_gap, 24px) );
            padding-right:calc(var(--thm_content_gap, 24px) );
            margin-top:1.5rem;
        }
    }
}

/**
 * Category description
 * =================================================================== */

.sidebar-widget-area a[data-title]:after{
    opacity:0;
    content:' ';
    -webkit-transition: opacity 1s;
    transition: opacity 1s;
}

/**
 * Grid Article
 * =================================================================== */

.is-light{
    .grid{
        article{
            transition:box-shadow .5s ease-in-out;
        }
    }
    .stream{
        article{
            transition:box-shadow .5s ease-in-out;
        }
    }
    .toc{
        transition:box-shadow .5s ease-in-out;
        box-shadow: var(--thm_box_shadow);
    }
    .wp-block-latest-posts{
        li{
            transition:all .5s ease-in-out;
        }
        &.is-grid{
            li{
                transition:all .5s ease-in-out;
            }
        }
    }
    .wp-block-rss.is-grid{
        li{
            transition:all .5s ease-in-out;
        }
    }
    .wp-block-latest-comments{
        .wp-block-latest-comments__comment{
            transition:all .5s ease-in-out;
        }
    }

    .wp-block-tag-cloud{
        transition:all .5s ease-in-out;
    }
}

/**
 * Primary Menu
 * =================================================================== */

body{
    .menu-is-light{
        //wp_nav_menu() primary
        .primary{
            .sub-menu,
            .children{
                transition: clip 1s ease;
            }
            .nav-menu-child-opener:checked ~ .sub-menu,
                .nav-menu-child-opener:checked ~ .children{
                box-shadow: var(--thm_box_shadow);
            }
            &[data-direction="vertical"]{
                .nav-menu-child-opener:checked ~ .sub-menu,
                    .nav-menu-child-opener:checked ~ .children{
                    -webkit-box-shadow:none;
                    -moz-box-shadow:none;
                    box-shadow:none;
                }
            }
            &[data-type="accordion"]{
                & > li{
                    .sub-menu,
                    .children{
                        .sub-menu,
                        .children{
                            -webkit-box-shadow:none;
                            -moz-box-shadow:none;
                            box-shadow:none;
                        }
                    }
                }
            }
        }
    }
    &.on-scroll{
        .primary-menu-wrapper,
        .header-layer-site-title-navigation{
            box-shadow: var(--thm_box_shadow);
        }
    }
}
.is-dark{
    .grid{
        article{
            transition:all .5s ease-in-out;
        }
    }
    .stream{
        article{
            transition:all .5s ease-in-out;
        }
    }
    .wp-block-latest-posts.is-grid li{
        transition:all .5s ease-in-out;
    }
    .wp-block-latest-posts{
        li{
            transition:all .5s ease-in-out;
        }
    }
    .wp-block-rss.is-grid li{
        transition:all .5s ease-in-out;
    }
    .wp-block-rss.is-grid li:hover{
        background:var(--thm_background_color);
        filter: brightness(130%);
    }
    .wp-block-rss.is-grid{
        li{
            transition:all .5s ease-in-out;
        }
    }
    .wp-block-latest-comments{
        .wp-block-latest-comments__comment{
            transition:all .5s ease-in-out;
        }
    }
    .wp-block-tag-cloud{
        transition:all .5s ease-in-out;
    }
}
.single,
.page{
    .header-image-active{
        -webkit-transition:  background 1s ease;
        transition: background 1s ease;
    }
}

/**
 * Site Title Only Home
 * =================================================================== */

.sidebar-widget-area-lists{
    .widget > ul > li{
        -webkit-transition:  all 1s ease; /* Safari */
        transition: all 1s ease;
    }
}
details[open] {
    animation: sweep 1s ease-in-out;
}
details summary{
    display:inline-block;
    width:100%;
}
@supports not (-ms-ime-align: auto) {
    //without ie edge
    details summary{
        cursor:pointer;
    }
}
details[open] summary ~ * {
    animation: sweep 1s ease-in-out;
}
.on-scroll .toc{
    animation: sweep 1s ease-in-out;
}
@keyframes sweep {
    0%    {opacity: 0;}
    100%  {opacity: 1;}
}

/**
 * jQuery Tooltip
   ========================================================================== */

.ui-tooltip {
    opacity: 1;
    padding: 8px;
    position: absolute;
    z-index: 9999;
    max-width: 300px;
}
.ui-tooltip-content {
    position: relative;
    text-align:left;
}
.ui-tooltip-content:before{
    content: "";
    position: absolute;
    bottom:-24px;
    left:0;
    right:0;
    margin-left:auto;
    margin-right:auto;
    width:2px;
}
.bottom-tooltip .ui-tooltip-content:before{
    content: "";
    position: absolute;
    top:auto;
    left:0;
    right:0;
    bottom:18px;
    margin-left:auto;
    margin-right:auto;
    width:2px;
}
/* tooltip fallback style */
.ui-tooltip {
    @include font_size(6);
    background:  var(--thm_black_color);
    color: #ccc;
    border: none;
}
.ui-tooltip-content:before{
    border: 10px solid transparent;
    border-top: 10px solid  var(--thm_black_color);
}
.bottom-tooltip .ui-tooltip-content:before{
    border: 10px solid transparent;
    border-bottom: 10px solid  var(--thm_black_color);
}

/**
 * Custom Class no-margin
 * Group images gallery, cover, image margin-top 1.5rem - 3px margin-bottom - 3px
 * ============================================================================*/

&.enable-alignfull{
    &.emulsion{
        .no-margin{
            margin:0;
        }
        .no-v-margin{
            margin-top:0;
            margin-bottom:0;
        }
    }
    .entry-content{
        .wp-block-gallery{
            &.no-margin{
                margin-top:calc(var(--thm_box_gap, 3px) );
                margin-bottom:calc(var(--thm_box_gap, 3px));
            }
        }
        .wp-block-cover{
            &.no-margin{
                margin-top:calc(var(--thm_box_gap, 3px) );
                margin-bottom:calc(var(--thm_box_gap, 3px) );
            }
        }
        .wp-block-image{
            &.no-margin{
                margin-top:calc(var(--thm_box_gap, 3px) );
                margin-bottom:calc(var(--thm_box_gap, 3px) );
            }
        }
    }
}

/**
 * TOC in entry-content
 * =================================================================== */

.single,
.page{
    article{
        .toc{
            display:block;
            position:static;
            top:0;
            box-sizing:border-box;
            box-shadow:none;
            ul{
                border:1px solid #ccc;
                background:rgba(188, 188, 188, .2);
                max-width:100%;
                padding-top:1rem;
                padding-bottom:1rem;
                list-style-type:decimal;
                li{
                    list-style-type:decimal;
                    padding-top:0;
                    padding-bottom:0;
                }
            }
            &:not(.on-scroll){
                display:block;
            }
        }
    }
    &.on-scroll{
        article{
            .toc{
                position:static;
                top:0;
                margin-left:auto;
                margin-right:auto;
            }
        }
    }
}
code{
    [id|="toc"]{
        display:none;
    }
}

/**
 *
 * ========================================================================== */

body{
    .scroll-button-top.skin-button{
        display:none;
    }
    &.on-scroll{
        .scroll-button-top{
            display:block;
            &.skin-button{
                position:fixed;
                right:-.2rem;
                bottom:.2rem;
                z-index:10;
                margin-bottom:10px;
                cursor:pointer;
                width:30px;
                height:30px;
                padding:0;
                border-radius:calc(15px + 4px);
                border:2px solid var(--thm_primary_menu_color);
            }
            span{
                display:none;
            }
        }
    }
    .header-is-dark ~ .scroll-button-top:before {
        //@since 1.2.9 move to style.css  background: url(#{$theme_image_dir}svg/arrow-up.svg#white);
        background-size: contain;
        background-position:center center;
        background-repeat:no-repeat;
        width:16px;
        height:18px;
        position:absolute;
        display:block;
        top:0;
        right:0;
        bottom:0;
        left:-2px;
        margin:auto;
    }
    .header-is-light ~ .scroll-button-top:before {
        //@since 1.2.9 move to style.css  background: url(#{$theme_image_dir}svg/arrow-up.svg);
        background-size: contain;
        background-position:center center;
        background-repeat:no-repeat;
        width:16px;
        height:16px;
        position:absolute;
        display:block;
        top:0;
        right:0;
        bottom:0;
        left:-2px;
        margin:auto;
    }
    .header-is-default-color ~ .scroll-button-top:before {
        //@since 1.2.9 move to style.css background: url(#{$theme_image_dir}svg/arrow-up.svg);
        background-size: contain;
        background-position:center center;
        background-repeat:no-repeat;
        width:16px;
        height:16px;
        position:absolute;
        display:block;
        top:0;
        right:0;
        bottom:0;
        left:-2px;
        margin:auto;
    }
    &.is-dark .header-is-default-color ~ .scroll-button-top:before {
        //@since 1.2.9 move to style.css background: url(#{$theme_image_dir}svg/arrow-up.svg);
        background-size: contain;
        background-position:center center;
        background-repeat:no-repeat;
    }
}
.nav-previous{
    transition:all .5s ease-in-out;
}
.nav-next{
    transition:all .5s ease-in-out;
}
.elementor_library-template-default.on-scroll.logged-in .primary-menu-wrapper{
    margin-top:0;
}
/* Social nav */

body{
    .icon{
        fill:var(--thm_general_link_color);
    }
    .has-background{
        .icon{
            fill:var(--thm_white_color);
        }
    }
    .has-black-background-color{
        .icon{
            fill:var(--thm_white_color);
        }
    }
    .has-black-color{
        .icon{
            fill: var(--thm_black_color);
        }
    }
    .has-gray-color{
        .icon{
            fill:#A9A9A9;
        }
    }
    .has-white-color{
        .icon{
            fill:#ffffff;
        }
    }
    .has-alert-color{
        .icon{
            fill:rgba(231, 76, 60, 1);
        }
    }
    .has-notice-color{
        .icon{
            fill:rgba(163, 140, 8, 1);
        }
    }
    .has-info-color{
        .icon{
            fill:rgba(22, 160, 133, 1);
        }
    }
    .has-cool-color{
        .icon{
            fill:rgba(52, 152, 219, 1);
        }
    }
    .icon {
        display: inline-block;
        width: calc( var(--thm_common_font_size, 16px) * var( --thm_common_line_height ) );
        height: calc( var(--thm_common_font_size, 16px) * var( --thm_common_line_height ) );
        stroke-width: 0;
        stroke: currentColor;
        fill: var(--thm_social_icon_color);
        vertical-align:baseline;
        margin-right:.5rem; //@since 1.217
        margin-left:0;  //@since 1.217
    }
    .primary-menu-wrapper{
        .icon {
            display: inline;
        }
    }

    /**
     * .background css pattern
     */

    &.is-dark.custom-background .is-style-carbon-fiber,
    &.is-dark.custom-background .has-background-carbon-fiber,
    &.is-dark.custom-background.background-css-pattern-carbon-fiber{
        will-change:background-size;
        animation:is-dark-carbon-fiber 1s ease-in .5s forwards;
        background-size: 0 0;
        background-color:var(--thm_background_color);
        @keyframes is-dark-carbon-fiber{
            100%{
                background:
                    radial-gradient(rgba(0,0,0,.5) 15%, transparent 16%) 0 0,
                    radial-gradient(rgba(0,0,0,.5) 15%, transparent 16%) 8px 8px,
                    radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 0 1px,
                    radial-gradient(rgba(255,255,255,.1) 15%, transparent 20%) 8px 9px;
                background-color:var(--thm_background_color);
                background-size:16px 16px;
            }
        }
    }
    &.is-light.custom-background .is-style-carbon-fiber,
    &.is-light.custom-background .has-background-carbon-fiber,
    &.is-light.custom-background.background-css-pattern-carbon-fiber{
        will-change:background-size;
        animation:is-light-carbon-fiber 1s ease-in .5s forwards;
        background-size: 0 0;
        background-color:var(--thm_background_color);
        @keyframes is-light-carbon-fiber{
            100%{
                background:
                    radial-gradient(rgba(188,188,188,.5) 15%, transparent 16%) 0 0,
                    radial-gradient(rgba(188,188,188,.5) 15%, transparent 16%) 8px 8px,
                    radial-gradient(rgba(255,255,255,.8) 15%, transparent 20%) 0 1px,
                    radial-gradient(rgba(255,255,255,.8) 15%, transparent 20%) 8px 9px;
                background-color:var(--thm_background_color);
                background-size:16px 16px;
            }
        }
    }
    &.custom-background .is-style-seigaiha,
    &.custom-background .has-background-seigaiha,
    &.custom-background.background-css-pattern-seigaiha{
        background-color:var(--thm_background_color);
        will-change:background-size;
        animation:pattern-seigaiha 1s ease-in .5s forwards;
        background-size: 0 0;
        @keyframes pattern-seigaiha{
            100%{
                background-image:
                    radial-gradient(circle at 100% 150%, var(--thm_background_color) 24%, var(--thm_sub_background_color_lighten, transparent) 25%, var(--thm_sub_background_color_lighten, transparent) 28%, var(--thm_background_color) 29%, var(--thm_background_color) 36%, var(--thm_sub_background_color_lighten, transparent) 36%, var(--thm_sub_background_color_lighten, transparent) 40%, transparent 40%, transparent),
                    radial-gradient(circle at 0    150%, var(--thm_background_color) 24%, var(--thm_sub_background_color_lighten, transparent) 25%, var(--thm_sub_background_color_lighten, transparent) 28%, var(--thm_background_color) 29%, var(--thm_background_color) 36%, var(--thm_sub_background_color_lighten, transparent) 36%, var(--thm_sub_background_color_lighten, transparent) 40%, transparent 40%, transparent),
                    radial-gradient(circle at 50%  100%, var(--thm_sub_background_color_lighten, transparent) 10%, var(--thm_background_color) 11%, var(--thm_background_color) 23%, var(--thm_sub_background_color_lighten, transparent) 24%, var(--thm_sub_background_color_lighten, transparent) 30%, var(--thm_background_color) 31%, var(--thm_background_color) 43%, var(--thm_sub_background_color_lighten, transparent) 44%, var(--thm_sub_background_color_lighten, transparent) 50%, var(--thm_background_color) 51%, var(--thm_background_color) 63%, var(--thm_sub_background_color_lighten, transparent) 64%, var(--thm_sub_background_color_lighten, transparent) 71%, transparent 71%, transparent),
                    radial-gradient(circle at 100% 50%, var(--thm_sub_background_color_lighten, transparent) 5%, var(--thm_background_color) 6%, var(--thm_background_color) 15%, var(--thm_sub_background_color_lighten, transparent) 16%, var(--thm_sub_background_color_lighten, transparent) 20%, var(--thm_background_color) 21%, var(--thm_background_color) 30%, var(--thm_sub_background_color_lighten, transparent) 31%, var(--thm_sub_background_color_lighten, transparent) 35%, var(--thm_background_color) 36%, var(--thm_background_color) 45%, var(--thm_sub_background_color_lighten, transparent) 46%, var(--thm_sub_background_color_lighten, transparent) 49%, transparent 50%, transparent),
                    radial-gradient(circle at 0    50%, var(--thm_sub_background_color_lighten, transparent) 5%, var(--thm_background_color) 6%, var(--thm_background_color) 15%, var(--thm_sub_background_color_lighten, transparent) 16%, var(--thm_sub_background_color_lighten, transparent) 20%, var(--thm_background_color) 21%, var(--thm_background_color) 30%, var(--thm_sub_background_color_lighten, transparent) 31%, var(--thm_sub_background_color_lighten, transparent) 35%, var(--thm_background_color) 36%, var(--thm_background_color) 45%, var(--thm_sub_background_color_lighten, transparent) 46%, var(--thm_sub_background_color_lighten, transparent) 49%, transparent 50%, transparent);
                background-size: 50px 25px;
            }
        }
    }
    /* background image */
    &.page.custom-background.emulsion-has-custom-background-image,
    &.single.custom-background.emulsion-has-custom-background-image{
        animation:none;
    }
    &.is-light.custom-background .is-style-cicada,
    &.is-light.custom-background .has-background-cicada,
    &.is-light.custom-background.background-css-pattern-cicada{
        background-color:var(--thm_background_color);
        background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(255,255,255,.07)), color-stop(50%, transparent)),
            -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(255,255,255,.13)), color-stop(50%, transparent)),
            -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, rgba(255,255,255,.17))),
            -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, rgba(255,255,255,.19)));
        background-image: -webkit-linear-gradient(left, rgba(255,255,255,.07) 50%, transparent 50%),
            -webkit-linear-gradient(left, rgba(255,255,255,.13) 50%, transparent 50%),
            -webkit-linear-gradient(left, transparent 50%, rgba(255,255,255,.17) 50%),
            -webkit-linear-gradient(left, transparent 50%, rgba(255,255,255,.19) 50%);
        background-image: -o-linear-gradient(left, rgba(255,255,255,.07) 50%, transparent 50%),
            -o-linear-gradient(left, rgba(255,255,255,.13) 50%, transparent 50%),
            -o-linear-gradient(left, transparent 50%, rgba(255,255,255,.17) 50%),
            -o-linear-gradient(left, transparent 50%, rgba(255,255,255,.19) 50%);
        background-image: linear-gradient(90deg, rgba(255,255,255,.07) 50%, transparent 50%),
            linear-gradient(90deg, rgba(255,255,255,.13) 50%, transparent 50%),
            linear-gradient(90deg, transparent 50%, rgba(255,255,255,.17) 50%),
            linear-gradient(90deg, transparent 50%, rgba(255,255,255,.19) 50%);
        background-size: 13px, 29px, 37px, 53px;
    }
    &.is-dark.custom-background .is-style-cicada,
    &.is-dark.custom-background .has-background-cicada,
    &.is-dark.custom-background.background-css-pattern-cicada{
        background-color:var(--thm_background_color);
        background-image: -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0,0,0,.07)), color-stop(50%, transparent)),
            -webkit-gradient(linear, left top, right top, color-stop(50%, rgba(0,0,0,.13)), color-stop(50%, transparent)),
            -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, rgba(0,0,0,.17))),
            -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, rgba(0,0,0,.19)));
        background-image: -webkit-linear-gradient(left, rgba(0,0,0,.07) 50%, transparent 50%),
            -webkit-linear-gradient(left, rgba(0,0,0,.13) 50%, transparent 50%),
            -webkit-linear-gradient(left, transparent 50%, rgba(0,0,0,.17) 50%),
            -webkit-linear-gradient(left, transparent 50%, rgba(0,0,0,.19) 50%);
        background-image: -o-linear-gradient(left, rgba(0,0,0,.07) 50%, transparent 50%),
            -o-linear-gradient(left, rgba(0,0,0,.13) 50%, transparent 50%),
            -o-linear-gradient(left, transparent 50%, rgba(0,0,0,.17) 50%),
            -o-linear-gradient(left, transparent 50%, rgba(0,0,0,.19) 50%);
        background-image: linear-gradient(90deg, rgba(0,0,0,.07) 50%, transparent 50%),
            linear-gradient(90deg, rgba(0,0,0,.13) 50%, transparent 50%),
            linear-gradient(90deg, transparent 50%, rgba(0,0,0,.17) 50%),
            linear-gradient(90deg, transparent 50%, rgba(0,0,0,.19) 50%);
        background-size: 13px, 29px, 37px, 53px;
    }
    &.custom-background .has-background-lattice,
    &.custom-background.background-css-pattern-lattice{
        background:
            linear-gradient(var(--thm_sub_background_color_lighten) 8px, transparent 8px) 0 -4px,
            linear-gradient(90deg, var(--thm_sub_background_color_lighten) 8px, transparent 8px) -4px 0;
        background-color: var(--thm_background_color);
        background-size:128px 128px, 128px 128px;
    }
    &.is-light.custom-background .has-background-hexagonal,
    &.is-light.custom-background.background-css-pattern-hexagonal{
        background:
            radial-gradient(circle farthest-side at 0% 50%,var(--thm_background_color) 23.5%,rgba(0,0,0,0) 0)21px 30px,
            radial-gradient(circle farthest-side at 0% 50%,var(--thm_sub_background_color_lighten) 24%,rgba(0,0,0,0) 0)19px 30px,
            linear-gradient(var(--thm_background_color) 14%,rgba(0,0,0,0) 0, rgba(0,0,0,0) 85%,var(--thm_background_color) 0)0 0,
            linear-gradient(150deg,var(--thm_background_color) 24%,var(--thm_sub_background_color_lighten) 0,var(--thm_sub_background_color_lighten) 26%,rgba(0,0,0,0) 0,rgba(0,0,0,0) 74%,var(--thm_sub_background_color_lighten) 0,var(--thm_sub_background_color_lighten) 76%,var(--thm_background_color) 0)0 0,
            linear-gradient(30deg,var(--thm_background_color) 24%,var(--thm_sub_background_color_lighten) 0,var(--thm_sub_background_color_lighten) 26%,rgba(0,0,0,0) 0,rgba(0,0,0,0) 74%,var(--thm_sub_background_color_lighten) 0,var(--thm_sub_background_color_lighten) 76%,var(--thm_background_color) 0)0 0,
            linear-gradient(90deg,var(--thm_sub_background_color_lighten) 2%,var(--thm_background_color) 0,var(--thm_background_color) 98%,var(--thm_sub_background_color_lighten) 0%)0 0 var(--thm_background_color);
        background-size: 40px 60px;
    }
    &.is-dark.custom-background .has-background-hexagonal,
    &.is-dark.custom-background.background-css-pattern-hexagonal{
        background:
            radial-gradient(circle farthest-side at 0% 50%,var(--thm_background_color) 23.5%,rgba(0,0,0,0) 0)21px 30px,
            radial-gradient(circle farthest-side at 0% 50%,var(--thm_sub_background_color_darken) 24%,rgba(0,0,0,0) 0)19px 30px,
            linear-gradient(var(--thm_background_color) 14%,rgba(0,0,0,0) 0, rgba(0,0,0,0) 85%,var(--thm_background_color) 0)0 0,
            linear-gradient(150deg,var(--thm_background_color) 24%,var(--thm_sub_background_color_darken) 0,var(--thm_sub_background_color_darken) 26%,rgba(0,0,0,0) 0,rgba(0,0,0,0) 74%,var(--thm_sub_background_color_darken) 0,var(--thm_sub_background_color_darken) 76%,var(--thm_background_color) 0)0 0,
            linear-gradient(30deg,var(--thm_background_color) 24%,var(--thm_sub_background_color_darken) 0,var(--thm_sub_background_color_darken) 26%,rgba(0,0,0,0) 0,rgba(0,0,0,0) 74%,var(--thm_sub_background_color_darken) 0,var(--thm_sub_background_color_darken) 76%,var(--thm_background_color) 0)0 0,
            linear-gradient(90deg,var(--thm_sub_background_color_darken) 2%,var(--thm_background_color) 0,var(--thm_background_color) 98%,var(--thm_sub_background_color_darken) 0%)0 0 var(--thm_background_color);
        background-size: 40px 60px;
    }
}

/**
 * wp-block-tag-cloud
 * ========================================================================== */

.tag-cloud-style-flat{
    display:flex;
    flex-wrap:wrap;
    a{
        flex:1 1 auto;
        z-index: 2;
        display: inline-block;
        text-align: center;
        padding: 2px 4px;
        margin: var(--thm_box_gap, 3px);
    }
}
.stream .archive-preview .tag-cloud-style-flat,
#editor [data-block] .tag-cloud-style-flat{
    a{
        //editor style
        //over write style attribute style
        font-size:var(--thm_meta_data_font_size) ! important;
        text-decoration:none ! important;
    }
}

/**
 * auxiliary block
 * ========================================================================== */

ol.shrink,
ul.shrink{
    li{
        padding-top:.5rem;
        padding-bottom:.5rem;
        font-size:var(--thm_meta_data_font_size);
    }
    &.alignleft{
        box-sizing:border-box;
        clear:left;
        float:left;
        padding-right:0;
        li{
            margin-left:0;
            width: calc(var(--thm_content_width, 720px) / 2 - var(--thm_content_gap, 24px) * 2);
            max-width:100%;
            clear:right;
            float:right;
        }
        @media screen and ( max-width : 640px ) {
            // static break point
            width:100%;
            max-width:100%;
            margin-left:0;
            margin-right:0;
            padding-left:calc(var(--thm_content_gap, 24px) );
            padding-right:calc(var(--thm_content_gap, 24px) );
            li{
                width:100%;
                float:none;
                clear:left;
            }
        }
    }
    &.alignright {
        box-sizing:border-box;
        clear:right;
        float:right;
        padding-left:0;
        li{
            width: calc(var(--thm_content_width, 720px) / 2 - var(--thm_content_gap, 24px) * 2);
            max-width:100%;
            margin-left:1rem;
        }
        @media screen and ( max-width : 640px ) {
            // static break point
            width:100%;
            max-width:100%;
            margin-left:0;
            margin-right:0;
            padding-left:calc(var(--thm_content_gap, 24px) );
            padding-right:calc(var(--thm_content_gap, 24px) );
            li{
                width:100%;
                float:none;
                clear:left;
                margin-left:0;
            }
        }
    }
}
.wp-block-table{
    &.shrink{
        margin-top:1.5rem;
        margin-bottom:.75rem;
        font-size:var(--thm_meta_data_font_size);
        margin-left:auto;
        margin-right:auto;
        table{
            width:auto;
            min-width:0;
            th,
            td{
                padding-top:.5rem;
                padding-bottom:.5rem;
            }
        }
        &.alignleft{
            margin-right:1rem;
            text-align:right;
            table{
                text-align:left;
                width: calc(var(--thm_content_width, 720px) / 2 - var(--thm_content_gap, 24px) * 2);
                margin-right:0;
            }
            @media screen and ( max-width : 640px ) {
                // static break point
                table{
                    width:99%;
                    margin-left:0;
                    margin-right:0;
                }
            }
        }
        &.alignright{
            margin-left:1rem;
            table{
                width: calc(var(--thm_content_width, 720px) / 2 - var(--thm_content_gap, 24px) * 2);
                margin-left:0;
            }
            @media screen and ( max-width : 640px ) {
                // static break point
                table{
                    width:99%;
                    margin-left:0;
                    margin-right:0;
                }
            }
        }
    }
}
.wp-block-image.is-style-shrink,
.wp-block-image.shrink{
    figure{
        padding-top:0;
        padding-bottom:0;
        font-size:var(--thm_meta_data_font_size);
        margin:0;
    }
    &.alignleft{
        box-sizing:border-box;
        clear:left;
        float:left;
        padding-right:0;
        width:calc(50% - 1rem);
        margin-right:1rem;
        &.is-resized{
            width:calc(50% - 1rem);
            figure{
                width: -moz-fit-content;
                width:fit-content;
            }
        }
        figure{
            margin-left:0;
            width: calc(var(--thm_content_width, 720px) / 2 - var(--thm_content_gap, 24px) * 2);
            max-width:100%;
            clear:right;
            float:right;
        }
        @media screen and ( max-width : 640px ) {
            // static break point
            width:100%;
            max-width:100%;
            margin-left:0;
            margin-right:0;
            padding-left:calc(var(--thm_content_gap, 24px) );
            padding-right:calc(var(--thm_content_gap, 24px) );
            figure{
                width:100%;
                float:none;
                clear:left;
            }
            &.is-resized{
                width:calc(100%);
                figure{
                    width: auto;
                    width:auto;
                }
            }
        }
    }
    &.alignright {
        box-sizing:border-box;
        clear:right;
        float:right;
        padding-left:0;
        width:calc(50% - 1rem);
        margin-left:1rem;
        &.is-resized{
            width:calc(50% - 1rem);
            figure{
                width: -moz-fit-content;
                width:fit-content;
            }
        }
        figure{
            width: calc(var(--thm_content_width, 720px) / 2 - var(--thm_content_gap, 24px) * 2);
            max-width:100%;
            margin-left:0;
        }
        @media screen and ( max-width : 640px ) {
            // static break point
            width:100%;
            max-width:100%;
            margin-left:0;
            margin-right:0;
            padding-left:calc(var(--thm_content_gap, 24px) );
            padding-right:calc(var(--thm_content_gap, 24px) );
            figure{
                width:100%;
                float:none;
                clear:left;
                margin-left:0;
            }
            &.is-resized{
                width:calc(100%);
                figure{
                    width: auto;
                    width:auto;
                }
            }
        }
    }
}

/**
 * element wrapping Square Circle
 * Play effect
 * Use this class within a group block
 * ========================================================================== */

.layout{
    .badge{
        position: relative;
        top:0;
        box-sizing: border-box;
        width:fit-content;
        display:inline-block;
        padding-left:var(--thm_content_gap, 24px);
        padding-right:var(--thm_content_gap, 24px);
        //debug
        vertical-align:middle;
        &:before{
            content: '';
            display: inline-block;
            padding-top: calc(50% + var(--thm_content_gap, 24px));
            padding-bottom:  calc(50% + var(--thm_content_gap, 24px));
            height: 0;
            width: 1px;
            vertical-align:middle;
            position:relative;
        }
        &.has-background{
            &:before{
                content: '';
                display: inline-block;
                padding-top: 50%;
                padding-bottom:  calc(50% + var(--thm_content_gap, 24px));
                height: 0;
                width: 1px ! important;
                vertical-align:middle;
                position:relative ! important;
            }
        }
    }
}
[data-block] .badge{
    position: relative;
    top: 0;
    border: 1px solid rgba(127,127,127,.4);
    box-sizing: border-box;
    width:fit-content;
    display:inline-block;
    padding-left:var(--thm_content_gap, 24px);
    padding-right:var(--thm_content_gap, 24px);
    vertical-align:middle;
    &:before{
        content: '';
        display: inline-block;
        padding-top: calc(50% + var(--thm_content_gap, 24px));
        padding-bottom:  calc(50% + var(--thm_content_gap, 24px));
        height: 0;
        width: 1px;
        vertical-align:middle;
        position:relative;
    }
}
.badge:not(.has-image-badge){
    &.circle{
        border-radius:9999px;
    }
    &.contort{
        border-radius: 70% 30% 30% 70%/60% 40% 60% 40%;
        margin-right:-20px;
        mix-blend-mode: multiply;
        &:before{
            content:'';

        }
    }
    &.awarding{
        border-radius: 50% 50% 50% 50% / 10% 10% 90% 90%;
        &:before{
            content:'';
        }
    }
    .exclusion{
        mix-blend-mode:exclusion;
        background:linear-gradient(90deg,blue 0%,blue 50%,red 50%,red 100%);
    }
}
[data-block] .wp-block-image.badge,
.badge.wp-block-image{
    background:transparent;
    padding:0 ! important;
    overflow:hidden;
    figcaption{
        position:absolute;
    }
    &:before{
        content:'';
        display:none;
    }
    &.circle{
        shape-outside: circle(50%);
        width:auto;
        display:inline-table;
        img{
            object-fit:cover;
            clip-path:circle();
        }
    }
    &.contort{
        display:inline-table;
        img{
            object-fit:cover;
            border-radius: 70% 30% 30% 70%/60% 40% 60% 40%;
        }
    }
    &.awarding{
        display:inline-table;
        img{
            object-fit:cover;
            border-radius: 50% 50% 50% 50% / 10% 10% 90% 90%;
        }
    }
}
#document{
    .counter.badge{
        padding:0;
        margin:0;
        text-align:center;
        min-width:1rem;
        @include font_size(6,no-margin);
        & > *{
            display:inline-block;
            padding:0;
            margin:0;
        }
        &:before{
            padding:3px 3px 3px;
            position:absolute;
        }
        &:empty:before,
            &:empty{
            display:none;
        }
    }
    .emulsion-cat-count.badge{
        display:inline-block;
        text-align:center;
    }
    .emulsion-archive-count.badge{
        display:inline-block;
        text-align:center;
    }
}
[data-block]{
    .emulsion-cat-count.badge{
        padding:0;
        margin:0;
        span{
            @include font_size(6,no-margin);
            padding:0;
            margin:0;
        }
    }
    .emulsion-archive-count.badge{
        padding:0;
        span{
            @include font_size(6,no-margin);
            padding:0;
        }
    }
}
.wp-block-column{
    figure.wp-block-image{
        &.has-image-badge{
            display:block;
            margin-left:auto;
            margin-right:auto;
            img{
                object-fit:cover;
            }
        }
    }
    div.wp-block-image{
        &.has-image-badge{
            display:block;
            max-width:100%;
        }
    }
    .has-only-image{
        &.has-image-badge{
            display:block;
            margin-left:auto;
            margin-right:auto;
            padding:2rem;
        }
    }
}
.entry-content .wp-block-media-text .wp-block-media-text__content div.badge p,
.entry-content .wp-block-media-text .wp-block-media-text__content div.badge:last-child p{
    margin:0 auto;
    padding:.5rem;
    white-space:pre;
}

/**
 * hover
 * ========================================================================== */

@media(hover: hover) and (pointer: fine) {
    /**
     * Category description
     */
    .sidebar-widget-area a[data-title]:hover:after{
        opacity:1;
        box-shadow: var(--thm_box_shadow);
    }
    /**
     * Grid Article
     */
    .is-light{
        .border-default{
            &.grid{
                article:target,
                    article:hover{
                    box-shadow: var(--thm_box_shadow);
                }
            }
            &.stream{
                article:target,
                    article:hover{
                    box-shadow: var(--thm_box_shadow);
                }
            }
        }
        .wp-block-latest-posts{
            li{
                background:var(--thm_white_color);
                &:hover{
                }
            }
            &.is-grid{
                li{
                    &:hover{
                        background:var(--thm_white_color);
                        box-shadow: var(--thm_box_shadow);
                    }
                }
            }
        }
        .wp-block-rss.is-grid{
            li:hover{
                background:var(--thm_white_color);
                box-shadow: var(--thm_box_shadow);
            }
        }
        .wp-block-latest-comments{
            .wp-block-latest-comments__comment:hover{
                background:var(--thm_white_color);
            }
        }

        .emulsion-initial-color{
            .wp-block-latest-posts{
                li{
                    &:hover{
                        background:var(--thm_white_color);
                    }
                }
                &.is-grid{
                    li{
                        &:hover{
                            background:var(--thm_white_color);
                        }
                    }
                }
            }
            .wp-block-latest-comments{
                .wp-block-latest-comments__comment:hover{
                    background:var(--thm_white_color);
                }
            }

        }
    }
    .emulsion-add-dark-color{
        .wp-block-latest-posts{
            li{
                &:hover{
                    background:rgba(222,222,222,.1);
                }
            }
            &.is-grid{
                li{
                    &:hover{
                        background:rgba(222,222,222,.1);
                    }
                }
            }
        }
        .wp-block-latest-comments{
            .wp-block-latest-comments__comment:hover{
                background:rgba(222,222,222,.1);
            }
        }
    }
    /**
     * Primary Menu
     */
    .is-dark{
        .wp-block-latest-posts.is-grid li{
            background:#000;
        }
        .wp-block-latest-posts{
            li{
                background:#000;
            }
        }
        .wp-block-rss.is-grid{
            li:target,
                li:hover{
                background:var(--thm_background_color);
                filter: brightness(130%);
            }
        }
        .wp-block-latest-comments{
            .wp-block-latest-comments__comment:target,
                .wp-block-latest-comments__comment:hover{
                background:var(--thm_background_color);
            }
        }
        .wp-block-tag-cloud{
            &:target,
                &:hover{
                background:var(--thm_background_color);
                filter: brightness(130%);
            }
        }
    }
    .emulsion-add-light-color{
        .wp-block-latest-posts{
            li{
                &:target,
                    &:hover{
                    background:var(--thm_white_color);
                }
            }
            &.is-grid{
                li{
                    &:target,
                        &:hover{
                        background:var(--thm_white_color);
                    }
                }
            }
        }
        .wp-block-latest-comments{
            .wp-block-latest-comments__comment:target,
                .wp-block-latest-comments__comment:hover{
                background:var(--thm_white_color);
            }
        }
        .wp-block-columns{
            .wp-block-column:target,
                .wp-block-column:hover{
                background:var(--thm_white_color);
            }
        }
    }
    .header-layer{

    }

    .single,
    .page{
        .header-image-active{
            &:hover{
                .header-layer-site-title-navigation{
                    background:var(--thm_header_image_dim);
                }
                .header-text{
                    .site-title-text{
                        color:var(--thm_white_color);
                    }
                    .site-description{
                        color:var(--thm_white_color);
                    }
                }
                .entry-text{
                    color:var(--thm_white_color);
                    .entry-title{
                        color:var(--thm_white_color);
                    }
                    .posted-on{
                        a{
                            color:var(--thm_white_color);
                        }
                    }
                    .entry-meta{
                        a{
                            color:var(--thm_white_color);
                        }
                    }
                }
            }
        }

    }

}
.wp-block-group.has-background{
    .wp-block-group__inner-container{
        .wp-block-latest-posts{
            li{
                background:transparent;
            }
        }
    }
}
#document{
    .entry-content{
        .wrap-metaslider{
            width:100% ! important;
        }
    }
}
/**
 * sizes
 */
.full_text{
    .size1of1 {
        float:none;
    }
    .size1of1,
    .size1of2,
    .size1of3,
    .size2of3,
    .size1of4,
    .size3of4,
    .size1of5,
    .size2of5,
    .size3of5,
    .size4of5 {
        box-sizing:border-box;
        display:inline-block;
        margin:var(--thm_box_gap, 3px);
        margin-bottom:calc( var(--thm_box_gap, 3px) * 2 );
        vertical-align:top;
        //     min-width: var(--thm_content_min_width);
        &.aligncenter{
            display:block;
            margin-left:auto;
            margin-right:auto;
        }
    }
    .alignleft{
        &.size1of3,
        &.size1of4,
        &.size1of5,
        &.size2of5{
            margin-right:1rem;
        }
    }
    .alignright{
        &.size1of3,
        &.size1of4,
        &.size1of5,
        &.size2of5{
            margin-left:1rem;
        }
    }
    figure{
        &.size1of1,
        &.size1of2,
        &.size1of3,
        &.size2of3,
        &.size1of4,
        &.size3of4,
        &.size1of5,
        &.size2of5,
        &.size3of5,
        &.size4of5{
            margin-bottom:calc( var(--thm_box_gap, 3px) * 2 );
            &.wp-block-embed{
                display:inline-block;
                height:auto;
                @include clearfix;
            }
            &.alignleft{
                margin-right:1rem;
            }
            &.alignright{
                margin-left:1rem;
            }
        }
    }

    .size1of3 {
        max-width: calc( 33.33333% - 5px - var(--thm_box_gap, 3px) * 2);
    }
    .size1of4 {
        max-width: calc( 24.99% - 5px - var(--thm_box_gap, 3px) * 2 );
    }
    .size1of2 {
        max-width: calc( 50% - 5px - var(--thm_box_gap, 3px) * 2 );
    }
    .size1of5 {
        max-width: calc( 19.99% - 5px - var(--thm_box_gap, 3px) * 2 );
    }
    .size2of3 {
        max-width: calc( 66.66666% - 5px - var(--thm_box_gap, 3px) * 2 );
    }
    .size2of5 {
        max-width: calc( 40% - 5px - var(--thm_box_gap, 3px) * 2 );
    }
    .size3of4 {
        max-width: calc( 75% - 5px - var(--thm_box_gap, 3px) * 2 );
    }
    .size3of5 {
        max-width: calc( 60% - 5px - var(--thm_box_gap, 3px) * 2 );
    }
    .size4of5 {
        max-width: calc( 80% - 5px - var(--thm_box_gap, 3px) * 2 );
    }
    .alignleft{
        &.size1of3 {
            width:100%;
            max-width: calc( 33.33333% - 1rem - var(--thm_box_gap, 3px) * 2);
        }
        &.size1of4 {
            width:100%;
            max-width: calc( 24.99% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size1of2 {
            width:100%;
            max-width: calc( 50% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size1of5 {
            width:100%;
            max-width: calc( 19.99% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size2of3 {
            width:100%;
            max-width: calc( 66.66666% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size2of5 {
            width:100%;
            max-width: calc( 40% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size3of4 {
            width:100%;
            max-width: calc( 75% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size3of5 {
            width:100%;
            max-width: calc( 60% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size4of5 {
            width:100%;
            max-width: calc( 80% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
    }
    .alignright{
        &.size1of3 {
            width:100%;
            max-width: calc( 33.33333% - 1rem - var(--thm_box_gap, 3px) * 2);
        }
        &.size1of4 {
            width:100%;
            max-width: calc( 24.99% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size1of2 {
            width:100%;
            max-width: calc( 50% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size1of5 {
            width:100%;
            max-width: calc( 19.99% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size2of3 {
            width:100%;
            max-width: calc( 66.66666% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size2of5 {
            width:100%;
            max-width: calc( 40% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size3of4 {
            width:100%;
            max-width: calc( 75% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size3of5 {
            width:100%;
            max-width: calc( 60% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size4of5 {
            width:100%;
            max-width: calc( 80% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
    }
    .aligncenter{
        &.size1of3 {
            width:100%;
            max-width: calc( 33.33333% - 1rem - var(--thm_box_gap, 3px) * 2);
        }
        &.size1of4 {
            width:100%;
            max-width: calc( 24.99% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size1of2 {
            width:100%;
            max-width: calc( 50% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size1of5 {
            width:100%;
            max-width: calc( 19.99% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size2of3 {
            width:100%;
            max-width: calc( 66.66666% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size2of5 {
            width:100%;
            max-width: calc( 40% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size3of4 {
            width:100%;
            max-width: calc( 75% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size3of5 {
            width:100%;
            max-width: calc( 60% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
        &.size4of5 {
            width:100%;
            max-width: calc( 80% - 1rem - var(--thm_box_gap, 3px) * 2 );
        }
    }
    > .alignleft{
        &.size1of3{
            margin-left:var(--thm_content_gap, 24px);
            max-width: calc( 33.33333% - 1rem - var(--thm_content_gap, 24px) - var(--thm_box_gap, 3px) * 2);
        }
        &.size1of4{
            margin-left:var(--thm_content_gap, 24px);
            max-width: calc( 24.99% - 1rem - var(--thm_content_gap, 24px) - var(--thm_box_gap, 3px) * 2 );
        }
        &.size1of5{
            margin-left:var(--thm_content_gap, 24px);
            max-width: calc( 19.99% - 1rem - var(--thm_content_gap, 24px) - var(--thm_box_gap, 3px) * 2 );
        }
        &.size2of5{
            margin-left:var(--thm_content_gap, 24px);
            max-width: calc( 40% - 1rem - var(--thm_content_gap, 24px) - var(--thm_box_gap, 3px) * 2 );
        }
    }
    > .alignright{
        &.size1of3{
            margin-right:var(--thm_content_gap, 24px);
            max-width: calc( 33.33333% - 1rem - var(--thm_content_gap, 24px) - var(--thm_box_gap, 3px) * 2);
        }
        &.size1of4{
            margin-right:var(--thm_content_gap, 24px);
            max-width: calc( 24.99% - 1rem - var(--thm_content_gap, 24px) - var(--thm_box_gap, 3px) * 2 );
        }
        &.size1of5{
            margin-right:var(--thm_content_gap, 24px);
            max-width: calc( 19.99% - 1rem - var(--thm_content_gap, 24px) - var(--thm_box_gap, 3px) * 2 );
        }
        &.size2of5{
            margin-right:var(--thm_content_gap, 24px);
            max-width: calc( 40% - 1rem - var(--thm_content_gap, 24px) - var(--thm_box_gap, 3px) * 2 );
        }
    }
}

/**
 * Handmade Layout helper
 * ========================================================================== */

.lastunit,
.lastUnit {
    float:none;
    width:auto;
}
.line .widget {
    margin:0;
    padding:0;
}
.line img {
    height:auto;
}
.line,
.lastunit,
.lastUnit {
    overflow:hidden;
}
.page-featured-image {
    padding:0;
}
.line {
    .size1of1,
    .size1of2,
    .size1of3,
    .size2of3,
    .size1of4,
    .size3of4,
    .size1of5,
    .size2of5,
    .size3of5,
    .size4of5 {
        display: inline-block;
        margin-left:0;
        margin-right:-4px;
    }
    .size1of2 {
        width: 50%;
    }
    .size1of3 {
        width: 33.33333%;
    }
    .size1of4 {
        width: 24.99%;
    }
    .size1of5 {
        width: 19.99%;
    }
    .size2of3 {
        width: 66.66666%;
    }
    .size2of5 {
        width: 40%;
    }
    .size3of4 {
        width: 75%;
    }
    .size3of5 {
        width: 60%;
    }
    .size4of5 {
        width: 80%;
    }
}
.unit {
    float:left
}
.unitext,
.unitExt {
    float:right
}
@media screen and ( max-width : 720px  ) {
    .full_text{
        h1,h2,h3,h4,h5,h6,
        ul,ol,
        p,
        .wp-blok,
        .alignleft,
        .alignright,
        figure{
            &.size1of1,
            &.size1of2,
            &.size1of3,
            &.size2of3,
            &.size1of4,
            &.size3of4,
            &.size1of5,
            &.size2of5,
            &.size3of5,
            &.size4of5 {
                display:block;
                width:100%;
                max-width:none;
                margin-left:auto;
                margin-right:auto;
                clear:both;
                float:none;
                padding-left:var(--thm_content_gap, 24px);
                padding-right:var(--thm_content_gap, 24px);
            }
        }
    }
}



.wp-block-buttons.is-style-has-shadow{
    .wp-block-button{
        .wp-block-button__link{
            box-shadow: var(--thm_box_shadow);
        }
        .wp-block-button__link:active{
            box-shadow:none;
        }
    }
}

CodeMirror{
    .CodeMirror-scroll{
        overflow: initial ! important;
        overflow-x: scroll ! important;
        margin-right:calc(var(--thm_common_font_size, 16px) * -1 );
        padding-right:var(--thm_common_font_size, 16px);
        margin-bottom:calc(var(--thm_common_font_size, 16px) * -1 );
        padding-bottom:var(--thm_common_font_size, 16px);
    }
}
#cookie-law-info-bar{
    .shortcode-wrapper{
        width:auto;
        margin:auto;
    }
}
