  <% if (!isMobile) { %> 
<!--
    This Source Code Form is subject to the terms of the GNU General Public License:

    Copyright (C) 2021-2022 POKETUBE (https://github.com/iamashley0/poketube)
    
    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program. If not, see https://www.gnu.org/licenses/.
-->
<!DOCTYPE html>
<html class="poketube_desktop">
<head>
    <% if (e === false) { %> <!-- if ?e=false,dont show up the meta tags  -->
    
 <% } %>
  <% if (!e) { %>
<meta content="<%=video.Title%>" name=title>
<meta content="<%=color%>" name="theme-color">
<meta content="<%=video.Channel.Name%>" name=twitter:author>
<meta content=@youtube name=twitter:site>
<meta content="https://poketube.fun/watch?v=<%=video.id%>" name=twitter:url>
<meta content="<%=video.Title%> - PokeTube" name=twitter:title>
<meta content="Watch this video by <%=video.Channel.Name%> On PokeTube. The YouTube front-end that doesnt track you!" property=twitter:description>
<meta content="https://i.ytimg.com/vi/<%=video.id%>/maxresdefault.jpg" property=og:image>
<meta content=summary_large_image name=twitter:card>
<link href="https://poketube.fun/watch?v=<%=video.id%>" itemprop=url>
<link href="http://www.youtube.com/channel/<%=video.Channel.id%>" itemprop=url>
 <% } %> <!-- close the } -->
<link href="/css/yt-ukraine.svg" rel=icon>
<title> <%=video.Title%> - PokeTube </title>  
<style>
   a.class:hover {
    text-decoration:underline;
    font-weight:bold
   }
   summary{
     color:gray;
   }
   summary:hover{
    color:white;
    }
  :visited { color: #00c0ff }
     
  a{
  color:#0ab7f0;
   }
  
  
  
   .video > .info > .title {
 	font-family: "PokeTube flex";
	font-stretch: extra-expanded;
}
   </style>
  
  <link href=/css/app-cdn.min.css rel=stylesheet>
  <link href=/css/app.main.css rel=stylesheet>
  <link href="/css/watch.main.css?v=56" rel=stylesheet>
  <link href="/css/watch-util.css" rel=stylesheet>
  <link href="https://fonts.poketube.fun/css/fonts.css" rel=stylesheet>
  <link href="/css/watch-navbar.css?v=56" rel=stylesheet>
  <link href=https://p.poketube.fun/https://site-assets.fontawesome.com/releases/v6.1.1/css/all.css rel=stylesheet>
   </head>
   
   
  <body>
    
<div class="app" style="color:#fff">
    
            
    <nav>
      <div class="left"><a class="class" href="/143" style=font-family:Inter,sans-serif;color:#fff> <img style="transform: scale(1.3);padding-left:0.9em;width: 8.5em;display: block;margin-left: auto;margin-right: auto;" src="/css/logo.svg?v=5">         </a>             </div>                                    
      <div class="middle">
        <form action=/search><input class=search-bar autocomplete="on" id=fname name=query style="color:#fff;font-family:Inter,sans-serif;border-radius: 8px;">
          <button class="btn btn-success" type=submit><i class="fa-light fa-search"></i></button>
             
         </form>
          <img src="https://search-metrics.poketube.fun/t/rep.gif"  style="border:0;width: 0;visibility: hidden;"> 

      </div>
      <div class="right">
      <a href="/privacy" style="text-decoration: none;" title="Privacy Policy">
          <i style="display: block;margin-left: auto;margin-right: auto;" class="fa-light fa-shield"></i>
        </a>
        <a href="/video/upload" style="text-decoration: none;" title="Upload Video">
          <i style="display: block;margin-left: auto;margin-right: auto;" class="fa-light fa-video"></i>
        </a>
    
        <a href="/embed/<%=video.id%>" style="text-decoration: none;" title="Embed">
          <i style="display: block;margin-left: auto;margin-right: auto;" class="fa-light fa-code"></i>
        </a>                                   
        
      </div>
    </nav>
	   
 
 
 <div class="watch-page">

 	<div class="primary">
       
		<div class="video-player-container">
<video class="player" id="<%=sha384(video.id)%>" style="border-radius: 16px;" autoplay controls src="<%=url%>" poster="https://p.poketube.fun/https://i.ytimg.com/vi/<%=video.id%>/maxresdefault.jpg?v=607ddcd4">
 
    <% if (  video.Subtitles.Subtitle) { %>  
     <%  if (Array.isArray( video.Subtitles.Subtitle)) { %> 
   <% video.Subtitles.Subtitle.forEach(x => { %>
     <track src="/api/subtitles?v=<%=video.id%>&h=<%= x.language %>" label="<%= x.language %>" kind="subtitles">      
     
        <img src="https://t.poketube.fun/t/rep.gif?v=<%=video.id%>&h=<%= x.language %>" id="subtitle_usage_rate" style="border:0;width: 0;visibility: hidden;"> 
         <% }) %>   
                                                                                                       <% } %>               
                                                           <% } %>                
 					</video><img src="https://t.poketube.fun/t/rep.gif?video=<%=btoa(video.id)%>" style="border:0;width: 0;visibility: hidden;" id="video">
<div style="display: flex;justify-content: center;align-items: center;flex-direction: row; column-gap: 3px;" align="center">
                                
  <% if (!qua) { %> 

                                 <i style="display: block;" title="High Definition [Current]" class="fa-solid fa-high-definition"></i> <a href="/watch?v=<%=video.id%>&quality=medium"><i style="display: block;" title="Standard Definition" class="fa-light fa-standard-definition"></i></a>
                                                                      <% } %>               
                               <% if (qua) { %> 
                                 <a href="/watch?v=<%=video.id%>">  <i style="display: block;"  title="High Definition" class="fa-light fa-high-definition"></i> </a>  <i style="display: block;" title="Standard Definition [Current]"  class="fa-solid fa-standard-definition"></i>

                                                                      <% } %>               

       </div>
                                 
       </div>
                                                            <br>
			<div class="video-info">           
				<div class="video-title" style="font-family:'Ginto Nord';font-weight:900;white-space:yes;"><%=video.Title%></div>
                  <p class="video-sub-info description" style="font-weight: bold;">
 
                    <span><%=engagement.viewCount.toLocaleString()%> Views - Uploaded At <%=date%> - By <a href="/channel?id=<%=k.Video.Channel.id%>"><%-k.Video.Channel.Name%></a> ^^</span> 
                      
                      <br><br>
                      </p>
<div class="video-sub-info description" style="font-weight: bold;margin-top:  55px !important;border-radius: 21px;background: #1c1c1c;padding: 10px;margin-bottom: 20px;margin-left: 0;font-family: 'Poketube flex';font-stretch: expanded;"><div class="video-title" style="color:#fff;font-family:Ginto Nord,sans-serif;font-weight:700;margin-top: 3px;margin-bottom: 10px;">Description</div>
 <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">
     <% if (String(video.Description) != "[object Object]")  { %>

              <%-String(video.Description).replace(/\n/g, " <br> ")%>
                          <% } %>          
                            
    <% if (String(video.Description) == "[object Object]")  { %>
      <p> No Description On this Video ( sad innit :c )</p>
                          <% } %>               

                   <% if (wiki.extract_html) { %> 
<div class="video-title" style="color:#fff;font-family:Ginto Nord,sans-serif;font-weight:700;margin-top: 10px;margin-bottom: 10px;">From da web</div>
                     
<hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">

  <%-wiki.extract_html%>
   
<p style="margin-bottom: 10px;">

  <a href=" <%-wiki.content_urls.desktop.page%>
 ">From wikipedia </a> under CC-BY-SA 3.0
                     </p>
 
                 
                     </p>
                     <% } %>  
                   
 
 				</div>
      <div class="video-info-buttons" style="background:#1c1c1c;border-radius:16px;padding: 3px;border-style: none;min-height: 34px;height: min-content;">
        
 					<div title="<%=engagement.likes.toLocaleString()%> Likes">
  <i class="fa-light fa-thumbs-up"></i>
     <%=convert(engagement.likes)%>
          </div>
					<div title="<%=engagement.dislikes.toLocaleString()%> Dislikes">
<i class="fa-light fa-thumbs-down"></i> <%=convert(engagement.dislikes)%>
					</div>

         
            <div>

					<a title="Download this Video :3" style="color:#fff;text-decoration: none; " href="/download?v=<%=video.id%>">
            <i class="fa-light fa-download"></i>
            Download
					</a>
 
   
 <% if (!video.Channel.Name.endsWith(' - Topic')) { %> 
    <% if (!video.Title.endsWith('Audio)')) { %> 

					<a title="Encryption duh" style="color:#fff;text-decoration: none;" href="/encryption?v=<%=video.id%>">
               <i class="fa-light fa-shield"></i>
                Encryption
   </a>
                                                                          <% }%>                                                                              <% }%>      
  
                                                                             <% if (video.Channel.Name.endsWith(' - Topic') || video.Title.endsWith('Audio)')) { %> 
                                                            
                            <% if (video.Channel.Name.endsWith(' - Topic') || video.Title.endsWith('Audio)'))  { %> 
                                                 					<a title="open this song in poketube music!" style="color:#fff;text-decoration: none;" href="/music?v=<%=video.id%>">
          <i class="fa-light fa-music"></i>
                  Open In Music
                                                 </a>

                                                                       <% }%>                     
                                                                          <% }%>      
    
                  					</div>
    

 
				</div>
			</div>
           		<div class="channel-info__bordered" style="border-radius:10px;font-family:Inter" name="chnl">
                            <a name="chnl"></a>

				<a href="/channel?id=<%=video.Channel.id%>" class="avatar">
					<img src="https://p.poketube.fun/<%= k.Video.Channel.Avatar[1].$t %>">
				</a>
				<div class="name" style="font-family:'Ginto Nord'">
 
         <div>
						<a style="color:#fff" href="/channel?id=<%=k.Video.Channel.id%>" >  <%=k.Video.Channel.Name%></a>   
            
              <% if (!video.Channel.Name.endsWith(' - Topic')) { %>  
               <% if (badges) { %> 
              <% if (badges.tooltip === "Verified") { %> 
<i class="fa-solid fa-badge-check" title="<%=badges.tooltip%>"></i>
            <% } %>  <% if (badges.tooltip === "Official Artist Channel") { %> 
<i class="fa-solid fa-music-note" title="<%=badges.tooltip%>"></i>  
             <% } %>             <% } %>  <% } %> 

              </div>

				</div>
				<div class="subscriber-count">
          <%= k.Video.Channel.subscriberCount %>
 				</div>
				<button class="subscribe-button" ><a style="color:#fff" href="https://www.youtube.com/channel/<%=video.Channel.id%>?view_as=subscriber?sub_confirmation=1">Suscribe</a></button>
			</div>
                                        
               <div style="display:none;">
                
              
                 
               </div>
                               <% if (comments) { %>
                <% if (!video.Channel.Name.endsWith(' - Topic')) { %>  

                   <div class="video-title" style="color:#fff;font-family:Ginto Nord,sans-serif;font-weight:700;margin-top: 10px;margin-bottom: 9px;">Comments - <span style="font-family: inter;"> <%=comments || "Probably disabled or theres no comments" %>  </span> </div>
                      
                             <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
                   <p>
                       <a href="https://invidio.us/watch?v=<%=video.id%>">  Click here to View Comments</a>
                        </p>

                            <% } %>
                            <% } %>



<p style="font-family:MonoSpace;">
         <b>
PokeTube Player v30.09.22a - Node <%=process.version%> - V8 v<%=process.versions.v8%> -  <%=process.platform.replace("linux", "GNU/Linux")%> <%=process.arch%> Server ( <%=ip.org%> )
           </b>
         
                </p>            
 
         </div>
                 
<div class="recommended-list" style="background-color:#1c1c1c;border-radius:25px;margin: 10px;height: fit-content;" align="center">
    
             

                              <% if (!r) { %> 
 
 <div class="video-title" style="text-align:left;font-family:'Ginto Nord';font-weight:900;white-space:yes;">                                  Recommendations
                                </div>   
<p style="text-align:left;margin:0;font-family: &quot;PokeTube flex&quot;;font-stretch: ultra-expanded;font-weight: 500;">
                                 Videos that u might like
                              </p>
                                <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
                                                <% if (!video.Channel.Name.endsWith(' - Topic')) { %>  

                              <% if (!f) { %> 
                                <div style="display: flex;column-gap: 2.5px;align-self: center;" align="center"> 

  <span tabindex="0" draggable="false" style="font-weight: bold;"  class="v-chip  v-chip--clickable v-chip--active v-chip--no-color theme--dark v-size--default"><a class="v-chip__content">
          Recommendations
        </span></a>

                                            <span tabindex="0" draggable="false" class="v-chip v-chip--clickable v-chip--no-color theme--dark v-size--default"> <a style="color:#fff;text-decoration: none;" href="/watch?v=<%=video.id%>&f=t" class="v-chip__content">
From <%=video.Channel.Name%> </span></a>
                                              
                                    
                                              <% } %>
                                </a>
                                              
                                                                          <% if (!f) { %> 
  
                                  </div>
                            <% } %>

                           <% } %>
                               <% if (f) { %> 

<div style="display: flex;column-gap: 2.5px;align-self: center;" align="center"> 
                                  <span tabindex="0" draggable="false" class="v-chip  v-chip--clickable v-chip--active v-chip--no-color theme--dark v-size--default"><a href="/watch?v=<%=video.id%>" style="color:#fff;text-decoration:none;" class="v-chip__content">
          Recommendations
        </span></a>
                                            <span tabindex="0" draggable="false" class="v-chip v-chip--clickable v-chip--no-color theme--dark v-size--default" style="font-weight: bold;" ><a style="color:#fff;text-decoration: none;"  class="v-chip__content">
From  <%=video.Channel.Name%> </span></a>
                                </a>
                        
                                 </div>
                            <% } %>

                              <% if (!f) { %> 
     <% k.Video.Recommendations.Video.forEach(x => { %>       
 						<div class="video" >
                    <% if (!optout) { %> 

      <a  href="/watch?v=<%= x.id %>" class="thumbnail" style="background-image: url('https://p.poketube.fun/https://i.ytimg.com/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw');border-radius: 9.5px;"  >								<span class="video-length"><%=x.duration %></span>
                           <% } %>
   <% if (optout) { %> 

      <a  href="/watch?v=<%= x.id %>&t=f" class="thumbnail" style="background-image: url('https://p.poketube.fun/https://i.ytimg.com/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw');border-radius: 9.5px;"  >								<span class="video-length"><%=x.duration %></span>
                           <% } %>
							</a>
							<div class="info">
                
      <% if (!optout) { %> 
								<a href="/watch?v=<%= x.id %>" class="title max-lines-2" title="<%= x.Title %>"><%= x.Title %></a>
                   <% } %>
   <% if (optout) { %> 
								<a href="/watch?v=<%= x.id %>&t=f" class="title max-lines-2" title="<%= x.Title %>"><%= x.Title %></a>
                   <% } %>
								<div>
               <a class="max-lines-2" href="/channel?id=<%= x.Channel.id %>"><%=x.Channel.Name %></a>
									<div>
 <%= x.uploadedAt %> • <%= convert(x.views) %> views</div>
								</div>
							</div>
						</div>
 
       <% }) %>   
                            <% } %>
 
     <% if (f) { %> 

     <% tj.Channel.Contents.ItemSection.ItemSection.Video.forEach(x => { %>       
 						<div class="video">
                    <% if (!optout) { %> 

      <a  href="/watch?v=<%= x.id %>" class="thumbnail" style="background-image: url('https://p.poketube.fun/https://i.ytimg.com/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw');border-radius: 9.5px;"  >								<span class="video-length"><%=x.duration %></span>
                           <% } %>
   <% if (optout) { %> 

      <a  href="/watch?v=<%= x.id %>&t=f" class="thumbnail" style="background-image: url('https://p.poketube.fun/https://i.ytimg.com/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw');border-radius: 9.5px;"  >								<span class="video-length"><%=x.duration %></span>
                            <% } %>
							</a>
							<div class="info">
       <% if (!optout) { %> 
								<a href="/watch?v=<%= x.id %>" class="title max-lines-2" title="<%= x.Title %>"><%= x.Title %></a>
                   <% } %>
   <% if (optout) { %> 
								<a href="/watch?v=<%= x.id %>&t=f" class="title max-lines-2" title="<%= x.Title %>"><%= x.Title %></a>
                   <% } %>
								<div>
               <a class="max-lines-2" href="/channel?id=<%= video.Channel.id %>"><%=video.Channel.Name %></a>
									<div>
 <%= x.uploadedAt %> • <%= convert(x.views) %> views</div>
								</div>
							</div>
						</div>
 
       <% }) %>   
                            <% } %>
                                                          <% } %>

                                                            
      	           <% if (lyrics) { %>
                                                  <% if (r === "f") { %> 
                                <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
                                                    <div>
            <a href="/watch?v=<%=video.id%>">See the Recommended videos instead</a> - <a href="https://github.com/iamashley0/poketube/issues">Report wrong lyrics qwq</a>
                                                    </div>
         <div align="center">                                <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">

                                                             <h1 style="font-family:'Ginto Nord',sans-serif;font-weight:900;white-space:yes;" align="center">
 Lyrics 
                        </h1>  
           <p>
 See how our lyrics search works:<a href="https://github.com/iamashley0/poketube/blob/main/src/lyrics.js">Here</a>
           </p>
                        <p style="color: white;">
                                        <p style=color:#fff>
                                            <%-lyrics%>
                                        </p> 
                                                                      <% } %>

                                        <% } %>                                      </details>
    <div style="font-family:Inter,sans-serif;font-weight:900;white-space:yes;" align="center">
                                 <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
<br>
       <a href="https://youtube.com/watch?v=<%=video.id%>">Open On YouTube</a> • <a href="/privacy">Privacy</a> • <a href="https://github.com/iamashley0/poketube/">Git</a> 
       </div> 
                                                                        
               
      <% if (optout) { %> 
        
 <% } %>
     
      <% if (!optout) { %> 
        
                  <div style="font-family:Inter,sans-serif;font-weight:900;white-space:yes;" align="center">

<a href="/watch?v=<%=video.id%>&t=f"> 
 Opt out of Metrics</a> (<a href="/privacy" style="color:#fff">Wut?</a>)
               
   </div>
     <% } %>
            

            	           <% if (lyrics && !r) { %>
                                             <div style="font-family:Inter,sans-serif;font-weight:900;white-space:yes;" align="center">

      <% if (optout) { %> 
     <a href="/watch?v=<%=video.id%>&r=f">Lyrics (Wow)</a>


  <% } %> 
         <% if (!optout) { %> 
                       <a href="/watch?v=<%=video.id%>&r=f">Lyrics (Wow)</a>
 <% } %>
                    </div>
                           <% } %> 
                     </div>
 
	</div>  
 
   
 <% if (!optout) { %> 
          <!-- MORE INFO :https://poketube.fun/privacy -->
          <!-- MORE INFO :https://poketube.fun/privacy -->
       
          <!-- if you want to change the url - please see config in server.js  -->
        
         <!-- START <%=t%> -->  
   
        <!-- SESSION -->
        <img src="<%=t%>t/rep.gif?ID=<%=btoa(Date.now())%>" style="width: 0;visibility: hidden;" id="SesionID">
        <img src="<%=t%>t/rep.gif?piwik=t" style="width: 0;visibility: hidden;" id="piwik_noip_no_personal-info_collect">
   
        <!-- VIDEO -->
        <img src="<%=t%>t/rep.gif?video_id=<%=btoa(video.id)%>" style="width: 0;visibility: hidden;" id="videoID">
        <img src="<%=t%>t/rep.gif?channel_ID=<%=btoa(video.Channel.id)%>" style="width: 0;visibility: hidden;" id="channel">
   

        <!-- END <%=t%> -->  

 <% } %>
</div>
 
</body>
</html>

  <% } %>

     <% if (isMobile) { %> 

     <!--
    This Source Code Form is subject to the terms of the GNU General Public License:

    Copyright (C) 2021-2022 POKETUBE (https://github.com/iamashley0/poketube)
    
    This program is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    This program is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with this program. If not, see https://www.gnu.org/licenses/.
-->
<!DOCTYPE html>
  <% if (e === false) { %> <!-- if ?e=false,dont show up the meta tags  -->
    
 <% } %>
  <% if (!e) { %>
<meta content="<%=video.Title%>" name=title>
<meta content="<%=color%>" name="theme-color">
<meta content="<%=video.Channel.Name%>" name=twitter:author>
<meta content=@youtube name=twitter:site>
<meta content="https://poketube.fun/watch?v=<%=video.id%>" name=twitter:url>
<meta content="<%=video.Title%> - PokeTube" name=twitter:title>
<meta content="mobile this video by <%=video.Channel.Name%> On PokeTube. The YouTube front-end that doesnt track you!" property=twitter:description>
<meta content="https://i.ytimg.com/vi/<%=video.id%>/maxresdefault.jpg" property=og:image>
<meta content=summary_large_image name=twitter:card>
<link href="https://poketube.fun/watch?v=<%=video.id%>" itemprop=url>
 <% } %> <!-- close the } -->
<meta name="viewport" content="width=device-width,initial-scale=1">
<link href=/css/yt-ukraine.svg?v=6 rel=icon>
<title> <%=video.Title%> - PokeTube Mobile</title>
<link href="https://p.poketube.fun/https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap" rel=stylesheet>
 <link href="https://p.poketube.fun/https://tube.kuylar.dev/css/mobile.css" rel=stylesheet>
 <link href=/css/app.main.css rel=stylesheet>
<link href="https://p.poketube.fun/https://fonts.googleapis.com/css2?family=Inter:wght@900&family=Sigmar+One&display=swap" rel=stylesheet>
    <link href=https://site-assets.fontawesome.com/releases/v6.1.1/css/all.css rel=stylesheet>
<style>
   a.class:hover {
    text-decoration:underline;
    font-weight:bold
}
  summary{
    color:gray;
}
summary:hover{
    color:white;
}
</style>
  <!-- WIGGLE WIGGLE WIGGLE -->
  <style>
    
    
    
    body{
         max-width: 100%;
        overflow-x: hidden; /* Hide horizontal scrollbar */
        color:#111111
    }
    html, body {
  overflow-x: hidden;
}
body {
  position: relative
}
   .animated {
            -webkit-animation-duration: 10s; 
            animation-duration: 10s; 
            -webkit-animation-fill-mode: both;
            animation-fill-mode: both; 
            animation-iteration-count: infinite;
            -moz-animation-iteration-count: infinite;
            -webkit-animation-iteration-count: infinite;
            -o-animation-iteration-count: infinite;
         }
             .v-chip:not(.v-chip--outlined).accent,
.v-chip:not(.v-chip--outlined).error,
.v-chip:not(.v-chip--outlined).info,
.v-chip:not(.v-chip--outlined).primary,
.v-chip:not(.v-chip--outlined).secondary,
.v-chip:not(.v-chip--outlined).success,
.v-chip:not(.v-chip--outlined).warning {
 color:#fff
}
.theme--light.v-chip {
 border-color:rgba(0,0,0,.12);
 color:rgba(0,0,0,.87)
}
.theme--light.v-chip:not(.v-chip--active) {
 background:#e0e0e0
}
.theme--light.v-chip:hover:before {
 opacity:.04
}
.theme--light.v-chip--active:before,
.theme--light.v-chip--active:hover:before,
.theme--light.v-chip:focus:before {
 opacity:.12
}
.theme--light.v-chip--active:focus:before {
 opacity:.16
}
.theme--dark.v-chip {
 border-color:hsla(0,0%,100%,.12);
 color:#fff
}
.theme--dark.v-chip:not(.v-chip--active) {
 background:#555
}
.theme--dark.v-chip:hover:before {
 opacity:.08
}
.theme--dark.v-chip--active:before,
.theme--dark.v-chip--active:hover:before,
.theme--dark.v-chip:focus:before {
 opacity:.24
}
.theme--dark.v-chip--active:focus:before {
 opacity:.32
}
.v-chip {
 align-items:center;
 cursor:default;
 display:inline-flex;
 line-height:20px;
 max-width:100%;
 outline:none;
 overflow:hidden;
 padding:0 12px;
 position:relative;
 text-decoration:none;
 transition-duration:.28s;
 transition-property:box-shadow,opacity;
 transition-timing-function:cubic-bezier(.4,0,.2,1);
 vertical-align:middle;
 white-space:nowrap
}
.v-chip:before {
 background-color:currentColor;
 bottom:0;
 border-radius:inherit;
 content:"";
 left:0;
 opacity:0;
 position:absolute;
 pointer-events:none;
 right:0;
 top:0
}
.v-chip .v-avatar {
 height:24px!important;
 min-width:24px!important;
 width:24px!important
}
.v-chip .v-icon {
 font-size:24px
}
.v-application--is-ltr .v-chip .v-avatar--left,
.v-application--is-ltr .v-chip .v-icon--left {
 margin-left:-6px;
 margin-right:6px
}
.v-application--is-ltr .v-chip .v-avatar--right,
.v-application--is-ltr .v-chip .v-icon--right,
.v-application--is-rtl .v-chip .v-avatar--left,
.v-application--is-rtl .v-chip .v-icon--left {
 margin-left:6px;
 margin-right:-6px
}
.v-application--is-rtl .v-chip .v-avatar--right,
.v-application--is-rtl .v-chip .v-icon--right {
 margin-left:-6px;
 margin-right:6px
}
.v-chip:not(.v-chip--no-color) .v-icon {
 color:inherit
}
.v-chip .v-chip__close.v-icon {
 font-size:18px;
 max-height:18px;
 max-width:18px;
 -webkit-user-select:none;
 -moz-user-select:none;
 -ms-user-select:none;
 user-select:none
}
.v-application--is-ltr .v-chip .v-chip__close.v-icon.v-icon--right {
 margin-right:-4px
}
.v-application--is-rtl .v-chip .v-chip__close.v-icon.v-icon--right {
 margin-left:-4px
}
.v-chip .v-chip__close.v-icon:active,
.v-chip .v-chip__close.v-icon:focus,
.v-chip .v-chip__close.v-icon:hover {
 opacity:.72
}
.v-chip .v-chip__content {
 align-items:center;
 display:inline-flex;
 height:100%;
 max-width:100%
}
.v-chip--active .v-icon {
 color:inherit
}
.v-chip--link:before {
 transition:opacity .3s cubic-bezier(.25,.8,.5,1)
}
.v-chip--link:focus:before {
 opacity:.32
}
.v-chip--clickable {
 cursor:pointer;
 -webkit-user-select:none;
 -moz-user-select:none;
 -ms-user-select:none;
 user-select:none
}
.v-chip--clickable:active {
 box-shadow:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12)
}
.v-chip--disabled {
 opacity:.4;
 pointer-events:none;
 -webkit-user-select:none;
 -moz-user-select:none;
 -ms-user-select:none;
 user-select:none
}
.v-chip__filter {
 max-width:24px
}
.v-chip__filter.v-icon {
 color:inherit
}
.v-chip__filter.expand-x-transition-enter,
.v-chip__filter.expand-x-transition-leave-active {
 margin:0
}
.v-chip--pill .v-chip__filter {
 margin-right:0 16px 0 0
}
.v-chip--pill .v-avatar {
 height:32px!important;
 width:32px!important
}
.v-application--is-ltr .v-chip--pill .v-avatar--left {
 margin-left:-12px
}
.v-application--is-ltr .v-chip--pill .v-avatar--right,
.v-application--is-rtl .v-chip--pill .v-avatar--left {
 margin-right:-12px
}
.v-application--is-rtl .v-chip--pill .v-avatar--right {
 margin-left:-12px
}
.v-chip--label {
 border-radius:4px!important
}
.v-chip.v-chip--outlined {
 border-width:thin;
 border-style:solid
}
.v-chip.v-chip--outlined.v-chip--active:before {
 opacity:.08
}
.v-chip.v-chip--outlined .v-icon {
 color:inherit
}
.v-chip.v-chip--outlined.v-chip.v-chip {
 background-color:transparent!important
}
.v-chip.v-chip--selected {
 background:transparent
}
.v-chip.v-chip--selected:after {
 opacity:.28
}
.v-chip.v-size--x-small {
 border-radius:8px;
 font-size:10px;
 height:16px
}
.v-chip.v-size--small {
 border-radius:12px;
 font-size:12px;
 height:24px
}
.v-chip.v-size--default {
 border-radius:16px;
 font-size:14px;
 height:32px
}
.v-chip.v-size--large {
 border-radius:27px;
 font-size:16px;
 height:54px
}
.v-chip.v-size--x-large {
 border-radius:33px;
 font-size:18px;
 height:66px
}
         @-webkit-keyframes wiggle { 
            0% { -webkit-transform: skewX(9deg); }
            10% { -webkit-transform: skewX(-8deg); }
            20% { -webkit-transform: skewX(7deg); }
            30% { -webkit-transform: skewX(-6deg); }
            40% { -webkit-transform: skewX(5deg); } 
            50% { -webkit-transform: skewX(-4deg); } 
            60% { -webkit-transform: skewX(3deg); }
            70% { -webkit-transform: skewX(-2deg); } 
            80% { -webkit-transform: skewX(1deg); } 
            90% { -webkit-transform: skewX(0deg); }
            100% { -webkit-transform: skewX(0deg); } 
         }
         
         @keyframes wiggle { 
            0% { transform: skewX(9deg); } 
            10% { transform: skewX(-8deg); } 
            20% { transform: skewX(7deg); } 
            30% { transform: skewX(-6deg); } 
            40% { transform: skewX(5deg); } 
            50% { transform: skewX(-4deg); } 
            60% { transform: skewX(3deg); } 
            70% { transform: skewX(-2deg); } 
            80% { transform: skewX(1deg); } 
            90% { transform: skewX(0deg); } 
            100% { transform: skewX(0deg); } 
         }
         
         .wiggle { 
            -webkit-animation-name: wiggle;
            animation-name: wiggle; 
            -webkit-animation-timing-function: ease-in;
            animation-timing-function: ease-in; 
         }
         
         .animated.wiggle { 
            -webkit-animation-duration: 0.75s; 
            animation-duration: 0.75s;
         }
    
    :root {
    --text-primary: #fff;
    --text-secondary: #fff;
    --text-link: #3ea6ff;

    --app-background: #0A0101;
    --context-menu-background: #333;
    --border-color: #444;
    --item-hover-background: #373737;
    --item-active-background: #383838;

    --top-bar-background: #202020;
    --guide-background: #212121;

    --thumbnail-background: #252525;

    --channel-info-background: #181818;
    --channel-contents-background: #0f0f0f;
}
          @font-face {
        font-family: 'Ginto Nord';
        font-weight: 800;
        src:url('https://cdn.statically.io/gh/brecert/discord-quote-generator/main/Ginto-Nord-800.woff') format("woff");
      }

.alert {
  padding: 20px;
  background-color: #f44336;
  color: white;
  opacity: 1;
  transition: opacity 0.6s;
  margin-bottom: 15px;
}

.alert.success {background-color: #04AA6D;}
.alert.info {background-color: #2196F3;}
.alert.warning {background-color: #ff9800;}

.closebtn {
  margin-left: 15px;
  color: white;
  font-weight: bold;
  float: right;
  font-size: 22px;
  line-height: 20px;
  cursor: pointer;
  transition: 0.3s;
}

.closebtn:hover {
  color: black;
}
    
        :visited { color: #00c0ff }
     
a{
  color:#0ab7f0;
}
    .fromtheweb-outer{
display: flex;
flex-wrap: wrap;
justify-content: space-between;
-moz-box-pack: justify;
padding: 10px;
margin-bottom: 12px;
border-bottom-right-radius: 10px;
border-bottom-left-radius: 10px;
    }
        .fromtheweb-inner{
    -moz-box-align: center;
text-align:left;
font-size: 14px;
-moz-box-pack: center;
justify-content: center;
padding: 0px 0px;
line-height: 18px;
     }
  </style>
  <style>body, html { margin: 0; padding: 0; } * { font-family: sans-serif; color:#fff } .player { background-color: #000 !important; display: grid; grid-template-columns: 1fr min-content; grid-template-rows: max-content 1fr max-content max-content max-content; gap: 0 0; width: 100%; /* height: 100%; */ aspect-ratio: 16 / 9; } .player * { color: #fff; } .player.embed, video.embed { position: fixed; top: 0; bottom: 0; left: 0; right: 0; } .player * { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .player > video { position: relative; width: 100%; height: 100%; z-index: 0; grid-area: 1 / 1 / 6 / 3; } .player.hide-controls > .player-title, .player.hide-controls > .player-controls, .player.hide-controls > .player-playback-bar-container, .player.hide-controls > .player-menu { display: none !important; } .player-controls { background-color: #0007; display: flex; justify-content: center; align-items: center; z-index: 1; grid-area: 1 / 1 / 6 / 3; } .player-button { width: 96px; height: 96px; font-size: 90px; text-align: center; line-height: 48px; } .player-tiny-button { width: 40px; font-size: 20px; text-align: center; } .player-tiny-button > i { color: #ddd; } .player-button, .player-button * { color: #dddddd !important; text-decoration: none; } .player-button > i { min-width: 48px; } .player-button:hover, .player-button:hover * { color: #fff !important; } .player-playback-bar { transition: width linear 100ms; } .player-playback-bar-container { grid-area: 4 / 1 / 5 / 3; display: flex; column-gap: 8px; justify-content: center; align-items: center; height: 8px; transition: height linear 100ms; width: 100%; z-index: 2; margin-bottom: 10px; } .player-playback-bar-bg { background-color: #fff3 !important; width: 100%; height: 100%; z-index: 2; display: grid; grid-template-columns: 1fr; grid-template-rows: 1fr; } .player-playback-bar-bg > * { grid-area: 1 / 1 / 2 / 2; } .player-playback-bar-buffer { background-color: #fffa !important; height: 100%; width: 0; z-index: 3; } .player-playback-bar-fg { background-color: #f00 !important; height: 100%; width: 0; z-index: 4; } .player-buffering { grid-area: 1 / 1 / 6 / 3; z-index: 1; display: flex; justify-content: center; align-items: center; } .player-buffering-spinner { width: 80px; height: 80px; }</style>
  <body>
<div class="app" style="color:#fff;margin-top: 0;">
    <nav >
      <div class=left><a class="class" href="/" style=font-family:Inter,sans-serif;color:#fff> <img style="width: 8.5em;display: block;margin-left: auto;margin-right: auto;" src="/css/logo-mobile.svg">      </a>
      </div>
              <a name="top"></a>
        </nav>
	   <div class="mobile-page">
	<div class="primary">
		<div class="video-player-container" style="background-color:#000">
					<video class="player" autoplay style="border-radius: 6px;" controls src="<%=url%>" poster="https://i.ytimg.com/vi/<%=video.id%>/hqdefault.jpg?v=607ddcd4">
               <%  if (Array.isArray( video.Subtitles.Subtitle)) { %> 

    <% if (  video.Subtitles.Subtitle) { %>  

   <% video.Subtitles.Subtitle.forEach(x => { %><track src="/api/subtitles?v=<%=video.id%>&h=<%= x.language %>" label="<%= x.language %>" kind="subtitles">                                                             
         <% }) %>   
                                                                                                       <% } %>               
                                                           <% } %>                
 					</video>
                                          <div style="display: flex;justify-content: center;align-items: center;flex-direction: row; column-gap: 3px;" align="center">
                                
  <% if (!qua) { %> 

                                 <i style="display: block;" title="High Definition [Current]" class="fa-solid fa-high-definition"></i> <a href="/watch?v=<%=video.id%>&quality=medium"><i style="display: block;" title="Standard Definition" class="fa-light fa-standard-definition"></i></a>
                                                                      <% } %>               
                               <% if (qua) { %> 
                                 <a href="/watch?v=<%=video.id%>">  <i style="display: block;"  title="High Definition" class="fa-light fa-high-definition"></i> </a>  <i style="display: block;" title="Standard Definition [Current]"  class="fa-solid fa-standard-definition"></i>

                                                                      <% } %>               

       </div>                                                 
 		</div>
			<div class="video-info">
        <div class="video-title" style="font-family:'Inter';font-weight:900;white-space:yes;"><%=video.Title%> </div>
 				<div class="video-info-bar" style="font-family:'Inter';">
					<div class="divider"></div>
         	<div class="divider"></div>
          					<%=engagement.viewCount.toLocaleString()%> Views - Uploaded at <%=date%> :3
<div class="video-info-buttons" style="font-family:'Inter';font-weight:900;white-space:yes;background-color: #333;border-radius: 15px;margin: 6px;align-self: center;align-items: center;">
  <div>
   <i class="fa-light fa-thumbs-up"  style="font-size:x-large" ></i>
     <%=convert(engagement.likes)%>
       </div>
              <div>
 <i class="fa-light fa-thumbs-down"  style="font-size:x-large" ></i><%=convert(engagement.dislikes)%>
                </div>
					<a style="color:#fff" href="/download?v=<%=video.id%>&from=mobile">   
            <i style="font-size:x-large" class="fa-light fa-download"></i>
            Download
					</a>
            <a style="color:#fff" onclick="share()">   
            <i style="font-size:x-large" class="fa-light fa-share"></i>
            Share
					</a>
 	<a style="color:#fff" href="#more"> <i style="font-size:x-large;color:#fff" class="fa-thin fa-circle-plus"></i>More.. </a>
            </div>
				</div>
					<div class="channel-info" name="chnl">
				<a href="/channel?id=<%=video.Channel.id%>" class="avatar">
					<img src=" <%= k.Video.Channel.Avatar[1].$t %>">
				</a>
				<div class="name" style="font-family:'Ginto Nord'">
		  <div>
						<a style="color:#fff" href="/channel?id=<%=k.Video.Channel.id%>" >  <%=k.Video.Channel.Name%></a>   
            
              <% if (!video.Channel.Name.endsWith(' - Topic')) { %>  
            
               <% if (badges) { %> 

              <% if (badges.tooltip === "Verified") { %> 
<i class="fa-solid fa-badge-check" title="<%=badges.tooltip%>"></i>
            <% } %>  <% if (badges.tooltip === "Official Artist Channel") { %> 
<i class="fa-solid fa-music-note" title="<%=badges.tooltip%>"></i>
             <% } %>             <% } %>  <% } %> 
               
		<div class="subscriber-count">
          <%= k.Video.Channel.subscriberCount %>
 				</div>
              </div>
				</div>
		 
				<button class="subscribe-button" ><a style="color:#fff" href="https://www.youtube.com/channel/<%=video.Channel.id%>?view_as=subscriber?sub_confirmation=1">Suscribe</a></button>
			</div>
                        <div>
                <div>
 
<h3 style="color:#fff;font-family:Ginto Nord,sans-serif;font-weight:700;white-space:yes;"> Description</h3>
                               <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;"> 

        			<p class="description"><%-String(video.Description).replace(/\n/g, " <br> ")%> </p>
 
                            </div> 
          <div>
                    <div style="justify-content: center;display: flex;padding: 11px;font-family: Ginto nord;gap: 3px;background: #1f1f1f;border-top-left-radius: 10px;border-top-right-radius: 10px;">
More from  <%=k.Video.Channel.Name%>
          </div>  
                            <div style="justify-content: center;display: flex;padding: 11px;font-family: Ginto nord;gap: 3px;background: #1f1f1f;">
                             
<div style="border-radius: 5px;background: #333;width: fit-content;padding: 18px;">
		<a style="color:#fff" href="/channel?id=<%=k.Video.Channel.id%>&tab=about" > 

  <i class="fa-thin fa-square-user"></i> About
  </a>
                       </div>                     

                     <div style="border-radius: 5px;background: #333;width: fit-content;padding: 17px;">
		<a style="color:#fff" href="/channel?id=<%=k.Video.Channel.id%>" > 
      <i class="fa-thin fa-play"></i> Videos </a>
                       </div>      
                              

                              
            </div>  
                                                           <div style="background:#181818;" class="fromtheweb-outer">
                          <div class="fromtheweb-inner">
                             
                   <% if (wiki.extract_html) { %> 
<div class="video-title" style="color:#fff;font-family:Ginto Nord,sans-serif;font-weight:700;margin-top: 10px;margin-bottom: 10px;text-aligin:left;">From da web</div>
                     
<hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">

  <b><%-wiki.extract_html%>
   
<p style="margin-bottom: 10px;">

  <a href=" <%-wiki.content_urls.desktop.page%>
 ">From wikipedia </a> under CC-BY-SA 3.0
    </p></b>
 
                 
                      <% } %>  
                                 <% if (!wiki.extract_html) { %> 
                                                                    <% if (desc) { %> 

<div class="video-title" style="color:#fff;font-family:Ginto Nord,sans-serif;font-weight:700;margin-top: 10px;margin-bottom: 10px;text-aligin:left;">About This Channel</div>
                     
<hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;/*! width: 4.5em; */height: 0;">

<p><b><%-desc%></b></p>
 
                 
                      <% } %>                        <% } %>  

                        
                          </div>
 			</div> 
                     
                          </div>
                          <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
                           <div>
 			</div>    <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
                           <div>
                   <div class="video-title" style="font-family:'Ginto Nord';font-weight:900;white-space:yes;margin-top: 10px;">Comments    </div>
                                                        <div style="padding:0">
              <% if (!video.Channel.Name.endsWith(' - Topic')) { %>  
                               <% if (comments) { %>
                                          <p>
                                           theres <%=comments%> total comments rigth now on this video. view em on <a href="https://invidio.us/watch?v=<%=video.id%>">invidious</a>
                             </p>
                                                                       <% } %>                                                                       <% } %>

              <% if (video.Channel.Name.endsWith(' - Topic')) { %>  
                                 disabled for topic channels                                      <% } %>

               </div>
 
                                 <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;"> 
               </div>
                 
 	</div>
 	 <div class="secondary" style="padding-top: 0;">

		<div class="recommended-list" style="color:#fff">
    
                              <% if (!r) { %> 
                                 
                                
                              
                                
                              <% if (!f) { %> 
                                              <% if (!video.Channel.Name.endsWith(' - Topic')) { %>  

<div style="display: flex;column-gap: 2.5px;align-self: center;padding-top: 5px;" align="center"> 
  <span tabindex="0" draggable="false" style="font-weight: bold;"  class="v-chip  v-chip--clickable v-chip--active v-chip--no-color theme--dark v-size--default"><a class="v-chip__content">
          Recommendations
        </span></a>
                                            <span tabindex="0" draggable="false" class="v-chip v-chip--clickable v-chip--no-color theme--dark v-size--default"> <a style="color:#fff;text-decoration: none;" href="/watch?v=<%=video.id%>&f=t" class="v-chip__content">
From  <%=video.Channel.Name%> </span></a>
                                </a>
                        
 
                                                            </div>                                 
                           <% } %>                           <% } %>

                               <% if (f) { %> 
              <% if (!video.Channel.Name.endsWith(' - Topic')) { %>  

<div style="display: flex;column-gap: 2.5px;align-self: center;padding-top: 5px;" align="center"> 
                                  <span tabindex="0" draggable="false" class="v-chip  v-chip--clickable v-chip--active v-chip--no-color theme--dark v-size--default"><a href="/watch?v=<%=video.id%>" style="color:#fff;text-decoration:none;" class="v-chip__content">
          Recommendations
        </span></a>
                                            <span tabindex="0" draggable="false" class="v-chip v-chip--clickable v-chip--no-color theme--dark v-size--default" style="font-weight: bold;" ><a style="color:#fff;text-decoration: none;"  class="v-chip__content">
From <%=video.Channel.Name%> </span></a>
                                </a>
                        
 
                                                            </div>                                 
                           <% } %>                           <% } %>

                             
                              <% if (!f) { %> 
     <% k.Video.Recommendations.Video.forEach(x => { %>       
 						<div class="video">
                    <% if (!optout) { %> 

      <a  href="/watch?v=<%= x.id %>" class="thumbnail" style="background-image: url('https://p.poketube.fun/https://i.ytimg.com/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw');border-radius: 9.5px;"  >								<span class="video-length"><%=x.duration %></span>
                           <% } %>
   <% if (optout) { %> 

      <a  href="/watch?v=<%= x.id %>&t=f" class="thumbnail" style="background-image: url('https://p.poketube.fun/https://i.ytimg.com/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw');border-radius: 9.5px;"  >								<span class="video-length"><%=x.duration %></span>
                           <% } %>
							</a>
							<div class="info">
                
      <% if (!optout) { %> 
								<a href="/watch?v=<%= x.id %>" class="title max-lines-2"><%= x.Title %></a>
                   <% } %>
   <% if (optout) { %> 
								<a href="/watch?v=<%= x.id %>&t=f" class="title max-lines-2"><%= x.Title %></a>
                   <% } %>
								<div  style="color:#fff" >
               <a class="max-lines-2" style="color:#fff" href="/channel?id=<%= x.Channel.id %>"><%=x.Channel.Name %></a> • <div>
  <%= x.uploadedAt %>  </div>
								</div>
							</div>
						</div>
 
       <% }) %>   
                            <% } %>
 
     <% if (f) { %> 

     <% tj.Channel.Contents.ItemSection.ItemSection.Video.forEach(x => { %>       
 						<div class="video">
                    <% if (!optout) { %> 

      <a  href="/watch?v=<%= x.id %>" class="thumbnail" style="background-image: url('https://p.poketube.fun/https://i.ytimg.com/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw');border-radius: 9.5px;"  >								<span class="video-length"><%=x.duration %></span>
                           <% } %>
   <% if (optout) { %> 

      <a  href="/watch?v=<%= x.id %>&t=f" class="thumbnail" style="background-image: url('https://p.poketube.fun/https://i.ytimg.com/vi/<%= x.id %>/hqdefault.jpg?sqp=-oaymwEbCKgBEF5IVfKriqkDDggBFQAAiEIYAXABwAEG&rs=AOn4CLBy_x4UUHLNDZtJtH0PXeQGoRFTgw');border-radius: 9.5px;"  >								<span class="video-length"><%=x.duration %></span>
                           <% } %>
							</a>
							<div class="info">
       <% if (!optout) { %> 
								<a href="/watch?v=<%= x.id %>" class="title max-lines-2"><%= x.Title %></a>
                   <% } %>
   <% if (optout) { %> 
								<a href="/watch?v=<%= x.id %>&t=f" class="title max-lines-2"><%= x.Title %></a>
                   <% } %>
								<div>
               <a class="max-lines-2" style="color:#fff"  href="/channel?id=<%= video.Channel.id %>"><%=video.Channel.Name %></a>
									<div>
 <%= x.uploadedAt %>  </div>
								</div>
							</div>
						</div>
 
       <% }) %>   
                            <% } %>
                              <a name="more"></a>
                                      <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
                               
<h3 style="text-align:center;color:#fff;font-family:Ginto Nord,sans-serif;font-weight:700;white-space:yes"> MOAR                </h3>
                              <p style="text-align:center;color:#fff; font-weight:700;white-space:yes;margin:0">More Epic options owo~</p>
                  <div style="font-family:Inter,sans-serif;font-weight:900;white-space:yes;" align="center">
     <a href="https://youtube.com/watch?v=<%=video.id%>">Open On YouTube</a> •  <a href="/privacy">Privacy</a> • <a href="https://github.com/iamashley0/poketube/">Git</a> 
                                <% if (optout) { %> 
 <% } %>
      <% if (!optout) { %> 
 • <a href="/watch?v=<%=video.id%>&t=f"> 
 Opt out of Metrics</a> (<a href="/privacy" style="color:#fff">Wut?</a>) 
     <% } %>
                        <% if (lyrics && !r) { %>                      
      <% if (optout) { %> 
                 <br>    <br>     <a href="/watch?v=<%=video.id%>&r=f">  Lyrics (Wow) </a> 
  <% } %>
         <% if (!optout) { %> 
             <br>   <br>          <a href="/watch?v=<%=video.id%>&r=f" >  Lyrics (Wow) </a> 
 <% } %>
                            <% } %> 
                          
            <% } %>                                     
                    <p><i class="fa-light fa-shield"></i> The Connection is secured with ECDSA with SHA-384 Signature Algorithm :3 </p>          
                 <div align="center">
                     <a href="/encryption?v=<%=video.id%>">Click here for encryption info</a><br> 
                                             
                    </div><br>
              <a href="#top">Go To Top</a>
              </div>
                           
                              
 
                                    
               
                              
      	           <% if (lyrics) { %>
                                                  <% if (r === "f") { %> 
                                <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
                                                    <p>
            <a href="/watch?v=<%=video.id%>">See the Recommended videos instead</a> - <a href="https://github.com/iamashley0/poketube/issues">Report wrong lyrics qwq</a>
                                                    </p>
         <div align="center">                                <hr style="clear: both;display: block;border: none;border-bottom: 0.5px solid #2f2f2f;margin: 0 0;/*! width: 4.5em; */height: 0;">
                                                              <h1 style="font-family:'Ginto Nord',sans-serif;font-weight:900;white-space:yes;" align="center">
 Lyrics 
                        </h1>  
           <p>
 See how our lyrics search works:<a href="https://github.com/iamashley0/poketube/blob/main/src/lyrics.js">Here</a>
           </p>
                        <p style="color: white;">
                                        <p style=color:#fff>
                                            <%-lyrics%>
                                        </p> 
                           
                                          <% } %>
 
                                        <% } %>         
                                  
 		</div>
 </div>
  <script type="text/javascript">
<!--//--><![CDATA[//><!--
/**
 * @licstart The following is the entire license notice for the JavaScript
 * code in this page.
 *
 *  Copyright (C) 2021-2022 POKETUBE (https://github.com/iamashley0/poketube)
 *
 * The JavaScript code in this page is free software: you can redistribute
 * it and/or modify it under the terms of the GNU General Public License
 * (GNU GPL) as published by the Free Software Foundation, either version 3
 * of the License, or (at your option) any later version.  The code is
 * distributed WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the GNU GPL
 * for more details.
 *
 * As additional permission under GNU GPL version 3 section 7, you may
 * distribute non-source (e.g., minimized or compacted) forms of that code
 * without the copy of the GNU GPL normally required by section 4, provided
 * you include this license notice and a URL through which recipients can
 * access the Corresponding Source.
 *
 * @licend The above is the entire license notice for the JavaScript code
 * in this page.
 */

//--><!]]>
</script>
 <script>  
   // @license magnet:?xt=urn:btih:1f739d935676111cfff4b4693e3816e664797050&dn=gpl-3.0.txt GPL-3.0-or-later
 function share(){
   if (navigator.share) {
  navigator.share({
    title: document.title,
    text: "",
    url: window.location.href + "&pk=m"
  })
  .then(() => console.log('Successful share'))
  .catch(error => console.log('Error sharing:', error));
}
 }
     // @license-end
                                          </script>
 <% if (!optout) { %> 
          <!-- MORE INFO :https://poketube.fun/privacy -->
          <!-- MORE INFO :https://poketube.fun/privacy -->
   
          <!-- if you  want to change the url - please see config in server.js  -->
   
         <!-- START <%=t%> -->  
  <!-- mobile only -->
   <!-- dont use matomo.php, as its being blocked by ublock origin. -->
        <img src="<%=t%>t/index.php?idsite=5&amp;rec=1" style="width: 0;visibility: hidden;border:0;"  alt="" >
  <!--- mobile only -->
   
        <img src="<%=t%>t/rep.gif?ID=<%=btoa(Date.now())%>" style="width: 0;visibility: hidden;" id="SesionID">
        <img src="<%=t%>t/rep.gif?video_id=<%=btoa(video.id)%>" style="width: 0;visibility: hidden;" id="videoID">
        <img src="<%=t%>t/rep.gif?channel_ID=<%=btoa(video.Channel.id)%>" style="width: 0;visibility: hidden;" id="channel">
        <img src="<%=t%>t/rep.gif?piwik=t" style="width: 0;visibility: hidden;" id="piwik_noip_no_personal-info_collect">
        <!-- END <%=t%> -->  
 <% } %>
</div>
 
</body>
</html>
  </body>
  <% } %>

