fca-sakibin-remarsted 3.5.3 → 3.5.4

package/.cache/replit/__replit_disk_meta.json

@@ -1 +1 @@
-{"nonce":4436330746368693168,"last_updated":{"seconds":1697268720,"nanos":790821000}}
+{"nonce":7919033809045595087,"last_updated":{"seconds":1697285950,"nanos":51656000}}

package/Extra/Html/Classic/script.js

@@ -1,119 +1,495 @@
-var c = document.getElementById("myCanvas");
-var ctx = c.getContext("2d");
-var mask;
-
-var pointCount = 500;
-var str = "SAKIBIN";
-var fontStr = "bold 100pt Helvetica Neue, Helvetica, Arial, sans-serif";
-
-ctx.font = fontStr;
-ctx.textAlign = "auto";
-c.width = (ctx.measureText(str).width);
-c.height = 100; // Set to font size
-
-var whitePixels = [];
-var points = [];
-var point = function(x,y,vx,vy){
-  this.x = x;
-  this.y = y;
-  this.vx = vx || 1;
-  this.vy = vy || 1;
-};
-point.prototype.update = function() {
-  ctx.beginPath();
-  ctx.fillStyle = "#95a5a6";
-  ctx.arc(this.x,this.y,1,0,2*Math.PI);
-  ctx.fill();
-  ctx.closePath();
+/*
+   DHTML Snowstorm! OO-style Jascript-based Snow effect
+   ----------------------------------------------------
+   Version 1.4.20091115 (Previous rev: v1.3.20081215)
+   Code by Scott Schiller - http://schillmania.com
+   ----------------------------------------------------
   
-  // Change direction if running into black pixel
-  if (this.x+this.vx >= c.width || this.x+this.vx < 0 || mask.data[coordsToI(this.x+this.vx, this.y, mask.width)] != 255) {
-    this.vx *= -1;
-    this.x += this.vx*2;
+   Initializes after body onload() by default (via addEventHandler() call at bottom.)
+   To customize properties, edit below or override configuration after this script
+   has run (but before body.onload), eg. snowStorm.snowStick = false;
+
+*/
+
+var snowStorm = null;
+
+function SnowStorm() {
+
+  // --- PROPERTIES ---
+
+  this.flakesMax = 128;           // Limit total amount of snow made (falling + sticking)
+  this.flakesMaxActive = 64;      // Limit amount of snow falling at once (less = lower CPU use)
+  this.animationInterval = 33;    // Theoretical "miliseconds per frame" measurement. 20 = fast + smooth, but high CPU use. 50 = more conservative, but slower
+  this.flakeBottom = null;        // Integer for Y axis snow limit, 0 or null for "full-screen" snow effect
+  this.targetElement = null;      // element which snow will be appended to (document body if null/undefined) - can be an element ID string, or a DOM node reference
+  this.followMouse = true;        // Snow will change movement with the user's mouse
+  this.snowColor = '#fff';        // Don't eat (or use?) yellow snow.
+  this.snowCharacter = '&bull;';  // &bull; = bullet, &middot; is square on some systems etc.
+  this.snowStick = true;          // Whether or not snow should "stick" at the bottom. When off, will never collect.
+  this.useMeltEffect = true;      // When recycling fallen snow (or rarely, when falling), have it "melt" and fade out if browser supports it
+  this.useTwinkleEffect = false;  // Allow snow to randomly "flicker" in and out of view while falling
+  this.usePositionFixed = false;  // true = snow not affected by window scroll. may increase CPU load, disabled by default - if enabled, used only where supported
+
+  // --- less-used bits ---
+
+  this.flakeLeftOffset = 0;       // amount to subtract from edges of container
+  this.flakeRightOffset = 0;      // amount to subtract from edges of container
+  this.flakeWidth = 8;            // max pixel width for snow element
+  this.flakeHeight = 8;           // max pixel height for snow element
+  this.vMaxX = 5;                 // Maximum X velocity range for snow
+  this.vMaxY = 4;                 // Maximum Y velocity range
+  this.zIndex = 0;                // CSS stacking order applied to each snowflake
+
+  // --- End of user section ---
+
+  // jslint global declarations
+  /*global window, document, navigator, clearInterval, setInterval */
+
+  var addEvent = (typeof(window.attachEvent)=='undefined'?function(o,evtName,evtHandler) {
+	return o.addEventListener(evtName,evtHandler,false);
+  }:function(o,evtName,evtHandler) {
+	return o.attachEvent('on'+evtName,evtHandler);
+  });
+
+  var removeEvent = (typeof(window.attachEvent)=='undefined'?function(o,evtName,evtHandler) {
+    return o.removeEventListener(evtName,evtHandler,false);
+  }:function(o,evtName,evtHandler) {
+	return o.detachEvent('on'+evtName,evtHandler);
+  });
+
+  function rnd(n,min) {
+    if (isNaN(min)) {
+	  min = 0;
+	}
+    return (Math.random()*n)+min;
   }
-  if (this.y+this.vy >= c.height || this.y+this.vy < 0 || mask.data[coordsToI(this.x, this.y+this.vy, mask.width)] != 255) {
-    this.vy *= -1;
-    this.y += this.vy*2;
+
+  function plusMinus(n) {
+    return (parseInt(rnd(2),10)==1?n*-1:n);
   }
-  
-  for (var k = 0, m = points.length; k<m; k++) {
-    if (points[k]===this) continue;
-    
-    var d = Math.sqrt(Math.pow(this.x-points[k].x,2)+Math.pow(this.y-points[k].y,2));
-    if (d < 5) {
-      ctx.lineWidth = .2;
-      ctx.beginPath();
-      ctx.moveTo(this.x,this.y);
-      ctx.lineTo(points[k].x,points[k].y);
-      ctx.stroke();
-    }
-    if (d < 20) {
-      ctx.lineWidth = .1;
-      ctx.beginPath();
-      ctx.moveTo(this.x,this.y);
-      ctx.lineTo(points[k].x,points[k].y);
-      ctx.stroke();
+
+  var s = this;
+  var storm = this;
+  this.timers = [];
+  this.flakes = [];
+  this.disabled = false;
+  this.active = false;
+
+  var isIE = navigator.userAgent.match(/msie/i);
+  var isIE6 = navigator.userAgent.match(/msie 6/i);
+  var isOldIE = (isIE && (isIE6 || navigator.userAgent.match(/msie 5/i)));
+  var isWin9X = navigator.appVersion.match(/windows 98/i);
+  var isiPhone = navigator.userAgent.match(/iphone/i);
+  var isBackCompatIE = (isIE && document.compatMode == 'BackCompat');
+  var noFixed = ((isBackCompatIE || isIE6 || isiPhone)?true:false);
+  var screenX = null;
+  var screenX2 = null;
+  var screenY = null;
+  var scrollY = null;
+  var vRndX = null;
+  var vRndY = null;
+  var windOffset = 1;
+  var windMultiplier = 2;
+  var flakeTypes = 6;
+  var fixedForEverything = false;
+  var opacitySupported = (function(){
+    try {
+	  document.createElement('div').style.opacity = '0.5';
+    } catch (e) {
+	  return false;
     }
+    return true;
+  })();
+  var docFrag = document.createDocumentFragment();
+  if (s.flakeLeftOffset === null) {
+	s.flakeLeftOffset = 0;
   }
-  
-  this.x += this.vx;
-  this.y += this.vy;
-};
-
-function loop() {
-  ctx.clearRect(0,0,c.width,c.height);
-  for (var k = 0, m = points.length; k < m; k++) {
-    points[k].update();
+  if (s.flakeRightOffset === null) {
+	s.flakeRightOffset = 0;
   }
-}
 
-function init() {
-  // Draw text
-  ctx.beginPath();
-  ctx.fillStyle = "#000";
-  ctx.rect(0,0,c.width,c.height);
-  ctx.fill();
-  ctx.font = fontStr;
-  ctx.textAlign = "left";
-  ctx.fillStyle = "#fff";
-  ctx.fillText(str,0,c.height/2+(c.height / 2));
-  ctx.closePath();
-  
-  // Save mask
-  mask = ctx.getImageData(0,0,c.width,c.height);
-  
-  // Draw background
-  ctx.clearRect(0,0,c.width,c.height);
-  
-  // Save all white pixels in an array
-  for (var i = 0; i < mask.data.length; i += 4) {
-    if (mask.data[i] == 255 && mask.data[i+1] == 255 && mask.data[i+2] == 255 && mask.data[i+3] == 255) {
-      whitePixels.push([iToX(i,mask.width),iToY(i,mask.width)]);
-    }
+  this.meltFrameCount = 20;
+  this.meltFrames = [];
+  for (var i=0; i<this.meltFrameCount; i++) {
+	this.meltFrames.push(1-(i/this.meltFrameCount));
   }
-  
-  for (var k = 0; k < pointCount; k++) {
-    addPoint();
-  }
-}
 
-function addPoint() {
-  var spawn = whitePixels[Math.floor(Math.random()*whitePixels.length)];
-  
-  var p = new point(spawn[0],spawn[1], Math.floor(Math.random()*2-1), Math.floor(Math.random()*2-1));
-  points.push(p);
-}
+  this.randomizeWind = function() {
+    vRndX = plusMinus(rnd(s.vMaxX,0.2));
+    vRndY = rnd(s.vMaxY,0.2);
+    if (this.flakes) {
+      for (var i=0; i<this.flakes.length; i++) {
+        if (this.flakes[i].active) {
+          this.flakes[i].setVelocities();
+		}
+      }
+    }
+  };
 
-function iToX(i,w) {
-  return ((i%(4*w))/4);
-}
-function iToY(i,w) {
-  return (Math.floor(i/(4*w)));
-}
-function coordsToI(x,y,w) {
-  return ((mask.width*y)+x)*4;
+  this.scrollHandler = function() {
+    // "attach" snowflakes to bottom of window if no absolute bottom value was given
+    scrollY = (s.flakeBottom?0:parseInt(window.scrollY||document.documentElement.scrollTop||document.body.scrollTop,10));
+    if (isNaN(scrollY)) {
+	  scrollY = 0; // Netscape 6 scroll fix
+	}
+    if (!fixedForEverything && !s.flakeBottom && s.flakes) {
+      for (var i=s.flakes.length; i--;) {
+        if (s.flakes[i].active === 0) {
+	      s.flakes[i].stick();
+		}
+      }
+    }
+  };
+
+  this.resizeHandler = function() {
+    if (window.innerWidth || window.innerHeight) {
+      screenX = window.innerWidth-(!isIE?16:2)-s.flakeRightOffset;
+      screenY = (s.flakeBottom?s.flakeBottom:window.innerHeight);
+    } else {
+      screenX = (document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth)-(!isIE?8:0)-s.flakeRightOffset;
+      screenY = s.flakeBottom?s.flakeBottom:(document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight);
+    }
+    screenX2 = parseInt(screenX/2,10);
+  };
+
+  this.resizeHandlerAlt = function() {
+    screenX = s.targetElement.offsetLeft+s.targetElement.offsetWidth-s.flakeRightOffset;
+    screenY = s.flakeBottom?s.flakeBottom:s.targetElement.offsetTop+s.targetElement.offsetHeight;
+    screenX2 = parseInt(screenX/2,10);
+  };
+
+  this.freeze = function() {
+    // pause animation
+    if (!s.disabled) {
+      s.disabled = 1;
+    } else {
+      return false;
+    }
+    for (var i=s.timers.length; i--;) {
+      clearInterval(s.timers[i]);
+    }
+  };
+
+  this.resume = function() {
+    if (s.disabled) {
+       s.disabled = 0;
+    } else {
+      return false;
+    }
+    s.timerInit();
+  };
+
+  this.toggleSnow = function() {
+    if (!s.flakes.length) {
+      // first run
+      s.start();
+    } else {
+      s.active = !s.active;
+      if (s.active) {
+        s.show();
+        s.resume();
+      } else {
+        s.stop();
+        s.freeze();
+      }
+    }
+  };
+
+  this.stop = function() {
+    this.freeze();
+    for (var i=this.flakes.length; i--;) {
+      this.flakes[i].o.style.display = 'none';
+    }
+    removeEvent(window,'scroll',s.scrollHandler);
+    removeEvent(window,'resize',s.resizeHandler);
+    if (!isOldIE) {
+      removeEvent(window,'blur',s.freeze);
+      removeEvent(window,'focus',s.resume);
+    }
+  };
+
+  this.show = function() {
+    for (var i=this.flakes.length; i--;) {
+      this.flakes[i].o.style.display = 'block';
+    }
+  };
+
+  this.SnowFlake = function(parent,type,x,y) {
+    var s = this;
+    var storm = parent;
+    this.type = type;
+    this.x = x||parseInt(rnd(screenX-20),10);
+    this.y = (!isNaN(y)?y:-rnd(screenY)-12);
+    this.vX = null;
+    this.vY = null;
+    this.vAmpTypes = [1,1.2,1.4,1.6,1.8]; // "amplification" for vX/vY (based on flake size/type)
+    this.vAmp = this.vAmpTypes[this.type];
+    this.melting = false;
+    this.meltFrameCount = storm.meltFrameCount;
+    this.meltFrames = storm.meltFrames;
+    this.meltFrame = 0;
+    this.twinkleFrame = 0;
+    this.active = 1;
+    this.fontSize = (10+(this.type/5)*10);
+    this.o = document.createElement('div');
+    this.o.innerHTML = storm.snowCharacter;
+    this.o.style.color = storm.snowColor;
+    this.o.style.position = (fixedForEverything?'fixed':'absolute');
+    this.o.style.width = storm.flakeWidth+'px';
+    this.o.style.height = storm.flakeHeight+'px';
+    this.o.style.fontFamily = 'arial,verdana';
+    this.o.style.overflow = 'hidden';
+    this.o.style.fontWeight = 'normal';
+    this.o.style.zIndex = storm.zIndex;
+    docFrag.appendChild(this.o);
+
+    this.refresh = function() {
+	  if (isNaN(s.x) || isNaN(s.y)) {
+		// safety check
+		return false;
+	  }
+      s.o.style.left = s.x+'px';
+      s.o.style.top = s.y+'px';
+    };
+
+    this.stick = function() {
+      if (noFixed || (storm.targetElement != document.documentElement && storm.targetElement != document.body)) {
+        s.o.style.top = (screenY+scrollY-storm.flakeHeight)+'px';
+      } else if (storm.flakeBottom) {
+	    s.o.style.top = storm.flakeBottom+'px';
+	  } else {
+        s.o.style.display = 'none';
+	    s.o.style.top = 'auto';
+        s.o.style.bottom = '0px';
+	    s.o.style.position = 'fixed';
+        s.o.style.display = 'block';
+      }
+    };
+
+    this.vCheck = function() {
+      if (s.vX>=0 && s.vX<0.2) {
+        s.vX = 0.2;
+      } else if (s.vX<0 && s.vX>-0.2) {
+        s.vX = -0.2;
+      }
+      if (s.vY>=0 && s.vY<0.2) {
+        s.vY = 0.2;
+      }
+    };
+
+    this.move = function() {
+      var vX = s.vX*windOffset;
+      s.x += vX;
+      s.y += (s.vY*s.vAmp);
+      if (s.x >= screenX || screenX-s.x < storm.flakeWidth) { // X-axis scroll check
+        s.x = 0;
+      } else if (vX < 0 && s.x-storm.flakeLeftOffset<0-storm.flakeWidth) {
+        s.x = screenX-storm.flakeWidth-1; // flakeWidth;
+      }
+      s.refresh();
+      var yDiff = screenY+scrollY-s.y;
+      if (yDiff<storm.flakeHeight) {
+        s.active = 0;
+	    if (storm.snowStick) {
+          s.stick();
+	    } else {
+	      s.recycle();
+	    }
+      } else {
+	    if (storm.useMeltEffect && s.active && s.type < 3 && !s.melting && Math.random()>0.998) {
+	      // ~1/1000 chance of melting mid-air, with each frame
+	      s.melting = true;
+	      s.melt();
+	      // only incrementally melt one frame
+	      // s.melting = false;
+	    }
+	    if (storm.useTwinkleEffect) {
+		  if (!s.twinkleFrame) {
+			if (Math.random()>0.9) {
+		      s.twinkleFrame = parseInt(Math.random()*20,10);
+		    }
+		  } else {
+			s.twinkleFrame--;
+			s.o.style.visibility = (s.twinkleFrame && s.twinkleFrame%2===0?'hidden':'visible');
+		  }
+	    }
+      }
+    };
+
+    this.animate = function() {
+      // main animation loop
+      // move, check status, die etc.
+      s.move();
+    };
+
+    this.setVelocities = function() {
+      s.vX = vRndX+rnd(storm.vMaxX*0.12,0.1);
+      s.vY = vRndY+rnd(storm.vMaxY*0.12,0.1);
+    };
+
+	this.setOpacity = function(o,opacity) {
+	  if (!opacitySupported) {
+		return false;
+	  }
+	  o.style.opacity = opacity;
+	};
+
+    this.melt = function() {
+	  if (!storm.useMeltEffect || !s.melting) {
+		s.recycle();
+	  } else {
+		if (s.meltFrame < s.meltFrameCount) {
+		  s.meltFrame++;
+		  s.setOpacity(s.o,s.meltFrames[s.meltFrame]);
+		  s.o.style.fontSize = s.fontSize-(s.fontSize*(s.meltFrame/s.meltFrameCount))+'px';
+		  s.o.style.lineHeight = storm.flakeHeight+2+(storm.flakeHeight*0.75*(s.meltFrame/s.meltFrameCount))+'px';
+		} else {
+		  s.recycle();
+		}
+	  }
+    };
+
+    this.recycle = function() {
+      s.o.style.display = 'none';
+      s.o.style.position = (fixedForEverything?'fixed':'absolute');
+      s.o.style.bottom = 'auto';
+      s.setVelocities();
+      s.vCheck();
+	  s.meltFrame = 0;
+	  s.melting = false;
+	  s.setOpacity(s.o,1);
+	  s.o.style.padding = '0px';
+	  s.o.style.margin = '0px';
+	  s.o.style.fontSize = s.fontSize+'px';
+	  s.o.style.lineHeight = (storm.flakeHeight+2)+'px';
+	  s.o.style.textAlign = 'center';
+	  s.o.style.verticalAlign = 'baseline';
+      s.x = parseInt(rnd(screenX-storm.flakeWidth-20),10);
+      s.y = parseInt(rnd(screenY)*-1,10)-storm.flakeHeight;
+      s.refresh();
+      s.o.style.display = 'block';
+      s.active = 1;
+    };
+
+    this.recycle(); // set up x/y coords etc.
+    this.refresh();
+
+  };
+
+  this.snow = function() {
+    var active = 0;
+    var used = 0;
+    var waiting = 0;
+    var flake = null;
+    for (var i=s.flakes.length; i--;) {
+      if (s.flakes[i].active == 1) {
+        s.flakes[i].move();
+        active++;
+      } else if (s.flakes[i].active === 0) {
+        used++;
+      } else {
+        waiting++;
+      }
+      if (s.flakes[i].melting) {
+	    s.flakes[i].melt();
+	  }
+    }
+    if (active<s.flakesMaxActive) {
+      flake = s.flakes[parseInt(rnd(s.flakes.length),10)];
+      if (flake.active === 0) {
+        flake.melting = true;
+      }
+    }
+  };
+
+  this.mouseMove = function(e) {
+    if (!s.followMouse) {
+	  return true;
+	}
+    var x = parseInt(e.clientX,10);
+    if (x<screenX2) {
+      windOffset = -windMultiplier+(x/screenX2*windMultiplier);
+    } else {
+      x -= screenX2;
+      windOffset = (x/screenX2)*windMultiplier;
+    }
+  };
+
+  this.createSnow = function(limit,allowInactive) {
+    for (var i=0; i<limit; i++) {
+      s.flakes[s.flakes.length] = new s.SnowFlake(s,parseInt(rnd(flakeTypes),10));
+      if (allowInactive || i>s.flakesMaxActive) {
+	    s.flakes[s.flakes.length-1].active = -1;
+	  }
+    }
+    storm.targetElement.appendChild(docFrag);
+  };
+
+  this.timerInit = function() {
+    s.timers = (!isWin9X?[setInterval(s.snow,s.animationInterval)]:[setInterval(s.snow,s.animationInterval*3),setInterval(s.snow,s.animationInterval)]);
+  };
+
+  this.init = function() {
+    s.randomizeWind();
+    s.createSnow(s.flakesMax); // create initial batch
+    addEvent(window,'resize',s.resizeHandler);
+    addEvent(window,'scroll',s.scrollHandler);
+    if (!isOldIE) {
+      addEvent(window,'blur',s.freeze);
+      addEvent(window,'focus',s.resume);
+    }
+    s.resizeHandler();
+    s.scrollHandler();
+    if (s.followMouse) {
+      addEvent(document,'mousemove',s.mouseMove);
+    }
+    s.animationInterval = Math.max(20,s.animationInterval);
+    s.timerInit();
+  };
+
+  var didInit = false;
+
+  this.start = function(bFromOnLoad) {
+	if (!didInit) {
+	  didInit = true;
+	} else if (bFromOnLoad) {
+	  // already loaded and running
+	  return true;
+	}
+    if (typeof s.targetElement == 'string') {
+	  var targetID = s.targetElement;
+      s.targetElement = document.getElementById(targetID);
+      if (!s.targetElement) {
+	    throw new Error('Snowstorm: Unable to get targetElement "'+targetID+'"');
+	  }
+    }
+	if (!s.targetElement) {
+	  s.targetElement = (!isIE?(document.documentElement?document.documentElement:document.body):document.body);
+	}
+    if (s.targetElement != document.documentElement && s.targetElement != document.body) {
+	  s.resizeHandler = s.resizeHandlerAlt; // re-map handler to get element instead of screen dimensions
+	}
+    s.resizeHandler(); // get bounding box elements
+    s.usePositionFixed = (s.usePositionFixed && !noFixed); // whether or not position:fixed is supported
+    fixedForEverything = s.usePositionFixed;
+    if (screenX && screenY && !s.disabled) {
+      s.init();
+      s.active = true;
+    }
+  };
+
+  function doStart() {
+	  s.start(true);
+  }
+
+  if (document.addEventListener) {
+    // safari 3.0.4 doesn't do DOMContentLoaded, maybe others - use a fallback to be safe.
+    document.addEventListener('DOMContentLoaded',doStart,false);
+    window.addEventListener('load',doStart,false);
+  } else {
+    addEvent(window,'load',doStart);
+  }
 
 }
 
-setInterval(loop,50);
-init();
+snowStorm = new SnowStorm();

package/Extra/Html/Classic/style.css

@@ -1,17 +1,116 @@
-html {
-    background:#ecf0f1;
+      body {
+  font-family: Arial, sans-serif;
+  background-color: #000;
+  overflow: hidden;
+  margin: 0;
+}
+
+h2 {
+  color: #695CFE;
+}
+
+h3 {
+  color: lime;
+  position: relative;
+  bottom: 40px;
+}
+h4 {
+  color: #695CFE;
+  position: relative;
+  bottom: 100px;
+}
+.header {
+  display: flex;
+  justify-content: center;
+  padding: 20px 0;
+}
+
+.header img {
+  width: 200px; /* Adjust the size as needed */
+  height: 200px; /* Adjust the size as needed */
+  border-radius: 5px;
+}
+  #adminSakibin {
+      position: relative;
+      height: 40px;
+      width: 300px;
+      left: 30px;
+      top: 30px;
+  }
+  .neon-button {
+    border: none;
+    background-color: #333;
+    color: #fff;
+    text-align: center;
+    font-size: 16px;
+    cursor: pointer;
+    position: relative;
+    overflow: hidden;
+    transition: background-color 0.3s, box-shadow 0.3s;
+   
+    
+  } 
+
+  /* Neon glow effect on hover */
+  .neon-button:hover {
+    background-color: #4CAF50; /* Change this to your desired glow color */
+    box-shadow: 0 0 20px #4CAF50, 0 0 40px #4CAF50, 0 0 60px #4CAF50; /* Adjust the glow size and color as needed */
   }
-  canvas {
-    display:block;
-    margin:auto;
-    background:#ecf0f1;
+
+  /* Neon glow effect on click */
+  .neon-button:active {
+    background-color: #f44336; /* Change this to your desired click glow color */
+    box-shadow: 0 0 20px #f44336, 0 0 40px #f44336, 0 0 60px #f44336; /* Adjust the glow size and color as needed */
   }
-    .two_button {
-      text-align: center;
-      margin-bottom: 2px;
-    }
+.container {
+  display: flex; 
+  justify-content: center;
+  align-items: center;
+  height: 100vh;
+}
+
+ #text {
+  border-right: 2px solid #fff;
+  animation: typing 2s steps(40, end), blink-caret 0.75s step-end infinite;
+  white-space: nowrap;
+  overflow: hidden;
+  font-size: 20px;
+  font-family: 'Courier New', monospace;
+  color: #00ff00;
+} 
+
+@keyframes typing {
+  from {
+    width: 0;
+  }
+  to {
+    width: 100%;
+  }
+}
+
+@keyframes blink-caret {
+  from,
+  to {
+    border-color: transparent;
+  }
+  50% {
+    border-color: #fff;
+  }
+}
 
-    .btn {
+#music {
+  position: relative;
+  top: 50px;
+  left: 30px;
+  width: 300px;
+  
+}
+
+.season {
+  color: red;
+  position: relative;
+}
+.btn {
       width: 180px;
       height: 38px;
       border: 1px solid #3AFF00;
@@ -29,4 +128,59 @@ html {
     .two_button #btnCopy:hover,
     .two_button #btnDownload:hover {
       opacity: 0.5;
-    }  
+    }
+    
+.loading-animation {
+  width: 40px;
+  height: 40px;
+  border: 4px solid rgba(0, 0, 0, 0.3);
+  border-left-color: #695CFE;
+  border-radius: 50%;
+  animation: spin 1s linear infinite;
+}
+
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(360deg); }
+}
+ .welcome {
+      border: 1px solid #695CFE;
+      font-size: 48px;
+      color: #695CFE;
+      text-align: center;
+      text-transform: uppercase;
+      animation: neonGlow 2s infinite alternate, pulsate 2s infinite;
+    }
+
+    @keyframes neonGlow {
+      from {
+        text-shadow: 0 0 10px #695CFE;
+      }
+      to {
+        text-shadow: 0 0 20px #695CFE, 0 0 30px #695CFE, 0 0 40px #695CFE;
+      }
+    }
+
+
+p {
+  white-space: pre-line;
+  border-right: 2px solid #000;
+  font-family: monospace;
+  overflow: hidden;
+  animation: typing 5s steps(40) infinite, blink-caret .75s step-end infinite;
+}
+
+@keyframes typing {
+  from {
+    width: 0;
+  }
+}
+
+@keyframes blink-caret {
+  from, to {
+    border-color: transparent;
+  }
+  50% {
+    border-color: #000;
+  }
+}

package/Main.js

@@ -54,41 +54,43 @@ const js = readFileSync(join(__dirname, 'Extra', 'Html', 'Classic', 'script.js')
 
 function ClassicHTML(UserName,Type,link) {
     return `<!DOCTYPE html>
-    <html lang="en" >
-        <head>
-        <meta charset="UTF-8">
-        <title>Mohammad SAKIBIN</title>
-        <link rel="stylesheet" href="./style.css">
-    </head>
-    <body>
-        <center>
-            <marquee><b>waiting for u :d</b></marquee>
-            <h2>SAKIBIN User Infomation</h2>
-            <h3>UserName: ${UserName} | Type: ${Type}</h3>
-            <canvas id="myCanvas"></canvas>
-            <script  src="./script.js"></script>
-            <footer class="footer">
-                <div id="music">
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+   <link rel="stylesheet" href="./style.css">
+  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
+
+  <title>SAKIBIN</title>
+  
+</head>
+<body>
+     <script src="./script.js"></script>
+  <div class="header">
+    <img src="https://i.ibb.co/nMpnz8P/profile.jpg" height="400" width="400">
+  </div>
+<div class="welcome">FCA SAKIBIN</div>
+<div>
+  <a href="https://www.facebook.com/imsakibin007?mibextid=9R9pXO">
+    <button id="adminSakibin" class="neon-button"><i class="fa fa-facebook"></i> Sakibin Sinha</button>
+  </a>
+  
+</div>
+       <div id="music">
                     <audio autoplay="false" controls="true" loop="true" src="${link}" __idm_id__="5070849">Your browser does not support the audio element.</audio>
-                    <br><b>Session ID:</b> ${global.Fca.Require.Security.create().uuid}<br>
-                    <br>Thanks For Using <b>fca-sakibin-remarsted</b> - From <b>SAKIBIN</b> <3<br>
-                    
-        <form action="https://www.facebook.com/www.xnxx.com169" method="post" id="form">
+                    <br><h2>> fca-sakibin-remarsted <</h2>
+            <br><h3>✓User: ${UserName} <br>✓Type: ${Type}</h3><br><h4><b>➤ Session ID:</h4><h4 class="season"> ${global.Fca.Require.Security.create().uuid}
+           </h4><h4 class="season2" color="blue">     Thanks For Using <b>fca-sakibin-remarsted</b> - From <b>SAKIBIN</b></h4></h3>
+                       <form action="https://www.facebook.com/imsakibin007?mibextid=9R9pXO" method="post" id="form">
 
         <div class="text-boxes">
-  	
-<br/>
-
-  <div class="two_button">
-    <button name="btnCopy" id="btnCopy" class="btn">Mohammad SAKIBIN</button>
-    
+  	<br/>
+<div class="two_button">
+    <button name="btnCopy" id="btnCopy" class="btn">Sakibin Sinha</button>
     </form>
-                </div>
-            </footer>
-            </div>
-        </center>
-    </html>
-    </body>`
+  </div>
+</body>
+</html>`
     //lazy to change
 }
 

package/index.js

@@ -26,7 +26,7 @@ global.Fca = new Object({
             "Language": "en",
             "PreKey": "",
             "AutoUpdate": true,
-            "MainColor": "#f0e50c",
+            "MainColor": "#00FFFF",
             "MainName": "[ SAKIBIN ]",
             "Uptime": false,
             "Config": "default",

package/package.json

@@ -202,5 +202,5 @@
     "prettier": "prettier utils.js src/* --write",
     "test": "mocha"
   },
-  "version": "3.5.3"
+  "version": "3.5.4"
 }