/* @article */

.article-container {
	
	&__inner {
		@include poly-padding-x--large;
		width: 100%;
	    position: relative;
	    max-width: 1170px;
		margin: 0 auto;
		display: grid;
		grid-template-columns: 50px 3fr 1fr;
		grid-column-gap: $base-spacing;

		@media screen and (max-width: 770px) {
			display: flex;
			flex-direction: column;
			margin-top: -1.5rem;
		}
	}
}

.article-main {
	-ms-grid-column: 2;
	
	.browser--ie11 & {
		margin-right: $base-spacing;
	}
}

.article-sidebar {
	-ms-grid-column: 3;

	@media screen and (max-width: 770px) {
		margin-top: 1.5rem;
	}

	&__inner {
		position: sticky;
		top: calc(120px + 1.5rem);

		.admin-bar & {
			top: calc(160px + 1.5rem);
		}
	}

	.browser--ie11 & {
		margin-right: $base-spacing;
	}
}

.article-social {
	-ms-grid-column: 1;

	@media screen and (max-width: 770px) {
    	margin-top: 0.5rem;
    	order: 2;
	}

	&__inner {
		position: sticky;
		top: calc(120px + 1.5rem);

		.admin-bar & {
			top: calc(160px + 1.5rem);
		}
	}

	&-icon {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 50px;
		height: 50px;
		margin-bottom: 3px;

		svg {
			width: 1.5rem;
			path {
				fill: white;
			}
		}

		&--twitter {
			background-color: #1da1f2;
		}

		&--linkedin {
			background-color: #007bb5;
		}

		&--facebook {
			background-color: #3b5998;
		}
	}
}