body.error
	width: 100%
	height: 100%

#error_container
	display: flex
	justify-content: center
	align-items: center
	position: absolute
	top: 0
	left: 0
	right: 0
	bottom: 0
	background-color: darken($color-background-nav, 3%)

	&.standalone
		width: 100%
		height: 100%
		position: fixed

		#error_box
			.error-lead
				padding: 10px 10px

				p
					display: block

				&.extra
					padding-top: 0


	#error_box
		min-width: 60%
		max-width: 500px
		text-align: center
		display: flex
		justify-content: center
		align-items: center
		flex-direction: column

		+container-box

		box-shadow: 0 0 15px rgba(black, .2)
		padding: 0
		background-color: $color-background-nav

		.error-top-container
			position: relative
			width: 100%
			background-color: $color-background-nav
			background: repeating-linear-gradient(-45deg, lighten($color-background-nav, 2%), lighten($color-background-nav, 2%) 10px, $color-background-nav 10px, $color-background-nav 20px)

		.error-title
			padding: 25px 0 10px 0
			color: white
			font:
				family: $font-headings
				size: 2em
				weight: 300

		.error-lead
			width: 100%
			padding: 0 25px 25px 0
			line-height: 1.6em

			color: $color-text-light-primary
			font:
				family: $font-body
				weight: 300

			a
				text-decoration: none
				&:hover
					text-decoration: underline

			&.extra
				padding: 25px 0
				font-size: .9em
				color: $color-text-light-secondary


		hr
			margin: 0 0
			width: 100%
			border: none
			height: 3px
			background-color: lighten($color-background-nav, 5%)

		.buttons
			margin: 0 15px 25px 0

			a
				font-size: 1.2em
				margin: 0 15px
				&.sign-up
					@include button-rounded-filled($color-primary, 999em)
				&.sign-in
					@include button-rounded($color-background, 999em)
					border-color: transparent


#node-overlay
	#error_container
		@include overlay(rgba($color-background-nav, .8), 0%, transparent, 60%)

		#error_box
			top: 50px
			position: absolute
			left: 50%
			transform: translateX(-50%)
			border-radius: 3px
			box-shadow: 0 0 100px rgba(black, .85)
			overflow: hidden