<title>sayanta's site</title>
<meta name="description" content="Sayanta's Site">

<!-- Recommended minimum -->
<meta property="og:title" content="Sayanta">
<meta property="og:description" content="Sayanta's Site">
<meta property="og:image" content="img/summary_large_image.png">
<meta name="twitter:card" content="summary">

<!-- favicon for site -->
<link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico"/>
<link rel="apple-touch-icon" sizes="180x180" href="img/favicon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/favicon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="img/favicon/favicon-16x16.png">
<link rel="manifest" href="/site.webmanifest">

<!-- You could also inline the stylesheet -->
<link rel="stylesheet" href="css/main.css">
<link rel="stylesheet" href="css/jetbrains.css">

<!-- special font for special quotes-->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Lora&family=Marck+Script&family=Rye&display=swap">

<!-- Twemoji Font Support -->
<script src="https://twemoji.maxcdn.com/v/latest/twemoji.min.js" crossorigin="anonymous"></script>

<header>

  <neon>
<span class="box">
      <a href="#home">NUllxV0iD ></a>​
</span>
  </neon>

  <edges>
<nav>
      <a href="#links">Links</a>
      <a href="#blog">Blog</a>
      <a href="#photos">Photos</a>
      <a href="#portfolio">Portfolio</a>
</nav>
  </edges>
  
</header>

<main>
  
  <!-- Home -->

  <section id="home">

  
      <article>
    <div>
      <h2 style="color:var(--highlight)">Hi there!</h2>  
          <code>I am Sayanta, 18y old guy from india, who loves tinkering with computer and softwares.</code>  
      
      <h2 style="color:var(--highlight)" font-family="Twemoji">Love Linux. 🐧</h2>
          <code>Arch • Bspwm • Kitty • Neovim</code> 
      
      <h2 style="color:var(--highlight)"> Likes.. </h2>
          <code> Privacy • OpenSource</code>
    </div>

      </article>

    <!-- <special-quote> -->
      <!-- ❝ Life ki lgi pdi h, mere life ki...! ❞  -->
    <!-- </special-quote> -->

  <p style="color:var(--highlight)">  </p>

  <article>
         <script type="text/javascript" src="//counter.websiteout.net/js/9/0/0/0"></script>
      <!-- <script type="text/javascript" src="//counter.websiteout.net/js/2/10/0/1"></script>  -->
    </div>
  </article>

  </section>

  <!-- Links -->

  <section id="links">

<article>
  <h2>🦉 Personal Links </h2> 
  <div id="links">
    <ul>
      <li>Mail: <a href="mailto:sayantasingh01@gmail.com" target="_blank" rel="noopener noreferrer"> sayantasingh01@gmail.com </a> </li>
      <li>Telegram: <a href="https://telegram.me/noobot01" target="_blank" rel="noopener noreferrer">noobot01</a> </li>
      <li>Gits: <a href="https://github.com/sayanta01" target="_blank" rel="noopener noreferrer">sayanta01</a></li>
    </ul>
  </div>
</article>

  </section>
  
  <!-- BLOG -->
  
  <section id="blog">

<article>
  <h2> 🌄 My Trip to Mukteshwar </h2>
  <div id="trip">
    <p>After spending more than a year in a dark room, I decided to visit mountains first time in my life. I was always excited to do these kind of </p>
  <p>stuff. I chose this place Mukteshwar, a small district somewhere in Uttrakhand, India. I did my research and watched many vlogs.
  <p>I wanted to do all the normie stuff like making vlog and enjoying the views. I had lot of issues regarding my career choices... </p>      
    <a href="blogs/mukteshwar.html">...Read More </a>
    
  </div>

</article>

<!-- <article> -->
<!--   <h2 id="swim"> 🏊 And I started Swimming again.. </h2> -->
<!--   <div> -->
<!--     <p> After a very long time I have started going to swim at the nearest river dam of my village. </p> -->
<!--     <p> I was bored and this is summer which makes things more boring for me. but hey plus thing we have water solution here. </p> -->
<!--     <p>It was a sunny day, I was bored, trying online CTFs and making website and suddenly I picked this vibe of "sporting"... </p> -->
<!--     <a href="blogs/swim.html">...Read More </a> -->
<!--      -->
<!--   </div> -->

