// -------------------------------------------------------------------
// :: SHARES
// -------------------------------------------------------------------

.m-shares {

	@include clearfloat;

	margin-bottom: rem(12px);

	.m-shares__label {
		line-height: 40px;

		@include FLOW-to($tablet) {
			display: none;
		}
	}

	.m-shares__list {
		text-align: center;
		padding: 0;
		letter-spacing: 0;


		@include FLOW-at($tablet) {
			display: inline-block;
			margin: 1rem 0;
		}


		li {
			display: inline-block;
			letter-spacing: 0;
		}

		a {
			text-decoration: none !important;
			display: block;
			width: rem(40px);
			height: rem(40px);
			border: 1px solid $medium;
			border-radius: 50%;
			text-align: center;
			margin-right: 0.7rem;

			span:not([class*='icon-']) {
				display: none;
			}

			span[class*='icon-'] {
				font-size: rem(19px);
				color: inherit;
			}

			&:hover {
				color: $white;
			}
		}
	}

}

$twcolor: #00ABF0;
$fbcolor: #39569A;
$licolor: #007AB8;
$ytcolor: #FF0000;

.m-shares .m-shares__item{

	&.tw {
		a {
			color: $twcolor;
			border-color: $twcolor;

			&:hover {
				color: $white;
				background: $twcolor;
			}
		}
	}

	&.fb {
		a {
			color: $fbcolor;
			border-color: $fbcolor;

			&:hover {
				color: $white;
				background: $fbcolor;
			}
		}
	}

	&.li {
		a {
			color: $licolor;
			border-color: $licolor;

			&:hover {
				color: $white;
				background: $licolor;
			}
		}
	}

	&.yt {
		a {
			color: $ytcolor;
			border-color: $ytcolor;

			&:hover {
				color: $white;
				background: $ytcolor;
			}
		}
	}
}