.dev-share-buttons,
.dev-share-buttons-profiles {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	margin: -0.15em;
}

.dev-share-buttons__item,
.dev-share-buttons-link {
	position: relative;
	display: inline-block;
	flex-grow: 1;
	font-size: 1em;
	font-weight: bold;
	text-decoration: none;
	text-align: left;
	margin: .15em;
	background-color: #222;
	background-repeat: no-repeat;
	background-position: .5em center;
	background-size: 1.2em auto;
	color: #f8f8f8;
	padding: .5em;
	line-height: 1.2;
	border: none;
	border-radius: 3px;
	transition: background .2s, color .2s;
}

.dev-share-buttons__item {
	max-width: 16em;
}

.dev-share-buttons-link {
	max-width: 12em;
}

.dev-share-buttons__item:hover,
.dev-share-buttons__item:focus,
.dev-share-buttons__item:active,
.dev-share-buttons-link:hover,
.dev-share-buttons-link:focus,
.dev-share-buttons-link:active {
	border: none;
	background-color: #000;
	color: #fff;
}

.dev-share-buttons__item--facebook,
.dev-share-buttons-link--facebook {
	padding-left: 2.2em;
	background-color: #3b5998;
	background-image: url(./svgs/facebook.svg);
}

.dev-share-buttons__item--facebook:hover,
.dev-share-buttons-link--facebook:hover,
.dev-share-buttons__item--facebook:focus,
.dev-share-buttons-link--facebook:focus,
.dev-share-buttons__item--facebook:active,
.dev-share-buttons-link--facebook:active {
	background-color: #22407F;
}

.dev-share-buttons__item--twitter,
.dev-share-buttons-link--twitter {
	padding-left: 2.2em;
	background-color: #00aced;
	background-image: url(./svgs/twitter.svg);
}

.dev-share-buttons__item--twitter:hover,
.dev-share-buttons-link--twitter:hover,
.dev-share-buttons__item--twitter:focus,
.dev-share-buttons-link--twitter:focus,
.dev-share-buttons__item--twitter:active,
.dev-share-buttons-link--twitter:active {
	background-color: #0093D4;
}

.dev-share-buttons__item--google,
.dev-share-buttons-link--google {
	padding-left: 2.2em;
	background-color: #dd4b39;
	background-image: url(./svgs/google.svg);
}

.dev-share-buttons__item--google:hover,
.dev-share-buttons-link--google:hover,
.dev-share-buttons__item--google:focus,
.dev-share-buttons-link--google:focus,
.dev-share-buttons__item--google:active,
.dev-share-buttons-link--google:active {
	background-color: #C43220;
}

.dev-share-buttons__item--linkedin,
.dev-share-buttons-link--linkedin {
	padding-left: 2.2em;
	background-color: #007bb6;
	background-image: url(./svgs/linkedin.svg);
}

.dev-share-buttons__item--linkedin:hover,
.dev-share-buttons-link--linkedin:hover,
.dev-share-buttons__item--linkedin:focus,
.dev-share-buttons-link--linkedin:focus,
.dev-share-buttons__item--linkedin:active,
.dev-share-buttons-link--linkedin:active {
	background-color: #00629D;
}

.dev-share-buttons__item--youtube,
.dev-share-buttons-link--youtube {
	padding-left: 2.2em;
	background-color: #bb0000;
	background-image: url(./svgs/youtube.svg);
}

.dev-share-buttons__item--youtube:hover,
.dev-share-buttons-link--youtube:hover,
.dev-share-buttons__item--youtube:focus,
.dev-share-buttons-link--youtube:focus,
.dev-share-buttons__item--youtube:active,
.dev-share-buttons-link--youtube:active {
	background-color: #A20000;
}

