@offset: 188.8;
@duration: 1.4s;
.h5-ext-layer {
    display:none;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index:100;
    width: 100%;
    height: 100%;
    background-color: #000;
    .h5-frame-layer{
        display: none;
        position: absolute;
        left:0px;
        top:0px;
        width: 100%;
        height: 100%;
        z-index: 202;
    }
    ul, li{ display: block; margin: 0; padding: 0; }
    ul, li{list-style:none;}
    .inter-player{
        width:100%;
        height:100%;
        position:absolute;
        left:0;bottom:0;
        display:none;
        z-index:209;
        cursor: pointer
    }
    .inter-player span{color:red; padding: 0 2px 0 2px;}
    .spv-ad-box{height:100%;position:relative;}
    .spv-ad-tip{position:absolute;height:30px;font-size:12px;line-height:30px;color:#454545;right:0;background:rgba(0,0,0,0.6);color:#fff;text-align:center;width:120px;z-index:202;
        text-align: center;}
    .inter-player svg{float:left;}
    .spv-ad-mute{width:25px;height:17px;right:105px;top:0;padding:6px 6px 7px 7px;cursor: pointer;}
    .spv-ad-nomute{display:none;width:25px;height:17px;right:105px;top:0px;padding:6px 6px 7px 7px;cursor: pointer;}
    .spv-ad-count{padding:0 10px;right:148px;top:0;}
    .spv-ad-skip{width:100px;cursor:pointer;top:0;}
    .spv-ad-more{bottom:60px;width:100px;cursor:pointer;z-index: 200}
    .spv-ad-view{bottom:60px;width:100px;cursor:pointer;right: 105px;display: none;}
    .spv-ad-skip-view{
        position: absolute;
        bottom: 110px;
        cursor: pointer;
        right: 10px;
        display: block;
        height: 40px;
        line-height: 40px;
        background-color: rgba(222, 218, 218, 0.45);
        color: rgba(0, 0, 0, 0.9);
        opacity: 0.8;
        border-radius: 10px;
        border: 1px solid rgba(206, 153, 153, 0.45);
        font-size: 14px;
        width: 140px;
        z-index: 202;
        text-align: center;
        padding: 0 5px 0 5px;
    }
    .spv-ad-skip-view .view-adtime{
        color: rgb(76, 183, 255);
        padding: 0 2px 0 2px;
        font-size: 16px;
    }
    .spv-ad-skip-view .view-txt{
         color: rgba(0, 0, 0, 0.9);
    }
    .inter-player-big{width:100%;height:100%;position:absolute;left:0;top:0;z-index:200;}
}
.h5-ext-layer-adsdk{
    position: absolute;
    top: 0;
    left: 0;
    bottom:0;
    width: 100%;
    height: 100%;
}
.h5-ext-layer  .preloading-container{
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100px;
    height: 75px;
    margin-left: -50px;
    margin-top: -40px;
    z-index: 104;
    .h5-layer-loading {
        position: relative;
        width: 40px;
        height: 40px;
        margin: 0 auto;
        .spinner {
           animation: rotator @duration linear infinite;
        }

        @keyframes rotator {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(270deg); }
        }

        @keyframes rotator2 {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(270deg); }
        }

        .path {
            stroke-dasharray: @offset;
            stroke-dashoffset: 0;
            transform-origin: center;
            animation:dash @duration ease-in-out infinite;
        }

        @keyframes dash {
            0% {
                stroke-dashoffset: @offset;
                opacity: 0;
            }
            50% {
                stroke-dashoffset: @offset/4;
                transform:rotate(135deg);
                opacity: 1;
            }
            100% {
                stroke-dashoffset: @offset;
                transform:rotate(450deg);
                opacity: 0;
            }
        }
    }
}