diff --git a/Bow and Arrow/README.md b/Bow and Arrow/README.md
new file mode 100644
index 00000000..19997fa8
--- /dev/null
+++ b/Bow and Arrow/README.md
@@ -0,0 +1,9 @@
+# Bow And Arrow Game
+This is a Bow And Arrow Game made using HTML, CSS and Javascript
+
+# How To Play?
+- Click Start to play.
+- Mouse Click or press any key to fire the arrow!
+- Goal: Hit the Target as many times as you can for the highest score.
+
+
diff --git a/Bow and Arrow/index.html b/Bow and Arrow/index.html
new file mode 100644
index 00000000..5bcc0609
--- /dev/null
+++ b/Bow and Arrow/index.html
@@ -0,0 +1,25 @@
+
+
+
+ Bow And Arrow
+ w){
+ document.getElementById("mainContainer").style.transform = "translateX("+(w)+"px) rotate(90deg)";
+ document.getElementById("mainContainer").style.width = h+"px";
+ var nh = h;
+ h = w;
+ w = nh;
+
+ }
+
+
+ var updatePointArea = document.getElementById("showPoint");
+ updatePointArea.style.height = h+"px";
+ updatePointArea.style.width = w+"px";
+ var uScore = document.querySelector("#showPoint .u");
+ var arrs = document.getElementById("arrs");
+
+ function updArr(arrNum){
+ var arr = "↑";
+ arr = arr.repeat(arrNum);
+ arrs.innerHTML = arr;
+ }
+
+ function animateScore(scr,arrNum){
+ if(scr >= 7) uScore.innerHTML = "↑ +"+scr;
+ else uScore.innerHTML = "+"+scr;
+ updArr(arrNum);
+ var t = 50, l = 70, o = 1;
+ var animIntv = setInterval(function(){
+ uScore.style.top = t + "%";
+ uScore.style.left = l + "%";
+ uScore.style.opacity = o;
+ t-=4;
+ l-=3;
+ o-=0.1;
+ },100)
+ setTimeout(function(){
+ clearInterval(animIntv);
+ uScore.style.opacity = 0;
+ uScore.style.top = "50%";
+ uScore.style.left = "70%";
+ },1000);
+ }
+
+
+ var c2 = document.getElementById("animCanvas");
+ c2.height = h;
+ c2.width = w;
+ var ctx2 = c2.getContext("2d");
+
+ var fwBuilder = function(n,x,y,speed){
+ this.n = n;
+ this.x = x;
+ this.y = y;
+ this.speed = speed;
+ this.balls = [];
+ }
+
+ fwBuilder.prototype.ready = function(){
+ for(var i = 0; i < this.n; i++){
+ this.balls[i] = {
+ x:this.x,
+ y:this.y,
+ dx:this.speed*Math.sin(i*Math.PI*2/this.n),
+ dy:this.speed*Math.cos(i*Math.PI*2/this.n),
+ u:this.speed*Math.cos(i*Math.PI*2/this.n),
+ t:0
+ }
+ }
+ }
+
+
+
+ var fw1 = new fwBuilder(50,w/5,h,3);
+ var fw2 = new fwBuilder(50,4*w/5,h,3);
+
+ var intvA;
+ var running = false;
+
+ function newF(){
+ if(!running){
+ fw1.ready();
+ fw2.ready();
+ running = true;
+ intvA = setInterval(function(){
+ ctx2.clearRect(0,0,w,h);
+ fw1.draw();
+ fw2.draw();
+ },15)
+ }
+ }
+
+ newF();
+
+
+
+ var c = document.getElementById("myCanvas");
+
+ c.height = h;
+ c.width = w;
+
+ var ctx = c.getContext("2d");
+
+ var checkArrowMoveWithBoard1 = false;
+ var checkArrowMoveWithBoard2 = false;
+
+ // Objects
+
+ var arc = {
+ x:30,
+ y:100,
+ dy:3,
+ r:50,
+ color:"#000",
+ lw:3,
+ start:Math.PI+Math.PI/2,
+ end:Math.PI-Math.PI/2
+ }
+
+ var rope = {
+ h:arc.r*2,
+ lw:1,
+ x:arc.x-25,
+ color:"#000",
+ status:true
+ }
+
+ var board = {
+ x:w-40,
+ y:h/2,
+ dy:4,
+ height:150,
+ width:7
+ }
+
+ var boardY;
+ var boardMove = false;
+ var totalArr = 10;
+ updArr(totalArr);
+
+ function drawBoard() {
+ ctx.beginPath();
+ ctx.fillRect(board.x,board.y-5,40,board.width+3);
+ ctx.fillRect(board.x,board.y-board.height/2,board.width,board.height);
+ ctx.moveTo(board.x,board.y-15);
+ ctx.quadraticCurveTo(board.x-10,board.y,board.x,board.y+15);
+
+ ctx.fillStyle = "RED";
+ ctx.fill();
+ ctx.closePath();
+ ctx.fillStyle = "#000";
+
+ if(board.y >= h || board.y <= 0){
+ board.dy *= -1;
+ }
+
+
+ if(autoMove){
+ board.y += board.dy;
+ if(checkArrowMoveWithBoard1){
+ arrow1.moveArrowWithBoard(1);
+ }
+ else if(checkArrowMoveWithBoard2){
+ arrow2.moveArrowWithBoard(1);
+ }
+ }
+ else{
+
+ if(boardMove){
+ if(Math.abs(board.y - boardY) > 5){
+ board.y += board.dy;
+ arrow1.moveArrowWithBoard(1);
+ arrow2.moveArrowWithBoard(1);
+ }
+ }
+ else{
+ if(Math.abs(board.y - boardY) > 5){
+ board.y -= board.dy;
+ arrow1.moveArrowWithBoard(-1);
+ arrow2.moveArrowWithBoard(-1);
+ }
+ }
+ }
+ }
+
+ function Arrow(){
+ this.w = 85;
+ this.x = arc.x-25;
+ this.dx = 20;
+ this.status = false;
+ this.vis = true;
+ this.fy = arc.y;
+ }
+
+ Arrow.prototype.drawArrow = function() {
+ if(this.vis) {
+ if(this.status) {
+ ctx.fillRect(this.x,this.fy-3,10,6);
+ ctx.fillRect(this.x,this.fy-1,this.w,2);
+ ctx.beginPath();
+ ctx.moveTo(this.x+this.w,this.fy-4);
+ ctx.lineTo(this.x+this.w+12,this.fy);
+ ctx.lineTo(this.x+this.w,this.fy+4);
+ ctx.fill();
+
+ if(moveArrowCheck) {
+ if(this.x < w-155){
+ this.x += this.dx;
+ }
+ else {
+ if(!(this.fy <= board.y-board.height/2 || this.fy >= board.y+board.height/2) || this.x > w){
+ if(this.x > w-110){
+ if(this == arrow1){
+ arrow2.vis = true;
+ checkArrowMoveWithBoard1 = true;
+ checkArrowMoveWithBoard2 = false;
+ }
+ else {
+ arrow1.vis = true;
+ checkArrowMoveWithBoard1 = false;
+ checkArrowMoveWithBoard2 = true;
+ }
+ moveArrowCheck = false;
+ score++;
+ //console.log(score);
+ if(score === 4){
+ arc.dy = 5;
+ }
+ else if(score === 8){
+ autoMove = true;
+ }
+
+
+ if(this.fy >= board.y-board.height/2 && this.fy <= board.y+board.height/2) {
+ try{
+ hitSound.play().catch(function(e){});
+ }catch(err){}
+ var scores = this.fy - board.y;
+ var currentScore = Math.round(board.height/20)-Math.round(Math.abs(scores/10));
+ if(currentScore >= 7){
+ newF();
+ totalArr+=2;
+ try{
+ successSound.play().catch(function(e){});
+ }catch(err){
+ }
+ }
+
+ totalScore += currentScore;
+ gameScore.innerHTML = totalScore;
+
+ animateScore(currentScore,totalArr);
+
+
+ boardY = board.y + scores;
+ if(scores>=0){
+ boardMove = true;
+ }
+ else {
+ boardMove = false;
+ }
+
+
+ }
+ else updArr(totalArr);
+ if(totalArr <= 0){
+ clearInterval(intv);
+ try{
+ //bgSound.pause();
+ endSound.play().catch(function(e){});
+ }catch(err){
+ }
+ document.getElementById("animCanvas").removeEventListener("click",shoot);
+ document.body.removeEventListener("keydown",shoot);
+ startPage.style.display = "block";
+ document.getElementById("title").innerHTML = "Your Score