Grid Pattern 5/25/23


<!DOCTYPE html>   <html>   <head>   <meta name="viewport" content="width=device-width, initial-scale=1"><title>Prettiest Page Numbers
 </title><style>@import url(https://fonts.googleapis.com/css?family=Macondo);  ::-webkit-scrollbar { width:16px;height:16px; }
  ::-webkit-scrollbar-track {background:#006;box-shadow:0 0 33px 8px #003; } ::-webkit-scrollbar-thumb { border-radius:22px;background:#600;
 box-shadow:0 0 11px 8px #300; } body { background:#100;overflow:auto; }      .maintext { text-align:center;font-family:macondo;
 font-size:22px;color:#f0a;line-height:11px; }        .text { position:absolute;top:122px;width:22px;text-align:left;font-family:macondo;
 font-size:20px;color:green;line-height:44px;margin-top:44px;padding:0px 0px 0px 0px; }
      .falsetext { position:absolute;font-size:1200px;line-height:1100px;color:transparent; }

 .row1, .row2, .row3, .row4, .row5, .row6, .row7, .row8, .row9, .row10, .row11, .row12, .row13, .row14, .row15, .row16, .row17, .row18
 { position:absolute;border-left:1.9px solid gold;top:144px;height:100vw; }
 .row1 { left:2px; } .row2 { left:50px; } .row3 { left:125px; } .row4 { left:200px; } .row5 { left:275px; } .row6 { left:350px; } .row7 { left:425px; }
 .row8 { left:500px; } .row9 { left:575px; } .row10 { left:650px; } .row11 { left:725px; } .row12 { left:800px; } .row13 { left:875px; } .row14 { left:950px; } .row15 { left:1025px; } .row16 { left:1100px; } .row17 { left:1175px; } .row18 { left:1250px; }

 .bar1, .bar2, .bar3, .bar4, .bar5, .bar6, .bar7, .bar8, .bar9, .bar10, .bar11, .bar12, .bar13, .bar14, .bar15, .bar16, .bar17, .bar18, .bar19, .bar20, .bar21,
 .bar22, .bar23, .bar24, .bar25, .bar26, .bar27, .bar28, .bar29, .bar30, .bar31, .bar32, .bar33, .bar34, .bar35, .bar36, .bar37, .bar38, .bar39,  .bar40
 { position:absolute;border-top:1px solid gold;left:0px;width:100%; }
 .bar1 { top:144px; } .bar2 { top:174px; } .bar3 { top:204px; } .bar4 { top:234px; } .bar5 { top:264px; } .bar6 { top:294px; } .bar7 { top:324px; }
 .bar8 { top:354px; } .bar9 { top:384px; } .bar10 { top:414px; } .bar11 { top:444px; } .bar12 { top:474px; } .bar13 { top:504px; } .bar14 { top:534px; }
 .bar15 { top:564px; } .bar16 { top:594px; } .bar17 { top:624px; } .bar18 { top:654px; } .bar19 { top:684px; } .bar20 { top:714px; } .bar21 { top:744px; }
 .bar22 { top:774px; } .bar23 { top:804px; } .bar24 { top:834px; } .bar25 { top:864px; } .bar26 { top:894px; } .bar27 { top:924px; } .bar28 { top:954px; }
 .bar29 { top:984px; } .bar30 { top:1014px; } .bar31 { top:1044px; } .bar32 { top:1074px; } .bar33 { top:1104px; } .bar34 { top:1134px; }
 .bar35 { top:1164px; } .bar36 { top:1194px; } .bar37 { top:1224px; } .bar38 { top:1254px; } .bar39 { top:1284px; } .bar40 { top:1314px; }

 .box { position:absolute;top:5px;left:333px;width:577px;height:92px;border:ridge 7px gold; }

  </style>

 <div class="row1"></div><div class="row2"></div><div class="row3"></div><div class="row4"></div><div class="row5"></div>
 <div class="row6"></div><div class="row7"></div><div class="row8"></div><div class="row9"></div><div class="row10"></div>
 <div class="row11"></div><div class="row12"></div><div class="row13"></div><div class="row14"></div><div class="row15"></div>
 <div class="row16"></div><div class="row17"></div><div class="row18"></div>
  <div class="box"></div><div class="bar1" style="border-top:3px solid gold"></div><div class="bar2"></div><div class="bar3"></div>
<div class="bar4"></div><div class="bar5"></div><div class="bar6"></div><div class="bar7"></div><div class="bar8"></div>
<div class="bar9"></div><div class="bar10"></div><div class="bar11"></div><div class="bar12"></div><div class="bar13"></div>
<div class="bar14"></div><div class="bar15"></div><div class="bar16"></div><div class="bar17"></div><div class="bar18"></div>
<div class="bar19"></div><div class="bar20"></div><div class="bar21"></div><div class="bar22"></div><div class="bar23"></div>
<div class="bar24"></div><div class="bar25"></div><div class="bar26"></div><div class="bar27"></div><div class="bar28"></div>
<div class="bar29"></div><div class="bar30"></div><div class="bar31"></div><div class="bar32"></div><div class="bar33"></div>
<div class="bar34"></div><div class="bar35"></div><div class="bar36"></div><div class="bar37"></div><div class="bar38"></div>
<div class="bar39"></div><div class="bar40"></div>