* {
	box-sizing: border-box;
}
a {
	text-decoration: none;
}
a:hover {
	cursor: pointer;
}

.widget {
	font-family: "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
	display: flex;
	flex-direction: column;
	gap: 12px;
	max-width: 500px;
	width: 100%;
	margin-top: 32px;
}
.widget:first-of-type {
	margin-top: 0;
}
.widget__reposts {
	display: block;
}
.widget__buttons {
	display: flex;
	gap: 8px;
}
.widget__reposts,
.widget__buttons {
	margin-left: 45px;
}

.reposts-link {
	color: #818C9C;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	letter-spacing: .4px;
	transition: color .3s;
}
.reposts-link:hover {
	color: #5a526d;
}
.reposts-link:before {
	display: inline-block;
	text-align: center;
	font-family: "Font Awesome 6 Pro";
	font-size: 13px;
	font-weight: 900;
	content: '\f064';
	width: 20px;
	height: 20px;
	margin-right: 4px
}
.reposts-link:after {
	display: inline-block;
	font-family: "Font Awesome 6 Pro";
	font-size: 14px;
	content: '\f105';
	width: 11px;
	height: 15px;
	line-height: 1;
	vertical-align: middle;
	margin-left: 4px;
}

.button--big {
	flex: 1;
	border-radius: 8px;
	border: 1px solid #E4E4E4;
	padding: 10px 16px;
	color: #000;
	text-align: center;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 20px;
	letter-spacing: .1px;
}
.button--big:hover {
	color: #000;
}
.button--small {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-shrink: 0;
	background-color: #F4F4F5;
	border-radius: 8px;
	border: none;
	color: #818C9C;
	padding: 10px 16px;
	width: 40px;
	transition: background-color .3s;
}
.button--small:hover {
	background-color: #DFDFDF;
}
.button--small:before {
	font-family: "Font Awesome 6 Pro";
	content: '\f141';
}

@media only screen and (max-width: 354px) {
	.widget__reposts,
	.widget__buttons {
		margin-left: 7px;
	}
}
