<div id="snippet-pc-56-content">
	<div class="m-social-icons m-social-icons--inline">
		<ul class="m-social-icons__list">
			<li class="m-social-icons__item">
				<a href="#" class="m-social-icons__link" target="_blank">
					<i class="icon-twitter" aria-hidden="true"></i>
				</a>
				<!-- Skip the closing tag -->
			<li class="m-social-icons__item">
				<a href="#" class="m-social-icons__link" target="_blank">
					<i class="icon-facebook" aria-hidden="true"></i>
				</a>
				<!-- Skip the closing tag -->
			<li class="m-social-icons__item">
				<a href="#" class="m-social-icons__link" target="_blank">
					<i class="icon-linkedin-square" aria-hidden="true"></i>
				</a>
				<!-- Skip the closing tag -->
			<li class="m-social-icons__item">
				<a href="#" class="m-social-icons__link" target="_blank">
					<i class="icon-pinterest-p" aria-hidden="true"></i>
				</a>
				<!-- Skip the closing tag -->
			<li class="m-social-icons__item">
				<a href="#" class="m-social-icons__link" target="_blank">
					<i class="icon-google-plus" aria-hidden="true"></i>
				</a>
				<!-- Skip the closing tag -->
		</ul>
	</div>
</div>

.m-social-icons {

    overflow: hidden;

    &__list {

        @include font-size(large);
        display: inline-block;
        list-style: none;
        margin: em(-10px);

    }

    &__item {

        margin: em(10px);
    }

    &--inline &__item {

        display: inline-block;
        vertical-align: middle;

    }

    &__link {

        @include text-underline(none);
        color: inherit;

    }

}