.phones__dropdown-item.social-item {
  padding: 9px 0 5px 0;
}
.phones__dropdown--top .phones__dropdown-item.social-item {
  padding: 5px 0 9px 0;
}

.social {
  position: relative;
}

.social__title {
	font-weight: 400;
	text-align: center;
	padding: 33px 0 15px 0;
}
.popup .social__title {
  padding-top: 0;
}


.social__items {
  display: flex;
  flex-wrap: wrap;
  margin: -3px -8px;
  padding: 0;
}
.social__items.social__items--grid {
  grid-template-columns: repeat(auto-fit, minmax(48px, 1fr));
  grid-gap: 8px;
  display: grid;
}
.social__items.grid-list--items-4 {
  grid-template-columns: repeat(4, 1fr);
}
.social__items.social__items--md.social__items--grid {
  grid-template-columns: repeat(auto-fit, minmax(40px, 1fr));
  grid-gap: 4px;
}
.social__items .social__item:before,
.main ul.social__items li:before {
  display: none;
}

.social__items .social__item {
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
}
.social__items .social__item span {
  display: none;
}
.social__items .social__link {
  width: 100%;
  min-width: 48px;
  height: 48px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;
  border-radius: var(--border-radius);
}
.social__items.social__items--md .social__link {
  height: 40px;
  min-width: 40px;
}
.social__items {
	--position: 0;
	--svg-size: -24px;

	.social__link:before {
		--icon-size: 20px;
		background: url("../images/svg/social.svg?v=2.4.1") calc(var(--svg-size) * var(--position)) 0 no-repeat;
		content: "";
		display: block !important;
		position: relative;
		height: var(--icon-size);
		width: var(--icon-size);
	}

	.vkontakte 			{--position: 0}
	.odnoklassniki 	{--position: 1}
	.facebook 			{--position: 2}
	.twitter 				{--position: 3}
	.yandex 				{--position: 4}
	.mailru2 				{--position: 5}
	.mymailru 			{--position: 5}
	.openid-mail-ru {--position: 5}
	.yandex-zen 		{--position: 6}
	.telegram 			{--position: 7}
	.whatsapp 			{--position: 8}
	.viber 					{--position: 9}
	.snapchat 			{--position: 10}
	.tenchat 				{--position: 11}
	.linkedin 			{--position: 12}
	.youtube 				{--position: 13}
	.rutube 				{--position: 14}
	.tiktok 				{--position: 15}
	.instagram 			{--position: 16}
	.pinterest 			{--position: 17}
	.acloud 				{--position: 18}
	.aspro-link 		{--position: 18}
	.avito 					{--position: 19}
	.wb 						{--position: 20}
	.ozon 					{--position: 21}
	.google 				{--position: 22}
	.zoom 					{--position: 23}
	.livejournal 		{--position: 24}
	.bitrix24 			{--position: 25}
	.dropbox 				{--position: 27}
	.box 						{--position: 28}
	.office365 			{--position: 29}
	.apple 					{--position: 30}
	.openid 				{--position: 32}
	.liveid 				{--position: 33}
	.liveinternet 	{--position: 33}
	.blogger 				{--position: 34}
}

/* social color */
.social__items--type-color {
  margin: 0px;
  width: 100%;
  background: none;
}
.social__items--type-color .social__link {
  background-color: #f4f4f4;
  background-color: var(--light, #f4f4f4) var(--dark, #343434);
}
.theme-dark .social__items--type-color .social__link,
.footer--color-dark .footer__social .social__link {
  background-color: #474747;
}
.social__items--type-color .social__item {
  padding: 0px;
}

.social__more {
  margin: 0;
}
.social__more-dots {
  display: flex;
  margin: 0 15px;
  padding-bottom: 7px;
  letter-spacing: 1.8px;
  cursor: pointer;
}
.social__more-dots:hover ~ .social__more,
.social__more:hover {
  opacity: 1;
  visibility: visible;
}
.social__more {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.2s ease-in-out, visibility 0.2s ease-in-out;
  position: absolute;
  right: -2px;
  top: 100%;
  background: #fff;
  background: var(--card_bg_black);
  -webkit-box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.15);
  box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  margin-top: 9px;
}
.social__more .social__item {
  padding: 10px 15px;
}
html:not(.mobile) .social__item.hide_on_desktop {
  display: none;
}
html.mobile .social__item.hide_on_mobile {
  display: none;
}


/* soc-avt socials, soc-serv-accounts */
.soc-avt .row a {
  display: inline-block;
  vertical-align: top;
  zoom: 1;
  padding: 0px;
  margin: 0px;
}
.soc-avt .row a i {
  display: block;  
  width: 100%;
  height: 100%;
  background: url(../images/svg/social.svg) -2px -190px no-repeat;
}
.soc-avt .row a:hover {
  opacity: 0.8;
}
.soc-avt .row a {
  display: inline-block;
}

#bx_auth_servform .form-control {
  margin: 10px 0px;
}
