.messengers .button {
	margin-bottom: 10px;
}

.soc_widget .button {
	cursor: pointer;
	position: relative;
	/*position: absolute;
	right: 0;
	bottom: -240px;*/
}

	.soc_widget .button a {
		display: block;
	}

.soc_widget .icon {
	width: 50px;
	height: 50px;
}

#trigger .icon {
	background-color: #2196F3;
	background-size: 100%;
}

#trigger:hover .icon {
	background-image: url("/icon_mnogotochka.svg") !important;
	background-size: 20px !important;
}

#trigger.act .icon {
	background-image: url("/icon_mnogotochka.svg") !important;
	background-size: 20px !important;
}

#call,
#chat,
#trigger,
#messengers {
	position: relative;
	display: inline-block;
	vertical-align: middle;
	letter-spacing: normal;
}

	#call .icon,
	#chat .icon,
	#trigger .icon,
	#messengers .icon {
		background-size: 26px 25px;
		background-repeat: no-repeat;
		background-position: center;
	}

	#call .icon {
		background-image: url("/call.svg");
	}

	#chat .icon {
		background-image: url("/chat.svg");
	}

	#trigger .icon,
	#messengers .icon {
		background-size: 100%;
	}

	#trigger.act .icon,
	#messengers.act .icon {
		background-size: 100%;
	}

	#trigger .icon {
		transition: background-color .5s ease;
	}

.messengers {
	position: absolute;
	right: 0;
	top: -300px;
}

	.messengers .button {
		border-radius: 50%;
	}

	.messengers.inactive {
		display: none;
	}

	.messengers > div:hover .hint {
		display: block;
	}

	.messengers .hint {
		position: absolute;
		top: calc(50% - 12px);
		right: 62px;
		display: block;
		white-space: nowrap;
		width: auto;
		box-shadow: 0 0 20px rgba(96, 125, 139, 0.4);
		height: 24px;
		line-height: 24px;
		padding: 0 8px;
		border-radius: 3px;
		font-size: 14px;
		color: #5A6D7B;
		font-weight: 300;
		background-color: white;
		display: none;
	}

		.messengers .hint:after {
			left: 100%;
			top: calc(50% - 4px);
			border: solid transparent;
			content: " ";
			height: 0;
			width: 0;
			position: absolute;
			pointer-events: none;
			border-color: transparent;
			border-left-color: white;
			border-width: 5px;
			margin-left: 0;
			z-index: 10;
		}

.userinactivity {
	background: white;
	position: absolute;
	top: 0;
	left: 0;
	min-width: 184px;
	height: 50px;
	border-left-style: solid;
	border-left-width: 4px;
	border-left-color: transparent;
	font-size: 14px;
	line-height: 50px;
	text-align: center;
	color: #263238;
	cursor: pointer;
	display: none;
}

	.userinactivity.hidden {
		display: none;
	}

	.userinactivity.act {
		background-color: white;
		z-index: 1;
	}

	.userinactivity.viewed {
		display: none;
	}

.soc_widget.h {
	display: none;
}

.soc_widget {
	opacity: 1;
	transition: opacity 1s ease;
	position: fixed;
	bottom: 20px;
	right: 20px;
	box-shadow: 0 0 10px rgba(96, 125, 139, 0.5);
	z-index: 999;
	border-radius: 5px;
}

	.soc_widget .triggers .trg:first-of-type, .soc_widget .triggers .trg:first-of-type .icon {
		border-top-left-radius: 5px;
		border-bottom-left-radius: 5px;
	}

	.soc_widget .triggers .trg:last-of-type, .soc_widget .triggers .trg:last-of-type .icon {
		border-top-right-radius: 5px;
		border-bottom-right-radius: 5px;
	}

	.soc_widget.brright {
		border-top-right-radius: 5px;
		border-bottom-right-radius: 5px;
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
	}

		.soc_widget.brright .triggers .trg:first-of-type,
		.soc_widget.brright .triggers:first-of-type .icon {
			border-top-left-radius: 0;
			border-bottom-left-radius: 0;
		}

		.soc_widget.brright .triggers .trg:last-of-type,
		.soc_widget.brright .triggers:last-of-type .icon {
			border-top-right-radius: 5px;
			border-bottom-right-radius: 5px;
		}

	.soc_widget .inner {
		width: 150px;
		transition: all 0.5s ease;
		position: relative;
	}