<!-- </article> -->

  </section>

  <!-- PHOTOS -->

  <section id="photos">

    <p>My Gallery</p>
    <!-- You can use this grid of images in any page -->
    <div class="grid">

      <a href="#img-02"><img loading="lazy" alt="" src="gl/trio.jpg"></a>
      <a href="#img-04"><img loading="lazy" alt="" src="gl/ced.jpg"></a>
      <a href="#img-05"><img loading="lazy" alt="" src="gl/cs.jpg"></a>
      <a href="#img-06"><img loading="lazy" alt="" src="gl/qe.png"></a>
      <a href="#img-08"><img loading="lazy" alt="" src="gl/rc.jpg"></a>
      <a href="#img-09"><img loading="lazy" alt="" src="gl/hb.jpg"></a>
      <a href="#img-10"><img loading="lazy" alt="" src="gl/we.jpg"></a>
      <a href="#img-11"><img loading="lazy" alt="" src="gl/mo.jpg"></a>
      <a href="#img-12"><img loading="lazy" alt="" src="gl/bk.png"></a>
      <a href="#img-13"><img loading="lazy" alt="" src="gl/bq.jpg"></a>
      <a href="#img-14"><img loading="lazy" alt="" src="gl/sp.jpg"></a>
      <a href="#img-15"><img loading="lazy" alt="" src="gl/ch.png"></a>
    </div>

  </section>

  <!-- PORTFOLIO -->

  <section id="portfolio">
    <div class="slides">
      <!-- <figure class="cover"> <img loading="lazy" alt="" src="img/snape.jpg"></figure> -->
      <!-- <figure class="cover"><img loading="lazy" alt="" src="img/Alwaysextract.jpg"></figure> -->
      <figure class="cover"><img loading="lazy" alt="" src="img/kingcross.jpg"></figure>
      <figure style="background:#000">
        <h1>hogwarts is my home.</h1>
      </figure>
      <figure class="cover">
        <img loading="lazy" alt="" src="img/castleouter.jpg">
      </figure>
  <figure class="cover">
        <img loading="lazy" alt="" src="img/castle.jpg">
        <figcaption>..in mystery and light</figcaption>
      </figure>
      <figure style="background:#000">
        <img loading="lazy" alt="" src="img/collage.jpg">
        <figcaption>together</figcaption>
      </figure>
  <figure>
        <img loading="lazy" alt="" src="img/casts.jpg">
        <p style="color:#fff">forever.</p>
      </figure>
       <figure class="cover">
        <img loading="lazy" alt="" src="img/hedwig.jpg">
        <p style="color:#000">Always.</p>
      </figure>
    </div>

  </section>

  <!-- HIDDEN PAGE -->

  <section id="if-you-want">
    <p>This page is not referenced in the menu, for example.</p>
    <p><a href="#home">← back</a></p>
  </section>

<!-- HI-RES IMAGES -->

<!-- For the PHOTOS grid -->
<a href="#photos" class="lightbox" id="img-02"><img loading="lazy" alt="" src="gl/trio.jpg"></a>
<a href="#photos" class="lightbox" id="img-04"><img loading="lazy" alt="" src="gl/ced.jpg"></a>
<a href="#photos" class="lightbox" id="img-05"><img loading="lazy" alt="" src="gl/cs.jpg"></a>
<a href="#photos" class="lightbox" id="img-06"><img loading="lazy" alt="" src="gl/qe.png"></a>
<a href="#photos" class="lightbox" id="img-08"><img loading="lazy" alt="" src="gl/rc.jpg"></a>
<a href="#photos" class="lightbox" id="img-09"><img loading="lazy" alt="" src="gl/hb.jpg"></a>
<a href="#photos" class="lightbox" id="img-10"><img loading="lazy" alt="" src="gl/we.jpg"></a>
<a href="#photos" class="lightbox" id="img-11"><img loading="lazy" alt="" src="gl/mo.jpg"></a>
<a href="#photos" class="lightbox" id="img-12"><img loading="lazy" alt="" src="gl/bk.png"></a>
<a href="#photos" class="lightbox" id="img-13"><img loading="lazy" alt="" src="gl/bq.jpg"></a>
<a href="#photos" class="lightbox" id="img-14"><img loading="lazy" alt="" src="gl/sp.jpg"></a>
<a href="#photos" class="lightbox" id="img-15"><img loading="lazy" alt="" src="gl/ch.png"></a>