@charset "UTF-8";

.fb-btn {
	background-color: #1877f2;
}
.tw-btn {
	background-color: #666666;
	/* Twitter Blue: #1DA1F2 */
}
.em-btn {
	background-color: #F4CD0B;
}
.wa-btn {
	background-color: #25D366;
}
.li-btn {
	background-color: #0A66C2;
}
.co-btn {
	background-color: #555555;
}
.xr-btn {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 32px;
	height: 32px;
	padding: 0;
	gap: 0;
	color: white;
	padding-top: 3px;
	border-radius: 6px;
	text-align: center;
	border: 1px solid #555555;
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.78) inset;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.78) inset;
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.78) inset;
}
.xr-btn:hover {
	color: #555555;
	/* gray tone */
	background: #e9e9e9;
	/* light gray hover */
	box-shadow: 0px 0px 35px 0px rgba(128,128,128,0.78) inset;
	-webkit-box-shadow: 0px 0px 35px 0px rgba(128,128,128,0.78) inset;
	-moz-box-shadow: 0px 0px 35px 0px rgba(128,128,128,0.78) inset;
}
.xr-btn i {
	font-size: 0.85rem;
}
.back-to-top {
	position: fixed;
	bottom: 20px;
	right: 20px;
	width: 38px;
	height: 38px;
	background-color: var(--bg);
	color: var(--text4);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 20%;
	border: 1px solid var(--border);
	font-size: 1.3rem;
	text-decoration: none;
	cursor: pointer;
	transition: 0.25s ease;
	z-index: 9999;
	
	box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.78) inset;
	-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.78) inset;
	-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.78) inset;

	transition: opacity 0.3s ease, visibility 0.3s ease;
	opacity: 0;
	visibility: hidden;
}
.back-to-top:hover {
	background: #e9e9e9;
	color: #555;
	box-shadow: 0px 0px 35px 0px rgba(128,128,128,0.78) inset;
	-webkit-box-shadow: 0px 0px 35px 0px rgba(128,128,128,0.78) inset;
	-moz-box-shadow: 0px 0px 35px 0px rgba(128,128,128,0.78) inset;
}
.back-to-top.show {
	opacity: 1;
	visibility: visible;
}