.triggers {
	position: relative;
	height: 50px;
	text-align: right;
	letter-spacing: -0.3em;
}

	.triggers.lonely > div .icon {
		border-radius: 4px;
	}

	.triggers.multiple > div:first-of-type .icon,
	.triggers.double > div:first-of-type .icon {
		border-radius: 4px 0 0 4px;
	}

	.triggers.multiple > div:last-of-type .icon,
	.triggers.double > div:last-of-type .icon {
		border-radius: 0 4px 4px 0;
	}

	.triggers > div:hover .hint {
		display: block;
	}

	.triggers .icon:hover {
		cursor: pointer;
		opacity: 0.9;
	}

	.triggers .hint {
		font-size: 12px;
		position: absolute;
		top: -35px;
		right: 0;
		display: block;
		white-space: nowrap;
		width: auto;
		box-shadow: 0 0 20px rgba(96, 125, 139, 0.5);
		height: 24px;
		line-height: 24px;
		padding: 0 8px;
		border-radius: 3px;
		color: #5A6D7B;
		font-weight: 300;
		background-color: white;
		display: none;
	}

		.triggers .hint.sel {
			display: block;
		}

		.triggers .hint:after {
			top: 100%;
			left: calc(100% - 20px);
			border: solid transparent;
			content: " ";
			height: 0;
			width: 0;
			position: absolute;
			pointer-events: none;
			border-color: transparent;
			border-top-color: white;
			border-width: 5px;
			margin-left: 0px;
		}

/* Modal Base CSS */
.scotch-overlay {
	position: fixed;
	z-index: 9998;
	top: 0;
	left: 0;
	opacity: 0;
	width: 100%;
	height: 100%;
	-webkit-transition: 1ms opacity ease;
	-moz-transition: 1ms opacity ease;
	-ms-transition: 1ms opacity ease;
	-o-transition: 1ms opacity ease;
	transition: 1ms opacity ease;
	background: rgba(0, 0, 0, 0.6);
}

.scotch-modal {
	position: absolute;
	z-index: 9999;
	top: 50%;
	left: 50%;
	opacity: 0;
	width: 94%;
	padding: 24px 20px;
	-webkit-transition: 1ms opacity ease;
	-moz-transition: 1ms opacity ease;
	-ms-transition: 1ms opacity ease;
	-o-transition: 1ms opacity ease;
	transition: 1ms opacity ease;
	-webkit-transform: translate(-50%, -50%);
	-moz-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	-o-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	border-radius: 2px;
	background: #fff;
}

	.scotch-modal.scotch-open.scotch-anchored {
		top: 20px;
		-webkit-transform: translate(-50%, 0);
		-moz-transform: translate(-50%, 0);
		-ms-transform: translate(-50%, 0);
		-o-transform: translate(-50%, 0);
		transform: translate(-50%, 0);
	}

	.scotch-modal.scotch-open {
		opacity: 1;
	}

.scotch-overlay.scotch-open {
	opacity: 1;
}

/* Close Button */
.scotch-close {
	font-family: Helvetica, Arial, sans-serif;
	font-size: 24px;
	font-weight: 700;
	line-height: 12px;
	position: absolute;
	top: 5px;
	right: 5px;
	padding: 5px 7px 7px;
	cursor: pointer;
	color: #fff;
	border: 0;
	outline: none;
	background: #e74c3c;
}

	.scotch-close:hover {
		background: #c0392b;
	}

.scotch-overlay.fade-and-drop {
	display: block;
	opacity: 0;
}

.scotch-modal.fade-and-drop {
	top: -300%;
	opacity: 1;
	display: block;
}

	.scotch-modal.fade-and-drop.scotch-open {
		top: 50%;
		-webkit-transition: 500ms top 500ms ease;
		-moz-transition: 500ms top 500ms ease;
		-ms-transition: 500ms top 500ms ease;
		-o-transition: 500ms top 500ms ease;
		transition: 500ms top 500ms ease;
	}

		.scotch-modal.fade-and-drop.scotch-open.scotch-anchored {
			-webkit-transition: 500ms top 500ms ease;
			-moz-transition: 500ms top 500ms ease;
			-ms-transition: 500ms top 500ms ease;
			-o-transition: 500ms top 500ms ease;
			transition: 500ms top 500ms ease;
		}

