.mobile-bar {
    position: fixed;
    left: 0;
    bottom: 0;
    width: 100%;
    z-index: 1000;
    text-align: center;
    background: #fff;
    padding: 5px 0
}

@media (min-width: 768px) {
    .mobile-bar {
        display: none
    }
}

.bar-link {
    display: inline-block;
    position: relative;
    width: 32px;
    height: 32px;
    cursor: pointer;
    margin: 0 10px
}

.bar-link i {
    display: block;
    width: 32px;
    height: 32px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    filter: invert(7%) sepia(92%) saturate(7251%) hue-rotate(298deg) brightness(108%) contrast(106%)
}

.bar-link-main i {
    background-image: url("../linearicons/SVG/home.svg")
}

.bar-link-catalog i {
    background-image: url("../linearicons/SVG/list.svg")
}

.bar-link-cart i {
    background-image: url("../linearicons/SVG/cart.svg")
}

.bar-link-profile i {
    background-image: url("../linearicons/SVG/user.svg")
}

.bar-link-call i {
    background-image: url("../linearicons/SVG/phone.svg")
}

.bar-link-call:hover ul {
    display: block
}

.bar-link ul {
    margin: 0;
    padding: 0 50px 0 0;
    list-style: none;
    position: absolute;
    bottom: 100%;
    right: 0;
    text-align: right;
    display: none
}

.bar-link ul.active {
    display: block
}

.bar-link li {
    margin: 20px 0
}

.bar-link li.call a:before {
    background: #ff2241
}

.bar-link li.order_call a:before {
    background: #ff9900
}

.bar-link li.call i, .bar-link li.order_call i {
    background-image: url("../linearicons/SVG/call.svg")
}

.bar-link li.whatsap a:before {
    background: #30d64f
}

.bar-link li.whatsap i {
    background-image: url("../linearicons/SVG/whatsapp.svg")
}

.bar-link li.chat a:before {
    background: #03a9f4
}

.bar-link li.chat i {
    background-image: url("../linearicons/SVG/bubble.svg")
}

.bar-link li a {
    position: relative;
    display: inline-block;
    height: 30px;
    line-height: 30px;
    width: auto;
    padding: 0 10px;
    white-space: nowrap;
    border-radius: 15px;
    background: rgba(0, 0, 0, 0.8);
    color: #fff;
    text-decoration: none
}

.bar-link li a:before {
    content: '';
    position: absolute;
    width: 40px;
    height: 40px;
    top: -5px;
    right: -50px;
    border-radius: 20px
}

.bar-link li i {
    display: block;
    position: absolute;
    width: 26px;
    height: 26px;
    top: 2px;
    right: -44px;
    filter: invert(99%) sepia(0%) saturate(1696%) hue-rotate(120deg) brightness(119%) contrast(100%)
}

body.background {
    padding-bottom: 42px !important
}

.ccalback,
.ya-chat-button {
    display: none !important;
    visibility: hidden !important
}

div.ya-chat-widget {
    margin-right: 2000px !important
}

.jo-whatsappcontactbutton {
    display: none !important
}

.ccalback {
	display: none;
}

div.ya-chat-widget{
	margin-right:2000px !important;
}

div.ya-chat-widget.active{
	margin-right:0 !important;
}

@media (min-width: 768px) {
	body.background {
		padding-bottom:0 !important;
	}
}

.multibutton {
    position: fixed;
    left: 30px;
    bottom: 30px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    width: 70px;
    height: 70px;
    transition: 0.2s ease;
	display: none;
	z-index:1000;
}

.multibutton:hover {
    width: auto;
    height: auto;
}

.multibutton:hover .multibutton__list {
    position: relative;
    top: auto;
    bottom: 10px;
    visibility: visible;
}

.multibutton:hover .multibutton__item {
    visibility: visible;
    opacity: 1;
    transition: 0.3s ease;
    transform: scaleX(1) scaleY(1) translateY(0);
}

.multibutton__list {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: absolute;
    left: 13px;
    top: 80px;
    visibility: hidden;
    transition: 0.3s ease;
    list-style: none;
    padding: 0;
    margin: 0;
}

.multibutton__title {
    font-size: 12px;
    color: #fff;
    text-decoration: none;
    background: rgba(0,0,0,0.8);
    padding: 10px;
    border-radius: 30px;
}

.multibutton__title:hover {
	color:#fff;
}

.multibutton__item {
    display: flex;
    align-items: center;
    margin: 4px 0;
    transform: scaleX(0.4) scaleY(0.4) translateY(150px);
    opacity: 0;
    visibility: hidden;
}

.multibutton__button {
    width: 70px;
    height: 70px;
    background: #ffce09;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    animation: animation_button 3s linear infinite;
    transition: all 200ms ease-out;
}

@keyframes animation_button {
    0% {
        box-shadow: 0 0 0 0 #ffba26, 0 0 0 0 rgba(255, 206, 9, 0.7);
    }
    40% {
        box-shadow: 0 0 0 13.62667px rgba(255,186, 38, 0), 0 0 0 6.81333px rgba(255, 206, 9, 0.7);
    }
    80% {
        box-shadow: 0 0 0 27.25333px rgba(255, 186, 38, 0), 0 0 0 13.62667px rgba(255,206, 9, 0);
    }
    100% {
        box-shadow: 0 0 0 34.06667px rgba(255, 186, 38, 0), 0 0 0 27.25333px rgba(255, 206, 9, 0);
    }
}

.multibutton__button svg {
    width: 30px;
    height: 30px;
    fill: #fff;
}

.multibutton__item:nth-child(1) .multibutton__icon{
    background: #03a9f4;
}

.multibutton__item:nth-child(2) .multibutton__icon{
    background: #ff2241;
}

.multibutton__item:nth-child(3) .multibutton__icon{
    background: #30d64f;
}

.multibutton__item:nth-child(4) .multibutton__icon{
    background: #30d64f;
}

.multibutton__icon {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
}

.multibutton__icon svg{
    width: 26px;
    height: 26px;
    fill: #fff;
}