@import "https://fonts.googleapis.com/css?family=Play:400,700&subset=latin,cyrillic";
.yBodyOverflowHidden {
	overflow: hidden
}

.yButton {
	position: fixed!important;
	width: 100px!important;
	height: 100px!important;
	box-sizing: border-box!important
}

.yButton.bottom {
	bottom: 30px!important
}

.yButton.top {
	top: 30px!important
}

.yButton.right {
	right: 30px!important
}

.yButton.left {
	left: 30px!important
}

.yButtonBackground {
	position: absolute!important;
	left: 0!important;
	top: 0!important;
	width: 100px!important;
	height: 100px!important;
	border-radius: 100%!important;
	background-color: #1c84c6;
	opacity: .8!important;
	box-sizing: border-box!important
}

.yButtonWave {
	position: absolute!important;
	left: 50%!important;
	top: 50%!important;
	-webkit-transform: translate(-50%, -50%)!important;
	-moz-transform: translate(-50%, -50%)!important;
	-o-transform: translate(-50%, -50%)!important;
	transform: translate(-50%, -50%)!important;
	border-radius: 50%!important;
	border-color: #1c84c6;
	color: #1c84c6;
	border: 2px solid!important;
	width: 105%;
	height: 105%;
	opacity: .9!important;
	box-sizing: border-box!important;
	-webkit-animation: wave-stroke 2s infinite cubic-bezier(.37, 0, .8, .77);
	-moz-animation: wave-stroke 2s infinite cubic-bezier(.37, 0, .8, .77);
	-o-animation: wave-stroke 2s infinite cubic-bezier(.37, 0, .8, .77);
	animation: wave-stroke 2s infinite cubic-bezier(.37, 0, .8, .77)
}

.yButtonIcon {
	display: none;
	box-sizing: border-box!important
}

.yButtonText {
	position: absolute!important;
	top: 25px!important;
	left: 5px!important;
	right: 5px!important;
	border-radius: 50%!important;
	width: 90px!important;
	height: 50px!important;
	color: #fff!important;
	font-size: 15px!important;
	line-height: 25px!important;
	font-weight: 400!important;
	text-align: center!important;
	vertical-align: middle!important;
	letter-spacing: 1.5px!important;
	font-family: play, sans-serif!important;
	box-sizing: border-box!important
}

.yWidgetBlock {
	position: fixed!important;
	top: 0!important;
	width: 500px;
	height: 100%!important;
	background-color: #fff!important;
	background-image: url(/images/widgetBack.png)!important;
	background-position: center 10%!important;
	background-repeat: no-repeat!important;
	box-sizing: border-box!important
}

.yWidgetBlock.right {
	right: -500px
}

.yWidgetBlock.left {
	left: -500px!important
}

.yWidgetIFrame {
	width: 100%!important;
	height: 100%!important;
	box-sizing: border-box!important
}

.yWidgetCover {
	width: 100%!important;
	height: 100%!important;
	background: #333!important;
	opacity: .5!important;
	display: none;
	position: fixed!important;
	top: 0!important;
	left: 0!important;
	box-sizing: border-box!important
}

.yCloseIcon {
	position: fixed!important;
	top: 13px!important;
	width: 35px!important;
	height: 35px!important;
	border-radius: 50%!important;
	display: none;
	background-repeat: no-repeat!important;
	background-position: center center!important;
	background-size: 12px 12px!important;
	box-sizing: border-box!important
}

.yCloseIcon.left {
	left: 513px!important
}

.yCloseIcon.right {
	right: 513px!important
}

.yWidgetShow {
	animation-duration: .4s!important
}

.yWidgetShow.right {
	right: 0!important;
	animation-name: slideinRight!important
}

.yWidgetShow.left {
	left: 0!important;
	animation-name: slideinLeft!important
}

.yWidgetHide {
	animation-duration: .4s!important
}

.yWidgetHide.right {
	right: -500px!important;
	animation-name: slideoutRight!important
}

.yWidgetHide.left {
	left: -500px!important;
	animation-name: slideoutLeft!important
}

@keyframes slideinRight {
	from {
		right: -500px
	}
	to {
		right: 0
	}
}

@-webkit-keyframes slideinRight {
	from {
		right: -500px
	}
	to {
		right: 0
	}
}

@-moz-keyframes slideinRight {
	from {
		right: -500px
	}
	to {
		right: 0
	}
}

@-o-keyframes slideinRight {
	from {
		right: -500px
	}
	to {
		right: 0
	}
}

@keyframes slideinLeft {
	from {
		left: -500px
	}
	to {
		left: 0
	}
}

@-webkit-keyframes slideinLeft {
	from {
		left: -500px
	}
	to {
		left: 0
	}
}

@-moz-keyframes slideinLeft {
	from {
		left: -500px
	}
	to {
		left: 0
	}
}

@-o-keyframes slideinLeft {
	from {
		left: -500px
	}
	to {
		left: 0
	}
}

@keyframes slideoutRight {
	from {
		right: 0
	}
	to {
		right: -500px
	}
}

@-webkit-keyframes slideoutRight {
	from {
		right: 0
	}
	to {
		right: -500px
	}
}

@-moz-keyframes slideoutRight {
	from {
		right: 0
	}
	to {
		right: -500px
	}
}

@-o-keyframes slideoutRight {
	from {
		right: 0
	}
	to {
		right: -500px
	}
}

@keyframes slideoutLeft {
	from {
		left: 0
	}
	to {
		left: -500px
	}
}

@-webkit-keyframes slideoutLeft {
	from {
		left: 0
	}
	to {
		left: -500px
	}
}

@-moz-keyframes slideoutLeft {
	from {
		left: 0
	}
	to {
		left: -400px
	}
}

@-o-keyframes slideoutLeft {
	from {
		left: 0
	}
	to {
		left: -500px
	}
}

@-webkit-keyframes wave-stroke {
	100% {
		width: 200%;
		height: 200%;
		border-color: transparent;
		opacity: 0
	}
}

@-moz-keyframes wave-stroke {
	100% {
		width: 200%;
		height: 200%;
		border-color: transparent;
		opacity: 0
	}
}

@-o-keyframes wave-stroke {
	100% {
		width: 200%;
		height: 200%;
		border-color: transparent;
		opacity: 0
	}
}

@keyframes wave-stroke {
	100% {
		width: 200%;
		height: 200%;
		border-color: transparent;
		opacity: 0
	}
}