/*.floating-block {*/
/*    position: fixed;*/
/*    z-index: 3100;*/
/*    bottom: 50px;*/
/*    right: 30px*/
/*}*/


/*.floating-block__btn {*/
/*    --btn-size: 72px;*/
/*    --icon-size: 40px;*/
/*    position: relative;*/
/*    width: var(--btn-size);*/
/*    height: var(--btn-size);*/
/*    border-radius: 50%;*/
/*    cursor: pointer;*/
/*    display: flex;*/
/*    justify-content: center;*/
/*    align-items: center;*/
/*    background-color: #29AAE3;*/
/*    transition: all 300ms;*/
/*    transition-property: transform, background-color*/
/*}*/





/*.floating-block__btn:focus, .floating-block__btn:hover {*/
/*    transform: scale(1.1)*/
/*}*/



/*.floating-block__options {*/
/*    position: absolute;*/
/*    bottom: 100%;*/
/*    left: 50%;*/
/*    padding: 15px 0;*/
/*    transform-origin: 50% 100%;*/
/*    transform: translate(-50%, 50px) scale(0);*/
/*    transition: transform 300ms*/
/*}*/

/*.floating-block.active .floating-block__options {*/
/*    transform: translate(-50%, 0) scale(1)*/
/*}*/

/*.floating-block__options > .floating-block__btn {*/
/*    --btn-size: 60px;*/
/*    margin-bottom: 10px*/
/*}*/

/*.floating-block__btn--pulsating::before {*/
/*    content: '';*/
/*    position: absolute;*/
/*    left: 0;*/
/*    right: 0;*/
/*    top: 0;*/
/*    bottom: 0;*/
/*    width: 100%;*/
/*    height: 100%;*/
/*    border-radius: 50%;*/
/*    opacity: .4;*/
/*    background-color: #376597;*/
/*    transform: scale(1.1);*/
/*    animation: pulse 2s 1s infinite*/
/*}*/


/*@keyframes pulse {*/
/*    0% {*/
/*        transform: scale(1.1)*/
/*    }*/
/*    60% {*/
/*        transform: scale(1.3)*/
/*    }*/
/*    100% {*/
/*        transform: scale(1.1)*/
/*    }*/
/*}*/

/*.floating-block__btn--full-svg {*/
/*    --icon-size: 100%;*/
/*    background-color: transparent !important*/
/*}*/

/*.floating-block__btn--telegram {*/
/*    background-color: #376597;*/
/*}*/


/*.floating-block__btn--viber {*/
/*    background-color: #7360f2*/
/*}*/

/*.floating-block__btn--whatsapp {*/
/*    background-color: #25d366*/
/*}*/

/*.floating-block__icon {*/
/*    position: relative;*/
/*    width: var(--icon-size);*/
/*    height: var(--icon-size)*/
/*}*/

/*.inner-bracket-path, .outer-bracket-path {*/
/*    animation: appearRightTop 1s infinite*/
/*}*/

/*.inner-bracket-path {*/
/*    animation-delay: 2s*/
/*}*/

/*.outer-bracket-path {*/
/*    animation-delay: 2.35s*/
/*}*/

/*@keyframes appearRightTop {*/
/*    0% {*/
/*        opacity: 0;*/
/*        transform: translate(0, 0)*/
/*    }*/
/*    50% {*/
/*        opacity: 1;*/
/*        transform: translate(1px, -1px)*/
/*    }*/
/*    75% {*/
/*        opacity: 1;*/
/*        transform: translate(1.5px, -1.5px)*/
/*    }*/
/*    100% {*/
/*        opacity: 0;*/
/*        transform: translate(2px, -2px)*/
/*    }*/
/*}*/

/*.phone-path {*/
/*    transform-origin: 20% 60%;*/
/*    animation: shaking 2s infinite*/
/*}*/





