
.tooltip-container {
    position: relative;
    display: inline-block;
    cursor: pointer;
    width: 100%;
    text-align: center;
}

.tooltip-container .tooltip-text {
    visibility: hidden;
    opacity: 0;
    width: 250px;
    background-color: #333;
    color: #fff;
    text-align: center;
    padding: 8px;
    border-radius: 6px;
    position: absolute;
    z-index: 1;
    bottom: 115%;
    left: 50%;
    transform: translateX(-50%);
    /*transition: opacity 0.3s ease;*/
    pointer-events: none;
    font-size: 14px;
    line-height: 20px;
}

.tooltip-container .tooltipicon{
    width:100px;
    height:auto;
    margin: 0 auto;
}

.tooltip-container .tooltip-text:after{
    content: "";
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 6px 6px 0 6px;
    border-color: #333 transparent transparent transparent;
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
}

.tooltip-container:hover  .tooltip-text {
    visibility: visible;
    opacity: 1;
}
.tooltip-container svg{
    width: 48px;
    stroke: #6c44f0;
}
.tooltip-container .icon-text{
    font-size: 17.6px;
    font-weight: bold;
    display: block;
    margin-top: 0;
    margin-bottom: 5px;
}
@media(max-width: 992px) {
    .first-tooltip.tooltip-container .tooltip-text{
        transform: translateX(-30%);
    }
    .first-tooltip.tooltip-container .tooltip-text:after{
        left: 30%;
    }
    .last-tooltip.tooltip-container .tooltip-text{
        left: -10%;
    }
    .last-tooltip.tooltip-container .tooltip-text:after{
        left: 82%;
    }
}
@media(max-width: 767px) {
    .tooltip-container .icon-text{
        font-size: 14px;
        line-height: 14px;
        margin-bottom: 3px;
    }
    .tooltip-container .icon-subtitle {
        font-size: 13px;
    }
    .tooltip-container svg{
        width: 38px;
    }
    .tooltip-container .tooltipicon{
        width:70px;
        margin-bottom: 5px;
    }
    .first-tooltip.tooltip-container .tooltip-text {
        left: 30%;
        transform: translateX(0%);
    }
    .first-tooltip.tooltip-container .tooltip-text:after{
        left: 14%;
    }
    .last-tooltip.tooltip-container .tooltip-text{
        left: 0%;
    }
}

/*JS Tooltip*/
#d8ss-tooltips-container .tooltip-text {
    position: absolute;
    background: #333;
    color: #fff;
    padding: 8px 10px;
    border-radius: 4px;
    font-size: 13px;
    width: 280px;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease;
    z-index: 9;
}

#d8ss-tooltips-container .tooltip-text.visible {
    opacity: 1;
    pointer-events: auto;
}


#d8ss-tooltips-container .tooltip-text::after {
    content: "";
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
}

#d8ss-tooltips-container .tooltip-top::after {
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 6px 6px 0 6px;
    border-color: #333 transparent transparent transparent;
}

#d8ss-tooltips-container .tooltip-bottom::after {
    bottom: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 0 6px 6px 6px;
    border-color: transparent transparent #333 transparent;
}

#d8ss-tooltips-container .tooltip-left::after {
    left: 100%;
    top: 50%;
    margin-top: -5px;
    border-width: 6px 0 6px 6px;
    border-color: transparent transparent transparent #333;
}

#d8ss-tooltips-container .tooltip-right::after {
    right: 100%;
    top: 50%;
    margin-top: -5px;
    border-width: 6px 6px 6px 0;
    border-color: transparent #333 transparent transparent;
}

.has-tooltip{
    cursor: pointer;
    position: relative;
}

