/*
 * Notifications button styling, mobile-first approach
 */
.enable-notifications {
	display: block;
	padding: 0;
	width: 49px;
	height: 49px;
	line-height: 3em;
	overflow: hidden;
	border: 0;
	position: fixed;
	bottom: 1.7em;
	right: 1em;
	cursor: pointer;
	background: #FFF300;
	z-index: 1000;
}

@media (min-width: 768px) {
	.enable-notifications {
		width: 49px;
		height: 49px;
		line-height: 1em;
		right: 1.7em;
	}
	.enable-notifications:focus,
	.enable-notifications:active {
		outline: none;
	}
}

/* Color invert on WebSocket loaded */
.enable-notifications.ns-granted {
	position: relative;
	margin-top: -5em;
	float: right;
}