/*@keyframes shaking {*/
/*    0% {*/
/*        transform: rotate(0deg)*/
/*    }*/
/*    10% {*/
/*        transform: rotate(-8deg)*/
/*    }*/
/*    30% {*/
/*        transform: rotate(8deg)*/
/*    }*/
/*    50% {*/
/*        transform: rotate(-8deg)*/
/*    }*/
/*    60% {*/
/*        transform: rotate(0deg)*/
/*    }*/
/*    100% {*/
/*        transform: rotate(0deg)*/
/*    }*/
/*}*/

.floating-block {
    position: fixed;
    z-index: 3100;
    bottom: 50px;
    right: 30px
}


.floating-block__btn {
    --btn-size: 72px;
    --icon-size: 40px;
    position: relative;
    width: var(--btn-size);
    height: var(--btn-size);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #29AAE3;
    transition: all 300ms;
    transition-property: transform, background-color
}





.floating-block__btn:focus, .floating-block__btn:hover {
    transform: scale(1.1)
}



.floating-block__options {
    position: absolute;
    bottom: 100%;
    left: 50%;
    padding: 15px 0;
    transform-origin: 50% 100%;
    transform: translate(-50%, 50px) scale(0);
    transition: transform 300ms
}

.floating-block.active .floating-block__options {
    transform: translate(-50%, 0) scale(1)
}

.floating-block__options > .floating-block__btn {
    --btn-size: 60px;
    margin-bottom: 10px
}

.floating-block__btn--pulsating::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    opacity: .4;
    background-color: #376597;
    transform: scale(1.1);
    animation: pulse 2s 1s infinite
}


@keyframes pulse {
    0% {
        transform: scale(1.1)
    }
    60% {
        transform: scale(1.3)
    }
    100% {
        transform: scale(1.1)
    }
}

.floating-block__btn--full-svg {
    --icon-size: 100%;
    background-color: transparent !important
}

.floating-block__btn--telegram {
    background-color: #249bda;
}

.floating-block__btn--telegram:hover {
    background-color: #1299dc;
}


.floating-block__btn--viber {
    background-color: #7360f2
}

.floating-block__btn--phone {
    background-color: #376597
}

.floating-block__btn--whatsapp {
    background-color: #25d366
}
.floating-block__btn--instagram {
    fill: white;
    width: 60px;
    height: 60px;
    padding: 3px;
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%,#d6249f 60%,#285AEB 90%);
    border-radius: 50%;
    z-index: 10;
}
.floating-block__btn--facebook {
    fill: white;
    width: 60px;
    height: 60px;
    padding: 3px;
    background: #3b5998;
    border-radius: 50%;
    z-index: 10;
}

.whatsapp-ico{
    fill: white;
    width: 60px;
    height: 60px;
    padding: 3px;
    background-color: #4dc247;
    border-radius: 50%;
    z-index: 10;
}
.messenger-ico{
    fill: white;
    width: 60px;
    height: 60px;
    padding: 3px;
    background: linear-gradient(135deg, #006AFF 0%, #00ACFF 100%);
    border-radius: 50%;
    z-index: 10;
}

.whatsapp-ico:hover{
    box-shadow: 2px 2px 11px rgba(0,0,0,0.7);
}

.floating-block__icon {
    position: relative;
    width: var(--icon-size);
    height: var(--icon-size)
}

.inner-bracket-path, .outer-bracket-path {
    animation: appearRightTop 1s infinite
}

.inner-bracket-path {
    animation-delay: 2s
}

.outer-bracket-path {
    animation-delay: 2.35s
}

@keyframes appearRightTop {
    0% {
        opacity: 0;
        transform: translate(0, 0)
    }
    50% {
        opacity: 1;
        transform: translate(1px, -1px)
    }
    75% {
        opacity: 1;
        transform: translate(1.5px, -1.5px)
    }
    100% {
        opacity: 0;
        transform: translate(2px, -2px)
    }
}

.phone-path {
    transform-origin: 20% 60%;
    animation: shaking 2s infinite
}





@keyframes shaking {
    0% {
        transform: rotate(0deg)
    }
    10% {
        transform: rotate(-8deg)
    }
    30% {
        transform: rotate(8deg)
    }
    50% {
        transform: rotate(-8deg)
    }
    60% {
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(0deg)
    }
}
