.ube-social-icons{
	@include d-inline-flex();
	@include flex-wrap();
	padding-left: 0;
	margin-bottom: 0;
	list-style: none;
	a{
		color: inherit;
		width: 100%;
		height: 100%;
		@include transition(.3s);
		border-radius: inherit;
		&:hover{
			color: inherit;
		}
	}
	li{
		@include d-flex();
		@include align-items-center();
		@include justify-content-center();
		background-color: var(--e-global-color-accent);
		&:hover{
			-webkit-filter: brightness(1.2);
			filter: brightness(1.2);
		}
		+ li {
			margin-left: 10px;
		}
	}
}

li.ube-social-facebook{
	background-color: #3b5998;
	&.ube-social-outline{
		color:#3b5998;
	}
}
li.ube-social-twitter {
	background-color: #1DA1F2;
	&.ube-social-outline{
		color:#1DA1F2;
	}
}
li.ube-social-linkedin{
	background-color: #cd201f;
	&.ube-social-outline{
		color:#cd201f;
	}
}
li.ube-social-tumblr{
	background-color: #61CE70;
	&.ube-social-outline{
		color:#61CE70;
	}
}
li.ube-social-skype{
	background-color: #313B69;
	&.ube-social-outline{
		color:#313B69;
	}
}
li.ube-social-pinterest{
	background-color: #4054B2;
	&.ube-social-outline{
		color:#4054B2;
	}
}
li.ube-social-whatsapp{
	background-color: #CC8383;
	&.ube-social-outline{
		color:#CC8383;
	}
}
.ube-social-text,
.ube-social-classic{
	li{
		background-color: transparent;
		+ li{
			margin-left: 1em;
		}
	}
}

.ube-social-rounded li{
	@include border-radius(10%);
}
.ube-social-circle li{
	@include border-radius(50%);
}
.ube-social-rounded,
.ube-social-circle,
.ube-social-square {
	li{
		width: 2.5em;
		height: 2.5em;
		&:not(.ube-social-outline) {
			color: var(--e-global-color-primary-foreground);
		}
	}
}
.ube-text-social{
	padding-left: 5px;
}
.ube-social-icon-icon{
	@include d-flex();
	@include align-items-center();
	@include justify-content-center();
}

.ube-social-outline{
	color: var(--e-global-color-accent);
	border: solid 1px currentColor;
	background-color: transparent !important;
	&:hover {
		background-color: currentColor !important;
		i,svg {
			color: var(--e-global-color-primary-foreground);
		}
	}
}
.ube-social-xs {
	font-size: 0.875em;
}
.ube-social-sm {
	font-size: 1em;
}
.ube-social-md {
	font-size: 1.25em;
}
.ube-social-lg {
	font-size: 1.5em;
}
.ube-social-xl {
	font-size: 2em;
}