.scotch-overlay.fade-and-drop.scotch-open {
	top: 0;
	-webkit-transition: 500ms opacity ease;
	-moz-transition: 500ms opacity ease;
	-ms-transition: 500ms opacity ease;
	-o-transition: 500ms opacity ease;
	transition: 500ms opacity ease;
	opacity: 1;
}

.scotch-modal.fade-and-drop {
	-webkit-transition: 500ms top ease;
	-moz-transition: 500ms top ease;
	-ms-transition: 500ms top ease;
	-o-transition: 500ms top ease;
	transition: 500ms top ease;
}

.scotch-overlay.fade-and-drop {
	-webkit-transition: 500ms opacity 500ms ease;
	-moz-transition: 500ms opacity 500ms ease;
	-ms-transition: 500ms opacity 500ms ease;
	-o-transition: 500ms opacity 500ms ease;
	transition: 500ms opacity 500ms ease;
}

#content {
	display: none;
}

.trigger-button {
	font-size: 17px;
	position: relative;
	top: 100px;
	display: block;
	margin: auto;
	padding: 10px 30px;
	cursor: pointer;
	color: #fff;
	border: 0;
	border-radius: 3px;
	outline: none;
	background: #2ecc71;
	box-shadow: 0 5px 1px #27ae60;
}

	.trigger-button:hover {
		background: #27ae60;
		box-shadow: 0 5px 1px #145b32;
	}

	.trigger-button:active {
		border-top: 5px solid white;
		box-shadow: none;
	}

.soc_widget .wrapper {
	margin: 30px auto;
	width: 80%;
	font-family: sans-serif;
	color: #555;
	font-size: 14px;
	line-height: 24px;
}

	.soc_widget .wrapper h2 {
		margin-top: 15px;
		clear: both;
	}

.soc_widget h1 {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
	text-transform: uppercase;
}

	.soc_widget h1 + p {
		text-align: center;
		margin: 20px 0;
		font-size: 16px;
	}

.soc_widget .tabs {
	height: 66px;
	padding: 0;
}

	.soc_widget .tabs li {
		float: left;
		width: 20%;
		list-style: none;
	}

	.soc_widget .tabs a {
		display: block;
		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		color: #888;
		padding: 20px 0;
		border-bottom: 2px solid #888;
		background: #f7f7f7;
	}

		.soc_widget .tabs a:hover,
		.soc_widget .tabs a.active {
			background: #ddd;
		}

div#soc_widget.iPhone,
div#soc_widget.Android,
div#soc_widget.BlackBerry {
	left: 0;
	right: 0;
	bottom: 0;
	width: 100% !important;
}

	div#soc_widget.iPhone .messengers,
	div#soc_widget.Android .messengers,
	div#soc_widget.BlackBerry .messengers {
		position: absolute;
		bottom: 50px;
	}

		div#soc_widget.iPhone .messengers .button,
		div#soc_widget.Android .messengers .button,
		div#soc_widget.BlackBerry .messengers .button {
			display: inline-block;
			vertical-align: middle;
			margin-top: 20px;
			margin-left: 20px;
		}

	div#soc_widget.iPhone .triggers .icon,
	div#soc_widget.Android .triggers .icon,
	div#soc_widget.BlackBerry .triggers .icon {
		border-radius: 0;
	}

	div#soc_widget.iPhone #messengers,
	div#soc_widget.Android #messengers,
	div#soc_widget.BlackBerry #messengers {
		float: none;
		width: 100%;
	}

		div#soc_widget.iPhone #messengers .icon,
		div#soc_widget.Android #messengers .icon,
		div#soc_widget.BlackBerry #messengers .icon {
			width: 100%;
			background-size: 20px;
			background-image: url("/arrow.png");
		}

	div#soc_widget.iPhone #call,
	div#soc_widget.Android #call,
	div#soc_widget.BlackBerry #call,
	div#soc_widget.iPhone #chat,
	div#soc_widget.Android #chat,
	div#soc_widget.BlackBerry #chat {
		width: 50%;
	}

		div#soc_widget.iPhone #call .icon,
		div#soc_widget.Android #call .icon,
		div#soc_widget.BlackBerry #call .icon,
		div#soc_widget.iPhone #chat .icon,
		div#soc_widget.Android #chat .icon,
		div#soc_widget.BlackBerry #chat .icon {
			width: 100%;
			height: 50px;
		}

