The web site of n-has-a-site

Copypast the code in the box below

<a>  <!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>The web site of n-has-a-site</title>
    
    <link href="/style.css" rel="stylesheet" type="text/css" media="all">
    <style>
    @font-face{
  src: url(https://file.garden/ZzrM1q9yEhr5pkfS/LinearStd%20Regular.ttf);
  font-family:linear;
}
iframe{
  color:white;
}
    .whatever{
      left:700px;
      position:relative;
      color:white;
        font-family:linear;

}
  a{
    color:white;
    text-decoration:underline;
    font-size:15px;
  }
  p{
    font-size:15px;
    color:white;
    font-family:linear;
  }
  h1{
    font-size:30px;
    color:white;
    font-family:linear;
  }
  h2 {
  font-size:25px;
}
  body{
    background:url("https://n-has-a-site.neocities.org/af255ff553132e0f27fdbaf4201eb6af.jpg");
    background-size:cover;
    background-repeat: no-repeat;
    top:2000px;

}
  .glass {
  width: 900px;
  height: 500px;
  background-size:cover;
  backdrop-filter: blur(5.3px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 20px;
  border: 1px solid rgba(22, 17, 121, 0.3);
  box-shadow: 
    0 8px 32px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.5),
    inset 0 -1px 0 rgba(255, 255, 255, 0.1),
    inset 0 0 0px 0px rgba(255, 255, 255, 0);
  position: relative;
  overflow: hidden;
  left:90px;
  top:10px;
  font-family:linear;
  color:white;
  
}

.glass::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(22, 17, 121,0.8),
    transparent
  );
}

.glass::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 100%;
  background: linear-gradient(
    180deg,
    rgba(22, 17, 121,0.3)
    transparent,
    rgba(22, 17, 121, 0.3)
  );
}
    .container {
  display: grid;
  grid-template-columns: auto auto auto;
  padding: 10px;
}
.container > div {
  padding: 10px;
  font-size: 30px;
  text-align: center;
    top:50px;
position:relative;
right:45px;
}
  .glass-card {
  width: 100px;
  height: 500px;
  background-size:cover;
  backdrop-filter: blur(5.3px);
  -webkit-backdrop-filter: blur(4px);
  border-radius: 20px;
  border: 1px solid rgba(22, 17, 121, 0.3);
  box-shadow: 
    0 8px 32px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.5),
    inset 0 -1px 0 rgba(255, 255, 255, 0.1),
    inset 0 0 0px 0px rgba(255, 255, 255, 0);
  position: relative;
  overflow: hidden;
  left:150px;
  top:10px;
  font-family:linear;
  color:white;
}

.glass-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 1px;
  background: linear-gradient(
    90deg,
    transparent,
    rgba(22, 17, 121,0.8),
    transparent
  );
}

.glass-card::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 1px;
  height: 100%;
  background: linear-gradient(
    180deg,
    rgba(22, 17, 121,0.3)
    transparent,
    rgba(22, 17, 121, 0.3)
  );
}
</style>
<script async defer src="https://scripts.withcabin.com/hello.js"></script>
    <script>
('blockquote').each(function () {
    $(this).html($(this).html().replace(/(\$)/g, '<span style="color: #bb60d5;">-N</span>'));
});

<div><div class="glass-card">
 
 <p> <a href="glasslayout1.html" target="content"> home </a>  <br>  <a href="home.html" target="content"> blog </a> <br> <a href="about.html" target="content"> about </a>
          </div></div>
          
  <div>  <div class="glass" id="dynamicContent">
 <iframe name="content" src="glasslayout1.html" width="100%" height="100%" frameBorder="0"> </iframe>
          </div></div>
</div>
  </body>
</html>

Glass layout