.has-tooltip:after,
.wr-points-balance .item.tile:after{
    content: "";
    position: absolute;
    top: 5px;
    right: 5px;
    cursor: pointer;
    vertical-align: middle;
    width: 15px;
    height: 15px;
    text-align: center;
    display: inline-block;
    margin-left: 3px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAADd0lEQVR4nO2aT08UQRDFfwSENRiRhRWPcjQY5VMoRFTghuJNgxeRoFeVm4ieSEj4HBpC0KghUSP+QbmoKJwED0a8uUDQjKn4JunEmYWdnd0dCC+ZZHeqp7prurq6+tXALnYu0kAncBeYAD4BP4F1Xfb7o2TW5ixQT0KQAi4AD4E/gJfn9RuYAnqBmnIYsBe4BnxzBrUGPAFuaGaO6I3v0VWveya7CTzVM/7zy8CgXk5JcApYdAbwGrgI1EXQdQC4BLxx9C0A7RQR9qbGnQ7fAidi1N8GvHP0jxVjdg5p4NbBL+AKUBl3J/zTeRXIOrPdFJfyZk23p6hzlOLjGDCvPr9oDAUh4yh8BTRSOtQDz9T3orwiElKOO70Aaik9aoGXjptFWjPjjjvZZpcvqoE7CtEWWod1L180OF5hASDvEOsv7KhrYjhgA7R7UddMVjosum15s/P3CYtOUbEcYIjdi4oBZ/FvycWuO/tEZYIMqQLeS48ZlRMpJ+0odLMLcq3bBepsl56lzXKzXidCFIpqGbNc4GJ3UeFE0nPkwCM1stwpqejTGCfDGqSVVq9FTABLuVGuAxth4+ySpY9JPqY11tNBwnsS2nki6RjSWEeChBMSnomho7ATYVzokr77QcLPEtopLumGtEif8QL/YUXCKHlVGIplSKP0fQ8SrktYaKwvhSE1Dk+wcw1Z2UaulcnlWnEudh9lWewTEhoDmHRDunOFX39DNPIs6YYM5doQOyU0tjDphkxLX0dYMuYnjcYAJtWQtJM07g9rNKUOjcZMqiGXpcvWdCjOq5FxsUk0pAKYla6ezTaaJTU8mUBDOqTn61bKEINqPBsDvxunIVXAnPT0b+WBlMP1GqEcZ/ZbiEGDenY+n6KQz1ZkRY6V25BWYDUquzPmvAGjLcuFjEg5G8toFAUp0UKeiORykNj7gBmNYaaQOmNGiZlfVrD/pUIaeK6+F+Io+DQ7U2tudpzio9Xp07Lyw3EpbnLcLCvu1cJh3KhSdFp13Olg3J2knADgiVCOq/paoVLGnKN/tNi19zZn2j1xsX0Rv2JIK3fy0w5PrhRntXjT2Rlw0hlPGaml17fEO7UobFfralDRqFttph2ewE87+sv1BUSNWPFJHQG8PK8NZbE95TIgCHXiYu3U9kC1xx/ORzX2+4OOpyNqG3qe2AXbHH8BUFp9NS4UzQMAAAAASUVORK5CYII=");
}
.static-tooltip-icon{
    position: relative;
    top: -10px;
    cursor: pointer;
    width: 15px;
    height: 15px;
    text-align: center;
    display: inline-block;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAADd0lEQVR4nO2aT08UQRDFfwSENRiRhRWPcjQY5VMoRFTghuJNgxeRoFeVm4ieSEj4HBpC0KghUSP+QbmoKJwED0a8uUDQjKn4JunEmYWdnd0dCC+ZZHeqp7prurq6+tXALnYu0kAncBeYAD4BP4F1Xfb7o2TW5ixQT0KQAi4AD4E/gJfn9RuYAnqBmnIYsBe4BnxzBrUGPAFuaGaO6I3v0VWveya7CTzVM/7zy8CgXk5JcApYdAbwGrgI1EXQdQC4BLxx9C0A7RQR9qbGnQ7fAidi1N8GvHP0jxVjdg5p4NbBL+AKUBl3J/zTeRXIOrPdFJfyZk23p6hzlOLjGDCvPr9oDAUh4yh8BTRSOtQDz9T3orwiElKOO70Aaik9aoGXjptFWjPjjjvZZpcvqoE7CtEWWod1L180OF5hASDvEOsv7KhrYjhgA7R7UddMVjosum15s/P3CYtOUbEcYIjdi4oBZ/FvycWuO/tEZYIMqQLeS48ZlRMpJ+0odLMLcq3bBepsl56lzXKzXidCFIpqGbNc4GJ3UeFE0nPkwCM1stwpqejTGCfDGqSVVq9FTABLuVGuAxth4+ySpY9JPqY11tNBwnsS2nki6RjSWEeChBMSnomho7ATYVzokr77QcLPEtopLumGtEif8QL/YUXCKHlVGIplSKP0fQ8SrktYaKwvhSE1Dk+wcw1Z2UaulcnlWnEudh9lWewTEhoDmHRDunOFX39DNPIs6YYM5doQOyU0tjDphkxLX0dYMuYnjcYAJtWQtJM07g9rNKUOjcZMqiGXpcvWdCjOq5FxsUk0pAKYla6ezTaaJTU8mUBDOqTn61bKEINqPBsDvxunIVXAnPT0b+WBlMP1GqEcZ/ZbiEGDenY+n6KQz1ZkRY6V25BWYDUquzPmvAGjLcuFjEg5G8toFAUp0UKeiORykNj7gBmNYaaQOmNGiZlfVrD/pUIaeK6+F+Io+DQ7U2tudpzio9Xp07Lyw3EpbnLcLCvu1cJh3KhSdFp13Olg3J2knADgiVCOq/paoVLGnKN/tNi19zZn2j1xsX0Rv2JIK3fy0w5PrhRntXjT2Rlw0hlPGaml17fEO7UobFfralDRqFttph2ewE87+sv1BUSNWPFJHQG8PK8NZbE95TIgCHXiYu3U9kC1xx/ORzX2+4OOpyNqG3qe2AXbHH8BUFp9NS4UzQMAAAAASUVORK5CYII=");
}
.wr-points-balance .item.tile{
    position: relative;
}
@media(max-width:767px){
    div.wr-points-balance.wr-shortcode-grid{
        grid-template-columns: none;
    }
    .mobile-align-left{
        text-align: left;
        margin-bottom: 15px;
    }
}