@media only screen and (min-device-width: 320px) and (max-device-width: 568px) and (orientation: portrait) {
	#admin {
		display: none;
	}
}

/*div.iPhone, div.Android {
	.mobileTrigger {
		display: block;
	}

	&#soc_widget {
		.messengers {
			display: block;
			left: auto;
			bottom: -150px;
			top: auto;
			right: auto;
			margin-left: 2vw;

			.button {
				margin-top: 80px;
				margin-left: 80px;
				margin-bottom: 80px;
			}

			.icon {
				width: 135px;
				height: 135px;
			}
		}
	}
}*/
/*body.phoneActive {
	#box {
		opacity: 0;
	}

	background: white;

	.mobileTrigger {
		top: -430px;
	}

	#soc_widget .messengers {
		bottom: 128px;
	}
}*/
.mobileFixedWall {
	display: none;
	position: fixed;
	background: white;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 888;
	transition: all 1s ease;
}

	.mobileFixedWall + .soc_widget {
		z-index: 999;
	}

.mobileTrigger {
	color: white;
	background-color: #2196F3;
	/*background-image: url('/Images/widget/ico_what.svg');
	background-repeat: no-repeat;
	background-size: 55px;
	background-position: 222px 33px;*/
	width: 100%;
	height: 40px;
	font-size: 14px;
	font-weight: 300;
	line-height: 40px;
	border: none;
	text-align: center;
	position: absolute;
	bottom: 0;
	left: 0;
	transition: bottom 0.3s ease;
	/*&:before {
		content: '';
		background: url('../../Partial/ppk.png');
		background-repeat: no-repeat;
		width: 355px;
		height: 430px;
		position: absolute;
		bottom: 20px;

  }*/
}

.iPhone, .Android {
	box-shadow: none;
	background-color: white;
	border-radius: 0 !important;
}

	.iPhone .userinactivity, .Android .userinactivity {
		display: none !important;
	}

	.iPhone .inner, .Android .inner {
		width: 100% !important;
	}

	.iPhone .hint, .Android .hint {
		/* display: none !important;  */
	}

	.iPhone #call .icon,
	.Android #call .icon {
		width: 200px !important;
		background-position: 30px 5px;
		background-size: 25px !important;
	}

	.iPhone #call,
	.Android #call {
		background: #F9A825 !important;
	}

		.iPhone #call .icon .hint,
		.Android #call .icon .hint {
			display: block;
			position: static;
			background: none;
			color: #fff;
			box-shadow: none;
			font-size: 14px;
			width: 200px;
			font-weight: 300;
			line-height: 33px;
			text-indent: 40px;
		}

	.iPhone .mobileTrigger.sel,
	.Android .mobileTrigger.sel {
		background-image: url('/triggerclose.png');
		background-repeat: no-repeat;
		background-position: 96% center;
	}

	.iPhone .triggers, .Android .triggers {
		text-align: center;
	}

	.iPhone #call, .Android #call {
		width: auto !important;
		display: inline-block;
		border-radius: 30px;
	}

	.iPhone .inner, .Android .inner {
	}

	.iPhone .messengers, .Android .messengers {
		position: static !important;
		bottom: 60px !important;
		padding: 20px;
		text-align: center;
	}

		.iPhone .messengers .button, .Android .messengers .button {
			margin: 0 20px 0 0 !important;
			padding: 0 !important;
		}

			.iPhone .messengers .button:last-of-type, .Android .messengers .button:last-of-type {
				margin-right: 0 !important;
			}

/* .iPhone, .Android {
  box-shadow: none;
  background-color: white; }
  .iPhone .userinactivity, .Android .userinactivity {
    display: none !important; }
  .iPhone .inner, .Android .inner {
    width: 100% !important; }
  .iPhone .hint, .Android .hint {
    display: none !important; }
  .iPhone .triggers, .Android .triggers {
    text-align: center; }
  .iPhone #call, .Android #call {
    width: 100% !important; }
  .iPhone .messengers, .Android .messengers {
    position: static !important;
    bottom: 60px !important;
    padding: 20px;
    text-align: center; }
    .iPhone .messengers .button, .Android .messengers .button {
      margin: 0 20px 0 0 !important;
      padding: 0 !important; }
      .iPhone .messengers .button:last-of-type, .Android .messengers .button:last-of-type {
        margin-right: 0 !important; } */