Overleaf/services/web/public/stylesheets/app/error-pages.less

.full-height {
	height: 100%;
	padding: 0;
}

.error-container {
	display: flex;
	align-items: center;
}
	.error-figure {
		display: none;
		flex: 0 0 50%;
		align-self: stretch;
		padding: @line-height-computed * 2;
		&-404 {
			@media (min-width: @screen-sm-min) {
				display: block;
			}
		}
		&-500 {
			padding-bottom: 0;
			@media (min-width: @screen-sm-min) {
				display: flex;	
				align-items: flex-end;
			}
		}
	}

	.error-details {
		flex: 0 1 50%;
		padding: @line-height-computed * 2;
	}
		.error-code {
			font-family: @font-family-sans-serif;
			font-size: @font-size-h1 * 4;
			font-weight: 800;
			color: @red;
			margin-bottom: @line-height-computed;
		}
		.error-status {
			font-family: @font-family-serif;
			margin-bottom: (@line-height-computed / 4);
			line-height: 1;
			color: @gray-dark;
			font-size: @font-size-h1;
		}
		.error-description {
			font-family: @font-family-serif;
			font-size: @font-size-h3;
			color: @gray-light;
			margin-bottom: @line-height-computed * 2;
		}
		.error-btn {
			color: @navbar-default-link-color;
			border: 2px solid @navbar-default-link-color;
			border-radius: @border-radius-base;
			font-weight: 700;
			line-height: 1;
			padding: @padding-base-vertical @padding-base-horizontal;

			&:hover,
			&:focus {
				text-decoration: none;
				color: #fff;
				background-color: @navbar-default-link-hover-bg;
				border: 2px solid @navbar-default-link-hover-color;
			}
		}