.deep-ss-box {
    font-family: inherit;
    display: block;
    background: #73777d;
    position: fixed;
    top: 25%;
    right: -1px;
    padding: 4px 0;
    z-index: 999;
    border-radius: 4px 0 0 4px;
    box-shadow: -3px 0 15px 2px rgb(0 0 0 / 13%);
    transition: all .26s ease;
    border: 1px solid #73777d;
}

.deep-ss-box a {
    display: block;
    padding: 5px 12px;
    position: relative;
}

.deep-ss-box a svg {
    width: 20px;
    height: 24px;
    fill: #ffffff;
}

.deep-ss-box a svg path {
    fill: #ffffff
}

.deep-ss-box a span {
    position: absolute;
    font-size: 12px;
    font-family: calibri, arial, sans-serif;
    color: #ffffff;
    min-width: 110px;
    background: #73777d;
    box-shadow: -10px 0 15px 2px rgb(0 0 0 / 4%);
    text-align: center;
    opacity: 0;
    right: 100%;
    top: 0%;
    transform: translateY(20%);
    -webkit-transform: translateY(20%);
    transition: all .22s ease;
    border-radius: 3px 0 0 3px;
    padding: 8px;
    visibility: hidden;
}

.deep-ss-box a:hover span {
    opacity: 1;
    visibility: visible;
    transform: translateY(0%);
    -webkit-transform: translateY(0%);
}

.deep-ss-box a span {
    transition: all .2s ease;
    color: #e6eaef;
}

.deep-ss-box a:hover svg,
.deep-ss-box a span:hover {
    color: #62eae6;
    fill: #62eae6;
}

.deep-ss-intro-svg,
.deep-ss-docs-svg {
    width: 18px !important;
}

@media (max-width: 480px) {
    .deep-ss-box {
        top: auto;
        bottom: 0;
        right: auto;
        left: 50%;
        margin: 0 auto;
        border-radius: 4px 4px 0 0;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        width: 250px;
        box-shadow: 0 -7px 15px 3px rgba(0, 0, 0, 0.1);
        text-align: center;
        padding: 4px 10px
    }

    .deep-ss-box a {
        display: inline-block;
        padding: 5px 11px
    }

    .deep-ss-box a span {
        display: none
    }
}