/*noinspection CssUnusedSymbol*/
.block_type_badgeblock h3.block-title {
    display: none !important;
}

/*noinspection CssUnusedSymbol*/
.block_type_badgeblock {
    display: flex !important;
    justify-content: flex-end;
    align-items: center;
    position: fixed !important;
    inset: 0;
    z-index: 10000;
    pointer-events: none;
}


.block-badge-inner {
    display: none;
}

.block-badge-buttonname {
    width: auto;
    height: auto;
    position: fixed;
    top: 80vh;
    right: 0;
    transform: rotate(90deg);
    transform-origin: top right;
    padding: 0;
    margin: 0;
    z-index: 1000;
    font-size: 120%;
    text-transform: uppercase;
    font-weight: bold;
    display: table;
}

.block-badge-buttonname > span {
    margin: 0;
    display: table-cell;
    background-color: transparent !important;
    pointer-events: none;
    position: relative;
    float: left;
    padding: 13px 15px;
}

.block-badge-buttonname .block-badge-icon {
    text-transform: none;
    font-weight: 100 !important;
    font-size: 150%;
    vertical-align: sub;
    transform: rotate(-90deg);
    display: inline-block;
    background-color: transparent !important;
    margin-right: 5px;
    padding: 5px 0;
    line-height: 0;
}

svg.block-badge-icon {
    width: 1em;
    height: 1em;
}

div.block-badge-outer {
    position: relative;
    display: flex !important;
    min-width: 320px;
    min-height: 320px;
    max-width: 320px;
    max-height: 90vh;
    right: -100%;
    border-radius: 160px;
    transition: right 0.5s ease-out;
    text-align: center;
    box-sizing: border-box;
    pointer-events: initial;
    backface-visibility: hidden;
}

.block-badge-outer.blockbadgeFull {
    right: 5%;
    transition: right 0.5s ease-in;
}

@keyframes blockbadge {
    0% {
        top: auto;
        right: 5%;
    }

    100% {
        top: -100%;
        right: -100%;
    }
}

.block-badge-outer.animation:not(.blockbadgeFull):not(.no-animation) {
    top: auto;
    right: 5%;
    animation-name: blockbadge;
    animation-duration: 4s;
    animation-fill-mode: forwards;
    animation-delay: 10s;
    animation-iteration-count: 1;
    animation-timing-function: linear;
}

.block-badge-outer.animation.stop-animation {
    animation: none;
}

.block-badge-inner {
    display: flex;
    place-content: center center;
    align-items: center;
    flex-flow: row wrap;
    flex: 0 1 100%;
    font-size: 20px;
    max-width: 100%;
    padding: 0;
    margin: 25px 0;
    overflow: auto;
}

.block-badge-img {
    position: absolute;
    top: -35px;
    right: 0;
    height: 100px;
    width: 100px !important;
    border-radius: 50% !important;
    overflow: hidden;
}

.block-badge-img::after {
    content: " ";
    position: absolute;
    inset: -1px;
    border: 5px solid #ffffff;
    border-radius: 50%;
}

.block-badge-img img {
    margin: 2px;
    width: calc(100% - 4px) !important;
    height: calc(100% - 4px);
    overflow: hidden;
    float: none;
}

.block-badge-inner > * {
    line-height: 2em;
    flex-basis: 100%;
}

.block-badge-title {
    font-size: 120%;
    font-weight: 600;
    line-height: 1.5em;
}

.block-badge-phone {
    font-size: 20px;
}

.block-badge-phone::before {
    content: "V";
    padding-right: 0.1em;
    font-size: 100%;
    vertical-align: bottom;
    font-family: "web-icons-1";
}

.block-badge-html {
    font-size: 70%;
    order: 3 !important;
}

.block-badge-email {
    font-size: 70%;
}

.block-badge-email:hover,
.block-badge-phone:hover,
.block-badge-link:hover {
    text-decoration: none !important;
    cursor: pointer;
}

.block-badge-email::before {
    content: "L";
    padding-right: 0.2em;
    font-size: 150%;
    vertical-align: bottom;
    font-family: "web-icons-1";
    line-height: 1.3em;
}

.block-badge-link {
    padding: 0.4em 0.7em;
    border: 1px solid;
    line-height: 1.2em;
    margin-top: 0.5em;
    order: 3 !important;
    border-radius: 3px;
    font-size: 73%;
    text-transform: uppercase;
    font-weight: 600;
    flex-basis: 200px;
}

* {
    transition: color 0.25s ease, background-color 0.25s ease;
}

@media all and (width <= 679px) {
    .block-badge-outer {
        position: absolute;
        height: 100%;
        width: 100%;
        max-height: 100vh;
        max-width: 100vw;
        padding: 0;
        box-shadow: none;
        border-radius: 0;
        inset: 0;
        margin: 0 0 0 auto;
    }

    .block-badge-inner > * {
        order: 2;
    }

    .block-badge-img {
        position: relative;
        border-radius: 50%;
        order: 1;
        width: 250px !important;
        height: 250px !important;
        flex-basis: 250px;
    }

    .block-badge-outer {
        margin-right: -200vw;
    }

    .blockbadgeFull .block-badge-buttonname span {
        display: none;
    }

    .blockbadgeFull .block-badge-buttonname::after {
        content: "T";
        font-family: "web-icons-1";
        font-size: 30px;
        line-height: 2em;
    }

    .blockbadgeFull .block-badge-buttonname {
        top: 12px;
        height: 50px;
        box-shadow: none;
        right: 12px;
        width: 50px;
        transform: rotate(0deg);
        transform-origin: top right;
    }

    .blockbadgeFull .block-badge-buttonname:not(:hover) {
        background-color: transparent !important;
    }
}

/* overriding an !important global selector in template-adjustment.scss. Remove this line when template-selector.scss is no longe !important-overriding */
#WIPSMAINCONTENTS div.block-badge-html p {
    color: var(--foreground-color) !important;
}

div.block-badge-html, div.block-badge-html * {
    color: var(--foreground-color);
}

div.block-badge-outer, div.block-badge-buttonname {
    background-color: var(--background-color);
    color: var(--foreground-color);
}

.block-badge-link:hover,
.block-badge-link:hover a,
.block-badge-buttonname:hover,
.block-badge-buttonname:hover span {
    background-color: var(--foreground-color);
    color: var(--background-color);
}

/* site cutom*/
div.block-badge-outer {
    min-width: 242px;
    min-height: 246px;
    max-width: 208px;
    max-height: 61vh;
    padding: 22px;
}