error-pages/orient/403.html

187 lines
11 KiB
HTML
Raw Normal View History

<!DOCTYPE html>
<!--
Error 403: Forbidden
Description: Access is forbidden to the requested page
-->
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="robots" content="noindex, nofollow"/>
<link rel="preconnect" href="https://fonts.bunny.net" crossorigin>
<link rel="dns-prefetch" href="https://fonts.bunny.net">
<link href="https://fonts.bunny.net/css?family=Nunito&display=swap" rel="stylesheet">
<title>Forbidden</title>
<style>
:root {
--color-bg-primary: #fff;
--color-text-primary: #22292f;
--color-text-secondary: #606f7b;
}
@media (prefers-color-scheme: dark) {
:root {
--color-bg-primary: #212121;
--color-text-primary: #fafafa;
--color-text-secondary: #9db6cb;
}
}
html, body {
height: 100%;
line-height: 1.15;
text-size-adjust: 100%;
box-sizing: border-box;
font-family: Nunito, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
margin: 0;
padding: 0;
background-color: var(--color-bg-primary);
}
*,
*::before,
*::after {
box-sizing: inherit;
border-style: none;
}
p {
margin: 0;
}
main {
display: flex;
flex-direction: column;
height: 100vh;
}
main .left, main .right {
width: 100%;
}
main .left .container {
max-width: 30rem;
margin: 2rem;
}
main .left .container .code {
color: var(--color-text-primary);
font-size: 3rem;
font-weight: 900;
}
main .left .container .space {
width: 4rem;
height: .25rem;
background-color: #a779e9;
margin-top: .75rem;
margin-bottom: .75rem;
}
main .left .container .description {
color: var(--color-text-secondary);
font-size: 1.5rem;
margin-bottom: 2rem;
}
main .right {
height: 100%;
}
main .right .container {
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
/* */
/* https://github.com/LaravelCollective/errors/blob/8a0cf6fb73ba0041330967d3d6a137bd4509f7bd/src/publish/svg/403.svg */
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' viewBox='0 0 1024 1024'%3E%3Cdefs%3E%3ClinearGradient id='A' x1='50%25' x2='50%25' y1='100%25' y2='0%25'%3E%3Cstop offset='0%25' stop-color='%2376c3c3'/%3E%3Cstop offset='100%25' stop-color='%23183468'/%3E%3C/linearGradient%3E%3ClinearGradient id='B' x1='100%25' x2='0%25' y1='50%25' y2='50%25'%3E%3Cstop offset='0%25' stop-color='%23486587'/%3E%3Cstop offset='33.23%25' stop-color='%23183352'/%3E%3Cstop offset='66.67%25' stop-color='%23264a6e'/%3E%3Cstop offset='100%25' stop-color='%23183352'/%3E%3C/linearGradient%3E%3ClinearGradient id='C' x1='49.87%25' x2='48.5%25' y1='3.62%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%23e0f2fa'/%3E%3Cstop offset='8.98%25' stop-color='%2389bed6'/%3E%3Cstop offset='32.98%25' stop-color='%231e3c6e'/%3E%3Cstop offset='100%25' stop-color='%231b376b'/%3E%3C/linearGradient%3E%3ClinearGradient id='D' x1='49.87%25' x2='49.87%25' y1='3.62%25' y2='77.75%25'%3E%3Cstop offset='0%25' stop-color='%23b0ddf1'/%3E%3Cstop offset='100%25' stop-color='%23325c82'/%3E%3C/linearGradient%3E%3ClinearGradient id='E' x1='91.59%25' x2='66.97%25' y1='5.89%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%231d3a6d'/%3E%3Cstop offset='100%25' stop-color='%23467994'/%3E%3C/linearGradient%3E%3ClinearGradient id='F' x1='97.27%25' x2='52.53%25' y1='6.88%25' y2='100%25'%3E%3Cstop offset='0%25' stop-color='%231d3a6d'/%3E%3Cstop offset='100%25' stop-color='%23467994'/%3E%3C/linearGradient%3E%3ClinearGradient id='G' x1='82.73%25' x2='41.46%25' y1='41.06%25' y2='167.23%25'%3E%3Cstop offset='0%25' stop-color='%231d3a6d'/%3E%3Cstop offset='100%25' stop-color='%23467994'/%3E%3C/linearGradient%3E%3ClinearGradient id='H' x1='49.87%25' x2='49.87%25' y1='3.62%25' y2='100.77%25'%3E%3Cstop offset='0%25' stop-color='%23b0ddf1'/%3E%3Cstop offset='100%25' stop-color='%23325c82'/%3E%3C/linearGradient%3E%3ClinearGradient id='I' x1='100%25' x2='72.45%25' y1='0%25' y2='85.2%25'%3E%3Cstop offset='0%25' stop-color='%231d3a6d'/%3E%3Cstop offset='100%25' stop-color='%23467994'/%3E%3C/linearGradient%3E%3ClinearGradient id='J' x1='100%25' x2='62.1%25' y1='0%25' y2='68.86%25'%3E%3Cstop offset='0%25' stop-color='%23163055'/%3E%3Cstop offset='100%25' stop-color='%232f587f'/%3E%3C/linearGradient%3E%3Ccircle id='K' cx='180' cy='102' r='40'/%3E%3Cfilter id='L' width='340%25' height='340%25' x='-120%25' y='-120%25'%3E%3CfeOffset in='SourceAlpha'/%3E%3CfeGaussianBlur stdDeviation='32'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.696473053 0'/%3E%3C/filter%3E%3ClinearGradient id='M' x1='0%25' y1='50%25' y2='50%25'%3E%3Cstop offset='0%25' stop-color='%23fff' stop-opacity='0'/%3E%3Cstop offset='100%25' stop-color='%23fff'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cpath fill='url(%23A)' d='M0 0h1024v1024H0z'/%3E%3Cpath d='M857 508l4-1v11h-4zm-20-4l4-1v15h-4z' fill='%238dbcd2'/%3E%3Cg fill='%23183352'%3E%3Cpath d='M801 503l4 1v14h-4zm-20 4l4 1v14h-4z'/%3E%3Cpath opacity='.5' d='M820 481h2v20h-2z'/%3E%3C/g%3E%3Cpath fill='url(%23B)' d='M61 0c3 0 3 2 6 2s3-2 6-2 3 2 6 2v8c-3 0-3-2-6-2s-3 2-6 2-3-2-6-2V0z' transform='translate(761 481)'/%3E%3Cpath fill='%238dbcd2' d='M811 501l10-2v110h-60l10-100 10-2v10.92l10-.98V505l10-2v12.96l10-.98V501z'/%3E%3Cpath fill='%23183352' d='M861 507l10 2 10 100h-60V499l10 2v13.98l10 .98V503l10 2v11.94l10 .98V507z'/%3E%3Cg transform='translate(0 565)'%3E%3Cpath fill='url(%23C)' d='M1024 385H0V106.86c118.4 21.09 185.14 57.03 327.4 48.14 198.54-12.4 250-125 500-125 90.18 0 147.92 16.3 196.6 37.12V385z'/%3E%3Cg fill='url(%23D)'%3E%3Cpath d='M1024 355H0V79.56C76.46 43.81 137.14 0 285 0c250 0 301.46 112.6 500 125 103.24 6.45 166.7-10.7 239-28.66V355z'/%3E%3Cpath d='M344.12 130.57C367.22 144.04 318.85 212.52 199 336h649L344.12 130.57z'/%3E%3C/g%3E%3Cpath fill='url(%23E)' d='M0 336V79.56C76.46 43.81 137.14 0 285 0c71.14 0 86.22 26.04 32.5 82-48 50 147.33 58.02 36 136.5-40.67 28.67 21.17 67.83 185.5 117.5H0z'/%3E%3Cpath fill='url(%23F)' d='M317.5
/* */
}
/* */
@media (min-width: 768px) {
main {
flex-direction: row;
}
main .left, main .right {
width: 50%;
}
main .left {
display: flex;
align-items: center;
justify-content: center;
}
main .left .container .code {
font-size: 9rem;
}
main .left .container .space {
margin-top: 1.5rem;
margin-bottom: 1.5rem;
}
main .left .container .description {
font-size: 1.875rem;
font-weight: 300;
line-height: 1.5;
}
main .right {
display: flex;
padding-bottom: 0;
min-height: 100vh;
}
main .right .container {
background-position: left;
}
}
@media (min-width: 992px) {
main .right .container {
background-position: center;
}
}
</style>
</head>
<body>
<main>
<div class="left">
<div class="container">
<div class="code">403</div>
<div class="space"></div>
<p class="description" data-l10n>Access is forbidden to the requested page</p>
<!-- -->
</div>
</div>
<div class="right">
<div class="container"></div>
</div>
</main>
<script>
//
if (navigator.language.substring(0, 2).toLowerCase() !== 'en') {
((s, p) => { // localize the page (details here - https://github.com/tarampampam/error-pages/tree/master/l10n)
s.src = 'https://cdn.jsdelivr.net/gh/tarampampam/error-pages@2/l10n/l10n.min.js'; // '../l10n/l10n.js';
s.async = s.defer = true;
s.addEventListener('load', () => p.removeChild(s));
p.appendChild(s);
})(document.createElement('script'), document.body);
}
//
</script>
</body>
<!--
Error 403: Forbidden
Description: Access is forbidden to the requested page
-->
</html>