.dev-share-buttons__item--instagram,
.dev-share-buttons-link--instagram {
	padding-left: 2.2em;
	background-color: #ee583f;
	background-position: .5em center, center center;
	background-size: 1.2em auto, cover;
	background-image: url(./svgs/instagram.svg);
	background-image: url(./svgs/instagram.svg), -webkit-radial-gradient(70% 70% ellipse,#ee583f 8%,#d92d77 42%,#bd3381 58%);
    background-image: url(./svgs/instagram.svg), radial-gradient(ellipse at 70% 70%,#ee583f 8%,#d92d77 42%,#bd3381 58%);
}

.dev-share-buttons__item--instagram:hover,
.dev-share-buttons-link--instagram:hover,
.dev-share-buttons__item--instagram:focus,
.dev-share-buttons-link--instagram:focus,
.dev-share-buttons__item--instagram:active,
.dev-share-buttons-link--instagram:active {
	background-color: #D53F26;
	background-image: url(./svgs/instagram.svg), -webkit-radial-gradient(70% 70% ellipse,#D53F26 8%,#C0145E 42%,#A41A68 58%);
    background-image: url(./svgs/instagram.svg), radial-gradient(ellipse at 70% 70%,#D53F26 8%,#C0145E 42%,#A41A68 58%);
}

.dev-share-buttons__item--pinterest,
.dev-share-buttons-link--pinterest {
	padding-left: 2.2em;
	background-color: #cb2027;
	background-image: url(./svgs/pinterest.svg);
}

.dev-share-buttons__item--pinterest:hover,
.dev-share-buttons-link--pinterest:hover,
.dev-share-buttons__item--pinterest:focus,
.dev-share-buttons-link--pinterest:focus,
.dev-share-buttons__item--pinterest:active,
.dev-share-buttons-link--pinterest:active {
	background-color: #B2070E;
}

.dev-share-buttons__item--github,
.dev-share-buttons-link--github {
	padding-left: 2.2em;
	background-color: #171516;
	background-image: url(./svgs/github.svg);
}

.dev-share-buttons__item--github:hover,
.dev-share-buttons-link--github:hover,
.dev-share-buttons__item--github:focus,
.dev-share-buttons-link--github:focus,
.dev-share-buttons__item--github:active,
.dev-share-buttons-link--github:active {
	background-color: #000;
}

.dev-share-buttons__item--whatsapp,
.dev-share-buttons-link--whatsapp {
	padding-left: 2.2em;
	background-color: #64D448;
	background-image: url(./svgs/whatsapp.svg);
}

.dev-share-buttons__item--whatsapp:hover,
.dev-share-buttons-link--whatsapp:hover,
.dev-share-buttons__item--whatsapp:focus,
.dev-share-buttons-link--whatsapp:focus,
.dev-share-buttons__item--whatsapp:active,
.dev-share-buttons-link--whatsapp:active {
	background-color: #4BBB2F;
}

.dev-share-buttons__item--snapchat,
.dev-share-buttons-link--snapchat {
	padding-left: 2.2em;
	background-color: #FFFA37;
	color: #222;
	background-image: url(./svgs/snapchat.svg);
}

.dev-share-buttons__item--snapchat:hover,
.dev-share-buttons-link--snapchat:hover,
.dev-share-buttons__item--snapchat:focus,
.dev-share-buttons-link--snapchat:focus,
.dev-share-buttons__item--snapchat:active,
.dev-share-buttons-link--snapchat:active {
	background-color: #E6E11E;
	color: #000;
}

.dev-share-buttons__item--skype,
.dev-share-buttons-link--skype {
	padding-left: 2.2em;
	background-color: #00AFF0;
	background-image: url(./svgs/skype.svg);
}

.dev-share-buttons__item--skype:hover,
.dev-share-buttons-link--skype:hover,
.dev-share-buttons__item--skype:focus,
.dev-share-buttons-link--skype:focus,
.dev-share-buttons__item--skype:active,
.dev-share-buttons-link--skype:active {
	background-color: #0096D7;
}

.dev-share-buttons__item--reddit,
.dev-share-buttons-link--reddit {
	padding-left: 2.2em;
	background-color: #ff4500;
	background-image: url(./svgs/reddit.svg);
}

.dev-share-buttons__item--reddit:hover,
.dev-share-buttons-link--reddit:hover,
.dev-share-buttons__item--reddit:focus,
.dev-share-buttons-link--reddit:focus,
.dev-share-buttons__item--reddit:active,
.dev-share-buttons-link--reddit:active {
	background-color: #E62C00;
}

.dev-share-buttons__item--stumbleupon,
.dev-share-buttons-link--stumbleupon {
	padding-left: 2.2em;
	background-color: #eb4924;
	background-image: url(./svgs/stumbleupon.svg);
}

.dev-share-buttons__item--stumbleupon:hover,
.dev-share-buttons-link--stumbleupon:hover,
.dev-share-buttons__item--stumbleupon:focus,
.dev-share-buttons-link--stumbleupon:focus,
.dev-share-buttons__item--stumbleupon:active,
.dev-share-buttons-link--stumbleupon:active {
	background-color: #D2300B;
}

.dev-share-buttons__item--wechat,
.dev-share-buttons-link--wechat {
	padding-left: 2.2em;
	background-color: #7bb32e;
	background-image: url(./svgs/wechat.svg);
}

.dev-share-buttons__item--wechat:hover,
.dev-share-buttons-link--wechat:hover,
.dev-share-buttons__item--wechat:focus,
.dev-share-buttons-link--wechat:focus,
.dev-share-buttons__item--wechat:active,
.dev-share-buttons-link--wechat:active {
	background-color: #629A15;
}

.dev-share-buttons__item--medium,
.dev-share-buttons-link--medium {
	padding-left: 2.2em;
	background-color: #00ab6c;
	background-image: url(./svgs/medium.svg);
}

.dev-share-buttons__item--medium:hover,
.dev-share-buttons-link--medium:hover,
.dev-share-buttons__item--medium:focus,
.dev-share-buttons-link--medium:focus,
.dev-share-buttons__item--medium:active,
.dev-share-buttons-link--medium:active {
	background-color: #009253;
}

.dev-share-buttons__item--messenger,
.dev-share-buttons-link--messenger {
	padding-left: 2.2em;
	background-color: #0084ff;
	background-image: url(./svgs/messenger.svg);
}

.dev-share-buttons__item--messenger:hover,
.dev-share-buttons-link--messenger:hover,
.dev-share-buttons__item--messenger:focus,
.dev-share-buttons-link--messenger:focus,
.dev-share-buttons__item--messenger:active,
.dev-share-buttons-link--messenger:active {
	background-color: #006BE6;
}

.dev-share-buttons__item--share-api {
	padding-left: 2.2em;
	/*background-color: #3b5998;*/
	background-image: url(./svgs/share.svg);
}

