/*--------------------------------------------------------------
# Social Links Widget
--------------------------------------------------------------*/

:root {
	--flext-widget-social-icon-color: #5c5c5c;
}

.flext-social-icons-widget {
	overflow: hidden;
}

.flext-social-icons {
	align-items: center;
	display: flex;
	gap: 1rem 2rem;
	flex-flow: row wrap;
}

.flext-social-icons.flext-align-center {
	justify-content: center;
}

.flext-social-icons.flext-align-right {
	justify-content: flex-end;
}

.flext-social-icons.flext-align-left {
	justify-content: flex-start;
}

.flext-social-icons a {
	outline: none;
	transition: color 0.3s ease-out, background-color 0.3s ease-out;
}

.flext-social-icons .flext-link-500px,
.flext-social-icons .flext-link-github {
	--flext-widget-social-icon-color: #5c5c5c;
}

.flext-social-icons .flext-link-android {
	--flext-widget-social-icon-color: #9fc036;
}

.flext-social-icons .flext-link-apple,
.flext-social-icons .flext-link-digg {
	--flext-widget-social-icon-color: #808080;
}

.flext-social-icons .flext-link-behance {
	--flext-widget-social-icon-color: #316bf6;
}

.flext-social-icons .flext-link-bitbucket {
	--flext-widget-social-icon-color: #2784ff;
}

.flext-social-icons .flext-link-codepen {
	--flext-widget-social-icon-color: #acacac;
}

.flext-social-icons .flext-link-deviantart {
	--flext-widget-social-icon-color: #83fa4d;
}

.flext-social-icons .flext-link-discord {
	--flext-widget-social-icon-color: #7189d9;
}

.flext-social-icons .flext-link-dribbble {
	--flext-widget-social-icon-color: #d85a88;
}

.flext-social-icons .flext-link-dropbox {
	--flext-widget-social-icon-color: #2562f5;
}

.flext-social-icons .flext-link-facebook {
	--flext-widget-social-icon-color: #4a67ad;
}

.flext-social-icons .flext-link-flickr {
	--flext-widget-social-icon-color: #ea3783;
}

.flext-social-icons .flext-link-foursquare {
	--flext-widget-social-icon-color: #e74974;
}

.flext-social-icons .flext-link-gitlab {
	--flext-widget-social-icon-color: #f46a25;
}

.flext-social-icons .flext-link-houzz {
	--flext-widget-social-icon-color: #4ab615;
}

.flext-social-icons .flext-link-instagram {
	--flext-widget-social-icon-color: #cb3f7a;
}

.flext-social-icons .flext-link-jsfiddle {
	--flext-widget-social-icon-color: #2d69eb;
}

.flext-social-icons .flext-link-line {
	--flext-widget-social-icon-color: #40bf03;
}

.flext-social-icons .flext-link-linkedin {
	--flext-widget-social-icon-color: #0c63bc;
}

.flext-social-icons .flext-link-mail {
	--flext-widget-social-icon-color: #7258e2;
}

.flext-social-icons .flext-link-medium {
	--flext-widget-social-icon-color: #00de68;
}

.flext-social-icons .flext-link-meetup {
	--flext-widget-social-icon-color: #f11a43;
}

.flext-social-icons .flext-link-ok {
	--flext-widget-social-icon-color: #ed7e1e;
}

.flext-social-icons .flext-link-pinterest {
	--flext-widget-social-icon-color: #ad2725;
}

.flext-social-icons .flext-link-phone {
	--flext-widget-social-icon-color: #e0950b;
}

.flext-social-icons .flext-link-reddit {
	--flext-widget-social-icon-color: #f74300;
}

.flext-social-icons .flext-link-rss {
	--flext-widget-social-icon-color: #ed8030;
}

.flext-social-icons .flext-link-skype {
	--flext-widget-social-icon-color: #4be7e5;
}

