/* MAIN WRAPPER WIDGETS-AREA*/
#widgets-area {
	width: 50px;
	height: auto;
	position: fixed;
	right: 0;
	bottom: calc(50% - 140px);
	background-color: rgba(95, 158, 160, 0.2);
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	justify-content: space-evenly;
	align-items: stretch;
	gap: 3px;
	padding: 4px 7px;
	border-radius: 20px 0 0 20px;
	z-index: 1000;
	box-shadow: -3px 3px 10px 0 rgba(0, 0, 0, 0.2);
}

@media screen and (max-width: 600px) {
	#widgets-area {
		width: 39px;
/*		border-radius: 20px 20px 0 0;
		height: 30px;
		width: auto;
		bottom: 0;
		right: calc(50% - 86px);
		flex-direction: row;*/
	}

	#widgets-area>.widget-href>img {
		width: 25px !important;
		height: auto;
	}

	#jivo_custom_widget {
		width: 25px !important;
		height: 25px !important;
	}
}

#widgets-area>.widget-href {
	display: inline-block;
	object-fit: contain;
}

#widgets-area>.widget-href>img {
	width: 50px;
	height: auto;
	transition: .1s;
}

#widgets-area>.widget-href>svg {
	transition: .1s;
}

#widgets-area>.widget-href>img:hover, #widgets-area>.widget-href>svg:hover {
	transform: scale(1.1) rotate(360deg);
	transition: .5s;
}

/* hide the original widget - that there were no two labels on the screen*/
#jivo_chat_widget {
	display: none;
}

/* the default style - for offline messages if no one is online */
#jivo_custom_widget {
	/* position: fixed;
	left: -3px;
	top: 30%; */
	z-index: 300000;
	cursor: pointer;
	transition: .1s;
	height: 36px;
	width: 36px;
	background-size: contain;
	border-radius: 50px;
	background-image: url(/upload/jivosite/jivo_widget_offline.png);
}

/* when you hover the label should be shifted to the right by 3px */
#jivo_custom_widget:hover {
	left: 0;
	transform: scale(1.1) rotate(360deg);
	transition: .5s;
}

/* if there are operators online - show other label*/
#jivo_custom_widget.jivo_online {
	/*height: 50px;*/
	background-image: url(/upload/jivosite/jivo_widget_online.png);
}