.container {
        width: 100%;
        display: flex;
        justify-content: center;
        margin: 115px 0 0 0;
        background-color: #f9fafa;
    }
    .block {
        position: relative;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 400px;
        width: 400px;
    }
    .avaobj_backgrnd {
        position: relative;
        height: 100px;
        width: 100px;
        -o-object-fit: cover;
        object-fit: cover;
        -o-object-position: 50% 10%;
        object-position: 50% 10%;
        border-radius: 50%;
        /*box-shadow: 0 2px 6px rgba(0,0,0,.2);*/
    }
    .circle {
      border-radius: 50%;
      background-color: #b0ebff;
      width: 150px;
      height: 150px;
      position: absolute;
      opacity: 0;
      animation: scaleIn 4s infinite cubic-bezier(.36, .11, .89, .32);
    }
    .item {
      z-index: 100;
      padding: 5px;
    }
    .min_sub {
        position: absolute;
        animation: float 6s ease-out infinite;
    }
    .a1 {
        top: 86px;
        right: 23px;
        animation-delay: 0s
    }
    .a2 {
        top: 107px;
        left: 64px;
        animation-delay: 1s
    }
    .a3 {
        bottom: 0px;
        right: 23px;
        animation-delay: 2s
    }
    .a4 {
        bottom: 86px;
        left: 23px;
        animation-delay: 3s
    }
    .sub {
        width: 60px;
        height: 60px;
        border: 2px solid #fff;
        /*box-shadow: 0 2px 6px rgb(0 0 0 / 20%);*/
        /*animation: float 6s ease-out infinite;*/
    }
    .sub2 {
        width: 50px;
        height: 50px;
        border: 2px solid #fff;
    }
    @keyframes scaleIn {
        from {
            transform: scale(.5, .5);
            opacity: .5;
        }
        to {
            transform: scale(2.5, 2.5);
            opacity: 0;
        }
    }
    @keyframes float {
        50% {
            /*box-shadow: 0 25px 15px 0px rgba(0,0,0,0.2);*/
            transform: translate(0, 20px);
        }
    }