.flext-social-icons .flext-link-snapchat {
	--flext-widget-social-icon-color: #f3dd05;
}

.flext-social-icons .flext-link-spotify {
	--flext-widget-social-icon-color: #20b14f;
}

.flext-social-icons .flext-link-soundcloud {
	--flext-widget-social-icon-color: #df582b;
}

.flext-social-icons .flext-link-steam {
	--flext-widget-social-icon-color: #2f3a40;
}

.flext-social-icons .flext-link-strava {
	--flext-widget-social-icon-color: #fd6c25;
}

.flext-social-icons .flext-link-telegram {
	--flext-widget-social-icon-color: #25a4e2;
}

.flext-social-icons .flext-link-tiktok {
	--flext-widget-social-icon-color: #f7004d;
}

.flext-social-icons .flext-link-thumbtack {
	--flext-widget-social-icon-color: #01a0d9;
}

.flext-social-icons .flext-link-tripadvisor {
	--flext-widget-social-icon-color: #33d99c;
}

.flext-social-icons .flext-link-twitch {
	--flext-widget-social-icon-color: #8c44f7;
}

.flext-social-icons .flext-link-tumblr {
	--flext-widget-social-icon-color: #365972;
}

.flext-social-icons .flext-link-twitter {
	--flext-widget-social-icon-color: #4caae7;
}

.flext-social-icons .flext-link-vimeo {
	--flext-widget-social-icon-color: #54b4e5;
}

.flext-social-icons .flext-link-vk {
	--flext-widget-social-icon-color: #597dae;
}

.flext-social-icons .flext-link-yahoo {
	--flext-widget-social-icon-color: #4318b9;
}

.flext-social-icons .flext-link-youtube {
	--flext-widget-social-icon-color: #e93522;
}

.flext-social-icons .flext-link-viber {
	--flext-widget-social-icon-color: #7a4d9b;
}

.flext-social-icons .flext-link-whatsapp {
	--flext-widget-social-icon-color: #48a91f;
}

.flext-social-icons .flext-link-wechat {
	--flext-widget-social-icon-color: #2fbb01;
}

.flext-social-icons .flext-link-website {
	--flext-widget-social-icon-color: #6822e9;
}

.flext-social-icons .flext-link-weibo {
	--flext-widget-social-icon-color: #ce2a2a;
}

.flext-social-icons .flext-link-yelp {
	--flext-widget-social-icon-color: #ae282d;
}

.flext-social-icons .flext-link-xing {
	--flext-widget-social-icon-color: #005d61;
}

.flext-social-icons a:hover {
	color: var(--flext-widget-social-icon-color);
}

.flext-social-icons.flext-style-names a {
	color: inherit;
	position: relative;
	z-index: 1;
}

.flext-social-icons.flext-style-names a::before {
	background: var(--flext-widget-social-icon-color);
	bottom: 0.5rem;
	content: "";
	display: inline-block;
	height: 1rem;
	left: 0;
	opacity: 0.7;
	position: absolute;
	top: 50%;
	transform: scaleX(0) translateY(-50%);
	transform-origin: right center;
	transition: transform 0.5s cubic-bezier(0.23, 0.46, 0.35, 0.99);
	width: 100%;
	z-index: -1;
}

.flext-social-icons.flext-style-names a:hover::before {
	transform: scaleX(1) translateY(-50%);
	transform-origin: left center;
	transition: transform 0.35s cubic-bezier(0.23, 0.46, 0.35, 0.99);
}

.flext-social-icons.flext-style-circle {
	gap: 1rem;
}

.flext-social-icons.flext-style-circle a {
	align-items: center;
	background: rgba(0, 0, 0, 0.04);
	border-radius: 50%;
	display: flex;
	justify-content: center;
	height: 4rem;
	line-height: 4rem;
	width: 4rem;
}

.flext-social-icons.flext-style-circle a:hover {
	background: var(--flext-widget-social-icon-color);
	color: #fff;
}