-
Notifications
You must be signed in to change notification settings - Fork 0
/
403.shtml
1 lines (1 loc) · 5.11 KB
/
403.shtml
1
<!doctypehtml><html lang="en"><meta charset="UTF-8"><meta name="viewport"content="width=device-width,initial-scale=1"><meta http-equiv="X-UA-Compatible"content="ie=edge"><title>403 Error!</title><link href="https://fonts.googleapis.com/css?family=Anton|Passion+One|PT+Sans+Caption"rel="stylesheet"type="text/css"><style>*{font-family:'PT Sans Caption',sans-serif,arial,'Times New Roman'}.button{-webkit-border-radius:20px;-moz-border-radius:20px;border-radius:20px;background-color:#07b3f9;border:none;color:#fff;padding:15px 32px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;margin:4px 2px;cursor:pointer}.error{margin-left:auto;margin-right:auto}.text-center{text-align:center}.error .clip .shadow{height:180px}.error .clip:nth-of-type(2) .shadow{width:130px}.error .clip:nth-of-type(1) .shadow,.error .clip:nth-of-type(3) .shadow{width:250px}.error .digit{width:150px;height:150px;line-height:150px;font-size:120px;font-weight:700}.error h2{font-size:32px}.error .msg{top:-190px;left:30%;width:80px;height:80px;line-height:80px;font-size:32px}.error span.triangle{top:70%;right:0;border-left:20px solid #535353;border-top:15px solid transparent;border-bottom:15px solid transparent}.error .container-error-404{margin-top:10%;position:relative;height:250px;padding-top:40px}.error .container-error-404 .clip{display:inline-block;transform:skew(-45deg)}.error .clip .shadow{overflow:hidden}.error .clip:nth-of-type(2) .shadow{overflow:hidden;position:relative;box-shadow:inset 20px 0 20px -15px rgba(150,150,150,.8),20px 0 20px -15px rgba(150,150,150,.8)}.error .clip:nth-of-type(1) .shadow:after,.error .clip:nth-of-type(3) .shadow:after{content:"";position:absolute;right:-8px;bottom:0;z-index:9999;height:100%;width:10px;background:linear-gradient(90deg,transparent,rgba(173,173,173,.8),transparent);border-radius:50%}.error .clip:nth-of-type(3) .shadow:after{left:-8px}.error .digit{position:relative;top:8%;color:#fff;background:#07b3f9;border-radius:50%;display:inline-block;transform:skew(45deg)}.error .clip:nth-of-type(2) .digit{left:-10%}.error .clip:nth-of-type(1) .digit{right:-20%}.error .clip:nth-of-type(3) .digit{left:-20%}.error h2{color:#a2a2a2;font-weight:700;padding-bottom:20px}.error .msg{position:relative;z-index:9999;display:block;background:#535353;color:#a2a2a2;border-radius:50%;font-style:italic}.error .triangle{position:absolute;z-index:999;transform:rotate(45deg);content:"";width:0;height:0}@media(max-width:767px){.error .clip .shadow{height:100px}.error .clip:nth-of-type(2) .shadow{width:80px}.error .clip:nth-of-type(1) .shadow,.error .clip:nth-of-type(3) .shadow{width:100px}.error .digit{width:80px;height:80px;line-height:80px;font-size:52px}.error h2{font-size:24px}.error .msg{top:-110px;left:15%;width:40px;height:40px;line-height:40px;font-size:18px}.error span.triangle{top:70%;right:-3%;border-left:10px solid #535353;border-top:8px solid transparent;border-bottom:8px solid transparent}.error .container-error-404{height:150px}}.overlay{position:relative;z-index:20}.ground-color{background:#fff}.item-bg-color{background:#eaeaea}.padding-top{padding-top:10px}.padding-bottom{padding-bottom:10px}.padding-vertical{padding-top:10px;padding-bottom:10px}.padding-horizontal{padding-left:10px;padding-right:10px}.padding-all{padding:10px}.no-padding-left{padding-left:0}.no-padding-right{padding-right:0}.no-vertical-padding{padding-top:0;padding-bottom:0}.no-horizontal-padding{padding-left:0;padding-right:0}.no-padding{padding:0}.margin-top{margin-top:10px}.margin-bottom{margin-bottom:10px}.margin-right{margin-right:10px}.margin-left{margin-left:10px}.margin-horizontal{margin-left:10px;margin-right:10px}.margin-vertical{margin-top:10px;margin-bottom:10px}.margin-all{margin:10px}.no-margin{margin:0}.no-vertical-margin{margin-top:0;margin-bottom:0}.no-horizontal-margin{margin-left:0;margin-right:0}.inside-col-shrink{margin:0 20px}hr{margin:0;padding:0;border-top:1px dashed #999}</style><div class="error"><div class="container-floud"><div class="col-xs-12 ground-color text-center"><div class="container-error-404"><div class="clip"><div class="shadow"><span class="digit thirdDigit"></span></div></div><div class="clip"><div class="shadow"><span class="digit secondDigit"></span></div></div><div class="clip"><div class="shadow"><span class="digit firstDigit"></span></div></div><div class="msg">OH!<span class="triangle"></span></div></div><h2 class="h1">Access Forbidden!</h2><a class="button"href="./index.php">Back to Home</a></div></div></div><script>function randomNum(){"use strict";return Math.floor(9*Math.random())+1}var loop1,loop2,loop3,number,time=30,i=0,selector3=document.querySelector(".thirdDigit"),selector2=document.querySelector(".secondDigit"),selector1=document.querySelector(".firstDigit");loop3=setInterval(function(){"use strict";40<i?(clearInterval(loop3),selector3.textContent=4):(selector3.textContent=randomNum(),i++)},time),loop2=setInterval(function(){"use strict";80<i?(clearInterval(loop2),selector2.textContent=0):(selector2.textContent=randomNum(),i++)},time),loop1=setInterval(function(){"use strict";100<i?(clearInterval(loop1),selector1.textContent=3):(selector1.textContent=randomNum(),i++)},time)</script>