.one--line--banner{background:linear-gradient(90deg,#1C1847 0%,#212D64 100%);border-radius:10px;padding:45px 44px 50px 60px;display:flex;align-items:center;justify-content:space-between;margin-top:50px;position:relative}
.one--line--banner h2{display:inline-block;margin:0;max-width:627px;padding:0;font-size:28px;line-height:38px;color:#fff;font-weight:600;position:relative}
.one--line--banner .one--line--banner--cta{display:inline-block;border-radius:5px;background:linear-gradient(0deg,#B94141 0%,#E73131 52%,#ED4C4C 100%);font-size:16px;line-height:26px;font-weight:400;color:#fff;padding:10px 30px;position:relative;text-decoration:none;white-space:nowrap}
.one--line--banner:before{content:"";background:url(https://www.manageengine.com/products/self-service-password/images/fea-page-header-banner-25.png) no-repeat -6px 0;background-size:527px;width:323px;height:100%;position:absolute;right:0;top:0;mix-blend-mode:color-dodge;opacity:.4}
.one--line--banner .one--line--banner--cta:hover{text-decoration:none;background:linear-gradient(0deg,#ff0a0a 0%,#ff0000 52%,#ff0707 100%);transform:scale(1.02)}

.tool-tip-img {
        position: relative;
    }
        
    .tip {
        position: absolute;
    }
    
    .tip-com span {
        width: 15px;
        height: 15px;
        background: #f5633d;
        display: block;
        text-align: center;
        border-radius: 50%;
        color: #fff;
        cursor: pointer;
    }
    
    .tip-com span {
        position: relative;
        box-shadow: 0 0 0 0 rgb(232 76 61 / 70%);
        -webkit-animation: pulse 1.25s infinite cubic-bezier(0.66,0,0,1);
        -moz-animation: pulse 1.25s infinite cubic-bezier(0.66,0,0,1);
        -ms-animation: pulse 1.25s infinite cubic-bezier(0.66,0,0,1);
        animation: pulse 1.25s infinite cubic-bezier(0.66,0,0,1);
    }
    
    .tip-tool {
        background: #000;
        color: #fff;
        padding: 16px 20px;
        border-radius: 2px;
        width: 260px;
        margin: -24px 0 0 10px;
        box-shadow: 1px 1px 6px 0 rgb(0 0 0 / 60%);
        position: relative;
        transform: scale(0.9);
        opacity: 0;
        z-index: -1;
    }
    
    .tip-tool:before {
        content: '';
        position: absolute;
        width: 0;
        height: 0;
        border-top: 8px solid transparent;
        border-bottom: 8px solid transparent;
        border-right: 8px solid #000;
        top: 5px;
        left: -6px;
    }
    
    .tip .tip-tool p {
        font-size: 16px;
        line-height: 1.6;
        color: #fff;
        margin: 0;
    }
    
    .tip-com div {
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        -o-transition: all .5s ease;
        transition: all .5s ease;
    }
    
    .tip.ss1-tip1 {
        top: 19.5%;
        left: 68%;
    }
    
    .tip.ss1-tip1 .tip1_1_tool {
        right: 140px;
        top: 30px;
    }
    
    .tip.ss1-tip1 .tip1_1_tool::before {
        top: -12px;
        left: 134px;
        transform: rotate(90deg);
    }
    
    .tip.ss1-tip2 {
        top: 38.5%;
        left: 34.7%;
    }
    .tip.ss1-tip3 {
        top: 45%;
        left: 31%;
    }
    .tip.ss2-tip1 {
        top: 28.5%;
        left: 44.5%;
    }
    
    .tip.ss2-tip2 {
         top: 31.5%;
        left: 22.5%;
    }
    
    .tip.ss2-tip3 {
        top: 43%;
        left: 68%;
    }
    
    .tip.ss2-tip3 .tip1_1_tool {
        right: 130px;
        top: 28px;
    }
    
    .tip.ss2-tip3 .tip1_1_tool::before {
        top: -12px;
        left: 134px;
        transform: rotate(90deg);
    }
    
    .tip.ss3-tip1 {
        top: 49%;
        left: 61%;
    }
    
    .tip.ss3-tip1 .tip1_1_tool {
        right: 140px;
        top: 30px;
    }
    
    .tip.ss3-tip1 .tip1_1_tool::before {
        top: -12px;
        left: 134px;
        transform: rotate(90deg);
    }
    
    .tipshow{
        z-index: 2;
        opacity:1
    }
    
    .close {
        width: 12px;
        height: 12px;
        position: absolute;
        right: 8px;
        top: 8px;
        cursor: pointer;
        opacity: .6;
    }
    
    .close:hover {
        opacity: 1;
    }
    
    .close:before, 
    .close:after {
        background: #fff;
        content: ' ';
        height: 12px;
        left: 5px;
        position: absolute;
        width: 2px;
    }
    
    .close:after {
        transform: rotate(-45deg);
    }
    
    .close:before {
        transform: rotate(45deg);
    }
    
    @keyframes pulse {
        100% {
        box-shadow: 0 0 0 15px rgb(232 76 61 / 0%);
     }
    }
    
    .flexslider {
        max-height: inherit;
    }
    
    #slilock .flex-control-paging {
        position: relative;
        display: table;
        margin-left: auto;
        line-height: 0;
        padding-left: 0;
        margin: auto;
        margin-top: 18px;
        right: 0;
    }
    
    #slilock .flex-direction-nav {
            display: none
    }
    
    #slilock .flex-control-paging li a {
        width: 10px;
        height: 10px;
        display: block;
        cursor: pointer;
        text-indent: -9999px;
        border-radius: 20px;
    } 
    @media (max-width: 1200px) {
        .tip .tip-tool p {
            font-size: 14px;
        }
    .tip-tool {width: 240px}
    }
    @media (max-width: 992px) {
        .tip {
            display: none;
        }
    }