.error-card {
	width: 410px;
    min-height: 330px;
    margin: 60px auto;

    .error-title {
		font-size: 150px;
		line-height: 150px;
		font-weight: 700;
		color: #252932;
		text-align: center;
		text-shadow: rgba(61, 61, 61, 0.3) .5px .5px, rgba(61, 61, 61, 0.2) 1px 1px, rgba(61, 61, 61, 0.3) 1.5px 1.5px;
	}

	.error-sub-title {
		font-weight: 100;
		text-align: center;
	}

	.error-container {
		text-align: center;
		visibility: hidden;

		&.visible {
			visibility: visible;
		}
	}

	&.global {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translateY(-50%) translateX(-50%);
		margin: 0;

		.error-title {
			color: #ffffff;
		}

		.error-sub-title,
		.error-container {
			color: #ffffff;
		}
    }
}

@include media(md) {
	.error-card {
		width: 50%;
		
		&.global {
			position: relative;
			top: 25%;
			left: 0;
			transform: inherit;
			margin: 40px auto;
		}
	}
}

@include media-down(sm) {
	.error-card {
		width: 90%;

		&.global {
			position: relative;
			top: 25%;
			left: 0;
			transform: inherit;
			margin: 40px auto;
		}
	}
}